.hidden{display:none!important}.play-app-body{background:radial-gradient(circle at top,#172035 0,#0b0f16 36%,#080b10 100%);min-height:100vh}.join-header{display:flex}.play-shell{width:min(760px,100%);padding:12px}.join-hero{text-align:center;padding-top:18px}.join-icon,.waiting-icon,.leaderboard-icon{font-size:2.4rem;filter:drop-shadow(0 6px 12px rgba(0,0,0,.25))}.join-card{border-radius:22px}.gameplay-screen{min-height:100vh;display:flex;flex-direction:column}.app-topbar{position:sticky;top:0;z-index:10;background:rgba(8,11,16,.86);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border:1px solid rgba(255,255,255,.06);border-radius:16px;margin-bottom:10px;box-shadow:0 12px 32px rgba(0,0,0,.18)}.gameplay-status{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:8px 10px;color:var(--muted);font-size:.76rem}.gameplay-status-main,.gameplay-status-actions{display:flex;align-items:center;gap:7px;min-width:0}.gameplay-status-main strong{color:var(--text);max-width:30vw;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.mini-icon{font-size:.9rem}.state-chip,.question-state-chip{padding:.3rem .5rem;border-radius:999px;background:#151d2a;border:1px solid rgba(255,255,255,.08);text-transform:capitalize;font-weight:800}.connection-dot{width:8px;height:8px;border-radius:50%;background:var(--success);box-shadow:0 0 10px var(--success);flex:0 0 auto}.sr-status{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.score-mini{white-space:nowrap;color:var(--text);font-weight:900;background:#171f2c;border:1px solid rgba(255,255,255,.08);border-radius:999px;padding:.32rem .55rem}.leave-mini{min-height:0;padding:.32rem .5rem;border-radius:999px;background:#17131a;color:var(--muted);border:1px solid rgba(255,255,255,.08);font-size:.78rem}.gameplay-card{flex:1;background:linear-gradient(180deg,#141b29 0,#0f1520 100%);border:1px solid rgba(255,255,255,.08);border-radius:24px;padding:16px;box-shadow:0 24px 60px rgba(0,0,0,.28);overflow:hidden}.question-meta{display:flex;justify-content:space-between;gap:10px;align-items:center;margin-bottom:8px}.category-chip{display:inline-flex;align-items:center;gap:6px;padding:.42rem .7rem;border-radius:999px;background:linear-gradient(135deg,#2a2338,#1b2436);border:1px solid rgba(255,255,255,.08);font-size:.8rem;font-weight:900}.question-prompt{font-size:clamp(1.9rem,7.8vw,3.2rem);line-height:1.05;margin:10px auto 14px;text-align:center;max-width:19ch;font-weight:950;letter-spacing:-.03em;text-wrap:balance}.timer-zone{background:#0a1019;border:1px solid rgba(255,255,255,.06);border-radius:18px;padding:10px 12px 12px;margin-bottom:12px}.countdown-panel{display:flex;align-items:center;justify-content:center;gap:9px;margin:0 0 8px}.countdown-icon{font-size:1.35rem}.countdown-value{display:flex;align-items:baseline;gap:6px}.countdown-value span{font-size:clamp(2.5rem,11vw,4.4rem);font-weight:1000;line-height:.9}.countdown-value small{color:var(--muted);font-size:.72rem;text-transform:uppercase;letter-spacing:.09em;font-weight:900}.timer-track{height:12px;border-radius:999px;background:#090c12;border:1px solid rgba(255,255,255,.06);overflow:hidden}.timer-fill{height:100%;width:100%;background:linear-gradient(90deg,#64e5ff,#8e7bff,#ffcc5c);transform-origin:left center;transition:width .1s linear;box-shadow:0 0 16px rgba(100,229,255,.35)}.timer-fill.urgent{background:linear-gradient(90deg,#ffb34d,#ff5d73)}.clue-shell{height:90px;margin:0 0 12px;background:linear-gradient(180deg,#14111b,#101620);border:1px solid rgba(255,255,255,.08);border-radius:18px;padding:8px 10px;display:grid;grid-template-rows:auto 1fr;overflow:hidden}.clue-label{font-size:.72rem;line-height:1;text-transform:uppercase;letter-spacing:.1em;color:#ffd96a;font-weight:950;text-align:center}.hints-area{height:58px;display:grid;place-items:center;overflow:hidden}.hint{width:100%;height:58px;padding:5px 10px;border:0;background:transparent;color:#eef3ff;text-align:center;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;line-clamp:3;overflow:hidden;align-content:center;line-height:1.18;font-weight:800;font-size:.98rem}.hint-slot-empty{visibility:hidden}.answer-list{margin-top:0;position:relative;z-index:1;display:grid;grid-template-columns:1fr 1fr;gap:10px}.answer-choice{width:100%;min-height:78px;font-size:clamp(1rem,4vw,1.25rem);line-height:1.16;text-align:left;transition:border-color .15s,background .15s,transform .08s,box-shadow .15s;position:relative;z-index:2;pointer-events:auto;touch-action:manipulation;user-select:none;-webkit-tap-highlight-color:rgba(100,229,255,.16);padding:12px 12px 12px 54px;border-radius:18px;background:linear-gradient(180deg,#182232,#111925);border:1px solid rgba(255,255,255,.1);font-weight:850;box-shadow:0 8px 18px rgba(0,0,0,.16)}.answer-choice::before{content:attr(data-label);position:absolute;left:11px;top:50%;transform:translateY(-50%);width:32px;height:32px;border-radius:10px;display:grid;place-items:center;background:#0c121c;border:1px solid rgba(255,255,255,.1);font-weight:1000;color:#9eeeff}.answer-choice:active:not(:disabled){transform:scale(.985)}.answer-choice.selected{border-color:#74e9ff;background:linear-gradient(180deg,#193443,#142430);box-shadow:0 0 0 2px rgba(116,233,255,.16),0 10px 24px rgba(0,0,0,.2)}.answer-choice.selected::before{background:#74e9ff;color:#081018}.answer-choice.correct{border-color:var(--success);background:linear-gradient(180deg,#163326,#10241b)}.answer-choice.correct::before{background:var(--success);color:#07140d}.answer-choice.incorrect{border-color:var(--danger);background:linear-gradient(180deg,#351d25,#25141a)}.answer-choice.incorrect::before{background:var(--danger);color:#fff}.answer-choice:disabled:not(.selected):not(.correct):not(.incorrect){cursor:default;opacity:.86}.answer-message{margin:12px 2px 0;min-height:2.2em;font-weight:850;text-align:center;color:var(--text);padding:9px 10px;border-radius:14px;background:rgba(255,255,255,.035)}.waiting-screen{flex:1;display:grid;align-content:center;text-align:center;padding:16vh 20px}.waiting-title{font-size:clamp(1.8rem,8vw,2.8rem);margin:.35rem 0}.waiting-copy{margin:0}.leaderboard-screen{flex:1;padding:6vh 2px 24px;text-align:center}.leaderboard-screen h1{font-size:clamp(2.2rem,10vw,3.6rem);margin:.35rem 0 1rem}.your-standing{margin:0 auto 18px;padding:14px 16px;border:1px solid #74e9ff;border-radius:18px;background:linear-gradient(135deg,#132b37,#171c2b);font-size:1.05rem;font-weight:900}.player-leaderboard{display:grid;gap:9px;text-align:left}.player-rank{display:grid;grid-template-columns:44px 1fr auto;align-items:center;gap:10px;padding:13px 14px;border:1px solid rgba(255,255,255,.08);border-radius:16px;background:#111821}.player-rank.you{border-color:#74e9ff;background:#142632}.player-rank .rank{font-weight:950;color:#ffd96a}.player-rank .name{font-weight:850;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.player-rank .points{font-weight:900}.leaderboard-message{margin:16px 0 0;text-align:center}.player-stats-data{display:none}.join-actions{display:grid;gap:10px}.play-help{margin-top:14px;text-align:center}.trivia-build-footer{font-size:.65rem;padding:8px;opacity:.45}

/* Mobile gameplay owns the dynamic viewport. This prevents browser chrome/footer
   from creating a page scroll while a question is live. */
.play-app-body:has(#game:not(.hidden)){height:100dvh;min-height:100dvh;overflow:hidden;overscroll-behavior:none}.play-app-body:has(#game:not(.hidden)) .trivia-build-footer{display:none}.play-app-body:has(#game:not(.hidden)) .play-shell{height:100dvh;max-height:100dvh;overflow:hidden;padding:max(6px,env(safe-area-inset-top)) max(7px,env(safe-area-inset-right)) max(6px,env(safe-area-inset-bottom)) max(7px,env(safe-area-inset-left))}.play-app-body:has(#game:not(.hidden)) .gameplay-screen{height:100%;min-height:0;max-height:100%;overflow:hidden}.play-app-body:has(#game:not(.hidden)) .app-topbar{position:relative;flex:0 0 auto;margin-bottom:clamp(4px,.8dvh,8px)}.play-app-body:has(#game:not(.hidden)) .gameplay-status{padding:clamp(5px,.8dvh,8px) 8px}.play-app-body:has(#game:not(.hidden)) .gameplay-card{min-height:0;max-height:100%;display:flex;flex-direction:column;padding:clamp(8px,1.25dvh,13px);border-radius:clamp(16px,2.5dvh,22px)}.play-app-body:has(#game:not(.hidden)) .question-meta{flex:0 0 auto;margin-bottom:clamp(2px,.45dvh,6px)}.play-app-body:has(#game:not(.hidden)) .category-chip{padding:clamp(.22rem,.6dvh,.4rem) clamp(.45rem,1.2vw,.65rem);font-size:clamp(.65rem,1.55dvh,.78rem)}.play-app-body:has(#game:not(.hidden)) .question-state-chip{padding:.2rem .4rem;font-size:clamp(.62rem,1.45dvh,.74rem)}.play-app-body:has(#game:not(.hidden)) .question-prompt{flex:0 1 auto;font-size:clamp(1.16rem,min(5.6vw,3.15dvh),2rem);line-height:1.02;margin:clamp(3px,.65dvh,7px) auto clamp(4px,.9dvh,9px);max-width:28ch;letter-spacing:-.025em}.play-app-body:has(#game:not(.hidden)) .timer-zone{flex:0 0 auto;border-radius:clamp(11px,1.8dvh,16px);padding:clamp(5px,.7dvh,8px) 9px clamp(6px,.85dvh,9px);margin-bottom:clamp(4px,.8dvh,8px)}.play-app-body:has(#game:not(.hidden)) .countdown-panel{gap:6px;margin-bottom:clamp(3px,.5dvh,6px)}.play-app-body:has(#game:not(.hidden)) .countdown-icon{font-size:clamp(.95rem,2.25dvh,1.2rem)}.play-app-body:has(#game:not(.hidden)) .countdown-value span{font-size:clamp(1.7rem,5.2dvh,3rem);line-height:.88}.play-app-body:has(#game:not(.hidden)) .countdown-value small{font-size:clamp(.55rem,1.25dvh,.68rem)}.play-app-body:has(#game:not(.hidden)) .timer-track{height:clamp(7px,1.2dvh,10px)}.play-app-body:has(#game:not(.hidden)) .clue-shell{flex:0 0 auto;height:clamp(58px,9.8dvh,78px);margin-bottom:clamp(4px,.8dvh,8px);padding:clamp(5px,.7dvh,7px) 8px;border-radius:clamp(12px,1.9dvh,16px)}.play-app-body:has(#game:not(.hidden)) .clue-label{font-size:clamp(.58rem,1.25dvh,.68rem)}.play-app-body:has(#game:not(.hidden)) .hints-area,.play-app-body:has(#game:not(.hidden)) .hint{height:auto;min-height:0}.play-app-body:has(#game:not(.hidden)) .hints-area{overflow:visible}.play-app-body:has(#game:not(.hidden)) .hint{padding:2px 5px;display:block;overflow:visible;font-size:clamp(.72rem,1.8dvh,.93rem);line-height:1.08}.play-app-body:has(#game:not(.hidden)) .answer-list{flex:1 1 auto;min-height:0;grid-template-columns:1fr 1fr;grid-template-rows:repeat(2,minmax(0,1fr));gap:clamp(5px,.8dvh,8px)}.play-app-body:has(#game:not(.hidden)) .answer-choice{min-height:0;height:100%;font-size:clamp(.72rem,min(3.2vw,1.8dvh),1rem);line-height:1.08;padding:clamp(7px,1.1dvh,10px) 7px clamp(7px,1.1dvh,10px) clamp(36px,9vw,46px);border-radius:clamp(12px,2dvh,16px);overflow-wrap:anywhere}.play-app-body:has(#game:not(.hidden)) .answer-choice::before{left:clamp(7px,1.8vw,10px);width:clamp(24px,6.6vw,30px);height:clamp(24px,6.6vw,30px);border-radius:8px;font-size:clamp(.68rem,1.65dvh,.85rem)}.play-app-body:has(#game:not(.hidden)) .answer-message{flex:0 0 auto;margin:clamp(4px,.7dvh,7px) 1px 0;min-height:0;padding:clamp(5px,.7dvh,7px) 7px;font-size:clamp(.68rem,1.55dvh,.83rem);line-height:1.08;border-radius:10px}

@media(max-width:520px){.answer-list{grid-template-columns:1fr 1fr}.answer-choice{min-height:66px}.gameplay-card{padding:13px}.question-prompt{font-size:clamp(1.7rem,8.4vw,2.35rem)}.clue-shell{height:88px}.hints-area,.hint{height:56px}.gameplay-status-main strong{max-width:27vw}.score-mini{font-size:.7rem}.state-chip{display:none}.play-app-body:has(#game:not(.hidden)) .answer-choice{min-height:0}.play-app-body:has(#game:not(.hidden)) .gameplay-card{padding:clamp(7px,1.15dvh,11px)}.play-app-body:has(#game:not(.hidden)) .question-prompt{font-size:clamp(1.12rem,min(5.8vw,3dvh),1.85rem)}}
@media(max-height:720px){.play-app-body:has(#game:not(.hidden)) .mini-icon{display:none}.play-app-body:has(#game:not(.hidden)) .gameplay-status{font-size:.68rem}.play-app-body:has(#game:not(.hidden)) .score-mini{padding:.24rem .42rem}.play-app-body:has(#game:not(.hidden)) .leave-mini{padding:.24rem .4rem}.play-app-body:has(#game:not(.hidden)) .question-prompt{font-size:clamp(1.05rem,min(5.3vw,2.7dvh),1.55rem)}.play-app-body:has(#game:not(.hidden)) .clue-shell{height:clamp(52px,9dvh,64px)}.play-app-body:has(#game:not(.hidden)) .answer-message{font-size:.66rem}}
@media(max-height:620px){.play-app-body:has(#game:not(.hidden)) .gameplay-status{padding:3px 6px}.play-app-body:has(#game:not(.hidden)) .question-meta{margin:0}.play-app-body:has(#game:not(.hidden)) .question-prompt{font-size:clamp(.98rem,min(5vw,2.5dvh),1.35rem);margin:2px auto 3px}.play-app-body:has(#game:not(.hidden)) .timer-zone{padding:3px 7px 4px;margin-bottom:3px}.play-app-body:has(#game:not(.hidden)) .countdown-value span{font-size:1.55rem}.play-app-body:has(#game:not(.hidden)) .clue-shell{height:50px;margin-bottom:3px;padding:3px 6px}.play-app-body:has(#game:not(.hidden)) .hint{font-size:.68rem;line-height:1.02}.play-app-body:has(#game:not(.hidden)) .answer-list{gap:4px}.play-app-body:has(#game:not(.hidden)) .answer-choice{font-size:.68rem;padding-top:5px;padding-bottom:5px}.play-app-body:has(#game:not(.hidden)) .answer-message{margin-top:3px;padding:4px 6px;font-size:.62rem}}