:root{--bg:#050506;--bg-alt:#0a0a0c;--card:#0d0d10;--card-2:#141416;--border:#ffffff14;--border-strong:#ffffff29;--text:#9b98a1;--text-dim:#5c5960;--text-h:#f1eff2;--accent:#e0334f;--accent-hover:#ff4a67;--accent-soft:#e0334f1f;--accent-border:#e0334f73;--win:#e0334f;--win-soft:#e0334f1a;--lose:#6f6c74;--lose-soft:#ffffff08;--gold:#c9a24b;--gold-soft:#c9a24b1f;--shadow-sm:0 2px 10px #00000080;--shadow-lg:0 24px 48px -16px #000c;--radius-sm:6px;--radius:10px;--radius-lg:14px;--sans:"Inter", system-ui, "Segoe UI", Roboto, sans-serif;--display:"Bebas Neue", var(--sans);--mono:"JetBrains Mono", ui-monospace, Consolas, monospace;font:16px/1.55 var(--sans);--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;color:var(--text);background:var(--bg);font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*{box-sizing:border-box}body{background:radial-gradient(70vw 50vh at 50% -10%, #e0334f14, transparent 60%), var(--bg);background-attachment:fixed;min-height:100svh;margin:0}#root{flex-direction:column;min-height:100svh;display:flex}h1,h2,h3{font-family:var(--display);text-transform:uppercase;letter-spacing:.03em;color:var(--text-h);margin:0;font-weight:400}h1{font-size:34px}h2{font-size:26px}h3{font-size:20px}p{margin:0}a{color:inherit}button{font:inherit}.app{flex-direction:column;flex:1;align-items:stretch;display:flex}.app__header{z-index:10;background:color-mix(in srgb, var(--bg) 85%, transparent);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border-bottom:1px solid var(--border);flex-direction:column;align-items:center;gap:18px;padding:20px 16px 0;display:flex;position:sticky;top:0}.app__header-row{justify-content:space-between;align-items:center;gap:16px;width:100%;max-width:620px;display:flex}.app__brand{align-items:center;gap:12px;display:flex}.app__brand-mark{border:1px solid var(--accent-border);width:32px;height:32px;color:var(--accent);font-family:var(--display);justify-content:center;align-items:center;font-size:18px;display:inline-flex}.app__brand-text{flex-direction:column;align-items:flex-start;line-height:1;display:flex}.app__brand-title{font-family:var(--display);letter-spacing:.08em;color:var(--text-h);font-size:24px}.app__brand-sub{font-family:var(--sans);letter-spacing:.2em;text-transform:uppercase;color:var(--text-dim);font-size:10px;font-weight:600}.app__nav{gap:28px;display:flex}.app__nav a{color:var(--text-dim);font-family:var(--display);letter-spacing:.08em;text-transform:uppercase;align-items:center;padding:0 2px 14px;font-size:15px;text-decoration:none;transition:color .15s;display:inline-flex;position:relative}.app__nav a:after{content:"";background:var(--accent);height:2px;transition:transform .15s;position:absolute;bottom:0;left:0;right:0;transform:scaleX(0)}.app__nav a:hover,.app__nav a.active{color:var(--text-h)}.app__nav a.active:after{transform:scaleX(1)}.app__user{align-items:center;gap:10px;display:flex}.app__user-avatar{object-fit:cover;border-radius:50%;width:26px;height:26px}.app__user-avatar--placeholder{background:var(--card-2);border:1px solid var(--border-strong);font-family:var(--display);color:var(--text-dim);justify-content:center;align-items:center;font-size:13px;display:inline-flex}.app__user-name{color:var(--text-h);text-overflow:ellipsis;white-space:nowrap;max-width:120px;font-size:13px;font-weight:600;overflow:hidden}.app__user-link{letter-spacing:.04em;text-transform:uppercase;color:var(--text-dim);cursor:pointer;background:0 0;border:none;padding:0;font-size:11px;-webkit-text-decoration:underline #0000;text-decoration:underline #0000;transition:color .15s}.app__user-link:hover{color:var(--accent);-webkit-text-decoration-color:var(--accent-border);text-decoration-color:var(--accent-border)}.app__main{flex-direction:column;flex:1;align-items:center;gap:20px;padding:32px 16px 64px;display:flex}.card{background:var(--card);border:1px solid var(--border);border-radius:var(--radius-lg);width:100%;box-shadow:var(--shadow-sm)}.btn{border-radius:var(--radius-sm);letter-spacing:.04em;text-transform:uppercase;cursor:pointer;border:1px solid #0000;justify-content:center;align-items:center;gap:8px;padding:12px 22px;font-size:13px;font-weight:600;transition:background .15s,border-color .15s,opacity .15s,transform .1s;display:inline-flex}.btn:active:not(:disabled){transform:scale(.97)}.btn:disabled{cursor:not-allowed;opacity:.4}.btn--primary{background:var(--accent);color:#fff}.btn--primary:hover:not(:disabled){background:var(--accent-hover)}.btn--secondary{color:var(--text-h);border-color:var(--border-strong);background:0 0}.btn--secondary:hover:not(:disabled){border-color:var(--accent-border);color:var(--accent)}.btn--ghost{color:var(--text-dim);background:0 0;border-color:#0000;-webkit-text-decoration:underline #0000;text-decoration:underline #0000}.btn--ghost:hover:not(:disabled){color:var(--text-h);-webkit-text-decoration-color:var(--border-strong);text-decoration-color:var(--border-strong)}.btn--block{width:100%}.badge{border-radius:var(--radius-sm);letter-spacing:.03em;text-transform:uppercase;align-items:center;gap:6px;padding:5px 10px;font-size:12px;font-weight:600;display:inline-flex}.badge--accent{background:var(--accent-soft);color:var(--accent)}.bar{background:var(--card-2);width:100%;height:3px;position:relative;overflow:hidden}.bar__fill{background:var(--accent);transition:width .35s cubic-bezier(.22,1,.36,1);position:absolute;inset:0 auto 0 0}.state{color:var(--text-dim);flex-direction:column;align-items:center;gap:14px;padding:48px 16px;font-size:14px;display:flex}.state__spinner{border:2px solid var(--border);border-top-color:var(--accent);border-radius:50%;width:22px;height:22px;animation:.8s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.state--error{color:var(--accent)}.page{flex-direction:column;align-items:stretch;gap:16px;width:100%;max-width:620px;display:flex}.page__header{text-align:center;flex-direction:column;align-items:center;gap:6px;margin-bottom:4px;display:flex}.page__eyebrow{font-family:var(--display);letter-spacing:.16em;text-transform:uppercase;color:var(--accent);font-size:13px}.page__lead{color:var(--text-dim);font-size:14px}.game-progress{flex-direction:column;gap:10px;width:100%;padding:16px 18px;display:flex}.game-progress__row{justify-content:space-between;align-items:center;gap:12px;display:flex}.game-progress__round{letter-spacing:.04em;text-transform:uppercase;color:var(--text-dim);font-size:12px;font-weight:600}.game-progress__score{font-family:var(--display);letter-spacing:.03em;color:var(--text-h);align-items:baseline;gap:6px;font-size:20px;display:inline-flex}.game-progress__score-label{font-family:var(--sans);letter-spacing:.1em;text-transform:uppercase;color:var(--text-dim);font-size:10px;font-weight:500}.round-play{flex-direction:column;align-items:stretch;gap:16px;width:100%;display:flex}.round-reveal{flex-direction:column;gap:14px;padding:22px 22px 18px;display:flex}.round-reveal__frame{border-left:2px solid var(--accent-border);background:var(--card-2);position:relative;overflow:hidden}.round-reveal__frame:after{content:"";background:linear-gradient(to bottom, transparent, var(--card-2));pointer-events:none;height:56px;position:absolute;inset:auto 0 0}.round-reveal__text{white-space:pre-wrap;font-family:var(--mono);color:var(--text-h);text-align:left;max-height:280px;margin:0;padding:20px;font-size:15px;line-height:1.7;overflow-y:auto}.round-reveal__meta{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;display:flex}.round-reveal__progress{letter-spacing:.03em;color:var(--text-dim);margin:0;font-size:12px;font-weight:600}.round-reveal__max-score{letter-spacing:.03em;color:var(--accent);margin:0;font-size:12px;font-weight:600}.round-play__divider{background:var(--border);height:1px;margin:0 22px}.attempts-indicator{justify-content:center;align-items:center;gap:24px;padding:18px 22px 4px;display:flex}.attempts-indicator__group{letter-spacing:.03em;text-transform:uppercase;color:var(--text-dim);align-items:center;gap:8px;font-size:12px;display:flex}.attempts-indicator__dots{gap:5px;display:inline-flex}.attempts-indicator__dot{background:var(--accent);width:7px;height:7px}.attempts-indicator__dot--empty{background:var(--border-strong)}.attempts-indicator__wrong{color:var(--text-h);font-weight:700}.answer-form{flex-direction:column;gap:10px;padding:0 22px 22px;display:flex}.answer-form__row{gap:10px;display:flex}.answer-form__input{border-radius:var(--radius-sm);border:1px solid var(--border-strong);background:var(--card-2);min-width:0;color:var(--text-h);outline:none;flex:1;padding:13px 16px;font-size:15px;transition:border-color .15s,box-shadow .15s}.answer-form__input::placeholder{color:var(--text-dim)}.answer-form__input:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}.answer-form__input:disabled{opacity:.5;cursor:not-allowed}.answer-form__cooldown{letter-spacing:.03em;text-transform:uppercase;color:var(--text-dim);align-items:center;gap:10px;margin:0;font-size:11px;display:flex}.answer-form__cooldown-bar{flex:1}.round-play__actions{justify-content:center;align-items:center;gap:10px;padding:0 22px 22px;display:flex}.round-result{text-align:center;flex-direction:column;align-items:center;gap:14px;padding:28px 22px;display:flex}.round-result--won{border-color:var(--accent-border);background:linear-gradient(180deg, var(--win-soft), var(--card) 60%)}.round-result--lost,.round-result--skipped{background:var(--card)}.round-result__headline{flex-direction:column;align-items:center;gap:8px;display:flex}.round-result__icon{border:1px solid var(--border-strong);width:40px;height:40px;color:var(--text-dim);justify-content:center;align-items:center;font-size:16px;display:inline-flex}.round-result--won .round-result__icon{border-color:var(--accent);color:var(--accent)}.round-result__track{color:var(--text-dim);font-size:14px}.round-result__track strong{color:var(--text-h);font-weight:600}.round-result__lyrics{white-space:pre-wrap;font-family:var(--mono);background:var(--card-2);border-left:2px solid var(--border-strong);text-align:left;width:100%;max-height:220px;color:var(--text);padding:16px 18px;font-size:13px;line-height:1.7;overflow-y:auto}.round-result__score{font-family:var(--display);letter-spacing:.03em;color:var(--text-h);font-size:24px}.hero-card{text-align:center;background:var(--card);flex-direction:column;align-items:center;gap:14px;width:100%;padding:40px 26px;display:flex}.hero-card__score{font-family:var(--display);letter-spacing:.02em;color:var(--accent);margin:6px 0;font-size:56px;line-height:1}.hero-card__meta{color:var(--text-dim);font-size:14px}.leaderboard{flex-direction:column;gap:8px;width:100%;margin:0;padding:0;list-style:none;display:flex}.leaderboard__row{align-items:center;gap:16px;padding:14px 18px;display:flex}.leaderboard__rank{min-width:30px;font-family:var(--display);color:var(--text-dim);justify-content:center;align-items:center;font-size:18px;display:inline-flex}.leaderboard__row--top .leaderboard__rank{color:var(--accent)}.leaderboard__row--me{border-color:var(--accent)}.daily-leaderboard{flex-direction:column;gap:12px;width:100%;margin-top:24px;display:flex}.leaderboard__avatar{object-fit:cover;border-radius:50%;flex-shrink:0;width:30px;height:30px}.leaderboard__avatar--placeholder{background:var(--card-2);border:1px solid var(--border-strong);font-family:var(--display);color:var(--text-dim);justify-content:center;align-items:center;font-size:14px;display:inline-flex}.leaderboard__body{flex-direction:column;flex:1;display:flex}.leaderboard__player{color:var(--text-h);font-size:13px;font-weight:600}.leaderboard__score{font-family:var(--display);letter-spacing:.02em;color:var(--text-h);font-size:17px}.leaderboard__sub{color:var(--text-dim);font-size:12px}.leaderboard__empty{text-align:center;color:var(--text-dim);padding:40px 16px}.auth-page{align-items:stretch;max-width:380px}.auth-card{flex-direction:column;gap:18px;padding:26px 24px;display:flex}.auth-form{flex-direction:column;gap:12px;display:flex}.auth-form__error{color:var(--accent);margin:0;font-size:13px}.auth-divider{color:var(--text-dim);letter-spacing:.08em;text-transform:uppercase;align-items:center;gap:12px;font-size:11px;display:flex}.auth-divider:before,.auth-divider:after{content:"";background:var(--border);flex:1;height:1px}.auth-card__switch{text-align:center;color:var(--text-dim);margin:0;font-size:13px}.auth-card__switch a{color:var(--accent);text-decoration:underline}@media (width<=520px){.app__main{padding:24px 12px 48px}h1{font-size:28px}.app__nav{gap:20px}.round-reveal,.round-result,.answer-form,.round-play__actions{padding-left:16px;padding-right:16px}.answer-form__row{flex-direction:column}.hero-card__score{font-size:42px}}.room__code{font-family:var(--mono);letter-spacing:.18em;color:var(--accent);font-size:44px;font-weight:700;line-height:1}.room__code-input{font-family:var(--mono);letter-spacing:.3em;text-align:center;text-transform:uppercase;font-size:22px}.room__duration{color:var(--text);flex-direction:column;gap:8px;font-size:13px;display:flex}.room__host-badge{color:var(--gold);background:var(--gold-soft);margin-left:8px;padding:2px 6px;font-size:10px}.room__live{flex-direction:column;gap:12px;margin-top:8px;display:flex}.session-timer{flex-direction:column;gap:10px;padding:16px 18px;display:flex}.session-timer__row{justify-content:space-between;align-items:center;display:flex}.session-timer__clock{font-family:var(--mono);color:var(--text-h);font-variant-numeric:tabular-nums;font-size:28px;font-weight:700}.session-timer--urgent{border-color:var(--accent-border)}.session-timer--urgent .session-timer__clock{color:var(--accent)}.room__host-hint{text-align:center;font-size:13px}.room__host-hint a{color:var(--accent)}