:root{--bg: #0f1419;--bg-elev: #1a2129;--fg: #e6edf3;--fg-muted: #8b949e;--accent: #f7c948;--accent-strong: #e0a800;--border: #30363d;--danger: #f85149;--success: #3fb950}*{box-sizing:border-box}html,body,#root{margin:0;padding:0;height:100%}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,sans-serif;background:var(--bg);color:var(--fg);line-height:1.5}.app{display:flex;flex-direction:column;min-height:100vh}.app-header{display:flex;align-items:center;justify-content:space-between;padding:1rem 2rem;background:var(--bg-elev);border-bottom:1px solid var(--border)}.brand{font-weight:700;color:var(--accent);text-decoration:none;font-size:1.25rem}.app-main{flex:1;padding:2rem;max-width:960px;margin:0 auto;width:100%}.app-footer{padding:1rem 2rem;text-align:center;color:var(--fg-muted);border-top:1px solid var(--border)}.hero h1{font-size:2.5rem;margin-bottom:1rem;color:var(--accent)}.hero p{font-size:1.1rem;margin-bottom:1rem}.cta{display:inline-block;padding:.75rem 1.5rem;background:var(--accent);color:var(--bg);font-weight:600;text-decoration:none;border-radius:6px;transition:background .2s}.cta:hover{background:var(--accent-strong)}.status{margin-top:2rem;display:flex;gap:.75rem;align-items:center}.badge{display:inline-block;padding:.25rem .75rem;background:var(--accent);color:var(--bg);border-radius:12px;font-size:.85rem;font-weight:600}.muted{color:var(--fg-muted)}.placeholder{padding:2rem;background:var(--bg-elev);border:1px solid var(--border);border-radius:8px;text-align:center}.form-page{max-width:400px;margin:2rem auto;background:var(--bg-elev);border:1px solid var(--border);border-radius:8px;padding:2rem}.form-page h2{margin-top:0}.field{display:block;margin-bottom:1rem}.field span{display:block;margin-bottom:.35rem;color:var(--fg-muted);font-size:.9rem}.field input{width:100%;padding:.6rem .75rem;background:var(--bg);color:var(--fg);border:1px solid var(--border);border-radius:6px;font-size:1rem}.field input:focus{outline:2px solid var(--accent);outline-offset:-1px}.error{padding:.6rem .75rem;margin-bottom:1rem;background:#f8514926;border:1px solid var(--danger);border-radius:6px;color:var(--danger);font-size:.9rem}.btn-primary,.btn-secondary{padding:.6rem 1.25rem;border:none;border-radius:6px;font-size:1rem;font-weight:600;cursor:pointer;transition:background .2s}.btn-primary{background:var(--accent);color:var(--bg)}.btn-primary:hover:not(:disabled){background:var(--accent-strong)}.btn-primary:disabled{opacity:.6;cursor:not-allowed}.btn-secondary{background:transparent;color:var(--fg);border:1px solid var(--border)}.btn-secondary:hover{border-color:var(--accent);color:var(--accent)}.link-button{background:none;border:none;color:var(--fg);font:inherit;cursor:pointer;margin-left:1.5rem}.link-button:hover{color:var(--accent)}.app-header nav a{margin-left:1.5rem;color:var(--fg);text-decoration:none}.app-header nav a:hover,.app-header nav a.active{color:var(--accent)}@media (max-width: 760px){.app-header{flex-wrap:wrap;gap:.5rem;padding:.75rem 16px}.app-header nav{display:flex;flex-wrap:wrap;gap:.4rem 1rem}.app-header nav a{margin-left:0}}.profile-page h2{margin-top:0}.profile-card{background:var(--bg-elev);border:1px solid var(--border);border-radius:8px;padding:1.5rem;margin:1rem 0;display:grid;grid-template-columns:auto 1fr;gap:.5rem 1.5rem}.profile-card dt{color:var(--fg-muted)}.profile-card dd{margin:0}.tracks-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:1rem}.track-card{background:var(--bg-elev);border:1px solid var(--border);border-radius:8px;padding:1.25rem;display:flex;flex-direction:column;gap:.5rem}.track-card h3{margin:0}.track-city{color:var(--accent);font-size:.85rem;font-weight:600;text-transform:uppercase;letter-spacing:.05em}.track-desc{color:var(--fg-muted);flex:1}.track-meta{color:var(--fg-muted);font-size:.85rem}.track-error{padding:1rem;background:var(--bg-elev);border:1px solid var(--danger);border-radius:8px;color:var(--danger)}.empty-state{padding:2rem;text-align:center;color:var(--fg-muted);background:var(--bg-elev);border:1px dashed var(--border);border-radius:8px}.play-page{position:fixed;top:0;right:0;bottom:0;left:0;z-index:10;background:var(--bg)}.split-view{position:absolute;pointer-events:none;box-shadow:inset 0 0 0 1px #000000b3}.game-canvas{display:block;width:100%;height:100%}.hud{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;display:flex;flex-direction:column;justify-content:space-between;padding:1rem 1.25rem;font-variant-numeric:tabular-nums}.hud-top,.hud-bottom{display:flex;justify-content:space-between;align-items:flex-start}.hud-timer{font-size:2rem;font-weight:700;color:var(--accent);text-shadow:0 2px 8px rgba(0,0,0,.8)}.hud-laps{font-size:1.25rem;font-weight:600;background:#0f1419b3;padding:.35rem .9rem;border-radius:8px}.hud-best{background:#0f1419b3;padding:.3rem .8rem;border-radius:8px;font-size:.95rem}.hud-items{display:flex;align-items:flex-end;gap:.4rem;margin-top:.5rem}.hud-slot{width:64px;height:64px;display:grid;place-items:center;font-size:1.8rem;background:#0f1419bf;border:2px solid rgba(255,255,255,.35);border-radius:12px;overflow:hidden}.hud-slot.second{width:42px;height:42px;font-size:1.1rem;opacity:.85}.hud-slot.spinning{border-color:#ffd23f;box-shadow:0 0 12px #ffd23fb3}.hud-slot-extra{background:#0f1419bf;padding:.2rem .5rem;border-radius:8px;font-weight:700}.hud-fog{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;background:radial-gradient(circle at 50% 60%,#dcdce699,#aaaab9f2)}.hud-coins{margin-top:.5rem;display:inline-block;background:#0f1419b3;color:#ffd23f;padding:.3rem .8rem;border-radius:8px;font-weight:700}.hud-track{color:var(--fg-muted);font-size:.9rem}.hud-countdown{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;font-size:7rem;font-weight:800;color:var(--accent);text-shadow:0 4px 24px rgba(0,0,0,.9);animation:countdown-pop 1s ease-out infinite}@keyframes countdown-pop{0%{transform:scale(1.4);opacity:1}to{transform:scale(.9);opacity:.6}}.hud-offtrack{position:absolute;top:30%;left:50%;transform:translate(-50%);background:#f7c948eb;color:var(--bg);font-weight:700;padding:.6rem 1.4rem;border-radius:8px;animation:blink .6s step-end infinite}.hud-wrongway{position:absolute;top:18%;left:50%;transform:translate(-50%);display:flex;flex-direction:column;align-items:center;gap:.3rem;background:#dc2626e6;color:#fff;font-weight:800;font-size:1.3rem;padding:.6rem 1.4rem;border-radius:10px;animation:blink .8s step-end infinite}.hud-wrongway-arrow{font-size:3rem;line-height:1;transition:transform .15s linear}@keyframes blink{50%{opacity:.4}}.hud-paused{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;align-items:center;justify-content:center;background:#0f1419d9;pointer-events:auto}.hud-paused h3{font-size:3rem;margin:0;color:var(--accent)}.hud-finished{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;align-items:center;justify-content:safe center;overflow-y:auto;padding:1.5rem 16px 0;gap:1rem;background:#0f1419e6;pointer-events:auto;text-align:center}.hud-finished h2{font-size:2.5rem;margin:0;color:var(--accent)}.finish-stats{display:grid;grid-template-columns:auto auto;gap:.4rem 1.5rem;background:var(--bg-elev);border:1px solid var(--border);padding:1.25rem 2rem;border-radius:8px}.finish-stats dt{color:var(--fg-muted);text-align:right}.finish-stats dd{margin:0;font-weight:700;font-size:1.15rem;text-align:left;font-variant-numeric:tabular-nums}.finish-saved{color:var(--success)}.finish-error{color:var(--danger)}.finish-actions{display:flex;flex-wrap:wrap;justify-content:center;gap:.75rem}.hud-finished .finish-actions{position:sticky;bottom:0;width:100%;padding:.75rem 0 1rem;background:#0f1419f2}.placeholder h2{margin-top:0}code{font-family:SFMono-Regular,Consolas,Liberation Mono,Menlo,monospace;background:var(--bg-elev);padding:.1rem .4rem;border-radius:3px;font-size:.9em}.lb-header{display:flex;align-items:baseline;justify-content:space-between;gap:1rem;margin-bottom:1rem}.lb-table{width:100%;border-collapse:collapse;background:var(--bg-elev);border:1px solid var(--border);border-radius:8px;overflow:hidden}.lb-table th,.lb-table td{padding:.6rem .9rem;text-align:left;border-bottom:1px solid var(--border)}.lb-table thead th{font-size:.8rem;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);background:#ffffff05}.lb-table tbody tr:last-child td{border-bottom:none}.lb-rank{width:2.5rem;font-weight:700}.lb-time{font-weight:600;color:var(--accent);font-variant-numeric:tabular-nums}.lb-date{color:var(--muted);font-size:.9em}.lb-me{background:#f7c94814;outline:1px solid rgba(247,201,72,.35)}.finish-rank{font-size:1.2rem;font-weight:800;color:var(--accent);margin:.25rem 0}.track-actions{display:flex;align-items:center;gap:.9rem}.link-muted{color:var(--muted);font-size:.9rem;text-decoration:underline}.link-muted:hover{color:var(--text)}.modes-page{width:100%;max-width:980px;display:grid;gap:1rem}.modes-tabs,.modes-options{display:flex;flex-wrap:wrap;gap:.6rem;align-items:flex-end}.modes-options label{display:grid;gap:.2rem}.cups-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:.8rem}.cup-card{background:#0f1419b3;border:1px solid rgba(255,255,255,.12);border-radius:12px;padding:.8rem;display:grid;gap:.4rem}.cup-card.locked{opacity:.55}.cup-card ol{margin:0;padding-left:1.2rem;font-size:.9rem}.vs-tracks{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:.3rem;border-radius:10px}.battle-modes{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:.6rem}.battle-mode{display:grid;gap:.2rem;padding:.6rem;border-radius:10px;border:1px solid rgba(255,255,255,.15);cursor:pointer}.battle-mode.selected{border-color:#ffd23f}.hud-battle{position:absolute;top:60px;left:50%;transform:translate(-50%);display:flex;gap:.8rem;align-items:center;background:#0f1419bf;padding:.3rem .9rem;border-radius:999px;font-weight:700;pointer-events:none}.hud-battle-out{color:#ff4757}.series-table{width:100%;border-collapse:collapse;margin:.5rem 0}.series-table td,.series-table th{padding:.2rem .5rem;text-align:left}.series-table tr.me{background:#ffd23f2e;font-weight:700}.series-trophy{font-size:1.3rem;font-weight:700}.unlock-toast{position:absolute;bottom:90px;left:50%;transform:translate(-50%);background:#0f1419d9;border:1px solid #ffd23f;padding:.5rem 1rem;border-radius:999px;font-weight:700;z-index:5;animation:unlock-toast 6s ease forwards}@keyframes unlock-toast{0%,85%{opacity:1}to{opacity:0}}.garage-page{width:100%;max-width:1080px;display:grid;grid-template-columns:minmax(280px,420px) 1fr;gap:1.2rem;align-items:start}@media (max-width: 760px){.garage-page{grid-template-columns:1fr}}.garage-preview{width:100%;aspect-ratio:4 / 3;border-radius:14px;background:radial-gradient(circle at 50% 40%,#2d3a4a,#0f1419);display:block}.garage-stats{display:grid;gap:.3rem;margin-top:.8rem}.stat-row{display:grid;grid-template-columns:7.5rem 1fr 2.2rem;gap:.5rem;align-items:center;font-size:.9rem}.stat-bar{height:10px;border-radius:999px;background:#ffffff1a;overflow:hidden}.stat-bar>span{display:block;height:100%;background:linear-gradient(90deg,#ffd23f,#ff6b35);transition:width .25s ease}.garage-picks{display:grid;gap:1rem}.garage-picks fieldset{border:1px solid rgba(255,255,255,.12);border-radius:12px;padding:.6rem}.pick-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:.4rem}.pick-grid button{font-size:.85rem;padding:.45rem}.pick-grid button[aria-pressed=true]{outline:2px solid #ffd23f}.pick-weight{font-size:.72rem;opacity:.7;display:block}.modes-driver{display:flex;flex-wrap:wrap;gap:.6rem;align-items:flex-end}.hud-position{position:absolute;right:24px;bottom:72px;font-size:4.2rem;font-weight:900;font-style:italic;line-height:1;-webkit-text-stroke:2px rgba(0,0,0,.75);text-shadow:0 4px 14px rgba(0,0,0,.7)}.hud-position small{font-size:1.3rem;-webkit-text-stroke:0;opacity:.85}.hud-position.flash{animation:pos-flash .6s ease-out}@keyframes pos-flash{0%{transform:scale(1.6);filter:brightness(1.8)}to{transform:scale(1);filter:none}}.hud-minimap{position:absolute;top:20px;right:20px;background:#00000073;border-radius:50%;border:2px solid rgba(255,255,255,.2);pointer-events:none}.hud-lights{position:absolute;top:22%;left:50%;transform:translate(-50%);display:flex;gap:.7rem;align-items:center;background:#0a0c10d9;padding:.7rem 1rem;border-radius:18px;flex-wrap:wrap;justify-content:center}.hud-lights .light{width:44px;height:44px;border-radius:50%;background:#2d1a1a;box-shadow:inset 0 0 8px #000c}.hud-lights .light.on{background:#ff3b30;box-shadow:0 0 18px #ff3b30}.hud-lights .light.go{background:#2ecc71;box-shadow:0 0 22px #2ecc71}.hud-rocket-hint,.hud-go{flex-basis:100%;text-align:center;font-weight:800}.hud-rocket-hint{color:#ffd23f;font-size:.95rem;animation:blink .4s step-end infinite}.hud-go{color:#2ecc71;font-size:2.4rem}.hud-banner{position:absolute;top:38%;left:50%;transform:translate(-50%);font-size:2.6rem;font-weight:900;font-style:italic;color:#ff4757;-webkit-text-stroke:1.5px #fff;animation:banner-slide 3s ease-out forwards;white-space:nowrap}@keyframes banner-slide{0%{transform:translate(80vw)}15%,80%{transform:translate(-50%)}to{transform:translate(-120vw)}}.hud-incoming{position:absolute;bottom:30%;left:50%;transform:translate(-50%);background:#ff4757eb;color:#fff;font-weight:800;padding:.5rem 1.2rem;border-radius:999px;animation:blink .35s step-end infinite}.hud-callout{position:absolute;top:48%;left:50%;transform:translate(-50%);font-size:1.6rem;font-weight:900;color:#ffd23f;text-shadow:0 2px 10px rgba(0,0,0,.8)}.hud-callout.purple{color:#c56cf0}.hud-lookback,.hud-replay{position:absolute;top:70px;left:50%;transform:translate(-50%);background:#0f1419bf;padding:.25rem .8rem;border-radius:999px;font-weight:700}.hud-replay{top:14px;color:#ff4757;letter-spacing:.1em}.hud-help-btn{position:absolute;bottom:20px;right:20px;width:40px;height:40px;border-radius:50%;background:#0009;color:#fff;border:1px solid #666;font-size:1.2rem;pointer-events:auto;z-index:100;padding:0}.hud-help{position:absolute;top:0;right:0;bottom:0;left:0;background:#000c;display:flex;align-items:center;justify-content:center;z-index:200;pointer-events:auto}.hud-help-card{background:#222;padding:2rem;border-radius:8px;border:1px solid #444;max-width:min(92vw,520px)}.hud-help-card ul{list-style:none;padding:0;line-height:2}.hud-help-card kbd{background:#444;padding:2px 6px;border-radius:4px}.finish-standings{margin:1rem 0 1.5rem;background:#0006;padding:1rem;border-radius:8px}.finish-standings h3{margin:0 0 .5rem;text-align:center;color:#ffb142}.finish-standings ol{list-style:none;margin:0;padding:0}@media (min-width: 600px){.finish-standings ol{columns:2;column-gap:2rem}.finish-standings li{break-inside:avoid}}.finish-standings li{display:flex;justify-content:space-between;padding:.25rem 0;border-bottom:1px solid rgba(255,255,255,.1);color:#ccc}.finish-standings li.me{color:#fff;font-weight:700}.finish-standings .winner{color:#2ecc71}.podium-canvas{width:100%;aspect-ratio:2 / 1;display:block;border-radius:12px;background:radial-gradient(circle at 50% 30%,#3a4a5f,#10151c);margin:.5rem 0}.replay-exit{position:absolute;bottom:24px;left:50%;transform:translate(-50%);z-index:150}.settings-page{width:100%;max-width:620px;display:grid;gap:1rem}.settings-page fieldset{border:1px solid rgba(255,255,255,.12);border-radius:12px;padding:.8rem 1rem;display:grid;gap:.6rem}.settings-row{display:grid;grid-template-columns:6rem 1fr 3.5rem;gap:.6rem;align-items:center}.settings-check{display:flex;gap:.5rem;align-items:center}.online-page{width:100%;max-width:980px;display:grid;gap:1rem}.online-join,.online-join form,.vote-options{display:flex;flex-wrap:wrap;gap:.6rem;align-items:flex-end}.online-join label,.online-rules label{display:grid;gap:.2rem}.room-code{font-size:1.2em;letter-spacing:.12em}.online-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:1rem;align-items:start}.online-players{margin:0;padding-left:1.2rem}.online-players .gone{opacity:.5}.online-rules{display:flex;flex-wrap:wrap;gap:.6rem;border-radius:10px}.embed-exit{position:absolute;top:.6rem;right:.6rem;z-index:150;width:2.6rem;height:2.6rem;border-radius:50%;background:#0000008c;color:#fff;font-size:1.1rem}.embed-wait{position:absolute;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;color:#fff}.pause-menu{position:absolute;top:0;right:0;bottom:0;left:0;z-index:200;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1rem;background:#000c;color:#fff}.pause-menu h2{font-size:3rem;margin:0}.pause-note{margin:0;opacity:.85}.pause-options{display:flex;flex-direction:column;gap:.75rem;min-width:min(280px,calc(100vw - 32px))}.pause-options .cta:focus-visible,.pause-options .cta:focus{outline:3px solid #fff;outline-offset:3px}.pause-secondary{background:#555}