/* Show motion: quiet stage, mechanical reveals, spring-driven payoffs. */
:root { --show-ease: cubic-bezier(.16,1,.3,1); }
body .w-title, body .f-title, body .sc.cur, body .pw-status.you,
body .spin, body .pod, body .pod .av, body .w-over h1, body .f-over h1,
body .w-over.on, body .f-over.on, body .row.hit .in { animation: none; }
body .w-cat, body .f-q, body .ans, body .st { animation: none; }
body .w-top, body .f-top { padding-left:max(9vw, 145px); }
body .wheel { will-change: auto; }
body .wheel-wrap { isolation:isolate; }
body .wheel-wrap::before { content:''; position:absolute; inset:-3%; border:3px solid var(--yellow); border-radius:50%; opacity:0; transform:scale(.95); transition:opacity .25s,transform .5s var(--show-ease); pointer-events:none; }
body .wheel-wrap.spinning::before { opacity:.65; transform:scale(1.025); }
body .wheel-wrap.spinning .wheel { will-change:transform; }
.wheel-readout { position:absolute; bottom:-3.6vw; left:50%; transform:translateX(-50%); white-space:nowrap; text-align:center; font-family:var(--display); font-size:clamp(14px,1.7vw,28px); color:var(--yellow); letter-spacing:.07em; text-shadow:0 3px 0 var(--ink); }
body .hub { font-family:var(--display); font-size:clamp(15px,2.2vw,34px); color:var(--ink); }
body .sc { transition:transform .55s var(--show-ease),background-color .25s; position:relative; }
body .sc.cur { transform:translateY(-.65vw) rotate(-2deg); }
body .sc .tot, body .sc .rd, body .st .tt, .pod .pts { font-variant-numeric:tabular-nums; }
body .tile .in, body .row .in { transition:none; }
body .w .w-banner, body .f .f-banner { top:auto; bottom:17%; left:50%; max-width:82%; width:max-content; padding:.7em 1.4em; font-size:clamp(18px,2.1vw,34px); border:.25vw solid var(--ink); border-radius:1vw; background:var(--bc,var(--yellow)); box-shadow:0 .4vw 0 var(--ink); transform:translateX(-50%); opacity:0; }
body .w-banner::before, body .w-banner::after { display:none; }
body .f .f-banner { bottom:2%; }
body .family-show .f-main { gap:1.4vw; padding-bottom:2vw; }
body .family-show .f-q { font-size:3vw; padding:1.2vw 2.4vw; }
body .board .row { height:min(4.4vw, calc((100dvh - 27vw) / var(--board-rows, 6))); }
body .board.cols2 .row { height:min(3.9vw, calc((100dvh - 27vw) / var(--board-rows, 8))); }
body .row .pt::before { content:'+'; }
body .w-banner.show, body .f-banner.show { animation:none; opacity:1; }
body .chip { transition:background-color .2s,opacity .2s; }
body .chip.done { transform:none; }
body .chip.done .ok { animation:none; }
body .f-timer { overflow:visible; height:clamp(26px,2.6vw,42px); }
body .f-timer i { border-radius:99px; transition:transform .2s linear; }
body .f-timer span { font-size:clamp(16px,1.5vw,24px); font-variant-numeric:tabular-nums; }
body .f-timer.low { border-color:var(--pink); box-shadow:0 .4vw 0 var(--ink),0 0 0 4px #ff4fa030; }
.reveal-cue { font-family:var(--display); color:var(--yellow); letter-spacing:.12em; font-size:clamp(14px,1.4vw,24px); text-align:center; }
body .row { transition:opacity .25s; }
body .row.waiting { opacity:.55; }
body .row.ready .fr { background:var(--yellow); color:var(--ink); }
body .row.top.flip .bk { box-shadow:0 .3vw 0 var(--ink),0 0 0 .15vw var(--yellow); }
body .show-podium { overflow-y:auto; padding:3vh 4vw; background:radial-gradient(ellipse at 50% 80%,#7141bc 0, #21113f 65%); }
body .show-podium h1 { text-align:center; font-size:clamp(30px,5vw,80px); max-width:90vw; }
.show-eyebrow { font-size:clamp(12px,1.2vw,20px); font-weight:700; letter-spacing:.3em; color:var(--cyan); }
body .show-podium .podium { height:auto; min-height:30vw; gap:3vw; padding-top:1vw; }
body .show-podium .pod { position:relative; min-width:12vw; }
.pod-person { position:relative; display:flex; flex-direction:column; align-items:center; }
.pod-crown { color:var(--yellow); font-size:3vw; position:absolute; top:-3.5vw; text-shadow:0 3px 0 var(--ink); }
body .show-podium .pod .nm { max-width:20vw; overflow-wrap:anywhere; text-align:center; }
body .show-podium .pod .bar { width:13vw; }
body .show-podium .w-btns { margin-top:1vh; flex-wrap:wrap; justify-content:center; }
body .btn { transition:transform .18s var(--show-ease),box-shadow .18s; }
body .btn:hover { transform:translateY(-2px) rotate(0); }
body .btn:active { transform:translateY(5px) scale(.98); }
.btn:focus-visible, .key:focus-visible, .opt:focus-visible { outline:3px solid var(--cyan); outline-offset:5px; }
@media (max-width:700px) and (orientation:portrait) {
  body .w { grid-template-columns:1fr; grid-template-rows:auto auto 1fr auto; gap:20px; padding:60px 14px 20px; overflow-y:auto; }
  body .w-top, body .w-score { grid-column:1; padding-left:0; }
  body .w-title, body .f-title { font-size:6vw; }
  body .w-round, body .f-pill { font-size:3vw; }
  body .w-cat { font-size:4vw; }
  body .tile { width:5.5vw; height:7.5vw; }
  body .tile .f, body .tile .b { font-size:5vw; }
  body .wheel-wrap { width:min(65vw,34vh); }
  body .wheel-readout { bottom:-24px; }
  body .w-score { gap:8px; padding-top:24px; }
  body .sc { min-width:26vw; padding:6px; gap:6px; }
  body .sc .av { width:8vw; height:8vw; font-size:6vw; }
  body .sc .nm { font-size:3vw; max-width:16vw; }
  body .sc .tot { font-size:5vw; } body .sc .rd { font-size:2.6vw; }
  body .family-show { padding:60px 14px 20px; overflow-y:auto; gap:20px; }
  body .f-top { padding-left:0; }
  body .family-show .f-main { gap:20px; flex:none; }
  body .family-show .f-q { max-width:90vw; font-size:5vw; padding:16px; }
  body .f-q small { font-size:3vw; }
  body .f-timer { width:78vw; }
  body .f-hint { font-size:4vw; }
  body .chip { font-size:3.5vw; padding:5px 10px; }
  body .chip .av { width:7vw; height:7vw; font-size:5vw; }
  body .chip .ok { font-size:4vw; }
  body .f-grid, body .f-grid.two { grid-template-columns:1fr 1fr; }
  body .ans { font-size:4vw; min-height:60px; padding:10px; }
  body .board, body .board.cols2 { width:90vw; grid-template-columns:1fr; padding:10px; gap:8px; }
  body .board .row, body .board.cols2 .row { height:52px; }
  body .row .tx, body .board.cols2 .row .tx { font-size:3.3vw; }
  body .row .rk { width:6vw; height:6vw; font-size:4vw; }
  body .row .au { font-size:4vw; } body .row .vt { width:10vw; font-size:2.6vw; }
  body .row .pt { width:12vw; font-size:4vw; }
  body .stand { width:90vw; gap:10px; }
  body .st .nm, body .st .gn { font-size:3.5vw; } body .st .tt { font-size:5vw; }
  body .st .av { width:9vw; height:9vw; font-size:6vw; }
  body .show-podium { gap:30px; }
  body .show-podium .pod .av { font-size:10vw; }
  body .show-podium .pod .nm { font-size:3.5vw; }
  body .show-podium .pod .pts { font-size:4vw; }
  body .show-podium .pod .bar { width:22vw; font-size:6vw; }
  body .show-podium .podium { min-height:50vw; }
}
@media (prefers-reduced-motion:reduce) {
  *, *::before, *::after { animation:none !important; transition:none !important; scroll-behavior:auto !important; }
  body .w-banner.show, body .f-banner.show { transform:translateX(-50%); opacity:1; }
  #bg { display:none; }
}
/* Wheel decision clock: static urgency colour, continuous time strip, no flashing. */
.show-clock { position:relative; display:flex; align-items:center; justify-content:center; gap:.55em; padding:.35em .85em .55em; border:3px solid var(--ink); border-radius:1em; background:var(--yellow); color:var(--ink); box-shadow:0 .25em 0 var(--ink); font-family:var(--display); font-size:16px; font-variant-numeric:tabular-nums; overflow:hidden; flex-shrink:0; }
.show-clock[hidden] { display:none; }
.show-clock span { font-size:.65em; max-width:6em; line-height:1.1; }
.show-clock b { font-size:2em; line-height:1; min-width:1.25em; text-align:center; }
.show-clock small { font-size:.6em; }
.show-clock i { position:absolute; bottom:0; left:0; right:0; height:.22em; background:var(--ink); transform-origin:left; }
.show-clock.urgent { background:var(--pink); color:#fff; }