:root{
  --yellow:#F4D648;
  --black:#171717;
  --white:#fff;
  --paper:#f7f5ec;
  --red:#d40000;
  --muted:#6d695e;
  --line:#d9d5c8;
  font-family:Inter,-apple-system,BlinkMacSystemFont,"Hiragino Sans","Yu Gothic",sans-serif;
}
*{box-sizing:border-box}
body{margin:0;background:var(--paper);color:var(--black)}
button,input,select,textarea{font:inherit}
button{cursor:pointer}
.app-header{
  position:sticky;top:0;z-index:20;height:64px;padding:0 4vw;
  display:flex;align-items:center;justify-content:space-between;
  background:rgba(255,255,255,.94);border-bottom:2px solid var(--black);backdrop-filter:blur(8px)
}
.brand-button{border:0;background:none;font-weight:950;font-size:18px}
.share-warning{color:var(--red);font-weight:950;font-size:13px}
main{width:min(1080px,92vw);margin:auto;padding-bottom:72px}
.view{display:none}
.view.active{display:block;animation:fade .2s ease}
@keyframes fade{from{opacity:.2;transform:translateY(5px)}}
.top-view{text-align:center}
.top-visual{padding:58px 0 34px}
.simple-bulbs{font-size:38px;letter-spacing:-8px}
.kicker{font-weight:950;letter-spacing:.16em;font-size:12px}
.top-visual h1{font-size:clamp(48px,8vw,86px);margin:10px 0;letter-spacing:-.05em}
.tagline{font-size:clamp(18px,3vw,28px);font-weight:800;line-height:1.55}
.mode-actions{display:grid;grid-template-columns:1fr 1fr;gap:18px;max-width:820px;margin:20px auto}
.mode-card{
  min-height:190px;text-align:left;padding:24px;border:3px solid var(--black);border-radius:22px;
  background:var(--white);box-shadow:7px 7px 0 var(--black)
}
.mode-card:hover{transform:translateY(-2px)}
.mode-num{display:block;font-size:12px;font-weight:950;color:var(--muted);margin-bottom:28px}
.mode-card strong{display:block;font-size:28px;margin-bottom:9px}
.mode-card small{font-size:14px;color:var(--muted);line-height:1.7}
.external-note{max-width:820px;margin:32px auto 54px;color:var(--red);border-top:1px solid #d7b4b4;padding-top:20px}
.external-note strong{font-size:18px}
.external-note p{font-size:13px;line-height:1.8}
.column{text-align:left;background:var(--yellow);border:3px solid var(--black);border-radius:24px;padding:30px;box-shadow:7px 7px 0 var(--black)}
.column-label{font-weight:950}
.column h2{font-size:34px;margin:6px 0 10px}
.column-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:20px}
.column-grid article{background:#fff;border:2px solid var(--black);border-radius:16px;padding:18px}
.column-grid span{font-size:34px;font-weight:950}
.column-grid h3{margin:4px 0}
.page-title{padding:54px 0 25px}
.page-title h2{font-size:clamp(34px,5vw,58px);margin:8px 0}
.centered{text-align:center}
.panel{background:#fff;border:2px solid var(--black);border-radius:22px;padding:24px;box-shadow:5px 5px 0 var(--black)}
.setup-form{max-width:760px;margin:auto}
.field{display:grid;gap:9px;margin-bottom:20px;font-weight:900}
textarea,input,select{
  width:100%;border:2px solid var(--black);border-radius:13px;background:#fff;padding:13px 14px;outline:none
}
textarea:focus,input:focus,select:focus{box-shadow:0 0 0 4px rgba(244,214,72,.55)}
.participant-inputs{display:grid;gap:8px;margin-bottom:10px}
.participant-row{display:flex;gap:8px}
.participant-row button{width:44px}
.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.choice-row{display:flex;gap:10px;flex-wrap:wrap}
.choice-chip{border:2px solid var(--black);border-radius:999px;background:#fff;padding:10px 14px}
.record-option{display:flex;gap:12px;align-items:flex-start;border:2px dashed var(--black);border-radius:15px;padding:15px;margin:20px 0}
.record-option input{width:auto;margin-top:3px}
.record-option span{display:grid;gap:4px}
.record-option small{color:var(--muted);line-height:1.5}
.primary,.sub-button{
  border:2px solid var(--black);border-radius:13px;padding:12px 18px;font-weight:950
}
.primary{background:var(--yellow);box-shadow:4px 4px 0 var(--black)}
.sub-button{background:#fff}
.big{width:100%;padding:16px;font-size:18px}
.stage-view{padding-top:32px}
.stage-card{
  min-height:calc(100vh - 120px);border:3px solid var(--black);border-radius:26px;background:#fff;
  display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:28px
}
.yellow-stage{background:var(--yellow)}
.stage-card h2{font-size:clamp(36px,7vw,76px);margin:12px 0}
.stage-copy{max-width:640px;line-height:1.8}
.cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;width:100%;max-width:760px}
.cards.one{grid-template-columns:1fr;max-width:360px}
.cards.two{grid-template-columns:repeat(2,1fr);max-width:560px}
.card{
  background:#fff;border:3px solid var(--black);border-radius:18px;aspect-ratio:2/3;padding:10px;display:grid;place-items:center
}
.card img{width:100%;height:100%;object-fit:contain}
.compact-cards{max-width:460px}
.speaker{font-size:24px;font-weight:950;margin-top:18px}
.timer{font-weight:950}
.huge{font-size:88px;line-height:1}
.mega{font-size:140px;line-height:1}
.stage-topline{display:flex;justify-content:space-between;align-items:center;padding:32px 0 18px}
.stage-topline h2{font-size:clamp(28px,5vw,54px);margin:5px 0}
.round-label{background:var(--black);color:#fff;border-radius:999px;padding:10px 15px;font-weight:950}
.stage-layout{display:grid;grid-template-columns:1.25fr .75fr;gap:18px}
.card-panel{display:flex;align-items:center;justify-content:center;min-height:calc(100vh - 190px)}
.speaker-panel{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center}
.speaker-label{font-size:13px;color:var(--muted);font-weight:900}
.current-speaker{font-size:44px;font-weight:950;margin:12px 0 22px}
.capture-list{display:grid;gap:14px;max-width:820px;margin:0 auto 22px}
.capture-item{display:grid;grid-template-columns:110px 1fr;gap:14px;align-items:center;background:#fff;border:2px solid var(--black);border-radius:18px;padding:14px}
.capture-item img{width:100%;height:110px;object-fit:contain}
.ride-list{width:min(860px,100%);display:grid;grid-template-columns:repeat(2,1fr);gap:12px;max-height:48vh;overflow:auto;margin:16px 0}
.ride-item{display:grid;grid-template-columns:80px 1fr;gap:10px;align-items:center;text-align:left;border:3px solid var(--black);border-radius:15px;background:#fff;padding:10px}
.ride-item.selected{background:var(--black);color:#fff}
.ride-item img{width:80px;height:80px;object-fit:contain;background:#fff;border-radius:10px}
.team-cards,.adopt-list{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}
.team-card,.adopt-item{background:#fff;border:2px solid var(--black);border-radius:18px;padding:18px}
.team-card img,.adopt-item img{width:120px;height:120px;object-fit:contain;display:block;margin:auto}
.timer-box{text-align:center;margin:26px 0}
.timer-box span{display:block;color:var(--muted);font-weight:900}
.timer-box strong{font-size:80px}
.presentation-stage .mic,.question-mark{font-size:74px}
.present-idea{background:#fff;border:3px solid var(--black);border-radius:18px;padding:18px;max-width:700px;width:100%;margin:15px 0}
.adopt-item{cursor:pointer}
.adopt-item.selected{outline:6px solid var(--yellow)}
.adopt-reason{max-width:760px;margin:28px auto}
.stamp{display:inline-block;color:var(--red);border:8px double var(--red);border-radius:50%;padding:24px 16px;font-size:46px;font-weight:950;transform:rotate(-10deg);margin:0 auto 22px;animation:stamp .28s ease}
@keyframes stamp{from{transform:scale(2.2) rotate(-10deg);opacity:0}}
.result-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:18px}
.result-adopted{font-size:20px;line-height:1.8}
.result-text{min-height:500px;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:13px;line-height:1.6}
.button-row,.result-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:14px}
.result-actions{justify-content:center;margin-top:22px}
.record-badge{position:fixed;right:18px;bottom:18px;background:var(--red);color:#fff;border-radius:999px;padding:10px 14px;font-weight:900;z-index:50}
@media(max-width:800px){
  .mode-actions,.column-grid,.grid-2,.stage-layout,.result-grid,.team-cards,.adopt-list{grid-template-columns:1fr}
  .ride-list{grid-template-columns:1fr}
  .card-panel{min-height:auto}
}
@media(max-width:560px){
  main{width:min(94vw,1080px)}
  .top-visual{padding-top:38px}
  .mode-card{min-height:150px}
  .mode-card strong{font-size:23px}
  .stage-card{min-height:calc(100vh - 90px);padding:18px}
  .huge{font-size:70px}.mega{font-size:110px}
  .capture-item{grid-template-columns:78px 1fr}
  .capture-item img{height:78px}
}