:root{color-scheme:dark;--gold:#f4cc81;--muted:#a2afc8;--line:#304464;--panel:#101e36}
*{box-sizing:border-box} [hidden]{display:none!important} body{margin:0;background:#080f20 url('studio.svg') center top/cover fixed;color:#edf3ff;font:15px system-ui,'Segoe UI',sans-serif;min-height:100vh} button,input,textarea,select{font:inherit}button,.filebutton{border:1px solid var(--line);border-radius:8px;background:#16263f;color:#dce6fa;padding:11px 16px;cursor:pointer;transition:background .2s,border-color .2s,transform .2s}button:hover,.filebutton:hover{background:#2b4165;border-color:#97b0d6;transform:translateY(-1px)}button:active{transform:translateY(1px)}button:disabled{opacity:.42;cursor:default;transform:none}button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline:2px solid var(--gold);outline-offset:3px}.gold{background:linear-gradient(115deg,#ffe2a5,#e3ae57);color:#192237;font-weight:750;border-color:#f4cb80;box-shadow:0 3px 15px #e0ac4d15}.gold:hover{background:#ffdfa0}.danger{color:#ffa59e;border-color:#72434d}
header{display:flex;align-items:center;justify-content:space-between;gap:20px;border-bottom:1px solid #b5cdff16;padding:19px 4vw;background:#080f1be6;position:relative;z-index:1}.brand{color:var(--gold);text-decoration:none;font-size:34px;font-weight:900;letter-spacing:2px}.brand span{font-size:21px}.brand small{display:block;font-size:8px;letter-spacing:3.5px;color:#a4b1c9}nav{display:flex;gap:7px;flex-wrap:wrap;justify-content:flex-end}nav button{font-size:12px;padding:10px 13px}main{max-width:1180px;margin:auto;padding:0 32px}.livebar{display:flex;align-items:center;gap:10px;padding:17px 0;border-bottom:1px solid #ffffff0e;font-size:9px;letter-spacing:1.5px;color:#a4b1cb}.live-dot{width:6px;height:6px;border-radius:50%;background:#f2cd85;box-shadow:0 0 12px #f2cd8599}.in-room .live-dot{background:#6ee2ba;box-shadow:0 0 10px #6ee2ba}.live-copy{margin-left:auto;color:#7d91b3;letter-spacing:.5px}.livebar button{background:transparent;border:0;font-size:10px;padding:4px 0 4px 14px;color:#d8bd8a}
.scoreline{display:grid;grid-template-columns:1fr 1.85fr 1fr;align-items:center;gap:35px;margin:25px 0 30px}.team{border:1px solid #3c5377;border-radius:14px;background:linear-gradient(140deg,#172b49dd,#0b172be8);padding:14px 20px;text-align:center;position:relative;box-shadow:0 12px 35px #0003;transition:.3s}.team.active{border-color:var(--gold);box-shadow:0 0 25px #ecc16918,inset 0 2px #f0cc8033}.team-mark{display:flex;justify-content:space-between;color:#b69760;font:12px ui-monospace,Consolas,monospace;margin-bottom:13px}.team-mark span{font:8px system-ui;letter-spacing:2px;color:#7e92b0}.team input{width:100%;background:none;border:0;text-align:center;color:#e5ecfb;font-weight:650;font-size:17px}.team input:disabled{opacity:1}.team strong{display:block;font:57px ui-monospace,Consolas,monospace;color:var(--gold);margin:4px 0 8px;text-shadow:0 0 18px #ffce701a}.team button{padding:6px 11px;font-size:9px;letter-spacing:1px;text-transform:uppercase;background:#11213a}.title{text-align:center;min-width:0}.onair{font-size:9px;letter-spacing:3px;color:#ad9b7a;margin-bottom:6px}.title h1{font-size:clamp(40px,5.5vw,76px);font-style:italic;letter-spacing:-3px;margin:0;background:linear-gradient(#ffe7ae,#edc371 58%,#b77b36);background-clip:text;-webkit-text-fill-color:transparent;filter:drop-shadow(0 3px 0 #603e24)}.title p{font-size:11px;color:var(--muted);margin:10px 0 21px}.title>span{border:1px solid #b58a4466;background:#121e35;border-radius:20px;padding:6px 18px;font-size:9px;letter-spacing:2px;color:var(--gold)}
.stage{background:linear-gradient(150deg,#1a3151ef,#091429f5 70%);border:2px solid #bca16a;border-radius:18px;padding:22px 37px;box-shadow:0 0 0 5px #1c2d48,0 18px 70px #0008,inset 0 0 45px #5c8cd30c;position:relative}.stage:before{content:'';height:2px;position:absolute;top:-2px;left:14%;right:14%;background:linear-gradient(90deg,transparent,#ffe8b4,transparent);box-shadow:0 0 14px #eac07966}.stage-top{display:flex;justify-content:space-between;color:var(--gold);font-size:9px;letter-spacing:2px}.stage h2{text-align:center;font-size:24px;min-height:30px;margin:20px 0 22px;line-height:1.4;overflow-wrap:anywhere}#board{display:grid;gap:8px;max-width:850px;margin:auto;perspective:1000px}.answer{display:flex;align-items:center;text-align:left;width:100%;border:1px solid #3d5579;background:linear-gradient(100deg,#1f3758,#142943);padding:0;min-height:48px;border-radius:6px;overflow:hidden;color:#f3d391;font-weight:700;letter-spacing:2px;font-size:19px;box-shadow:inset 0 1px #ffffff08}.answer:disabled{opacity:1}.answer.hidden:disabled{cursor:default}.answer .num{width:52px;flex-shrink:0;text-align:center;font:15px ui-monospace,Consolas,monospace;color:#afbed5}.answer .text{flex:1;min-width:0;padding:11px 15px;border-left:1px solid #46608144;overflow-wrap:anywhere}.answer .points{border-left:1px solid #52647c77;min-width:68px;align-self:stretch;display:grid;place-items:center;font:24px ui-monospace,monospace;background:#09182a33}.answer.revealed{background:linear-gradient(100deg,#234860,#19324c);border-color:#b69c5f}.answer.revealed .text{text-transform:uppercase;text-shadow:0 0 9px #e9c05d44}.answer.hidden .text{color:#557097;letter-spacing:6px}.stage-bottom{display:flex;justify-content:space-between;align-items:center;margin-top:20px;gap:15px}#strikes{display:flex;gap:9px}#strikes span{font-size:27px;font-weight:bold;color:#334b70;border:1px solid #334b70;width:39px;height:39px;text-align:center;border-radius:5px}#strikes span.on{color:#ff7774;border-color:#ed7774;background:#c03c3c10;text-shadow:0 0 12px #ff3636}.bank{display:flex;align-items:center;gap:17px;color:#b1bfd6;font-size:9px;letter-spacing:2px}.bank strong{font:38px ui-monospace,monospace;color:var(--gold)}
.controls{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-top:24px;padding:20px 0;border-bottom:1px solid #ffffff12}.label{font-size:9px;letter-spacing:2px;color:var(--gold)}.controls p{color:var(--muted);font-size:12px;margin:6px 0}.buttons{display:flex;gap:8px;align-items:center;flex-wrap:wrap}footer{display:flex;justify-content:space-between;align-items:center;padding:18px 0 25px;color:#8a9cb9;font-size:10px;gap:15px;flex-wrap:wrap}footer button{border:0;background:none;font-size:11px;padding:8px}.version{font-size:8px;letter-spacing:2px;color:#6e819f}kbd{background:#1a2b46;padding:3px 6px;border-radius:3px;color:#c3cfe2}
dialog{background:linear-gradient(135deg,#182d4b,#0b172d);color:#edf3fa;border:1px solid #8e7e59;border-radius:16px;padding:28px;width:min(850px,94vw);max-height:90vh;box-shadow:0 20px 100px #000a}dialog[open]{animation:dialogIn .22s ease-out}dialog::backdrop{background:#030914db;backdrop-filter:blur(7px)}.dialog-head{display:flex;align-items:center;justify-content:space-between;gap:15px}.dialog-head h2{margin:0;color:var(--gold);font-size:25px}.dialog-head button{background:none;border:0}dialog p{color:#b2bfd4;line-height:1.6}textarea{width:100%;height:300px;background:#081427;color:#e6d29d;border:1px solid var(--line);border-radius:7px;padding:15px;font:13px/1.7 Consolas,monospace}.muted{font-size:12px;color:var(--muted)}.filebutton input{display:none}#editorError,#lobbyStatus{color:#ffb49c}input:not(.team input),select{background:#0c1c33;color:#ebd6aa;padding:11px;border:1px solid #385074;border-radius:7px;min-width:0}label{color:#afbed5;font-size:12px}.timer{display:flex;align-items:center;gap:10px;margin:20px 0;flex-wrap:wrap}.timer strong{font:46px ui-monospace,monospace;color:var(--gold);min-width:65px}.timer .urgent{color:#ff8580}.finalrow{display:grid;grid-template-columns:1fr 75px 75px;gap:9px;margin:10px 0;align-items:center}.finalrow input{width:100%;padding:10px}.finalrow small{font-size:9px;color:#9aaecb}.finaltotal{display:flex;justify-content:space-between;margin-top:22px;color:var(--gold);font-size:22px}
.panel{background:#0e1d34e8;border:1px solid #354d73;border-radius:14px;margin-top:25px;padding:22px}.panel-heading{display:flex;justify-content:space-between;align-items:center;gap:15px;flex-wrap:wrap}.panel-heading .buttons button{padding:7px 12px;font-size:11px}#roomCode{font:21px ui-monospace,monospace;margin-left:8px;color:#ffe0a0}.lobby-grid{display:grid;grid-template-columns:1fr 1fr;gap:22px;margin-top:25px}.lobby-grid>section{border:1px solid #354e74;background:#0c1a30;border-radius:12px;padding:24px}.lobby-grid h3{margin:14px 0;font-size:21px}.lobby-grid p{font-size:13px;margin-bottom:24px}#joinForm{display:grid;gap:10px}#joinCode{text-transform:uppercase;letter-spacing:3px}#joinForm button{margin-top:9px}#roster{display:flex;flex-wrap:wrap;gap:8px;margin:18px 0}.member{font-size:11px;border:1px solid #304665;padding:8px 12px;border-radius:30px;color:#94a6c2}.member.connected{color:#a5e3c7;background:#17342f66;border-color:#376453}.buzz-status{display:flex;align-items:center;justify-content:space-between;gap:15px;font-size:12px;color:#d2bf96}.buzz-status button{font-size:11px;padding:7px 11px}.submission{display:flex;align-items:center;justify-content:space-between;gap:15px;flex-wrap:wrap;border-top:1px solid #304261;margin-top:15px;padding-top:15px}.submission small{display:block;font-size:11px;color:#93a7c7}.submission strong{display:block;font-size:19px;margin-top:5px;overflow-wrap:anywhere}.submission button,.submission select{font-size:11px;padding:8px;max-width:230px}.player-actions{display:flex;align-items:center;gap:25px;margin-top:18px}.buzzer{border-radius:50%;width:105px;height:105px;flex-shrink:0;background:radial-gradient(circle at 35% 25%,#ff8680,#c43e56 65%,#7e223c);border:5px solid #70263e;box-shadow:0 7px 0 #491629,0 12px 30px #df354f25;color:white;font-size:11px;font-weight:800;letter-spacing:.5px}.buzzer:hover{background:#e86076;border-color:#953650;transform:translateY(2px)}.buzzer:active{transform:translateY(6px);box-shadow:0 1px 0 #491629}#answerForm{flex:1;min-width:0}.answer-entry{display:flex;gap:10px;margin-top:8px}.answer-entry input{flex:1;width:100%}#answerStatus{font-size:12px;color:#a4b9d7;margin:18px 0 0}#playerIdentity{font-size:12px;color:#a6bdde}#finalQuestionSelect{margin-top:10px;max-width:100%}.player-view #settings,.player-view #undo,.player-view #reset{display:none}
#toast{position:fixed;bottom:25px;left:50%;transform:translateX(-50%);background:#f0d39b;color:#152137;padding:14px 24px;border-radius:8px;opacity:0;pointer-events:none;transition:opacity .2s;z-index:20;max-width:90vw;font-size:13px}#toast.show{opacity:1}#effectLayer{position:fixed;inset:0;pointer-events:none;z-index:15;overflow:hidden}.confetti{position:absolute;top:-20px;width:9px;height:17px;animation:confettiFall 2.1s ease-in forwards}.reveal-now{animation:reveal .6s cubic-bezier(.2,.8,.2,1)}.shake{animation:shake .4s} .studio-lights{position:fixed;inset:0;pointer-events:none;background:radial-gradient(ellipse at 15% 0,#849dff0d,transparent 45%);animation:lights 9s ease-in-out infinite alternate;z-index:-1}
@keyframes reveal{0%{transform:rotateX(85deg);opacity:.25}65%{transform:rotateX(-8deg);box-shadow:0 0 20px #f4cc8133}100%{transform:rotateX(0)}}@keyframes confettiFall{to{transform:translate(var(--drift),110vh) rotate(620deg);opacity:.2}}@keyframes shake{20%,60%{transform:translateX(-5px)}40%,80%{transform:translateX(5px)}}@keyframes dialogIn{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}@keyframes lights{to{opacity:.2;transform:translateX(4%)}}
@media(max-width:900px){header{padding:15px 20px;gap:12px}nav button{font-size:10px;padding:9px}.brand{font-size:28px}.brand span{font-size:16px}.brand small{font-size:6px}.scoreline{gap:18px}.controls{align-items:flex-start;flex-direction:column}.live-copy{display:none}.livebar button{margin-left:auto}.team{padding:13px}.version{display:none}}
@media(max-width:600px){header{flex-wrap:wrap;justify-content:center;padding:12px}.brand{font-size:30px}.brand span{font-size:20px}.brand small{text-align:center}nav{justify-content:center;gap:5px}nav button{font-size:10px;padding:8px 10px}main{padding:0 14px}.livebar{font-size:8px;letter-spacing:.5px}.scoreline{grid-template-columns:1fr 1.25fr 1fr;gap:10px;margin:20px 0 24px}.title h1{font-size:35px;letter-spacing:-1px}.title p{display:none}.onair{font-size:6px;letter-spacing:1px;margin-bottom:10px}.title>span{display:inline-block;margin-top:13px;padding:5px 7px;font-size:7px;letter-spacing:1px}.team{padding:9px 6px}.team-mark{font-size:9px;margin-bottom:8px}.team-mark span{font-size:6px;letter-spacing:.7px}.team input{font-size:12px}.team strong{font-size:37px}.team button{font-size:7px;padding:5px 6px;letter-spacing:0}.stage{padding:17px 13px;border-radius:13px}.stage h2{font-size:18px;margin:17px 0}.stage-top{font-size:7px;letter-spacing:1px}#board{gap:7px}.answer{font-size:13px;letter-spacing:.8px;min-height:45px}.answer .num{width:30px;font-size:12px}.answer .text{padding:10px}.answer.hidden .text{letter-spacing:3px}.answer .points{min-width:40px;font-size:20px}#strikes{gap:6px}#strikes span{width:29px;height:29px;font-size:20px}.bank{font-size:7px;letter-spacing:.5px;gap:10px}.bank strong{font-size:29px}.controls{margin-top:16px;padding:19px 0}.controls .buttons{width:100%}.controls button{font-size:11px;padding:11px;flex:1}footer{font-size:8px;gap:8px}.panel{padding:16px}.panel-heading{gap:12px}.panel-heading .buttons{gap:5px}.panel-heading .buttons button{font-size:10px;padding:7px}dialog{padding:19px}.dialog-head h2{font-size:22px}.lobby-grid{grid-template-columns:1fr;gap:14px}.lobby-grid>section{padding:18px}.player-actions{gap:15px}.buzzer{width:82px;height:82px;font-size:9px}.answer-entry{flex-wrap:wrap;gap:7px}.answer-entry button{width:100%;font-size:12px}.buzz-status{align-items:flex-start}.submission .buttons{width:100%}.submission select{max-width:100%;flex:1 0 100%}.finalrow{grid-template-columns:1fr 52px 52px;font-size:12px}.finalrow input{padding:9px 5px}.timer button,.timer select{font-size:12px}.timer strong{font-size:40px}.livebar #readQuestion{font-size:9px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
@media(max-width:400px){.title h1{font-size:30px}.onair{letter-spacing:.6px}}
.mic-controls{display:flex;align-items:center;gap:14px;margin-top:12px}.mic-controls button{font-size:12px;padding:9px 13px;border-color:#6c6384;background:#25233e;color:#e1d3ff}.mic-controls button[aria-pressed="true"]{background:#512b42;border-color:#ff919b;color:#ffe6e9}.mic-status{font-size:11px;line-height:1.5;color:#b5c6e0;margin:9px 0 0;overflow-wrap:anywhere}.mic-privacy{font-size:10px;line-height:1.5;color:#8397b5;margin:7px 0 0}.mic-indicator{display:none;align-items:center;gap:3px;height:23px}.listening .mic-indicator{display:flex}.mic-indicator i{display:block;width:3px;height:8px;background:#ef9dae;border-radius:3px;animation:micWave .7s ease-in-out infinite alternate}.mic-indicator i:nth-child(2){animation-delay:.2s}.mic-indicator i:nth-child(3){animation-delay:.35s}.mic-indicator i:nth-child(4){animation-delay:.1s}.mic-indicator i:nth-child(5){animation-delay:.25s}@keyframes micWave{to{height:23px;background:#ffdb92}}@media(prefers-reduced-motion:reduce){.mic-indicator i{height:15px;animation:none!important}}@media(max-width:600px){.mic-controls{gap:8px}.mic-controls button{font-size:11px;padding:10px}.player-actions{align-items:flex-start}.buzzer{margin-top:25px}}
.restart-button{color:#ffe0ab;border-color:#a78956;background:#3e3025}.player-view #restart{display:none}
.phase-banner{font-size:13px;text-align:center;color:#c5d6ef;line-height:1.6;margin:0 0 17px;padding:11px 14px;background:#0b1b30a6;border:1px solid #3f5878;border-radius:8px}.phase-banner.steal-phase{color:#ffe0a0;border-color:#b68a4e;background:#513c262e}.player-turn{font-size:13px;line-height:1.5;color:#f1d291;margin:15px 0 0}.match-result{text-align:center;border-color:var(--gold)}.match-result h2{color:var(--gold);font-size:32px;margin:15px 0}.match-result>p{font-size:17px;color:#d9e4f5}.match-result .muted{font-size:12px}.results-scroll{overflow-x:auto}.match-result table{width:100%;border-collapse:collapse;margin:18px 0;font-size:13px}.match-result th,.match-result td{padding:12px 9px;border-bottom:1px solid #354965;text-align:left}.match-result th{font-size:10px;letter-spacing:1px;color:#b9cae6}.match-result td:last-child{color:var(--gold);font-weight:700}.stage-top{gap:12px}.stage-top span{overflow-wrap:anywhere}.team button:disabled{opacity:.85;color:#c9d7ec}.team button{min-height:27px}@media(max-width:600px){.phase-banner{font-size:11px;padding:9px}.match-result h2{font-size:25px}.match-result table{font-size:11px}.match-result th{font-size:8px}.team button{min-height:29px;font-size:6px}.stage-top{line-height:1.5}.match-result>p{font-size:14px}}
.answer-ok,#answerStatus.answer-ok{color:#a8e8c3}.answer-wrong,#answerStatus.answer-wrong{color:#ffaaa4}.submission>span{font-size:12px}.submission strong{max-width:650px}
.answer{cursor:default}.answer:hover,.answer:active{transform:none}