:root{--ground: #f7f4ee;--ground-deep: #efeae0;--card: #ffffff;--ink: #21243b;--text: #21243b;--text-dim: #6b6f8a;--text-faint: #9a9eb8;--pop-raspberry: #ef476f;--pop-cobalt: #118ab2;--pop-sunshine: #ffd166;--pop-mint: #06d6a0;--danger: #d64550;--line: 3px solid var(--ink);--shadow-offset: 6px 6px 0;--font-display: "Arial Black", "Avenir Next Heavy", "Segoe UI Black", system-ui, sans-serif;--font-body: "Avenir Next", "Segoe UI", system-ui, -apple-system, sans-serif;--radius: 14px;--radius-lg: 20px}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body,#root{height:100%}body{margin:0;font-family:var(--font-body);color:var(--text);background:radial-gradient(circle at 90% 6%,var(--pop-sunshine) 0 70px,transparent 71px),radial-gradient(circle at 4% 94%,var(--pop-raspberry) 0 54px,transparent 55px),radial-gradient(circle at 96% 78%,var(--pop-cobalt) 0 30px,transparent 31px),radial-gradient(circle at 8% 14%,var(--pop-mint) 0 22px,transparent 23px),linear-gradient(180deg,var(--ground),var(--ground-deep));background-attachment:fixed;overflow-x:hidden}button{font:inherit;color:inherit;border:none;background:none;cursor:pointer}button:focus-visible,input:focus-visible,[tabindex]:focus-visible{outline:3px solid var(--pop-cobalt);outline-offset:3px;border-radius:6px}input{font:inherit}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;transition-duration:.01ms!important}}.pop-card{background:var(--card);border:var(--line);border-radius:var(--radius-lg);box-shadow:var(--shadow-offset) var(--pop-cobalt)}.eyebrow{font-size:.72rem;letter-spacing:.26em;text-transform:uppercase;font-weight:700;color:var(--text-dim)}.btn-primary{display:block;width:100%;text-align:center;border-radius:var(--radius);padding:15px 22px;font-weight:800;font-size:1.05rem;letter-spacing:.06em;color:#fff;background:var(--pop-raspberry);border:var(--line);box-shadow:5px 5px 0 var(--ink);transition:transform .12s ease,box-shadow .12s ease,opacity .12s ease}.btn-primary:active{transform:translate(4px,4px);box-shadow:1px 1px 0 var(--ink)}.btn-primary:disabled{opacity:.4;cursor:default}.btn-ghost{display:block;width:100%;text-align:center;border-radius:var(--radius);padding:13px 22px;font-weight:700;color:var(--ink);border:var(--line);background:var(--card);box-shadow:4px 4px #21243b2e;transition:transform .12s ease,box-shadow .12s ease}.btn-ghost:active{transform:translate(3px,3px);box-shadow:1px 1px #21243b2e}.field{width:100%;background:var(--card);border:var(--line);border-radius:var(--radius);padding:13px 16px;font-size:1.05rem;color:var(--ink)}.field::placeholder{color:var(--text-faint)}.tv-intro{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:18px;text-align:center}.tv-intro h1{margin:0;font-family:var(--font-display);font-size:clamp(4rem,10vw,8rem);color:var(--ink);text-shadow:8px 8px 0 var(--pop-raspberry)}.tv-intro p{margin:0;font-size:1.5rem;font-weight:700;color:var(--text-dim)}.tv-question{flex:1;display:flex;flex-direction:column;padding:3vh 5vw;gap:3vh;position:relative}.q-head{display:flex;align-items:center;gap:22px}.q-count{font-family:var(--font-display);font-size:1.6rem;color:var(--ink)}.q-total{color:var(--text-faint);font-size:1.1rem}.q-category{font-size:.85rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--ink);background:var(--pop-sunshine);border:2px solid var(--ink);border-radius:999px;padding:6px 16px;box-shadow:3px 3px #21243b29;max-width:40vw;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.timer-track{flex:1;height:16px;border:2px solid var(--ink);border-radius:999px;background:var(--card);overflow:hidden}.timer-fill{height:100%;background:var(--pop-mint);transition:background .3s ease}.timer-fill.is-low{background:var(--pop-raspberry)}.q-text{margin:0;font-family:var(--font-display);font-size:clamp(1.8rem,4.2vw,3.4rem);line-height:1.2;color:var(--ink);text-wrap:balance;max-width:26ch}.q-answers{display:grid;grid-template-columns:1fr 1fr;gap:18px;max-width:1100px}.q-answer{display:flex;align-items:center;gap:16px;background:var(--card);border:var(--line);border-radius:var(--radius-lg);padding:18px 22px;font-size:clamp(1.1rem,2.2vw,1.6rem);font-weight:700;color:var(--ink);box-shadow:5px 5px #21243b24;transition:background .3s ease,opacity .3s ease}.q-answer.is-correct{background:var(--pop-mint);box-shadow:5px 5px 0 var(--ink)}.q-answer.is-dim{opacity:.4}.q-letter{flex-shrink:0;width:44px;height:44px;display:flex;align-items:center;justify-content:center;font-family:var(--font-display);border:2px solid var(--ink);border-radius:12px;background:var(--pop-sunshine)}.q-strip{margin-top:auto;display:flex;gap:26px;justify-content:center;flex-wrap:wrap}.strip-player{display:flex;flex-direction:column;align-items:center;gap:4px;transition:opacity .3s ease,filter .3s ease}.strip-player.is-locked{opacity:.35}.strip-player.is-off{filter:grayscale(1);opacity:.4}.strip-name{font-size:.85rem;font-weight:700;color:var(--ink);max-width:90px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.strip-score{font-family:var(--font-display);font-size:.95rem;color:var(--text-dim);font-variant-numeric:tabular-nums}.tv-avatar{border-radius:50%;border:3px solid var(--ink);background:linear-gradient(135deg,hsl(var(--hue),80%,62%),hsl(calc(var(--hue) + 40),80%,50%));overflow:hidden;display:flex;align-items:center;justify-content:center;font-family:var(--font-display);color:#fff;font-size:1.4rem}.tv-avatar img{width:100%;height:100%;object-fit:cover}.buzz-overlay{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;background:#21243b73;z-index:5}.buzz-card{display:flex;flex-direction:column;align-items:center;gap:16px;background:var(--card);border:var(--line);border-radius:var(--radius-lg);padding:36px 60px;box-shadow:10px 10px 0 var(--pop-raspberry)}.buzz-card .tv-avatar{font-size:3rem}.buzz-name{font-family:var(--font-display);font-size:2rem;color:var(--ink)}.outcome-flash{position:absolute;left:50%;bottom:16vh;transform:translate(-50%);font-family:var(--font-display);font-size:2rem;padding:16px 42px;border:var(--line);border-radius:999px;background:var(--card);color:var(--ink);z-index:6;white-space:nowrap}.outcome-correct{box-shadow:6px 6px 0 var(--pop-mint)}.outcome-wrong,.outcome-timeout{box-shadow:6px 6px 0 var(--pop-raspberry)}.tv-scoreboard{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4vh;padding:4vh 6vw}.tv-scoreboard h2{margin:0;font-family:var(--font-display);font-size:clamp(2.4rem,5vw,4rem);color:var(--ink);text-shadow:5px 5px 0 var(--pop-sunshine)}.board{width:min(900px,90vw);display:flex;flex-direction:column;gap:16px}.board-row{display:flex;align-items:center;gap:18px;background:var(--card);border:var(--line);border-radius:var(--radius-lg);padding:12px 22px;box-shadow:5px 5px #21243b24}.board-row.is-winner{box-shadow:7px 7px 0 var(--pop-sunshine)}.board-place{font-family:var(--font-display);font-size:1.5rem;width:36px;color:var(--text-dim)}.board-name{font-weight:800;font-size:1.3rem;color:var(--ink);width:180px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.board-bar-track{flex:1;height:20px;border:2px solid var(--ink);border-radius:999px;background:var(--ground);overflow:hidden}.board-bar{height:100%;background:var(--pop-cobalt)}.board-score{font-family:var(--font-display);font-size:1.4rem;color:var(--ink);width:80px;text-align:right;font-variant-numeric:tabular-nums}.board-hint{margin:0;color:var(--text-dim);font-weight:600}.screen-root{height:100%;display:flex;flex-direction:column;position:relative;isolation:isolate}.backdrop{position:fixed;top:0;right:0;bottom:0;left:0;overflow:hidden;z-index:-1;pointer-events:none}.confetti{position:absolute;background:var(--c);opacity:.35;animation:confetti-drift linear infinite;will-change:transform}.confetti-circle{border-radius:50%}.confetti-square{border-radius:4px}.confetti-triangle{background:transparent;border-left:.5em solid transparent;border-right:.5em solid transparent;border-bottom:1em solid var(--c);width:0!important;height:0!important;font-size:16px}@keyframes confetti-drift{0%{transform:translate(0) rotate(0)}25%{transform:translate(var(--drift),calc(var(--drift) * -.6)) rotate(calc(var(--spin) * .25))}50%{transform:translate(calc(var(--drift) * .4),var(--drift)) rotate(calc(var(--spin) * .5))}75%{transform:translate(calc(var(--drift) * -.7),calc(var(--drift) * .3)) rotate(calc(var(--spin) * .75))}to{transform:translate(0) rotate(var(--spin))}}.welcome{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:26px;text-align:center;padding:40px}.welcome h1{margin:0;font-family:var(--font-display);font-size:clamp(3rem,8vw,6.5rem);letter-spacing:.01em;color:var(--ink);text-shadow:6px 6px 0 var(--pop-sunshine);white-space:pre}.title-letter{display:inline-block;animation:letter-sway 3.4s ease-in-out infinite}.title-letter:nth-child(odd){animation-delay:-1.7s}.title-letter-inner{display:inline-block}@keyframes letter-sway{0%,to{transform:translateY(0)}50%{transform:translateY(-6px)}}.welcome-start{width:auto;padding:18px 56px;font-size:1.4rem}.lobby{flex:1;display:flex;flex-direction:column;padding:3vh 4vw;gap:3vh}.lobby-head{display:flex;flex-direction:column;align-items:center;gap:16px}.code-card{text-align:center;padding:18px 56px}.code-label{font-size:.85rem;letter-spacing:.24em;text-transform:uppercase;font-weight:700;color:var(--text-dim)}.code-value{font-family:var(--font-display);font-size:clamp(3.4rem,8vw,6rem);letter-spacing:.18em;margin-right:-.18em;color:var(--ink);line-height:1.05}.lobby-players{display:flex;flex-wrap:wrap;justify-content:center;align-content:flex-start;gap:34px;min-height:22vh}.lobby-hint{align-self:center;color:var(--text-dim);font-size:1.3rem;font-weight:600}.player-chip{display:flex;flex-direction:column;align-items:center;gap:10px;width:110px;transition:filter .3s ease,opacity .3s ease}.player-chip .player-avatar{animation:chip-bob 3s ease-in-out infinite}.player-chip:nth-child(2n) .player-avatar{animation-delay:-1s}.player-chip:nth-child(3n) .player-avatar{animation-delay:-2s}@keyframes chip-bob{0%,to{transform:translateY(0) rotate(0)}50%{transform:translateY(-5px) rotate(1.2deg)}}.player-chip.dropped{filter:grayscale(1);opacity:.45}.player-avatar{position:relative;width:92px;height:92px;border-radius:50%;border:var(--line);box-shadow:4px 4px hsl(var(--hue),75%,62%);background:linear-gradient(135deg,hsl(var(--hue),80%,62%),hsl(calc(var(--hue) + 40),80%,50%));overflow:visible}.player-avatar img{width:100%;height:100%;border-radius:50%;object-fit:cover}.player-initial{display:flex;width:100%;height:100%;align-items:center;justify-content:center;font-family:var(--font-display);font-size:2.3rem;color:#fff}.host-crown{position:absolute;top:-14px;right:-8px;font-size:1.4rem;color:var(--pop-sunshine);-webkit-text-stroke:1.5px var(--ink)}.player-name{font-size:1.05rem;font-weight:700;color:var(--ink);max-width:110px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.carousel{margin-top:auto}.carousel-track{display:flex;gap:28px;justify-content:center;padding:10px 0 12px}.game-card{width:min(300px,26vw);border-radius:var(--radius-lg);overflow:hidden;text-align:left;background:var(--card);border:var(--line);box-shadow:var(--shadow-offset) #21243b29;padding:0;color:var(--ink)}.game-card.selected{box-shadow:var(--shadow-offset) var(--pop-cobalt)}.game-art{height:110px;border-bottom:var(--line);background:radial-gradient(circle at 78% 26%,hsl(calc(var(--hue) + 50),85%,72%) 0 26px,transparent 27px),radial-gradient(circle at 14% 78%,rgba(255,255,255,.5) 0 16px,transparent 17px),linear-gradient(135deg,hsl(var(--hue),75%,60%),hsl(calc(var(--hue) + 35),75%,48%))}.game-meta{padding:14px 18px 18px}.game-meta h3{margin:0 0 4px;font-family:var(--font-display);font-size:1.2rem}.game-meta p{margin:0 0 10px;color:var(--text-dim);font-size:.92rem;line-height:1.4}.game-facts{font-size:.75rem;letter-spacing:.12em;text-transform:uppercase;font-weight:700;color:var(--text-faint)}.toast-corner{position:fixed;right:24px;bottom:24px;display:flex;flex-direction:column;gap:10px;align-items:flex-end;z-index:10}.toast{background:var(--card);border:var(--line);border-radius:12px;padding:10px 18px;font-size:.95rem;font-weight:600;color:var(--ink);box-shadow:4px 4px #21243b29}.toast-drop{box-shadow:4px 4px 0 var(--danger)}.toast-rejoin{box-shadow:4px 4px 0 var(--pop-mint)}.ctrl-root{height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:28px 22px}.ctrl-step{width:100%;max-width:380px;display:flex;flex-direction:column;gap:16px;text-align:center}.ctrl-title{margin:0;font-family:var(--font-display);font-size:1.6rem;color:var(--ink);text-wrap:balance}.ctrl-sub{margin:0;color:var(--text-dim);font-weight:600;line-height:1.5}.ctrl-error{margin:0;color:var(--danger);font-weight:700;font-size:.95rem}.code-input{text-align:center;font-family:var(--font-display);font-size:2.1rem;letter-spacing:.34em;text-transform:uppercase}.avatar-picker{display:flex;flex-direction:column;align-items:center;gap:12px}.avatar-preview{width:128px;height:128px;border-radius:50%;border:3px dashed var(--ink);background:var(--card);display:flex;align-items:center;justify-content:center;font-size:2.6rem;color:var(--text-dim);overflow:hidden;padding:0}.avatar-preview.has-photo{border-style:solid;box-shadow:5px 5px 0 var(--pop-sunshine)}.avatar-preview img{width:100%;height:100%;object-fit:cover}.avatar-preview.static{cursor:default;border-style:solid;box-shadow:5px 5px hsl(var(--hue, 340),75%,62%);background:linear-gradient(135deg,hsl(var(--hue, 340),80%,62%),hsl(calc(var(--hue, 340) + 40),80%,50%));color:#fff;font-family:var(--font-display)}.avatar-actions{display:flex;gap:8px;flex-wrap:wrap;justify-content:center}.avatar-action{font-size:.85rem;font-weight:700;color:var(--ink);border:2px solid var(--ink);border-radius:999px;padding:7px 14px;background:var(--card);box-shadow:3px 3px #21243b29}.avatar-action:active{transform:translate(2px,2px);box-shadow:1px 1px #21243b29}.ctrl-lobby{display:flex;flex-direction:column;align-items:center;gap:14px}.host-badge{font-size:.8rem;letter-spacing:.16em;text-transform:uppercase;font-weight:800;color:var(--ink);background:var(--pop-sunshine);border:2px solid var(--ink);border-radius:999px;padding:6px 14px;box-shadow:3px 3px #21243b29}.ctrl-choices{display:flex;flex-direction:column;gap:12px}.choice.is-picked{background:var(--pop-sunshine)}.host-lobby{display:flex;flex-direction:column;gap:14px;width:100%}.host-games{display:flex;flex-direction:column;gap:10px}.host-game{display:flex;flex-direction:column;gap:3px;text-align:left;background:var(--card);border:var(--line);border-radius:var(--radius);padding:12px 16px;box-shadow:4px 4px #21243b24}.host-game.is-selected{box-shadow:4px 4px 0 var(--pop-cobalt);background:#eaf6fb}.host-game:disabled{opacity:.45}.host-game-title{font-family:var(--font-display);font-size:1.05rem;color:var(--ink)}.host-game-tag{font-size:.82rem;color:var(--text-dim);font-weight:600}.host-bar{display:flex;gap:10px;margin-top:22px;width:100%}.host-bar-btn{flex:1;font-size:.82rem;font-weight:700;color:var(--text-dim);border:2px solid var(--text-faint);border-radius:999px;padding:9px 10px;background:var(--card)}.buzzer{width:min(72vw,300px);aspect-ratio:1;border-radius:50%;align-self:center;font-family:var(--font-display);font-size:2.2rem;letter-spacing:.08em;color:#fff;background:radial-gradient(circle at 35% 30%,#ff7096,var(--pop-raspberry) 65%);border:var(--line);box-shadow:8px 8px 0 var(--ink)}.buzzer:disabled{filter:grayscale(.8);opacity:.5}.buzzer:active:not(:disabled){transform:translate(6px,6px);box-shadow:2px 2px 0 var(--ink)}