:root{--bg:#0a0a12;--bg-elevated:#15151f;--bg-inset:#1b1b28;--border:#ffffff17;--border-strong:#ffffff2e;--text:#f4f3fa;--text-dim:#9b98ad;--accent:#22d3ee;--accent-ink:#06222b;--winner:#ffb020;--winner-ink:#2b1900;--danger:#ff6b7a;--reel-dur:1.4s;--reel-cell:26px;--reel-spin-blur:3px;--reel-stagger:90ms;--reel-ease:cubic-bezier(.16, 1, .3, 1);--check-opacity-dur:.45s;--check-rotate-dur:.45s;--check-rotate-from:80deg;--check-bob-dur:.45s;--check-y-amount:30px;--check-blur-dur:.45s;--check-blur-from:8px;--check-path-dur:.4s;--check-path-delay:80ms;--check-ease-out:cubic-bezier(.22, 1, .36, 1);--check-ease-bob:cubic-bezier(.34, 1.35, .64, 1);--shake-distance:6px;--shake-overshoot:4px;--shake-dur-a:80ms;--shake-dur-b:60ms;--shake-ease:cubic-bezier(.22, 1, .36, 1);--toast-open:.35s;--toast-close:.25s;--toast-distance:16px;--toast-blur:2px;--toast-scale:.97;--toast-ease:cubic-bezier(.22, 1, .36, 1);--stagger-dur:.5s;--stagger-distance:12px;--stagger-stagger:50ms;--stagger-blur:3px;--stagger-ease:cubic-bezier(.22, 1, .36, 1)}*{box-sizing:border-box}html,body{height:100%}body{color:var(--text);background:var(--bg);-webkit-font-smoothing:antialiased;margin:0;font-family:Sora,system-ui,sans-serif}h1,h2,.btn,.brand-name,.reveal-title,.buzzer-btn{font-family:Space Grotesk,Sora,system-ui,sans-serif}.hidden{display:none!important}.stage{justify-content:center;align-items:center;min-height:100dvh;padding:2rem 1.25rem;display:flex;position:relative;overflow:hidden}.stage-glow{z-index:0;pointer-events:none;background:radial-gradient(60% 50% at 50% 0,#22d3ee29,#0000 70%),radial-gradient(45% 40% at 85% 100%,#ffb0201a,#0000 70%);position:fixed;inset:0}.stage-glow:after{content:"";background-image:linear-gradient(#ffffff09 1px,#0000 1px),linear-gradient(90deg,#ffffff09 1px,#0000 1px);background-size:42px 42px;position:absolute;inset:0;-webkit-mask-image:radial-gradient(80% 60% at 50% 30%,#000,#0000 75%);mask-image:radial-gradient(80% 60% at 50% 30%,#000,#0000 75%)}.screen{z-index:1;flex-direction:column;justify-content:center;align-items:center;width:100%;display:flex;position:relative}.panel{background:var(--bg-elevated);border:1px solid var(--border);border-radius:24px;width:100%;max-width:460px;padding:2rem;box-shadow:0 24px 70px #00000073}.panel-center{text-align:center;flex-direction:column;align-items:center;gap:1rem;padding:2.5rem 2rem;display:flex}.panel-game{max-width:560px}.brand{align-items:center;gap:.6rem;display:flex}.brand-icon{width:2rem;height:2rem}.brand-name{letter-spacing:-.01em;font-size:1.5rem;font-weight:700}.panel-lede{color:var(--text-dim);margin:0 0 .25rem}#screen-login.intro-pending .intro-panel{box-shadow:none;background:0 0;border-color:#0000;transition:background-color .45s,border-color .45s,box-shadow .45s}#screen-login .intro-logo{opacity:0;transform:scale(.4)}#screen-login.intro-logo-in .intro-logo{animation:.55s cubic-bezier(.34,1.56,.64,1) forwards intro-logo-pop}@keyframes intro-logo-pop{0%{opacity:0;transform:scale(.4)}60%{opacity:1;transform:scale(1.15)}to{opacity:1;transform:scale(1)}}#screen-login .intro-reveal{opacity:0;transition:opacity .4s,transform .4s;transform:translateY(8px)}#screen-login.intro-done .intro-reveal{opacity:1;transform:translateY(0)}.panel-head{justify-content:space-between;align-items:center;margin-bottom:1.75rem;display:flex}.setup-steps-indicator{align-items:center;gap:.4rem;display:flex}.setup-step-dot{background:var(--border);width:8px;height:8px;transition:background var(--duration-fast,.25s) var(--ease-smooth-out,ease), transform var(--duration-fast,.25s) var(--ease-smooth-out,ease);border-radius:50%}.setup-step-dot.is-done{background:var(--accent)}.setup-step-dot.is-active{background:var(--accent);transform:scale(1.4)}.setup-step h1{margin-bottom:1.5rem}.setup-step-actions{justify-content:space-between;align-items:center;gap:.75rem;display:flex}.setup-step-actions .btn-primary{flex:1}.eyebrow{letter-spacing:.14em;text-transform:uppercase;color:var(--accent);margin-bottom:.4rem;font-size:.72rem;font-weight:600;display:inline-block}h1{letter-spacing:-.01em;margin:0;font-size:1.6rem;font-weight:700}.setup-block{margin-bottom:1.75rem}.setup-block:last-of-type{margin-bottom:1.5rem}.setup-block h2{color:var(--text-dim);align-items:center;gap:.5rem;margin:0 0 .75rem;font-size:1rem;font-weight:600;display:flex}.setup-block h2 i{color:var(--accent);font-size:1.1rem}.status-text{color:var(--text-dim);margin:.6rem 0 0;font-size:.88rem}.round-size-row{color:var(--text-dim);justify-content:space-between;align-items:center;gap:1rem;margin-bottom:1rem;font-size:.9rem;display:flex}.round-size-row input{background:var(--bg-inset);border:1px solid var(--border);width:5rem;color:var(--text);text-align:center;border-radius:12px;padding:.6rem .7rem;font-family:Space Grotesk,sans-serif;font-weight:600}.playlist-select{appearance:none;background-color:var(--bg-inset);border:1px solid var(--border);width:100%;color:var(--text);cursor:pointer;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%239b98ad' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");background-position:right 1rem center;background-repeat:no-repeat;background-size:1rem;border-radius:14px;margin-bottom:1rem;padding:.8rem 2.5rem .8rem 1rem;font-family:Sora,sans-serif;font-size:.95rem}.year-range{margin-bottom:1rem}.year-range-labels{color:var(--accent);align-items:center;gap:.4rem;margin-bottom:.6rem;font-family:Space Grotesk,sans-serif;font-weight:700;display:flex}.year-range-labels span:nth-child(2){color:var(--text-dim);font-family:Sora,sans-serif;font-size:.85rem;font-weight:400}.year-range-sliders{height:1.5rem;position:relative}.year-range-sliders input[type=range]{appearance:none;pointer-events:none;background:0 0;width:100%;margin:0;position:absolute;top:0;left:0}.year-range-sliders input[type=range]::-webkit-slider-runnable-track{background:var(--bg-inset);border-radius:999px;height:4px}.year-range-sliders input[type=range]::-moz-range-track{background:var(--bg-inset);border-radius:999px;height:4px}.year-range-sliders input[type=range]::-webkit-slider-thumb{appearance:none;pointer-events:auto;background:var(--accent);border:2px solid var(--bg-elevated);cursor:pointer;border-radius:999px;width:1.1rem;height:1.1rem;margin-top:-.35rem}.year-range-sliders input[type=range]::-moz-range-thumb{pointer-events:auto;background:var(--accent);border:2px solid var(--bg-elevated);cursor:pointer;border-radius:999px;width:1.1rem;height:1.1rem}.error{color:var(--danger);font-size:.88rem}.btn{letter-spacing:-.01em;cursor:pointer;border:none;border-radius:999px;justify-content:center;align-items:center;gap:.55rem;padding:.85rem 1.5rem;font-size:.95rem;font-weight:600;transition:transform .15s cubic-bezier(.16,1,.3,1),filter .15s;display:inline-flex}.btn i{font-size:1.1em}.btn-primary{background:var(--accent);color:var(--accent-ink)}.btn-accent{background:var(--winner);color:var(--winner-ink)}.btn-ghost{color:var(--text);border:1px solid var(--border-strong);background:0 0}.btn-lg{padding:1.05rem 1.75rem;font-size:1.02rem}.btn-block{width:100%}.btn-icon{border-radius:999px;width:2.6rem;height:2.6rem;padding:0}.btn-icon i{font-size:1.2rem}.buzzer-actions{justify-content:center;gap:.6rem;display:flex}.btn:hover:not(:disabled){filter:brightness(1.08)}.btn:active:not(:disabled){transform:scale(.97)}.btn-ghost:hover:not(:disabled){border-color:var(--accent);color:var(--accent)}.btn:disabled{background:var(--bg-inset);color:var(--text-dim);cursor:not-allowed;filter:none}input[type=text]{background:var(--bg-inset);border:1px solid var(--border);width:100%;color:var(--text);border-radius:14px;padding:.8rem 1rem;font-family:Sora,sans-serif;font-size:.95rem}input[type=text]::placeholder{color:var(--text-dim)}input[type=text]:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.input-row{gap:.6rem;display:flex}.input-row input{flex:1}.key-prompt{color:var(--accent);margin:.6rem 0 0;font-size:.88rem;font-weight:600}.player-list{flex-wrap:wrap;gap:.5rem;margin-bottom:.85rem;display:flex}.player-chip{background:var(--bg-inset);border:1px solid var(--border);border-radius:999px;align-items:center;gap:.5rem;padding:.4rem .5rem .4rem .4rem;font-size:.92rem;display:flex}.player-key{background:var(--accent);width:1.6rem;height:1.6rem;color:var(--accent-ink);border-radius:999px;justify-content:center;align-items:center;font-family:Space Grotesk,sans-serif;font-size:.8rem;font-weight:700;display:inline-flex}.player-chip button{color:var(--text-dim);cursor:pointer;background:0 0;border:none;border-radius:999px;width:1.5rem;height:1.5rem;font-size:.9rem;line-height:1}.player-chip button:hover{background:var(--border);color:var(--danger)}.game-head{justify-content:space-between;align-items:center;gap:.75rem;margin-bottom:1.5rem;display:flex}.btn-stop-game{border:1px solid var(--border-strong);width:2rem;height:2rem;color:var(--text-dim);cursor:pointer;background:0 0;border-radius:999px;flex-shrink:0;justify-content:center;align-items:center;font-size:.9rem;transition:color .15s,border-color .15s;display:inline-flex}.btn-stop-game:hover{color:var(--danger);border-color:var(--danger)}.tracks-left{color:var(--text-dim);margin:0;font-size:.9rem}.track-progress{gap:4px;width:100%;max-width:560px;margin-bottom:1rem;padding:.3rem .25rem 0;display:flex}.track-segment{background:var(--bg-inset);border:1px solid var(--border);border-radius:999px;flex:1;min-width:3px;height:5px;transition:background .2s,border-color .2s}.track-segment.done{background:var(--winner);border-color:var(--winner)}.track-segment.current{background:var(--accent);border-color:var(--accent)}.scoreboard{flex-direction:column;gap:.5rem;margin-bottom:1.5rem;display:flex}.score-row{background:var(--bg-inset);border:1px solid var(--border);border-radius:14px;align-items:center;gap:.7rem;padding:.5rem .9rem;display:flex}.score-row-leading{border-color:var(--winner);background:#ffb02014}.score-rank{color:var(--text-dim);text-align:center;flex-shrink:0;width:1.2rem;font-family:Space Grotesk,sans-serif;font-size:.8rem;font-weight:700}.score-row-leading .score-rank{color:var(--winner)}.score-avatar{width:1.8rem;height:1.8rem;color:var(--accent);background:#22d3ee26;border-radius:999px;flex-shrink:0;justify-content:center;align-items:center;font-family:Space Grotesk,sans-serif;font-size:.75rem;font-weight:700;display:inline-flex}.score-pill-name{white-space:nowrap;text-overflow:ellipsis;min-width:0;color:var(--text);flex:1;font-size:.9rem;font-weight:600;overflow:hidden}.score-pill-value{color:var(--winner);flex-shrink:0;font-family:Space Grotesk,sans-serif;font-size:1.15rem;font-weight:700}.t-reel{height:var(--reel-cell);font-variant-numeric:tabular-nums;align-items:center;display:inline-flex}.t-reel-col{height:var(--reel-cell);width:.62em;position:relative;overflow:hidden;-webkit-mask-image:linear-gradient(#0000 0%,#000 22% 78%,#0000 100%);mask-image:linear-gradient(#0000 0%,#000 22% 78%,#0000 100%)}.t-reel-strip{will-change:transform, filter;flex-direction:column;display:flex}.t-reel-digit{height:var(--reel-cell);justify-content:center;align-items:center;display:flex}@media (prefers-reduced-motion:reduce){.t-reel-strip{filter:none!important;transition:none!important}}.final-results{text-align:center;padding:1rem 0}.final-trophy{color:var(--winner);margin-bottom:.5rem;font-size:3rem}.final-results h2{margin:0 0 1.5rem;font-size:1.4rem}.final-scoreboard{flex-direction:column;gap:.6rem;margin-bottom:1.5rem;display:flex}.final-history-wrap{text-align:left;margin-bottom:1.5rem}.final-history-wrap h3{text-transform:uppercase;letter-spacing:.06em;color:var(--text-dim);margin:0 0 .6rem;font-size:.85rem;font-weight:600}.final-history{flex-direction:column;gap:.4rem;max-height:220px;margin:0;padding:0;list-style:none;display:flex;overflow-y:auto}.final-history li{background:var(--bg-inset);border:1px solid var(--border);border-radius:10px;justify-content:space-between;align-items:center;gap:.75rem;padding:.55rem .85rem;font-size:.85rem;display:flex}.final-history-main{flex-direction:column;min-width:0;display:flex}.final-history-title{white-space:nowrap;text-overflow:ellipsis;font-weight:600;overflow:hidden}.final-history-artist{color:var(--text-dim);font-size:.78rem}.final-history-meta{flex-direction:column;flex-shrink:0;align-items:flex-end;font-size:.78rem;display:flex}.final-history-who{color:var(--winner);font-weight:600}.final-history-time{color:var(--text-dim)}.final-row{background:var(--bg-inset);border:1px solid var(--border);opacity:0;transform:translateY(var(--stagger-distance));filter:blur(var(--stagger-blur));transition:opacity var(--stagger-dur) var(--stagger-ease), transform var(--stagger-dur) var(--stagger-ease), filter var(--stagger-dur) var(--stagger-ease);border-radius:14px;justify-content:space-between;align-items:center;padding:.85rem 1.25rem;display:flex}.final-row.is-shown{opacity:1;filter:blur();transform:translateY(0)}@media (prefers-reduced-motion:reduce){.final-row{opacity:1;filter:none;transform:none;transition:none!important}}.final-row.final-winner{border-color:var(--winner);background:#ffb02024}.final-name{align-items:center;gap:.5rem;font-weight:600;display:flex}.final-name i{color:var(--winner)}.final-score{font-family:Space Grotesk,sans-serif;font-size:1.1rem;font-weight:700}#btn-play{margin-bottom:1.25rem}.reveal-card{background:linear-gradient(135deg,#22d3ee1f,#22d3ee08);border:1px solid #22d3ee40;border-radius:20px;align-items:center;gap:1rem;margin-bottom:1.25rem;padding:1.25rem 1.5rem;display:flex}@media (prefers-reduced-motion:no-preference){.reveal-card:not(.hidden){animation:.5s cubic-bezier(.22,1,.36,1) revealIn}}@keyframes revealIn{0%{opacity:0;filter:blur(8px);transform:translateY(10px)scale(.96)}to{opacity:1;filter:blur();transform:translateY(0)scale(1)}}.reveal-icon{color:var(--winner);flex-shrink:0;font-size:1.8rem}.reveal-title{font-size:1.25rem;font-weight:700}.reveal-artist{color:var(--text-dim);font-size:.95rem}.reveal-album{color:var(--text-dim);opacity:.8;font-size:.82rem}.reveal-source{color:var(--accent);margin-top:.35rem;font-size:.85rem;font-weight:600}.reveal-link{color:var(--accent);align-items:center;gap:.35rem;margin-top:.5rem;font-size:.85rem;font-weight:600;text-decoration:none;display:inline-flex}.reveal-fix-btn{color:var(--text-dim);cursor:pointer;background:0 0;border:none;align-items:center;gap:.35rem;margin-top:.4rem;padding:0;font-size:.78rem;font-weight:600;display:inline-flex}.reveal-fix-btn:hover{color:var(--danger)}.fix-song-picker{background:var(--bg-inset);border:1px solid var(--border-strong);border-radius:16px;margin-bottom:1.25rem;padding:1rem 1.25rem}.fix-song-picker-hint{color:var(--text-dim);margin:0 0 .75rem;font-size:.85rem}.fix-song-candidates{flex-direction:column;gap:.5rem;max-height:320px;margin-bottom:.75rem;display:flex;overflow-y:auto}.fix-song-candidate{background:var(--bg-elevated);border:1px solid var(--border);text-align:left;cursor:pointer;color:var(--text);border-radius:12px;justify-content:space-between;align-items:center;gap:.75rem;width:100%;padding:.65rem .9rem;font-family:inherit;display:flex}.fix-song-candidate:hover{border-color:var(--accent)}.fix-song-candidate-info{min-width:0}.fix-song-candidate-title{white-space:nowrap;text-overflow:ellipsis;font-size:.9rem;font-weight:600;overflow:hidden}.fix-song-candidate-artist{color:var(--text-dim);font-size:.8rem}.fix-song-candidate i{color:var(--accent);flex-shrink:0;font-size:1.2rem}.reveal-link:hover{text-decoration:underline}.buzzer-area{margin-bottom:1rem}.preview-timer{background:var(--bg-inset);border-radius:999px;height:6px;margin-bottom:1rem;overflow:hidden}.preview-timer-bar{background:var(--accent);border-radius:inherit;width:100%;height:100%;transition:width .2s linear,background .2s}.preview-timer-bar.warning{background:var(--danger)}.buzzers{grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:.85rem;margin-bottom:1rem;display:grid}.buzzer-btn{color:var(--text);background:var(--bg-inset);border:2px solid var(--border-strong);cursor:pointer;border-radius:20px;flex-direction:column;align-items:center;gap:.5rem;padding:1.25rem 1rem;font-size:1.1rem;font-weight:600;transition:transform .12s cubic-bezier(.16,1,.3,1),border-color .15s,background .15s;display:flex}.buzzer-key{width:1.4rem;height:1.4rem;color:var(--text-dim);background:#ffffff14;border-radius:999px;justify-content:center;align-items:center;font-family:Space Grotesk,sans-serif;font-size:.72rem;font-weight:700;display:inline-flex}.buzzer-btn.winner .buzzer-key{background:#00000026}.buzzer-name{font-size:1rem}.buzzer-score{color:var(--text-dim);font-family:Space Grotesk,sans-serif;font-size:.8rem;font-weight:700}.buzzer-btn.winner .buzzer-score{color:var(--winner-ink);opacity:.7}.buzzer-btn:hover:not(.locked){border-color:var(--accent)}.buzzer-btn:active:not(.locked){transform:scale(.96)}.buzzer-btn.locked{opacity:.35;cursor:not-allowed;border-color:#0000}.buzzer-btn.winner{background:var(--winner);color:var(--winner-ink);border-color:var(--winner);opacity:1}@media (prefers-reduced-motion:no-preference){.buzzer-btn.winner{animation:.4s cubic-bezier(.34,1.56,.64,1) winnerPop}}@keyframes winnerPop{0%{transform:scale(1)}50%{transform:scale(1.08)}to{transform:scale(1)}}.buzz-result{color:var(--winner);min-height:1.4em;margin:0;font-size:1.05rem;font-weight:600}.resolve-area,.score-area{flex-wrap:wrap;gap:.6rem;margin-bottom:1rem;display:flex}.resolve-area .btn,.score-area .btn{flex:1}.t-success-check{transform-origin:50%;opacity:0;color:var(--winner);will-change:transform, opacity, filter;display:inline-block}.t-success-check svg{display:block;overflow:visible}.t-success-check svg path{stroke-dasharray:41;stroke-dashoffset:41px}.t-success-check[data-state=in]{animation:t-check-fade var(--check-opacity-dur) var(--check-ease-out) forwards, t-check-rotate var(--check-rotate-dur) var(--check-ease-out) forwards, t-check-blur var(--check-blur-dur) var(--check-ease-out) forwards, t-check-bob var(--check-bob-dur) var(--check-ease-bob) forwards}.t-success-check[data-state=in] svg path{animation:t-check-draw var(--check-path-dur) var(--check-ease-out) var(--check-path-delay) forwards}@keyframes t-check-fade{0%{opacity:0}to{opacity:1}}@keyframes t-check-rotate{0%{transform:rotate(var(--check-rotate-from))}to{transform:rotate(0)}}@keyframes t-check-blur{0%{filter:blur(var(--check-blur-from))}to{filter:blur()}}@keyframes t-check-bob{0%{translate:0 var(--check-y-amount)}to{translate:0}}@keyframes t-check-draw{to{stroke-dashoffset:0}}@media (prefers-reduced-motion:reduce){.t-success-check{opacity:1;animation:none!important}.t-success-check svg path{stroke-dashoffset:0!important;animation:none!important}}.buzzer-btn.is-shaking{animation:t-buzzer-shake calc(var(--shake-dur-a) * 2 + var(--shake-dur-b) * 2) linear}@keyframes t-buzzer-shake{0%{animation-timing-function:var(--shake-ease);transform:translate(0)}28.57%{transform:translateX(var(--shake-distance));animation-timing-function:var(--shake-ease)}57.14%{transform:translateX(calc(var(--shake-distance) * -1));animation-timing-function:var(--shake-ease)}78.57%{transform:translateX(var(--shake-overshoot));animation-timing-function:var(--shake-ease)}to{transform:translate(0)}}@media (prefers-reduced-motion:reduce){.buzzer-btn.is-shaking{animation:none!important}}.t-toast{transform:translate(-50%, var(--toast-distance)) scale(var(--toast-scale));opacity:0;filter:blur(var(--toast-blur));background:var(--bg-elevated);border:1px solid var(--accent);color:var(--text);z-index:50;pointer-events:none;will-change:transform, opacity, filter;transition:opacity var(--toast-close) var(--toast-ease), transform var(--toast-close) var(--toast-ease), filter var(--toast-close) var(--toast-ease);border-radius:999px;padding:.85rem 1.5rem;font-size:.9rem;font-weight:600;position:fixed;bottom:2rem;left:50%;box-shadow:0 12px 40px #00000080}.t-toast.is-open{opacity:1;filter:blur();transition:opacity var(--toast-open) var(--toast-ease), transform var(--toast-open) var(--toast-ease), filter var(--toast-open) var(--toast-ease);transform:translate(-50%)scale(1)}@media (prefers-reduced-motion:reduce){.t-toast{transition:none!important}}@media (width<=560px){.panel{border-radius:20px;padding:1.5rem}.stage{padding:1.25rem 1rem}.buzzers{grid-template-columns:repeat(auto-fit,minmax(110px,1fr))}}