/* Challenge ’Em: approved Pop Arcade Showdown skin. Real UI over original art. */
:root {
  --bg:#ffeb57; --bg-2:#fff3a1; --card:#fffdf5; --card-2:#eee4ff;
  --ink:#15132f; --ink-dim:#423856; --ink-faint:#655c72; --line:#17132e;
  --accent:#6621df; --accent-2:#ff5363; --good:#6230da; --bad:#d52945;
  --font-display:'Bangers',Impact,sans-serif; --font-body:'Nunito Sans',system-ui,sans-serif;
  --font-mono:var(--font-body); --radius:18px; --shadow:5px 6px 0 #17132f;
  --glow-accent:none; --glow-good:none; --glow-neon:none;
}
html,body {height:auto;min-height:100%;color:var(--ink);background:#ffeb57;color-scheme:light;}
body {background:#ffeb57 url('./assets/rumyverse/backdrop.webp') center top/cover fixed no-repeat;font-family:var(--font-body);font-weight:700;}
body::before,body::after {display:none;}
#root {max-width:1480px;padding:18px 28px 32px;gap:20px;min-height:100dvh;}
#root > .col {gap:22px;}
#fx {display:none;}
button,input,a,summary {touch-action:manipulation;}
button,a,input {outline-offset:5px;}
:focus-visible {outline:3px solid #215ba5;}
button,a,input,summary {font-family:var(--font-body);}
button {cursor:pointer;}
button:disabled {cursor:not-allowed;opacity:.5;}
.topbar {display:grid;grid-template-columns:minmax(240px,1fr) auto minmax(240px,1fr);gap:24px;align-items:start;padding:0;margin:0;min-height:136px;border:0;background:none;box-shadow:none;}
.brand-link {display:block;width:min(550px,100%);color:var(--ink);text-decoration:none;}
.game-logo {display:block;width:100%;height:auto;max-height:165px;object-fit:contain;object-position:left center;}
.brand-tag {display:block;font:19px/1 var(--font-display);letter-spacing:1.2px;text-align:center;margin-top:-5px;}
.round-badge {align-self:start;margin-top:20px;padding:14px 22px;background:#17132f;color:white;font:26px/1.1 var(--font-display);letter-spacing:1.5px;border-radius:6px;white-space:nowrap;}
.header-actions {display:flex;justify-content:flex-end;flex-wrap:wrap;gap:8px;padding-top:17px;}
.toolbtn,.exitbtn {width:auto;min-width:64px;min-height:46px;padding:9px 13px;border:2px solid #17132f;border-radius:14px;color:white;background:#17132f;box-shadow:0 3px 0 #7935d6;font-size:13px;font-weight:900;display:inline-flex;align-items:center;justify-content:center;white-space:nowrap;text-decoration:none;}
.toolbtn[aria-pressed=false] {color:#312446;background:#fff9c8;opacity:1;}
.btn {display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:12px 22px;border:2px solid #17132f;border-radius:15px;background:#fffef8;color:#17132f;font:900 17px/1.15 var(--font-body);box-shadow:0 4px 0 #17132f;text-decoration:none;transition:transform .12s,box-shadow .12s;white-space:normal;}
.btn:hover:not(:disabled),.toolbtn:hover,.exitbtn:hover {filter:brightness(1.05);transform:translateY(-2px);}
.btn:active:not(:disabled) {transform:translateY(3px);box-shadow:0 1px 0 #17132f;}
.btn.primary,.btn.good {background:#201640;color:white;border-color:#17132f;box-shadow:0 5px 0 #7935d6;}
.btn.danger {background:#ff5363;color:#17132f;box-shadow:0 5px 0 #a61947;}
.btn.ghost {background:transparent;color:#17132f;box-shadow:none;border-color:#8c7961;}
.btn.lg {min-height:66px;font-size:23px;}
.card {border:2px solid #17132f;background:#fffdf5;border-radius:22px;box-shadow:4px 5px 0 #17132f;padding:24px;backdrop-filter:none;}
.field-label,.eyebrow {font:900 13px/1.4 var(--font-body);text-transform:uppercase;letter-spacing:1.8px;color:#6a27c9;}
.muted,.legal {color:#57496a;}
input[type=text] {width:100%;min-width:0;min-height:58px;border:2px solid #bdb0cb;border-radius:13px;background:white;color:#17132f;font-size:20px;font-weight:800;padding:14px 17px;box-shadow:none;}
input::placeholder {color:#6c6479;opacity:1;font-weight:600;}
.row {gap:12px;}
.pill {color:#17132f;background:#fffef5;border:2px solid #17132f;box-shadow:none;font-size:14px;}
.pill.adult,.pill.clean {color:#17132f;background:#fffef5;}
.conn-banner {background:#fff1da;color:#792507;border:2px solid #b84712;box-shadow:none;}
.hidden {display:none!important;}

/* Welcome / room setup */
.home {display:grid;grid-template-columns:minmax(0,1fr) minmax(320px,460px);gap:24px 60px;align-items:start;max-width:none;margin:0;}
.home > .topbar {grid-column:1/-1;}
.home .brand {display:block;grid-column:1;grid-row:2/5;text-align:left;padding:14px 0 0;position:relative;min-height:560px;}
.home .brand h1 {font:clamp(52px,6vw,88px)/.98 var(--font-display);letter-spacing:1px;color:#17132f;background:none;-webkit-text-fill-color:initial;max-width:620px;margin:12px 0 0;text-shadow:none;}
.home-mascot {display:block;width:min(410px,85%);height:auto;margin:-2px auto -40px;object-fit:contain;}
.home .tag {grid-column:2;grid-row:2;margin:6px 0 0;max-width:none;text-align:left;font-size:19px;line-height:1.5;color:#352744;}
.home .entry-form {grid-column:2;grid-row:3;gap:18px;}
.home .join-card {grid-column:2;grid-row:4;}
.home .legal {grid-column:1;grid-row:5;margin:0;text-align:center;font-size:14px;}
.home .howto {grid-column:2;grid-row:5;}
.howto {font-size:14px;color:#302444;line-height:1.6;}
.howto summary {cursor:pointer;font-weight:900;min-height:44px;}
.howto p {max-width:65ch;}
.join-row {display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px;}
.join-row input {letter-spacing:3px;}
.entry-form .row .btn {min-height:44px;padding:10px;}
.entry-form .row .btn.good {background:#6621df;}
.lobby-grid {display:grid;grid-template-columns:minmax(0,1.25fr) minmax(300px,.8fr);align-items:start;gap:22px;max-width:1100px;width:100%;margin:auto;}
.lobby-grid > .code-card {grid-column:1;grid-row:1;}
.lobby-grid > .row {grid-column:2;grid-row:1;justify-content:flex-start!important;}
.lobby-grid > .card:nth-of-type(3) {grid-column:2;grid-row:2;}
.lobby-grid > .card:nth-of-type(4) {grid-column:1;grid-row:2/4;}
.lobby-grid > .btn.primary {grid-column:2;grid-row:3;}
.lobby-grid > .btn.ghost {box-shadow:none;min-height:44px;}
.code-big {font:clamp(24px,4vw,49px)/1.2 var(--font-display);letter-spacing:2px;color:#6621df;background:none;-webkit-text-fill-color:initial;overflow-wrap:anywhere;}
.linkbox {color:#65566c;overflow-wrap:anywhere;font-size:12px;}
.code-actions {margin:12px 0;}
.ctrl-row {border-bottom:1px solid #d9cddf;padding:12px 0;}
.lbl {color:#17132f;font-weight:900;}
.sub {color:#6a6173;}
.stepper .sbtn {color:#17132f;background:#f0e8ff;border:2px solid #17132f;border-radius:10px;min-width:44px;min-height:44px;}
.sval {color:#17132f;}
.toggle {background:#dbd3e4;border:2px solid #17132f;}
.toggle[aria-pressed=true] {background:#7033d5;}
.roster {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;}
.roster .pl {background:#f1eaff;color:#17132f;border:1px solid #c6b9d6;box-shadow:none;flex-wrap:wrap;}
.roster .pl.me {border:2px solid #6621df;}
.pl .badge {border:0;background:#e1d2fa;color:#49267b;font-size:10px;}
.pl .badge.host {background:#ffe766;color:#392338;}
.code-card::after {display:none;}

/* A live comic panel. Input and text remain real, selectable, accessible DOM. */
.play {display:grid;grid-template-columns:158px minmax(0,1fr) 330px;grid-template-areas:'players category category' 'players answer mascot' 'players controls controls';gap:20px 24px;min-height:660px;max-width:none;align-items:center;}
.play > .hud {display:none;}
.play > .prompt {grid-area:category;margin:0 22px 6px;text-align:center;color:#17132f;background:#fffdf5;font:900 clamp(25px,2.7vw,40px)/1.18 var(--font-body);padding:16px 24px;border-radius:8px;box-shadow:3px 4px 0 #17132f;}
.play .prompt .lead {display:block;color:#7131ce;font-size:12px;letter-spacing:2.5px;margin-bottom:8px;font-family:var(--font-body);text-shadow:none;}
.players-rail {grid-area:players;align-self:start;display:flex;flex-direction:column;gap:12px;background:#16142e;color:white;border-radius:22px;padding:18px 12px;min-width:0;max-height:690px;overflow-y:auto;}
.rail-label {font:16px var(--font-display);letter-spacing:2px;margin:2px 0 6px;text-align:center;color:#ffeb57;}
.rail-player {display:flex;gap:12px;align-items:center;padding:12px 9px;border:2px solid transparent;border-radius:16px;min-width:0;position:relative;}
.rail-player.active {border-color:#ffe650;background:#302154;box-shadow:0 0 0 2px #ffeb5740;}
.player-avatar {display:flex;align-items:center;justify-content:center;flex:0 0 46px;width:46px;height:46px;border-radius:50%;background:var(--player-color,#7833df);color:white;font-size:25px;font-weight:1000;border:2px solid #ffffffa0;}
.rail-info {display:flex;flex-direction:column;line-height:1.2;gap:4px;min-width:0;}
.rail-info b {font-size:15px;overflow-wrap:anywhere;}
.rail-info small {font-size:10px;letter-spacing:.5px;color:#c7beda;}
.rail-score {font-size:22px;color:#f2eefe;}
.play .wheel {grid-area:answer;min-height:300px;margin:0;display:flex;align-items:center;justify-content:center;background:none;padding:0;overflow:visible;}
.play .lane {display:none;}
.play .center-stage {width:100%;min-height:310px;border:0;box-shadow:none;background:url('./assets/rumyverse/answer-panel.webp') center/100% 100% no-repeat;padding:50px 65px 45px 42px;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:12px;overflow:visible;position:relative;}
.center-stage::before,.center-stage::after {display:none;}
.center-stage .who {font:40px/1.1 var(--font-display);letter-spacing:1.3px;text-transform:uppercase;color:white;background:#6621df;padding:7px 15px;max-width:100%;overflow-wrap:anywhere;text-shadow:none;}
.center-stage .ans {font:900 clamp(32px,5.4vw,78px)/1.1 var(--font-body);color:#17132f;opacity:1;filter:none;text-shadow:none;text-align:left;overflow-wrap:anywhere;max-width:100%;}
.center-stage .ans.empty {font-size:30px;color:#696073;}
.bomb-stage {grid-area:mascot;align-self:center;text-align:center;min-width:0;}
.bomb-stage img {display:block;width:100%;height:auto;object-fit:contain;}
.bomb-caption {display:inline-block;background:#17132f;color:#ffeb57;font:31px/1.15 var(--font-display);padding:9px 14px;letter-spacing:.8px;margin-top:-24px;position:relative;}
.turnzone {grid-area:controls;background:#6523d9;color:white;border:0;border-radius:22px;padding:22px 26px 26px;box-shadow:5px 6px 0 #17132f;margin:0;min-width:0;}
.turnzone > .col {gap:14px;}
.answer-tools {display:flex;gap:30px;align-items:center;justify-content:space-between;}
.your-turn {font:clamp(24px,3vw,42px)/1.1 var(--font-display);color:#17132f;background:#ffeb57;padding:9px 16px;letter-spacing:.6px;box-shadow:none;border:0;border-radius:4px;margin:0;flex:1;}
#timebox {flex:1;min-width:150px;max-width:460px;}
.timebar-label {font:900 20px/1.4 var(--font-body);letter-spacing:.7px;color:white;margin:0 0 8px;text-align:left;}
.timebar {height:12px;border:1px solid #d2b4fd;background:#3b156d;border-radius:20px;overflow:hidden;box-shadow:none;}
.timebar i {display:block;height:100%;background:#ffe859;border-radius:inherit;box-shadow:none;}
input.answer-input {background:white;color:#17132f;border:3px solid transparent!important;box-shadow:none!important;border-radius:16px;min-height:72px;font:700 24px/1.3 var(--font-body);padding:15px 20px;text-align:left;}
input.answer-input:focus {border-color:#fff178!important;outline:0;box-shadow:0 0 0 3px #17132f!important;}
.charcount {color:#e2d3f6;line-height:1;font-size:11px;margin:-7px 3px -4px;}
.turnzone .prompt-inline {display:none;}
.turnzone .row .btn {flex:1;min-height:64px;font-size:22px;}
.turnzone .btn.good {background:#17132f;box-shadow:0 4px 0 #3b126a;border-color:#bb8bfa;}
.turnzone .btn.danger {border-color:#17132f;}
.spectate-note {font:35px/1.1 var(--font-display);color:white;margin:0;letter-spacing:1px;}
.spectate-note .who {color:#ffe859;}
.spectate-help {color:#e1d4f5;font-size:15px;margin:10px 0 18px;}
.turnzone > .btn {width:auto;min-width:220px;margin:0 0 18px;}
.turnzone > #timebox {max-width:none;margin-top:12px;}
.intro {color:#17132f;}

/* Voting is an opaque foreground scene, never ghosted text over the answer. */
.overlay {position:fixed;inset:0;z-index:90;background:rgba(20,14,42,.87);padding:24px;display:flex;align-items:center;justify-content:center;overflow:auto;backdrop-filter:blur(5px);animation:none;}
.overlay .panel {max-width:700px;gap:12px;}
.panel {width:min(700px,100%);max-height:calc(100dvh - 48px);overflow:auto;border:3px solid #17132f;background:#fffcef;color:#17132f;padding:28px;border-radius:24px;box-shadow:8px 8px 0 #ffdf53;}
.panel .eyebrow {font:42px var(--font-display);letter-spacing:1px;text-align:center;color:#6a23d9;margin-bottom:20px;}
.chal-head {color:#17132f;font:800 18px/1.4 var(--font-body);text-align:center;}
.chal-head b {color:#6523d9;text-shadow:none;}
.chal-answer {font:900 clamp(24px,4vw,44px)/1.18 var(--font-body);background:white;color:#17132f;border:3px solid #17132f;box-shadow:4px 4px 0 #6621df;padding:24px;border-radius:13px;overflow-wrap:anywhere;margin:12px 0;text-shadow:none;}
.challenge-reason {font-size:16px;text-align:center;color:#6621df;font-weight:900;}
.reasons {display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:16px 0;}
.reasons .btn {font-size:15px;}
.reasons .btn[aria-pressed=true] {color:white;background:#6621df;}
.challenge-stakes {color:#665270;line-height:1.5;font-size:12px;text-align:center;margin:20px 0 0;}
.challenged-tag,.warn-banner {background:#ffedb1;color:#623510;border:1px solid #e5ad40;box-shadow:none;font-size:14px;}
.vote-btns {display:grid;grid-template-columns:1fr 1fr;gap:14px;}
.vote-btns .btn {min-height:64px;}
.voted-tag {color:#51368a;}
.vote-count {color:#57446b;font:800 15px var(--font-body);}
.vote-count i {color:#6630cd;}
.votebar {background:#ebe1f6;border:1px solid #a78cc4;box-shadow:none;}
.votebar.blink > i {animation:none;}
#votebarLabel {color:#5b4076;}
.caught {background:#17132f;color:white;}

/* Round reveals and the leaderboard save receipt */
.round-results,.final-results {width:100%;max-width:1080px;margin:0 auto;gap:24px;}
.round-results {display:grid;grid-template-columns:1fr 1fr;align-items:start;}
.round-results .outcome-hero,.round-results .next-up {grid-column:1/-1;}
.round-results .delta-list,.round-results .answer-history {max-height:330px;overflow-y:auto;}
.round-results .headline {font-size:clamp(38px,4vw,58px);}
.final-results {max-width:none;}
.final-results > :not(.topbar) {width:min(100%,1080px);margin-left:auto;margin-right:auto;}
.outcome-hero {display:flex;align-items:center;justify-content:center;gap:32px;padding:16px 0;}
.outcome-mascot {width:200px;flex:0 0 200px;}
.outcome-mascot img,.winner-mascot img {width:100%;height:auto;}
.outcome-mascot .bomb-caption,.winner-mascot .bomb-caption {display:none;}
.headline {font:clamp(38px,5vw,70px)/1 var(--font-display);color:#17132f;margin:8px 0 16px;text-align:left;letter-spacing:1px;}
.outcome-hero p {color:#574561;font-size:16px;}
.delta,.standing {background:none;border:0;border-bottom:1px solid #d6cbe0;padding:16px 8px;color:#17132f;box-shadow:none;}
.standing.top {background:#f2e6ff;border-radius:12px;border:2px solid #7937d2;}
.delta .nm,.standing .nm {font-size:20px;font-weight:900;}
.delta .tot,.standing .tot {color:#5e21c5;font-size:29px;font-weight:1000;}
.delta .d.up {color:#326e47;}
.delta .d.down {color:#ac2341;}
.ah-item {border-color:#e0d6e7;color:#17132f;background:#f1eaff;font-size:16px;}
.delta .d,.delta .tot,.standing .tot,.standing .rk {font-family:var(--font-body);}
.ah-item .who {color:#6a2ecb;}
.next-up {color:#17132f;background:#fff6b7;border:2px solid #17132f;border-radius:14px;text-align:center;padding:18px;font-size:20px;}
.winner {display:grid;grid-template-columns:160px auto;grid-template-rows:auto auto;align-items:center;justify-content:center;column-gap:28px;text-align:left;padding:0;background:none;}
.winner-mascot {grid-column:1;grid-row:1/3;width:160px;}
.winner .lead {font-size:15px;color:#6630ca;letter-spacing:2px;text-transform:uppercase;align-self:end;}
.winner .name {font:clamp(40px,6vw,80px)/1.1 var(--font-display);color:#17132f;background:none;-webkit-text-fill-color:initial;text-shadow:none;align-self:start;}
.drama-grid {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;}
.drama-card {background:#fff9d8;border:2px solid #17132f;box-shadow:3px 4px 0 #17132f;color:#17132f;}
.drama-card .lbl {color:#692dcc;font:900 13px/1.3 var(--font-body);}
.drama-card .who {color:#17132f;font:900 24px/1.3 var(--font-body);}
.drama-card .det {color:#615269;}
.score-save {display:flex;flex-wrap:wrap;align-items:center;gap:12px 22px;border:2px solid #17132f;border-radius:16px;padding:20px 24px;background:#fffdf4;font-size:16px;}
.score-save p {margin:0;flex:1 1 300px;}
.score-save.saved {border-color:#326848;background:#efffe8;}
.score-save.failed,.score-save.signin {border-color:#a44024;background:#fff1da;}
.leaderboard-link {color:#6224bd;text-underline-offset:4px;font-weight:900;}
.final-results > .btn {max-width:360px;}
#toasts .toast {background:#17132f;color:white;border:2px solid #ffe35b;}
.reduce-motion *, .reduce-motion *::before, .reduce-motion *::after {animation:none!important;transition:none!important;scroll-behavior:auto!important;}
@media(prefers-reduced-motion:reduce) {*,*::before,*::after {animation:none!important;transition:none!important;scroll-behavior:auto!important;}}

@media(min-width:1600px) {#root {padding-top:26px;}.play {min-height:730px;}}
@media(max-width:1100px) {
  #root {padding:14px 20px 28px;}
  .topbar {grid-template-columns:minmax(210px,1fr) auto;min-height:125px;gap:12px;}
  .round-badge {grid-column:1;grid-row:2;margin:0;justify-self:start;font-size:20px;padding:10px 14px;}
  .header-actions {grid-column:2;grid-row:1/3;padding:12px 0;}
  .game-logo {max-height:105px;}
  .brand-link {width:340px;}
  .brand-tag {font-size:16px;}
  .play {grid-template-columns:125px minmax(0,1fr) 230px;gap:18px;min-height:600px;}
  .rail-player {flex-direction:column;align-items:center;text-align:center;gap:6px;}
  .rail-info small {display:none;}
  .center-stage .ans {font-size:clamp(28px,4vw,47px);}
  .play .center-stage {padding:38px;min-height:275px;}
  .bomb-caption {font-size:24px;}
  .home {gap:20px 32px;grid-template-columns:1fr 380px;}
  .home .brand {min-height:530px;}
}
@media(max-width:760px) {
  #root {padding:10px 12px 24px;}
  #root > .col {gap:16px;}
  .topbar {grid-template-columns:1fr auto;gap:8px;min-height:100px;}
  .brand-link {width:250px;max-width:100%;}
  .game-logo {height:77px;max-height:none;}
  .brand-tag {font-size:13px;letter-spacing:.6px;margin-top:-1px;}
  .header-actions {gap:5px;max-width:160px;padding:8px 0;}
  .toolbtn,.exitbtn {font-size:11px;min-height:38px;min-width:57px;padding:6px 8px;border-radius:10px;}
  .round-badge {font-size:18px;padding:8px 12px;}
  .play {grid-template-columns:minmax(0,1fr) 112px;grid-template-areas:'category category' 'players players' 'answer mascot' 'controls controls';gap:13px 8px;min-height:0;}
  .play > .prompt {margin:0;font-size:23px;padding:12px 16px;}
  .prompt .lead {font-size:10px;margin-bottom:5px;}
  .players-rail {flex-direction:row;gap:6px;padding:8px;border-radius:15px;overflow-x:auto;align-items:center;max-width:100%;}
  .turnzone .prompt-inline {display:block;color:#ede1ff;font-size:13px;line-height:1.4;}
  .play .prompt.prompt-inline .lead {color:#fff0a7;font:900 10px var(--font-body);letter-spacing:1px;}
  .rail-label {display:none;}
  .rail-player {flex-direction:row;gap:7px;min-width:110px;flex:1;padding:6px;border-radius:10px;}
  .player-avatar {width:33px;height:33px;flex-basis:33px;font-size:19px;}
  .rail-info {text-align:left;gap:1px;}
  .rail-info b {font-size:12px;}
  .rail-score {font-size:15px;}
  .play .wheel {min-height:180px;}
  .play .center-stage {min-height:180px;padding:24px 32px 23px 24px;gap:8px;}
  .center-stage .who {font-size:19px;padding:4px 8px;}
  .center-stage .ans {font-size:clamp(21px,4.5vw,33px);}
  .center-stage .ans.empty {font-size:21px;}
  .bomb-caption {font-size:17px;letter-spacing:0;padding:5px 7px;margin-top:-8px;}
  .turnzone {padding:16px;border-radius:18px;box-shadow:3px 4px 0 #17132f;}
  .answer-tools {gap:14px;}
  .your-turn {font-size:24px;padding:7px 9px;}
  #timebox {min-width:112px;flex:.85;}
  .timebar-label {font-size:11px;letter-spacing:0;}
  input.answer-input {min-height:59px;font-size:18px;padding:13px 14px;}
  .turnzone .row {gap:10px;}
  .turnzone .row .btn {font-size:16px;min-height:54px;padding:12px 8px;}
  .spectate-note {font-size:28px;}
  .spectate-help {font-size:13px;}
  .home {display:flex;flex-direction:column;gap:18px;}
  .home > * {width:100%;}
  .home .brand {min-height:0;padding:0 110px 0 0;}
  .home .brand h1 {font-size:43px;margin:6px 0;}
  .home .brand .eyebrow {font-size:10px;}
  .home-mascot {position:absolute;width:142px;right:-12px;top:-14px;margin:0;}
  .home .tag {font-size:15px;margin:0;}
  .home .card {padding:20px;}
  .home .legal {font-size:12px;order:5;}
  .home .howto {order:6;}
  .lobby-grid {display:flex;flex-direction:column;gap:16px;}
  .lobby-grid > * {width:100%;}
  .lobby-grid .card {padding:20px;}
  .roster {grid-template-columns:repeat(2,minmax(0,1fr));}
  .panel {padding:20px;max-height:calc(100dvh - 32px);border-radius:18px;}
  .overlay {padding:16px;}
  .panel .eyebrow {font-size:34px;margin-bottom:12px;}
  .chal-head {font-size:15px;}
  .chal-answer {padding:18px;font-size:27px;margin:16px 0;}
  .reasons {gap:9px;}
  .reasons .btn {font-size:13px;padding:10px;}
  .challenge-reason {font-size:14px;}
  .vote-btns {gap:10px;}
  .vote-btns .btn {font-size:15px;padding:12px;}
  .outcome-hero {gap:12px;padding:4px 0;}
  .outcome-mascot {width:104px;flex-basis:104px;}
  .headline {font-size:37px;}
  .outcome-hero p {font-size:13px;}
  .round-results .card,.final-results .card {padding:20px;}
  .round-results {display:flex;}
  .delta .nm,.standing .nm {font-size:16px;}
  .delta .tot,.standing .tot {font-size:25px;}
  .drama-grid {grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;}
  .winner {grid-template-columns:105px auto;gap:15px;}
  .winner-mascot {width:105px;}
  .winner .lead {font-size:11px;}
  .winner .name {font-size:45px;}
  .score-save {padding:17px;font-size:14px;gap:12px;}
}
@media(max-width:480px) {
  .play {grid-template-areas:'category category' 'players players' 'answer answer' 'controls controls';}
  .play > .bomb-stage {display:none;}
  .play .center-stage {min-height:190px;padding:43px 46px 40px 30px;}
  .center-stage .ans {font-size:25px;}
  .center-stage .ans.empty {font-size:22px;}
}
@media(max-width:380px) {
  .brand-link {width:190px;}
  .header-actions {max-width:126px;}
  .toolbtn,.exitbtn {min-width:53px;font-size:10px;}
  .play {grid-template-columns:minmax(0,1fr) 87px;}
  .play .center-stage {padding:40px 39px 38px 28px;}
  .center-stage .ans {font-size:21px;}
  .your-turn {font-size:20px;}
  .card {padding:17px;}
}