:root{color:#f7f4e9;background:#101632;font-family:Inter,system-ui,sans-serif;font-synthesis:none;--ink: #101632;--paper: #fffaf0;--yellow: #ffcf4c;--pink: #ff668f;--cyan: #5ee6de;--violet: #8d73ff}*{box-sizing:border-box}html,body,#app{width:100%;min-width:960px;min-height:100%;margin:0}body{min-height:100vh;overflow:hidden;background:radial-gradient(circle at 50% 20%,#2a3566 0,#151c3d 45%,#0c1027)}button,input,select{font:inherit}button{cursor:pointer}body:before{position:fixed;inset:0;content:"";pointer-events:none;opacity:.16;background-image:linear-gradient(#fff 1px,transparent 1px),linear-gradient(90deg,#fff 1px,transparent 1px);background-size:42px 42px;mask-image:linear-gradient(to bottom,#000,transparent 80%)}.brand{position:fixed;z-index:30;top:24px;left:30px;display:flex;gap:11px;align-items:center;font:800 17px "Baloo 2";letter-spacing:.08em}body.in-game .brand{display:none}.brand-die{display:grid;width:35px;height:35px;place-items:center;color:var(--ink);background:var(--yellow);border:3px solid var(--ink);border-radius:9px;box-shadow:3px 3px #fff;transform:rotate(-4deg)}#connection-dot{width:9px;height:9px;margin-left:4px;border-radius:50%;background:#ef5965;box-shadow:0 0 0 3px #ef596544}#connection-dot.online{background:#65e58c;box-shadow:0 0 0 3px #65e58c44}main{height:100vh}.screen{position:absolute;inset:0;display:none;padding:92px 7vw 60px}.screen.active{display:flex;animation:screen-in .32s ease both}.screen.centred{align-items:center;justify-content:center;text-align:center}@keyframes screen-in{0%{opacity:0;transform:translateY(8px)}}h1,h2{margin:0;font-family:"Baloo 2",system-ui;line-height:.98}h1{font-size:clamp(46px,5.5vw,84px)}h1 em{color:var(--yellow);font-style:normal;text-shadow:4px 4px 0 var(--pink)}h2{font-size:29px}.eyebrow{margin:0 0 10px;color:var(--yellow);font-size:12px;font-weight:800;letter-spacing:.18em;text-transform:uppercase}.panel{color:var(--ink);background:var(--paper);border:4px solid var(--ink);border-radius:22px;box-shadow:9px 9px #070a1c88}.primary{color:var(--ink);background:var(--yellow);border-color:var(--ink);box-shadow:4px 4px 0 var(--ink)}button{min-height:44px;padding:10px 17px;color:var(--ink);background:#fff;border:3px solid var(--ink);border-radius:11px;font-weight:800;transition:transform .12s,box-shadow .12s}button:hover{transform:translate(-1px,-1px);box-shadow:3px 3px 0 var(--pink)}button:active{transform:translate(2px,2px);box-shadow:none}button:disabled{cursor:not-allowed;opacity:.45;transform:none;box-shadow:none}button:focus-visible,input:focus-visible,select:focus-visible{outline:4px solid var(--pink);outline-offset:3px}button.quiet{min-height:38px;padding:7px 12px;background:transparent;border-width:2px}label{display:grid;gap:7px;font-size:12px;font-weight:800;letter-spacing:.04em;text-transform:uppercase}input,select{width:100%;min-height:45px;padding:9px 12px;color:var(--ink);background:#fff;border:2px solid var(--ink);border-radius:9px}kbd{padding:4px 7px;color:var(--ink);background:var(--paper);border:2px solid var(--ink);border-radius:6px;box-shadow:0 2px 0 var(--ink)}[data-screen=identity]{align-items:center;justify-content:space-between;gap:8vw}.hero{width:58%;max-width:750px}.identity-stage{display:grid;grid-template-columns:minmax(300px,1fr) minmax(270px,.85fr);gap:22px;align-items:center}.player-preview{display:grid;place-items:center;min-width:0}.player-preview canvas{display:block;width:min(420px,32vw);height:auto;aspect-ratio:1;filter:drop-shadow(0 25px 38px #050817aa)}.control-guide{display:grid;gap:10px}.control-guide>div{display:grid;grid-template-columns:58px 1fr;gap:5px 10px;align-items:center;padding:11px 12px;background:#111832c9;border:2px solid #7983b1;border-radius:12px}.control-guide strong{grid-row:1 / 3;color:var(--yellow);font:800 15px "Baloo 2"}.control-guide span{color:#fffaf0;font-size:11px;line-height:1.8;white-space:nowrap}.control-guide kbd{padding:2px 5px;font-size:10px}.identity-card{width:370px;padding:28px;transform:rotate(1deg)}.identity-card h2{margin-bottom:18px}.identity-card label{margin:14px 0}.identity-actions{display:grid;grid-template-columns:auto 1fr;gap:9px;margin-top:10px}.identity-actions button{width:100%}.identity-actions button[hidden]{display:none}.colour-fields{display:grid;grid-template-columns:1fr 1fr;gap:12px}.colour-fields input{padding:4px}[data-screen=menu]{flex-direction:column;justify-content:center}.menu-title{display:flex;gap:32px;align-items:center;margin-bottom:28px}.menu-title h1{flex:0 0 auto;font-size:58px}.menu-controls{display:flex;flex-wrap:wrap;gap:10px 20px;align-items:center;color:#eef1ff;font-size:11px}.menu-controls span{white-space:nowrap}.menu-controls strong{color:var(--yellow)}.menu-controls kbd{padding:2px 5px;font-size:10px}.menu-grid{display:grid;grid-template-columns:.9fr 1.4fr .8fr;gap:18px}.menu-grid .panel{position:relative;min-height:235px;padding:25px;overflow:hidden}.menu-grid label{margin:20px 0 12px}.panel-head{display:flex;align-items:center;justify-content:space-between;gap:12px}.panel-head>div{position:relative}.room-list{display:grid;gap:7px;max-height:150px;margin-top:18px;overflow:auto}.room-row{display:grid;grid-template-columns:1fr auto auto;gap:10px;align-items:center;padding:7px 9px;color:#384064;background:#e9e7de;border-radius:8px;font-size:12px}.room-row strong{color:var(--ink);letter-spacing:.12em}.room-row button{min-height:30px;padding:3px 9px;border-width:2px;font-size:11px}.lab-card{display:flex;flex-direction:column;background:var(--cyan)}.lab-card button{margin-top:auto}.menu-tools{position:fixed;right:30px;bottom:25px;display:flex;gap:10px}.menu-tools button{color:#fff;background:#151c3d;border-color:#7983b1}[data-screen=lobby]{flex-direction:column}.lobby-top{display:flex;align-items:end;justify-content:space-between;margin-bottom:25px}.lobby-top h1{font-size:64px;letter-spacing:.12em}.lobby-tools{display:flex;gap:10px;align-items:center}.lobby-tools button{color:#fff;border-color:#7983b1}.pill{padding:8px 14px;color:#8bf3b0;border:1px solid #8bf3b0;border-radius:999px;font-size:12px;text-transform:uppercase}.lobby-layout{display:grid;grid-template-columns:1fr 330px;gap:22px;min-height:0}.roster-panel,.setup-panel{padding:25px}.player-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-top:18px}.player-card{display:flex;gap:10px;align-items:center;min-height:58px;padding:9px;background:#ece9e0;border:2px solid transparent;border-radius:10px}.player-card.me{border-color:var(--pink)}.player-swatch{width:34px;height:34px;background:var(--primary);border:3px solid var(--ink);border-radius:50%;box-shadow:inset 0 -8px #0002}.player-swatch[data-pattern=stripe]{background:repeating-linear-gradient(135deg,var(--primary) 0 8px,var(--secondary) 8px 14px)}.player-swatch[data-pattern=spots]{background-color:var(--primary);background-image:radial-gradient(circle,var(--secondary) 0 3px,transparent 4px);background-size:12px 12px}.player-swatch[data-pattern=chevron]{background:linear-gradient(135deg,transparent 37%,var(--secondary) 38% 52%,transparent 53%) 0 0 / 16px 16px,var(--primary)}.player-card small{display:block;color:#626a82;margin-top:3px}.player-card .player-team{color:var(--ink);font-weight:700}.team-picker{display:flex;gap:4px;margin-top:5px}.team-pick{width:26px;height:26px;padding:0;border:2px solid var(--ink);border-radius:7px;background:#fff;font-weight:700;cursor:pointer}.team-pick.active{background:var(--pink);color:#fff}.result-row.winner{border-color:var(--pink);background:#fff4f8}.setup-panel label{margin:15px 0}.setup-panel button{width:100%;margin-top:9px}.loader{display:grid;grid-template-columns:35px 35px;gap:8px;margin-bottom:25px;animation:spin 3s linear infinite}.loader i{width:35px;height:35px;border:3px solid var(--ink);border-radius:8px}.loader i:nth-child(1){background:var(--yellow)}.loader i:nth-child(2){background:var(--pink)}.loader i:nth-child(3){background:var(--cyan)}.loader i:nth-child(4){background:var(--violet)}@keyframes spin{to{transform:rotate(360deg)}}[data-screen=loading]{flex-direction:column}[data-screen=loading] h1{font-size:50px}.game-screen{padding:0;background:#7dcad5}.game-screen.active{display:block}#game-canvas{display:block;width:100%;height:100%;outline:0}.game-hud{position:absolute;z-index:5;inset:0;pointer-events:none}.round-chip,.timer-chip,.prompt-card{position:absolute;padding:10px 14px;color:var(--ink);background:#fffaf0ee;border:3px solid var(--ink);border-radius:12px;box-shadow:4px 4px #15203b99}.round-chip span,.timer-chip span,.prompt-card>span{display:block;color:#5a627c;font-size:9px;font-weight:800;letter-spacing:.13em}.round-chip strong{display:block;margin-top:3px;font:800 21px "Baloo 2"}.round-chip{top:18px;left:18px}.timer-chip{top:50%;left:24px;text-align:left;background:none;border:0;box-shadow:none;transform:translateY(-50%)}.timer-chip span{color:#fffaf0;text-shadow:2px 2px 0 var(--ink);font-size:13px}.timer-chip strong{display:block;color:#fffaf0;font:800 clamp(64px,9vw,132px)/.95 "Baloo 2";text-shadow:5px 5px 0 var(--ink)}.timer-chip.urgent strong{color:var(--pink)}.timer-chip.hidden{display:none}.prompt-card{top:18px;right:18px;width:min(480px,38vw);text-align:right}.prompt-card strong{display:block;font:800 clamp(26px,2.7vw,42px) "Baloo 2";line-height:1.05}.prompt-card small{color:#5a627c}.hud-answers{position:absolute;z-index:5;right:18px;bottom:60px;display:grid;gap:8px;width:min(420px,34vw)}.hud-answer{display:grid;grid-template-columns:34px 1fr auto;gap:10px;align-items:center;padding:7px 10px;color:var(--ink);background:#fffaf0ee;border:3px solid var(--ink);border-radius:10px;box-shadow:3px 3px #15203b99}.hud-answer .tally{display:grid;place-items:center;min-width:26px;height:26px;padding:0 5px;background:#15203b;border-radius:999px;color:#fffaf0;font:800 14px "Baloo 2";font-style:normal}.hud-answer.standing{background:var(--pad);border-color:#fffaf0;box-shadow:3px 3px #15203b99,0 0 0 3px var(--ink);transform:translate(-8px)}.hud-answer .pad{display:grid;place-items:center;width:30px;height:30px;color:var(--ink);background:var(--pad, var(--ink));border:2px solid var(--ink);border-radius:8px;font:800 18px "Baloo 2";text-shadow:0 1px 0 #fffaf0}.hud-answer .opt{font:700 18px/1.15 "Baloo 2";overflow-wrap:anywhere}.hud-answer.correct{background:var(--yellow);animation:answer-pop .45s both}@keyframes answer-pop{0%{transform:scale(1)}40%{transform:scale(1.06)}to{transform:scale(1)}}.countdown{position:absolute;z-index:9;top:50%;left:50%;color:#fffaf0;font:800 clamp(120px,22vh,220px) "Baloo 2";text-shadow:8px 8px 0 var(--ink);transform:translate(-50%,-50%);pointer-events:none}.countdown.tick{animation:countdown-pop .95s both}.countdown.urgent{color:var(--pink)}@keyframes countdown-pop{0%{opacity:0;transform:translate(-50%,-50%) scale(1.45)}20%,70%{opacity:.92;transform:translate(-50%,-50%) scale(1)}to{opacity:0;transform:translate(-50%,-50%) scale(.9)}}.reduced-flash .countdown{color:var(--paper)}.score-strip{position:absolute;z-index:5;top:105px;left:16px;display:grid;gap:5px;max-height:50vh;overflow:hidden}.score-item{display:flex;gap:5px;width:145px;justify-content:space-between;padding:5px 8px;color:var(--ink);background:#fffaf0dd;border-left:6px solid var(--colour);border-radius:5px;font-size:11px}.score-item span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.score-item strong{margin-left:auto}.score-item .delta{color:var(--cyan);font:800 11px "Baloo 2";font-style:normal}.score-item.scored{background:#fffaf0;animation:score-pop .5s both}@keyframes score-pop{0%{transform:scale(1)}35%{transform:scale(1.09)}to{transform:scale(1)}}.local-status{position:absolute;z-index:5;bottom:18px;left:50%;padding:8px 15px;color:#fff;background:#111832d9;border-radius:999px;font-size:11px;transform:translate(-50%)}.announcer{position:absolute;z-index:8;top:50%;left:50%;width:92vw;color:#fff;font:800 clamp(60px,10vw,148px)/.95 "Baloo 2";text-align:center;text-shadow:6px 6px 0 var(--ink);white-space:pre-line;transform:translate(-50%,-50%);pointer-events:none}.announcer.show{animation:announce 1.3s both}.announcer.good{color:var(--cyan)}.announcer.bad{color:var(--pink)}.announcer.stage{color:var(--yellow);font-size:clamp(48px,7.5vw,108px)}@keyframes announce{0%{opacity:0;transform:translate(-50%,-40%) scale(.5) rotate(-4deg)}18%,75%{opacity:1;transform:translate(-50%,-50%) scale(1) rotate(0)}to{opacity:0}}.game-exit{position:absolute;z-index:6;right:16px;bottom:16px;min-height:34px;padding:5px 10px;opacity:.75}body.in-game:not(.lab-mode) .local-status,body.in-game:not(.lab-mode) .prompt-card>span,body.in-game:not(.lab-mode) .prompt-card small{display:none}.quiz-panel{width:min(680px,92vw);padding:30px;text-align:left}.quiz-head{display:flex;align-items:baseline;justify-content:space-between}.quiz-head strong{font:800 34px "Baloo 2"}.quiz-panel h1{font-size:40px}.quiz-hint{margin:6px 0 14px;color:#5a627c;font-size:13px}.quiz-status{min-height:18px;margin:8px 0 0;color:var(--pink);font-size:13px;font-weight:700}.quiz-status.ok{color:#1d7d4f}.quiz-actions{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:14px}.quiz-subject-rows{display:flex;flex-direction:column;gap:14px;margin-top:14px}.quiz-subject-row{display:flex;flex-direction:column}.quiz-subject-controls{display:flex;align-items:center;gap:10px}.quiz-subject-controls input{flex:1 1 auto;min-width:0}.quiz-subject-controls .quiet,.quiz-subject-controls .primary{flex:0 0 auto}.quiz-subject-row .quiz-status{margin:6px 0 0}.subject-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:10px;max-height:46vh;margin-top:14px;overflow:auto}.subject-box{padding:10px 12px;color:var(--ink);background:#fffaf0;border:3px solid var(--ink);border-radius:10px;box-shadow:3px 3px #15203b55;font:700 14px/1.2 "Baloo 2";text-align:left;cursor:pointer}.subject-box.selected{background:var(--yellow);box-shadow:3px 3px 0 var(--ink)}.quiz-progress{display:flex;gap:6px;margin-top:18px}.quiz-progress i{width:14px;height:14px;background:#d9d4c7;border:2px solid var(--ink);border-radius:50%}.quiz-progress i.done{background:var(--cyan)}.results-panel{min-width:570px;padding:35px}.results-panel h1,.settings-panel h1{font-size:48px}.results-list{margin:22px 0;text-align:left}.result-row{display:grid;grid-template-columns:55px 1fr auto;gap:12px;padding:10px;border-bottom:1px solid #ccc8bb}.result-row strong:first-child{font:800 22px "Baloo 2"}.results-cost{margin:0 0 10px;color:#5a627c;font-size:13px}.settings-panel{width:min(760px,88vw);padding:30px;text-align:left}.settings-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:13px;margin:22px 0}.settings-grid input[readonly]{cursor:pointer;background:#ece9e0;text-align:center}.settings-grid input.listening{color:var(--pink);border-color:var(--pink)}.answer-palette-field{grid-column:span 2}.answer-palette-preview{display:grid;grid-template-columns:repeat(4,1fr);height:10px;overflow:hidden;border:2px solid var(--ink);border-radius:999px}.answer-palette-preview i{background:var(--swatch)}.gamepad-controls{display:flex;flex-wrap:wrap;gap:8px 18px;align-items:center;margin:-7px 0 18px;padding:10px 12px;background:#ece9e0;border-radius:9px;font-size:11px}.gamepad-controls strong{color:var(--ink)}.checks{display:flex;gap:25px;margin-bottom:20px}.checks label{display:flex;align-items:center;gap:8px;text-transform:none}.checks input{width:18px;min-height:18px}.toast{position:fixed;z-index:50;left:50%;bottom:35px;padding:11px 18px;color:var(--ink);background:var(--yellow);border:3px solid var(--ink);border-radius:10px;box-shadow:4px 4px 0 var(--ink);opacity:0;transform:translate(-50%,15px);pointer-events:none;transition:.2s}.toast.show{opacity:1;transform:translate(-50%)}.reduced-motion *,.reduced-motion *:before,.reduced-motion *:after{scroll-behavior:auto!important;animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}.reduced-flash .announcer{color:var(--paper)}@media(max-width:1100px){.screen{padding-inline:45px}.identity-stage{grid-template-columns:1fr}.player-preview canvas{width:min(320px,28vw)}.menu-grid{grid-template-columns:1fr 1.3fr}.lab-card{display:none}.player-grid{grid-template-columns:repeat(3,1fr)}}