:root{--bg: #1e1f22;--panel: #2b2d31;--panel-2: #313338;--border: #1f2024;--text: #f2f3f5;--muted: #b5bac1;--accent: #5865f2;--good: #23a559;--warn: #f0b232;--bad: #f23f42;--you: #00a8fc;color-scheme:dark}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{background:var(--bg);color:var(--text);font-family:gg sans,Helvetica Neue,Helvetica,Arial,sans-serif;font-size:15px}.app{display:flex;flex-direction:column;height:100%;padding:16px;gap:12px;max-width:720px;margin:0 auto}.card{background:var(--panel);border:1px solid var(--border);border-radius:8px;padding:14px}.row{display:flex;gap:8px;align-items:center}.col{display:flex;flex-direction:column;gap:8px}.spacer{flex:1}button{background:var(--accent);color:#fff;border:none;border-radius:6px;padding:8px 14px;font-weight:600;cursor:pointer}button[disabled]{opacity:.5;cursor:not-allowed}button.secondary{background:var(--panel-2);color:var(--text)}.title{font-size:18px;font-weight:700;letter-spacing:.01em}.muted{color:var(--muted);font-size:13px}.app-header{padding:12px 16px}.results-header{padding-bottom:10px;border-bottom:1px solid var(--border)}.flag-label{margin-left:8px;font-size:12px;font-weight:600;color:var(--warn)}.debug-label{font-size:11px;color:var(--muted);font-weight:400}.player{display:grid;grid-template-columns:22px 1fr 60px 50px;align-items:center;gap:8px;padding:6px 0}.player .name{font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.player.you .name{color:var(--you)}.player .progress-track{position:relative;height:10px;background:var(--panel-2);border-radius:6px;overflow:hidden}.player .progress-fill{position:absolute;inset:0 auto 0 0;background:var(--accent);transition:width .1s linear}.player.you .progress-fill{background:var(--you)}.player.finished .progress-fill{background:var(--good)}.player.flagged .progress-fill{background:var(--bad)}.countdown{font-size:64px;font-weight:800;text-align:center;letter-spacing:4px}.phrase{font-family:JetBrains Mono,Consolas,Menlo,monospace;font-size:18px;line-height:1.55;background:var(--panel-2);padding:12px 14px;border-radius:6px;white-space:pre-wrap;word-break:break-word;-webkit-user-select:none;user-select:none}.phrase .ok{color:var(--good)}.phrase .bad{color:var(--bad);background:#f23f422e;border-radius:2px}.phrase .cursor{background:#5865f280;border-radius:2px}.phrase .pending{color:var(--muted)}textarea.typing{width:100%;min-height:64px;background:var(--panel-2);color:var(--text);border:1px solid var(--border);border-radius:6px;padding:10px;font-family:JetBrains Mono,Consolas,monospace;font-size:16px;resize:none}textarea.typing:focus{outline:2px solid var(--accent)}textarea.typing.flagged{outline-color:var(--bad)}.results-row{display:grid;grid-template-columns:28px 1fr 70px 70px 80px;align-items:center;gap:8px;padding:9px 4px;border-bottom:1px solid var(--border)}.results-row.flagged{opacity:.6}.results-row-head{padding:6px 4px;font-weight:700;color:var(--muted);font-size:12px;text-transform:uppercase;letter-spacing:.05em;border-bottom:2px solid var(--border)}.rank-1{color:gold;font-weight:800}.rank-2{color:silver;font-weight:700}.rank-3{color:#cd7f32;font-weight:700}.error-banner{background:#f23f4226;border:1px solid var(--bad);color:var(--bad);padding:8px;border-radius:6px;font-size:13px}.waiting-card{padding:12px;text-align:center;color:var(--good);font-weight:600;background:#23a5591a;border-radius:6px}.round-timer{font-variant-numeric:tabular-nums;font-weight:700;color:var(--muted);font-size:14px}.round-timer.urgent{color:var(--warn)}button.danger{background:transparent;color:var(--bad);border:1px solid var(--bad)}button.danger:hover{background:#f23f421a}.tabs{display:flex;gap:4px;background:var(--panel);border:1px solid var(--border);border-radius:8px;padding:4px}.tab-btn{flex:1;background:transparent;color:var(--muted);border:none;padding:7px 10px;font-size:13px;font-weight:600;border-radius:6px;cursor:pointer;transition:background .1s,color .1s}.tab-btn:hover:not([disabled]){background:var(--panel-2);color:var(--text)}.tab-btn.active{background:var(--accent);color:#fff}.tab-btn[disabled]{opacity:.35;cursor:not-allowed}.tab-group{display:flex;gap:4px}.tab-group .tab-btn{flex:none}.mode-select{display:flex;gap:4px}.mode-btn{background:var(--panel-2);color:var(--muted);border:1px solid var(--border);border-radius:6px;padding:5px 10px;font-size:12px;font-weight:600;cursor:pointer;transition:background .1s,color .1s}.mode-btn:hover{color:var(--text)}.mode-btn.active{background:var(--accent);color:#fff;border-color:var(--accent)}.mode-badge{font-size:12px;font-weight:700;color:var(--accent);background:#5865f226;padding:3px 8px;border-radius:4px;letter-spacing:.03em}.results-row.lb-row,.results-row-head.lb-row{grid-template-columns:28px 1fr 60px 60px 70px 1fr}.lb-name{font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.phrase-preview{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:12px}.results-row.multi-round,.results-row-head.multi-round{grid-template-columns:28px 1fr 70px 60px 60px 80px}.pb-badge{display:inline-block;margin-left:6px;font-size:11px;font-weight:700;color:gold}.recent-race-row{display:flex;flex-direction:column;gap:5px;padding:10px 4px;border-bottom:1px solid var(--border)}.recent-race-row:last-child{border-bottom:none}.recent-race-mode{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--accent);background:#5865f226;padding:2px 6px;border-radius:4px}.difficulty-badge{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;padding:2px 6px;border-radius:4px}.difficulty-badge.easy{color:var(--good);background:#23a55926}.difficulty-badge.medium{color:var(--warn);background:#f0b23226}.difficulty-badge.hard{color:var(--bad);background:#f23f4226}.difficulty-badge.futures_pro{color:#b48eff;background:#b48eff26}.diff-select{display:flex;gap:4px;flex-wrap:wrap}.diff-btn{background:var(--panel-2);color:var(--muted);border:1px solid var(--border);border-radius:6px;padding:5px 10px;font-size:12px;font-weight:600;cursor:pointer;transition:background .1s,color .1s,border-color .1s}.diff-btn:hover{color:var(--text)}.diff-btn.active.easy{background:#23a55933;color:var(--good);border-color:var(--good)}.diff-btn.active.medium{background:#f0b23233;color:var(--warn);border-color:var(--warn)}.diff-btn.active.hard{background:#f23f4233;color:var(--bad);border-color:var(--bad)}.diff-btn.active.futures_pro{background:#b48eff33;color:#b48eff;border-color:#b48eff}