:root{--bg: #0d0b14;--surface: #1a1726;--surface-2: #252136;--text: #f4f1fa;--muted: #a49cb8;--accent: #ff3d7f;--accent-2: #22d3c5;--good: #3ddc84;--bad: #ff5a5a;--gold: #ffc53d;--radius: 14px;color-scheme:dark}*{box-sizing:border-box}html,body{margin:0;background:var(--bg);color:var(--text);font-family:Space Grotesk,system-ui,sans-serif;-webkit-tap-highlight-color:transparent}button,input{font:inherit;color:inherit}.app{max-width:520px;margin:0 auto;padding:16px 16px calc(24px + env(safe-area-inset-bottom));min-height:100dvh}.banner{position:sticky;top:0;z-index:10;background:var(--accent);color:#fff;text-align:center;padding:6px;border-radius:8px;margin-bottom:12px;font-weight:500}h1,h2{margin:0}h2{font-size:1rem;margin-bottom:10px}.logo{font-size:2.6rem;line-height:1;letter-spacing:-.03em;margin-top:24px}.logo span{color:var(--accent)}.tagline,.hint,.muted{color:var(--muted)}.hint{font-size:.9rem;margin:0 0 12px}.center{text-align:center}.error{color:var(--bad);text-align:center}.field{display:grid;gap:6px;margin:24px 0 16px}.field span{color:var(--muted);font-size:.9rem}input[type=text],input:not([type]){width:100%;min-width:0;background:var(--surface-2);border:1px solid transparent;border-radius:10px;padding:12px 14px;font-size:1.05rem;outline:none}input:focus{border-color:var(--accent-2)}.code-input{text-transform:uppercase;letter-spacing:.3em;font-weight:700;text-align:center}.panel{background:var(--surface);border-radius:var(--radius);padding:16px;margin-bottom:14px}.row{display:flex;gap:10px}.btn{border:0;border-radius:10px;padding:12px 18px;font-weight:700;cursor:pointer;background:var(--surface-2);transition:transform .08s,opacity .2s}.btn:active:not(:disabled){transform:scale(.97)}.btn:disabled{opacity:.45;cursor:default}.btn.primary{background:var(--accent);color:#fff}.btn.ghost{background:transparent;border:1px solid var(--surface-2)}.btn.danger{background:var(--bad);color:#fff}.btn.small{padding:8px 12px;font-size:.85rem}.btn.wide{width:100%}.chips{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:14px}.chip{border:1px solid var(--surface-2);background:transparent;border-radius:999px;padding:8px 14px;cursor:pointer}.chip small{color:var(--muted);margin-left:4px}.chip.on{background:var(--accent-2);border-color:var(--accent-2);color:#062b28}.chip.on small{color:#0a4a44}.stepper{display:flex;align-items:center;gap:10px;margin-bottom:14px}.stepper span{flex:1}.stepper strong{min-width:2ch;text-align:center;font-size:1.2rem}.room-code{text-align:center;margin:0 0 12px}.room-code span{display:block;color:var(--muted);font-size:.85rem;text-transform:uppercase;letter-spacing:.12em}.room-code strong{font-size:2.6rem;letter-spacing:.15em;color:var(--accent-2)}.qr{display:block;width:180px;height:180px;margin:0 auto 8px;border-radius:12px}.player-list{list-style:none;padding:0;margin:0}.player-list li{display:flex;justify-content:space-between;align-items:center;padding:8px 0;border-bottom:1px solid var(--surface-2)}.player-list li:last-child{border-bottom:0}.away{opacity:.45}.topbar{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:12px;font-size:.9rem}.tag{font-weight:700;letter-spacing:.12em;color:var(--accent-2)}.scores{display:flex;gap:8px;overflow-x:auto;padding-bottom:4px;margin-bottom:8px;scrollbar-width:none}.score{flex:none;display:grid;gap:2px;min-width:72px;padding:8px 12px;border-radius:12px;background:var(--surface);border:2px solid transparent;cursor:pointer;text-align:left}.score .name{font-size:.85rem;max-width:10ch;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.score .count{font-weight:700;font-size:1.1rem}.score.shown{border-color:var(--surface-2)}.score.active{border-color:var(--accent)}.timeline{display:grid;gap:6px}.timeline>*{min-width:0}.nowrap{white-space:nowrap}.axis-label{color:var(--muted);font-size:.75rem;text-transform:uppercase;letter-spacing:.15em;text-align:center}.card{display:flex;align-items:center;gap:14px;padding:12px 14px;border-radius:var(--radius);background:linear-gradient(120deg,hsl(var(--hue) 70% 22%),hsl(var(--hue) 55% 14%));border-left:5px solid hsl(var(--hue) 85% 60%)}.card .year{font-size:1.6rem;font-weight:700;min-width:3.2ch;color:hsl(var(--hue) 90% 75%)}.card .meta{min-width:0}.card .title{font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.card .artist{color:var(--muted);font-size:.9rem}.card.mystery{background:var(--surface-2);border:2px dashed var(--accent);animation:pulse 1.6s ease-in-out infinite}.card.right{outline:3px solid var(--good)}.card.wrong{outline:3px solid var(--bad);opacity:.85}.flip{animation:flip .5s ease-out}.gap{height:30px;border:1px dashed var(--surface-2);border-radius:10px;background:transparent;color:var(--muted);cursor:pointer;display:grid;place-items:center}.gap:active,.gap:hover{border-color:var(--accent);color:var(--accent)}.eq{display:flex;align-items:flex-end;gap:3px;width:3.2ch;height:28px}.eq i{flex:1;background:var(--accent);border-radius:2px;animation:eq .9s ease-in-out infinite}.eq i:nth-child(2){animation-delay:-.3s}.eq i:nth-child(3){animation-delay:-.6s}.eq i:nth-child(4){animation-delay:-.15s}.actions{position:sticky;bottom:12px;margin-top:16px}.host-panel{margin-top:20px;padding:14px;border-radius:var(--radius);border:1px solid var(--surface-2)}.host-title{font-size:.75rem;text-transform:uppercase;letter-spacing:.15em;color:var(--muted);margin-bottom:10px}.host-row{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:8px}.host-row .btn:not(.small){flex:1}@keyframes pulse{50%{box-shadow:0 0 0 6px #ff3d7f26}}@keyframes eq{0%,to{height:20%}50%{height:100%}}@keyframes flip{0%{transform:rotateX(90deg)}to{transform:rotateX(0)}}@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}.score .tokens{font-size:.75rem;color:var(--muted)}.gap.challenge{height:38px;border:2px dashed #ffc53d;color:#ffc53d;font-weight:700;animation:pulse-gold 1.2s ease-in-out infinite}.bet{padding:8px 12px;border-radius:10px;background:#ffc53d1f;border:1px solid #ffc53d;color:#ffc53d;font-weight:700;font-size:.9rem}.bet.won{background:#3ddc8426;border-color:var(--good);color:var(--good)}.guess{background:var(--surface);border-radius:12px;padding:10px 12px;margin-bottom:10px}.guess summary{cursor:pointer;color:var(--muted);font-size:.9rem}.guess input{margin-top:8px}.guess-result{background:var(--surface);border-radius:12px;padding:10px 12px;margin-bottom:12px;display:grid;gap:8px;font-size:.95rem}.verdict.good{color:var(--good);font-weight:700}.verdict.bad{color:var(--bad);font-weight:700}.judge{display:flex;align-items:center;gap:8px}.judge .muted{flex:1;font-size:.85rem}.buy{margin-top:10px}@keyframes pulse-gold{50%{box-shadow:0 0 0 4px #ffc53d26}}.audio-panel{margin-top:16px}.audio-panel .btn.ghost:not(:first-child){flex:0 0 auto}.game{display:flex;flex-direction:column}.topbar{order:0}.side{display:contents}.side>*{order:4}.side>.scores{order:2}.board{order:3}.phase{order:1;margin:4px 0 14px}.phase-line{display:flex;align-items:baseline;gap:10px}.phase-text{flex:1;font-size:1.15rem;font-weight:700;line-height:1.3}.phase-secs{font-variant-numeric:tabular-nums;font-weight:700;color:var(--muted)}.phase-sub{color:var(--muted);font-size:.9rem;margin-top:4px}.phase.good .phase-text{color:var(--good)}.phase.bad .phase-text{color:var(--bad)}.phase.hot .phase-text,.phase.hot .phase-secs{color:var(--gold)}.phase.shout .phase-text{font-size:1.6rem;text-transform:uppercase;transform-origin:left center;animation:throb .9s ease-in-out infinite}.timer-bar{height:6px;margin-top:8px;border-radius:99px;background:var(--surface-2);overflow:hidden}.timer-bar i{display:block;height:100%;background:var(--accent-2);transform-origin:left;transition:transform .2s linear}.phase.hot .timer-bar i{background:var(--gold)}.chip-tag{font-size:.7rem;font-weight:700;color:var(--muted);white-space:nowrap}.chip-tag.good{color:var(--good)}.chip-tag.bad{color:var(--bad)}.chip-tag.hot,.chip-tag.bet-tag{color:var(--gold)}.chip-tag.thinking{font-weight:400;font-style:italic}.viewing{font-size:.9rem;color:var(--muted);margin:0 0 10px}.link{background:none;border:0;padding:0;color:var(--accent-2);text-decoration:underline;cursor:pointer}.board-title{margin:16px 0 10px;font-size:1rem}.btn.huge{padding:18px;font-size:1.15rem}.btn.yes{background:var(--good);color:#062b17}.btn.no{background:var(--bad);color:#fff}.btn.pass{border-width:2px}.row .grow{flex:1}.tap-to-play{position:fixed;left:16px;right:16px;bottom:calc(16px + env(safe-area-inset-bottom));z-index:20;max-width:480px;margin:0 auto;border:0;border-radius:16px;padding:20px;font-size:1.2rem;font-weight:700;background:var(--accent);color:#fff;box-shadow:0 10px 40px #00000080;cursor:pointer;animation:pulse 1.6s ease-in-out infinite}.sound-state{flex:1;align-self:center;color:var(--muted);font-size:.9rem}.sound-state.on{color:var(--accent-2)}.setting{margin-bottom:12px}.setting-label{font-size:.75rem;text-transform:uppercase;letter-spacing:.12em;color:var(--muted);margin-bottom:6px}.setting-group{border-top:1px solid var(--surface-2);padding-top:14px;margin-top:4px;margin-bottom:6px}.seg{display:flex;gap:4px;padding:4px;border-radius:12px;background:var(--bg)}.seg button{flex:1;border:0;border-radius:9px;padding:9px 8px;background:transparent;color:var(--muted);font-weight:700;cursor:pointer}.seg button small{display:block;font-weight:400;font-size:.72rem}.seg button.on{background:var(--surface-2);color:var(--text);box-shadow:inset 0 -2px 0 var(--accent-2)}.seg.big button{padding:12px 8px;font-size:1.05rem}.seg.big button.on{background:var(--accent);color:#fff;box-shadow:none}.variants{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:14px}.variant{display:grid;gap:2px;align-content:start;text-align:left;padding:10px 12px;border-radius:12px;border:2px solid var(--surface-2);background:transparent;cursor:pointer}.variant small{color:var(--muted);font-size:.78rem;line-height:1.3}.variant-icon{font-size:1.3rem}.variant.on{border-color:var(--accent-2);background:#22d3c514}.start{margin-top:6px;position:sticky;bottom:12px;z-index:2;box-shadow:0 8px 24px #00000073}.summary-line{font-weight:700;font-size:1.05rem;margin:0 0 8px}.picker{display:grid;gap:8px}.picker-field{position:relative}.picker-list{position:absolute;left:0;right:0;bottom:calc(100% + 4px);z-index:15;list-style:none;margin:0;padding:4px;display:flex;flex-direction:column-reverse;background:#342e4d;border-radius:12px;box-shadow:0 -8px 28px #0000008c}.picker-list button{display:flex;align-items:baseline;gap:8px;width:100%;text-align:left;border:0;border-radius:8px;padding:11px 10px;background:transparent;cursor:pointer}.picker-list button:before{content:"♪";color:var(--accent-2)}.picker-list button small{color:var(--muted)}.picker-list button:hover,.picker-list button.on{background:#22d3c526}.picker-actions{display:flex;gap:8px}.picker-actions .grow{flex:1}.picker-actions .btn.primary{display:inline-flex;align-items:center;justify-content:center;gap:8px}.guess .picker{margin-top:8px}.reveal-summary{background:var(--surface);border-radius:var(--radius);padding:12px 14px;margin-bottom:14px;display:grid;gap:10px}.effects{list-style:none;margin:0;padding:0;display:grid;gap:6px}.effect{display:flex;gap:8px;line-height:1.35}.effect em{font-style:normal;font-weight:700}.effect-icon{flex:none;width:1.4em;text-align:center}.naming{display:grid;gap:8px;border-top:1px solid var(--surface-2);padding-top:10px}.naming p{margin:0}.vote p{margin-bottom:8px}.tally{font-size:.9rem}.standings{width:100%;border-collapse:collapse;background:var(--surface);border-radius:var(--radius);overflow:hidden;margin-bottom:14px}.standings th,.standings td{padding:10px 14px;text-align:left;border-bottom:1px solid var(--surface-2)}.standings th{font-size:.75rem;text-transform:uppercase;letter-spacing:.12em;color:var(--muted);font-weight:500}.standings td:last-child,.standings th:last-child{text-align:right;font-weight:700}.standings tr.win td{color:var(--gold);font-weight:700}.standings tr.me td{background:#22d3c512}.blitz.p-ended .blitz-scores{display:none}.blitz-scores{list-style:none;margin:0 0 8px;padding:0 0 4px}.blitz-scores .score{cursor:default;grid-template-columns:auto 1fr auto;align-items:baseline;column-gap:6px}.blitz-scores .rank{color:var(--muted);font-size:.75rem}.blitz-scores .delta,.blitz-scores .chip-tag{grid-column:1 / -1}.score.me{border-color:var(--surface-2)}.delta{font-weight:700;font-size:.85rem;padding:2px 8px;border-radius:99px;justify-self:start;background:var(--surface-2);color:var(--muted)}.delta.up{background:#3ddc8426;color:var(--good)}.delta.down{background:#ff5a5a26;color:var(--bad)}.stage-card{background:var(--surface);border-radius:var(--radius);padding:18px 16px;display:grid;gap:12px}.stage-card>.eq{justify-self:center;width:64px;height:36px}.stage-card p{margin:0}.prompt{font-size:1.2rem;font-weight:700;text-align:center}.locked{text-align:center;font-size:1.05rem;padding:12px;border-radius:12px;background:var(--surface-2)}.locked.good{color:var(--good)}.countdown{text-align:center;padding:28px 16px}.count-num{font-size:6rem;font-weight:700;line-height:1;color:var(--accent);animation:pop 1s ease-out}.buzz-area{display:grid;gap:14px;justify-items:center;padding:8px 0 12px}.buzz{width:min(78vw,42vh,340px);aspect-ratio:1;border-radius:50%;border:0;cursor:pointer;color:#fff;font-size:clamp(2.6rem,12vw,4rem);font-weight:700;letter-spacing:.06em;background:radial-gradient(circle at 35% 30%,#ff7aa8,var(--accent) 50%,#b8114c);box-shadow:0 12px #7d0b33,0 20px 40px #ff3d7f59,inset 0 -6px 18px #00000040;transition:transform .08s,box-shadow .08s;animation:buzz-glow 1.8s ease-in-out infinite;touch-action:manipulation}.buzz:active,.buzz.pressed{transform:translateY(10px) scale(.98);box-shadow:0 2px #7d0b33,0 6px 16px #ff3d7f59,inset 0 -4px 12px #00000040}.buzz:focus-visible{outline:4px solid var(--accent-2);outline-offset:6px}.bell{font-size:4rem;text-align:center;animation:ring .6s ease-in-out infinite}.shout{font-size:2.6rem;font-weight:700;text-align:center;color:var(--gold);animation:throb .9s ease-in-out infinite}.answer-card{padding:18px}.answer-card .year{font-size:2.4rem}.answer-card .title{font-size:1.3rem;white-space:normal}.strikes{display:flex;align-items:center;gap:6px;font-size:.85rem}.strikes i{width:14px;height:14px;border-radius:50%;border:2px solid var(--muted)}.strikes i.hit{background:var(--bad);border-color:var(--bad)}.strikes span{margin-left:4px}.wrong-list,.history{list-style:none;margin:0;padding:0;display:grid;gap:4px;font-size:.9rem}.wrong-list li,.history li.bad{color:var(--bad)}.history li.good{color:var(--good)}.stage-len{display:inline-block;min-width:3.5ch;color:var(--muted);margin-right:6px}.ring{width:1.2em;height:1.2em;transform:rotate(-90deg)}.ring circle{fill:none;stroke-width:3}.ring-bg{stroke:#ffffff40}.ring-fg{stroke:#fff;transition:stroke-dashoffset .2s linear}.stages{list-style:none;margin:0;padding:0;display:flex;gap:6px;justify-content:center;flex-wrap:wrap}.stages li{min-width:44px;text-align:center;padding:6px 8px;border-radius:99px;font-size:.85rem;font-weight:700;background:var(--surface-2);color:var(--muted)}.stages li.past{opacity:.6}.stages li.current{background:var(--accent);color:#fff;opacity:1}.stages li.wrong{box-shadow:inset 0 0 0 2px var(--bad)}.stages li.solved{background:var(--good);color:#062b17;opacity:1}.listening{display:flex;align-items:center;justify-content:center;gap:10px;color:var(--accent-2);font-weight:700}.replay{justify-self:center}.reveal{display:grid;gap:12px}.verdict-box{background:var(--surface);border-radius:12px;padding:12px 14px;display:grid;gap:8px}.verdict-box p{margin:0}.results{list-style:none;margin:0;padding:0;display:grid;gap:6px}.result{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:12px;background:var(--surface);border:2px solid transparent}.result.me{border-color:var(--surface-2)}.result-mark{width:1.4em;text-align:center;font-weight:700;color:var(--muted)}.result.good .result-mark{color:var(--good)}.result-main{flex:1;min-width:0;display:grid}.result-main .name{font-weight:700}.result-detail{color:var(--muted);font-size:.85rem;overflow-wrap:anywhere}.reveal-footer{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px}.ended{display:grid;gap:12px}@keyframes throb{50%{transform:scale(1.04)}}@keyframes pop{0%{transform:scale(1.6);opacity:0}}@keyframes ring{25%{transform:rotate(-12deg)}75%{transform:rotate(12deg)}}@keyframes buzz-glow{50%{box-shadow:0 12px #7d0b33,0 20px 60px #ff3d7f8c,inset 0 -6px 18px #00000040}}@media(min-width:900px){.app.wide{max-width:1200px;padding:24px 32px}.lobby{display:grid;grid-template-columns:minmax(0,1fr) 380px;gap:32px;align-items:start}.lobby-side{position:sticky;top:24px}.invite .qr{width:240px;height:240px}.invite .room-code strong{font-size:4rem}.game{display:grid;grid-template-columns:minmax(0,1fr) 340px;grid-template-areas:"top top" "phase side" "board side";grid-template-rows:auto auto 1fr;column-gap:32px;align-items:start}.topbar{grid-area:top}.phase{grid-area:phase}.board{grid-area:board}.side{grid-area:side;display:block;position:sticky;top:24px}.scores{display:grid;grid-template-columns:1fr 1fr;overflow:visible;margin-bottom:0}.score .name{max-width:none}.actions{position:static}.phase-text{font-size:1.5rem}}.coin{display:inline-block;width:.85em;height:.85em;border-radius:50%;vertical-align:-.08em;background:radial-gradient(circle at 35% 30%,#ffe8a3,#ffc53d 45%,#c98a00);box-shadow:inset 0 0 0 .08em #00000026}@media(min-width:900px){.blitz-scores{display:grid;grid-template-columns:1fr;gap:6px;margin-bottom:14px}.blitz-scores .score{display:flex;align-items:center;gap:8px}.blitz-scores .rank{min-width:2ch}.blitz-scores .name{flex:1}.blitz-scores .count{order:9;min-width:2.5ch;text-align:right}.blitz .board{max-width:720px}.stage-card{padding:28px}.picker-list{bottom:auto;top:calc(100% + 4px);flex-direction:column;box-shadow:0 8px 24px #0006}.phase.shout .phase-text{font-size:2rem}}@media(min-width:900px){.card.answer-card{width:auto;min-height:0;flex-direction:row;align-items:center;gap:20px;border-top:0;border-left:6px solid hsl(var(--hue) 85% 60%)}.card.answer-card .year{font-size:3rem}.card.answer-card .title{font-size:1.6rem}}.skip-vote{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:8px;margin-top:12px}.stage-card.ready .btn.huge{margin:14px 0}.volume{display:flex;align-items:center;gap:10px;font-size:.85rem}.volume input[type=range]{flex:1;height:28px;background:transparent;accent-color:var(--accent-2);cursor:pointer}.volume-pct{min-width:3.2em;text-align:right;color:var(--muted);font-variant-numeric:tabular-nums}.answer-area{display:grid;gap:10px}.answer-area .picker{margin:0}.or{display:flex;align-items:center;gap:10px;color:var(--muted);font-size:.85rem;text-transform:uppercase;letter-spacing:.1em}.or:before,.or:after{content:"";flex:1;height:1px;background:var(--surface-2)}.btn.know{padding-top:22px;padding-bottom:22px;font-size:1.3rem}.more summary{cursor:pointer;color:var(--muted);font-size:.9rem;padding:6px 0}.more[open] summary{margin-bottom:8px}.apple-link{display:block;margin:8px 0 12px;text-align:center;font-size:.85rem;color:var(--muted)}.credit{margin-top:auto;padding-top:16px;text-align:center;font-size:.8rem;color:var(--muted)}