:root{--c-ink: #111111;--c-ink-soft: #2b2b30;--c-paper: #fffdf3;--c-white: #ffffff;--c-yellow: #ffe500;--c-yellow-deep: #ffd400;--c-cyan: #00e0d5;--c-pink: #ff4d8d;--c-violet: #6b4dff;--c-violet-deep: #5b3df0;--c-green: #1a9e5c;--c-red: #e5484d;--bg: var(--c-paper);--surface: var(--c-white);--text: var(--c-ink);--text-muted: #6a6a72;--line: var(--c-ink);--primary: var(--c-violet);--on-primary: var(--c-white);--accent: var(--c-cyan);--hot: var(--c-pink);--success: var(--c-green);--danger: var(--c-red);--focus: var(--c-violet);--bw: 3px;--bw-sm: 2.5px;--shadow-sm: 3px 3px 0 var(--c-ink);--shadow: 6px 6px 0 var(--c-ink);--shadow-lg: 7px 7px 0 var(--c-ink);--press-sm: 3px;--press: 5px;--press-lg: 7px;--radius: 10px;--radius-lg: 14px;--radius-pill: 999px;--font-display: "Archivo Black", "Arial Black", system-ui, sans-serif;--font-body: "Space Grotesk", ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;--fs-xs: .72rem;--fs-sm: .85rem;--fs-md: 1rem;--fs-lg: 1.2rem;--fs-xl: 1.5rem;--fs-2xl: 2rem;--space-1: 4px;--space-2: 8px;--space-3: 12px;--space-4: 16px;--space-6: 24px;--page-max: 480px;--dur: .07s;--ease: cubic-bezier(.2, .8, .3, 1)}*{box-sizing:border-box}html{color-scheme:light}body{margin:0;background:var(--bg);color:var(--text);font-family:var(--font-body);font-size:var(--fs-md);line-height:1.5;-webkit-font-smoothing:antialiased}::selection{background:var(--c-yellow);color:var(--c-ink)}h1,h2,h3{font-family:var(--font-display);font-weight:400;line-height:1.05;margin:0}h1{font-size:var(--fs-2xl);text-transform:uppercase;letter-spacing:-.01em}h2{font-size:var(--fs-lg)}a{color:var(--primary);font-weight:700}:focus-visible{outline:var(--bw) solid var(--focus);outline-offset:2px}@media (prefers-reduced-motion: reduce){*{transition-duration:.001ms!important;animation-duration:.001ms!important;animation-iteration-count:1!important}}.page{max-width:var(--page-max);margin:0 auto;padding:var(--space-6) var(--space-4) 64px;display:flex;flex-direction:column;gap:var(--space-4);position:relative;z-index:1;animation:page-in .22s var(--ease) both}@keyframes page-in{0%{opacity:0;transform:translateY(8px) scale(.99)}to{opacity:1;transform:none}}.page-game.is-shaking{animation:page-in .22s var(--ease) both,screen-shake .45s var(--ease)}@keyframes screen-shake{10%{transform:translate(-4px,2px)}25%{transform:translate(5px,-2px)}40%{transform:translate(-5px,1px)}55%{transform:translate(4px,2px)}70%{transform:translate(-3px,-1px)}85%{transform:translate(2px,1px)}to{transform:translate(0)}}.subtitle{margin:calc(-1 * var(--space-2)) 0 var(--space-2);color:var(--text-muted);font-weight:500}.page-topbar{display:flex;justify-content:flex-end;margin-bottom:calc(-1 * var(--space-2))}.page-topbar--split{justify-content:space-between;margin-bottom:var(--space-4)}.game-code strong,.answer-reveal strong{font-family:var(--font-display);letter-spacing:.04em}.field{display:flex;flex-direction:column;gap:var(--space-1);font-size:var(--fs-sm);font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:var(--text)}input,select,textarea{font-family:var(--font-body);font-size:var(--fs-md);font-weight:500;padding:10px 12px;color:var(--text);background:var(--surface);border:var(--bw) solid var(--line);border-radius:var(--radius)}input::placeholder{color:var(--text-muted)}.theme-picker{display:flex;flex-direction:column;gap:var(--space-2);padding-bottom:var(--space-4)}.settings .field{padding-top:var(--space-3)}.players-section .player-list{margin-top:var(--space-3)}.theme-picker .btn{align-self:flex-start}.btn,button{--_press: var(--press-sm);font-family:var(--font-display);font-size:var(--fs-md);text-transform:uppercase;letter-spacing:.03em;padding:12px 18px;color:var(--text);background:var(--surface);border:var(--bw) solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow-sm);cursor:pointer;transition:transform var(--dur) var(--ease),box-shadow var(--dur) var(--ease)}.btn:hover,button:hover:not(:disabled){transform:translate(-1px,-1px)}.btn:active,button:active:not(:disabled){transform:translate(var(--_press),var(--_press));box-shadow:0 0 0 var(--line)}.btn:disabled,button:disabled{opacity:.45;cursor:not-allowed;transform:none}.btn--block{width:100%}.btn--sm{padding:6px 12px;font-size:var(--fs-xs);box-shadow:var(--shadow-sm)}.btn--primary,button.primary{--_press: var(--press);background:var(--primary);color:var(--on-primary);box-shadow:var(--shadow)}.btn--buzzer,.buzzer{--_press: var(--press-lg);width:100%;padding:32px;font-size:var(--fs-2xl);letter-spacing:.06em;background:var(--hot);color:var(--c-white);border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);-webkit-text-stroke:1px var(--c-ink)}.buzzer-wrap{position:relative;animation:buzzer-breathe 2.4s ease-in-out infinite}.buzzer-wrap:has(button:disabled){animation:none}@keyframes buzzer-breathe{50%{transform:scale(1.02)}}.impact-ring{position:absolute;top:-4px;right:-4px;bottom:-4px;left:-4px;border-radius:var(--radius-lg);border:var(--bw) solid var(--c-yellow);opacity:0;pointer-events:none}.impact-ring.is-hit{animation:impact-pop .4s var(--ease)}@keyframes impact-pop{0%{transform:scale(1);opacity:1}to{transform:scale(1.18);opacity:0}}.card{background:var(--surface);border:var(--bw) solid var(--line);border-radius:var(--radius-lg);box-shadow:var(--shadow);padding:var(--space-4);display:flex;flex-direction:column;gap:var(--space-3)}.card--flat{box-shadow:none}.badge{font-family:var(--font-display);font-size:var(--fs-xs);text-transform:uppercase;letter-spacing:.04em;background:var(--c-yellow);color:var(--c-ink);border:var(--bw-sm) solid var(--line);border-radius:var(--radius-pill);padding:2px 9px;line-height:1.4}.badge--accent,.badge.active{background:var(--accent)}.badge--danger,.badge.locked{background:var(--danger);color:var(--c-white)}.badge--success{background:var(--success);color:var(--c-white)}.badge-row{display:flex;flex-wrap:wrap;gap:var(--space-2)}.player-list,.leaderboard{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:var(--space-2)}.player-list li,.leaderboard li{display:flex;align-items:center;gap:var(--space-2);background:var(--surface);border:var(--bw-sm) solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow-sm);padding:10px 12px;font-weight:700}.player-list li.disconnected{opacity:.5;box-shadow:none}.dot{width:12px;height:12px;border-radius:50%;border:var(--bw-sm) solid var(--line);flex:none}.dot.online{background:var(--success)}.dot.offline{background:#cfcfcf}.pseudo{font-weight:700}.theme{color:var(--text-muted);font-size:var(--fs-sm);font-weight:500}.score{margin-left:auto;font-family:var(--font-display);font-variant-numeric:tabular-nums;background:var(--c-yellow);border:var(--bw-sm) solid var(--line);border-radius:var(--radius-pill);padding:1px 10px}.score.is-pop{animation:score-pop .45s var(--ease)}@keyframes score-pop{0%{transform:scale(1)}40%{transform:scale(1.35)}to{transform:scale(1)}}.question-card{background:var(--surface);border:var(--bw) solid var(--line);border-radius:var(--radius-lg);box-shadow:var(--shadow);padding:var(--space-6) var(--space-4);text-align:center}.question-meta{color:var(--primary);font-size:var(--fs-xs);font-weight:700;text-transform:uppercase;letter-spacing:.06em;margin:0 0 var(--space-2)}.question-card h2{font-size:var(--fs-xl);line-height:1.15}.question-cursor{display:inline-block;width:4px;height:1.1em;margin-left:2px;background:var(--primary);vertical-align:text-bottom;animation:cursor-blink .8s step-end infinite}@keyframes cursor-blink{0%,50%{opacity:1}50.01%,to{opacity:0}}.timer-bar{position:relative;height:30px;background:var(--surface);border:var(--bw) solid var(--line);border-radius:var(--radius-pill);box-shadow:var(--shadow-sm);overflow:hidden}.timer-fill{position:absolute;top:0;bottom:0;left:0;right:auto;height:100%;background:repeating-linear-gradient(45deg,var(--c-yellow) 0 10px,var(--c-yellow-deep) 10px 20px);transition:width .1s linear}.timer-seconds{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;font-family:var(--font-display);font-variant-numeric:tabular-nums;color:var(--c-ink)}.timer-bar.is-urgent{animation:timer-pulse .55s ease-in-out infinite}.timer-bar.is-urgent .timer-fill{background:repeating-linear-gradient(45deg,var(--hot) 0 10px,#e0326f 10px 20px)}.timer-bar.is-urgent .timer-seconds{color:var(--c-white)}@keyframes timer-pulse{50%{transform:scale(1.035)}}.banner{background:var(--c-yellow);border-bottom:var(--bw) solid var(--line);padding:10px 16px;text-align:center;font-weight:700}.banner.error{background:var(--danger);color:var(--c-white)}.hint{font-size:var(--fs-sm);color:var(--text-muted);font-weight:500;margin:0}.hint.success{color:var(--success);font-weight:700}.hint.error,.error{color:var(--danger);font-weight:700}.announcement{text-align:center;font-family:var(--font-display);background:var(--accent);border:var(--bw) solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow-sm);padding:12px}.skip-vote{display:flex;align-items:center;justify-content:center;gap:var(--space-2)}.guess-panel{display:flex;flex-direction:column;align-items:center;gap:var(--space-2)}.guess-input-row{display:flex;gap:var(--space-2);width:100%;max-width:360px}.guess-input{flex:1;font-size:var(--fs-lg);text-align:center}.guess-results{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:var(--space-1);width:100%}.guess-results li{display:flex;justify-content:space-between;gap:var(--space-2);padding:8px 12px;border:var(--bw) solid var(--line);border-radius:var(--radius);background:var(--surface)}.guess-results li.is-winner{background:var(--c-yellow);box-shadow:var(--shadow-sm);font-weight:700}.guess-results .pseudo{font-weight:700}.answer-panel{display:flex;flex-direction:column;gap:var(--space-2);align-items:stretch}.transcript{min-height:2.6em;font-size:var(--fs-lg)}.reveal{text-align:center;display:flex;flex-direction:column;gap:var(--space-2)}.result{font-family:var(--font-display);font-size:var(--fs-lg)}.result.success{color:var(--success)}.result.error{color:var(--danger)}.generating-card{align-items:center;text-align:center}.spinner{margin:var(--space-2) auto;width:40px;height:40px;background:var(--c-yellow);border:var(--bw) solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow-sm);animation:spin-square 1.1s linear infinite}@keyframes spin-square{to{transform:rotate(360deg)}}.generation-log{list-style:none;padding:0;margin:0;color:var(--text-muted);font-size:var(--fs-sm);font-weight:700;text-align:center;display:flex;flex-direction:column;gap:var(--space-1)}.generation-log li{opacity:0;animation:log-in .3s var(--ease) forwards}@keyframes log-in{0%{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}.rank-badge{font-family:var(--font-display);font-size:var(--fs-sm);width:30px;height:30px;flex:none;display:flex;align-items:center;justify-content:center;background:var(--surface);border:var(--bw-sm) solid var(--line);border-radius:50%}.rank-badge.rank-1{background:var(--c-yellow)}.rank-badge.rank-2{background:var(--c-cyan)}.rank-badge.rank-3{background:var(--hot);color:var(--c-white)}.winner-card{text-align:center;background:var(--c-yellow);align-items:center}.winner-card .trophy{font-size:var(--fs-2xl);line-height:1;animation:trophy-bounce .6s var(--ease) both}@keyframes trophy-bounce{0%{transform:scale(0) rotate(-30deg)}60%{transform:scale(1.25) rotate(8deg)}to{transform:scale(1) rotate(0)}}.winner-card .winner-pseudo{font-family:var(--font-display);font-size:var(--fs-xl);text-transform:uppercase}.leaderboard li{animation:row-in .35s var(--ease) both}@keyframes row-in{0%{opacity:0;transform:translate(-14px)}to{opacity:1;transform:none}}.podium{display:flex;align-items:flex-end;justify-content:center;gap:var(--space-2)}.podium-col{flex:1;max-width:130px;display:flex;flex-direction:column;align-items:center;gap:var(--space-1);animation:podium-rise .5s var(--ease) both}.podium-col.rank-1{animation-delay:.14s}.podium-pseudo{font-weight:700;font-size:var(--fs-sm);text-align:center;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.podium-block{width:100%;border:var(--bw) solid var(--line);border-radius:var(--radius) var(--radius) 0 0;box-shadow:var(--shadow);display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:2px;padding:var(--space-2)}.podium-rank{font-family:var(--font-display);font-size:var(--fs-xl)}.podium-score{font-family:var(--font-display);font-variant-numeric:tabular-nums}.podium-col.rank-1 .podium-block{background:var(--c-yellow);height:120px}.podium-col.rank-2 .podium-block{background:var(--accent);height:92px}.podium-col.rank-3 .podium-block{background:var(--hot);color:var(--c-white);height:74px}@keyframes podium-rise{0%{opacity:0;transform:translateY(24px)}to{opacity:1;transform:none}}.bg-canvas{position:fixed;top:0;right:0;bottom:0;left:0;width:100%;height:100%;z-index:-1;pointer-events:none}.flash{position:fixed;top:0;right:0;bottom:0;left:0;z-index:50;pointer-events:none;opacity:0}.flash--correct{background:var(--success);animation:flash-fade .6s ease-out}.flash--wrong{background:var(--danger);animation:flash-fade .5s ease-out}@keyframes flash-fade{0%{opacity:.32}to{opacity:0}}.steal-announcement{font-weight:700;color:var(--hot);background:var(--surface);border:var(--bw-sm) solid var(--line);border-radius:var(--radius);padding:var(--space-2) var(--space-3);animation:row-in .35s var(--ease) both}.toast-stack{position:fixed;top:var(--space-4);left:50%;transform:translate(-50%);z-index:60;display:flex;flex-direction:column;gap:var(--space-2);width:min(90vw,var(--page-max));pointer-events:none}.toast{background:var(--c-yellow);border:var(--bw) solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);padding:var(--space-2) var(--space-4);font-family:var(--font-display);font-size:var(--fs-sm);text-align:center;animation:toast-in .4s var(--ease) both,toast-out .4s var(--ease) 3.6s both}@keyframes toast-in{0%{opacity:0;transform:translateY(-16px)}to{opacity:1;transform:none}}@keyframes toast-out{0%{opacity:1}to{opacity:0}}