:root{--bg: #120a1f;--ink: #f6f1ff;--muted: #b9aed0;--orange: #ff7a3d;--cyan: #3df2ff;--magenta: #ff3d9a;--panel: rgba(18, 10, 31, .86);--font: "Segoe UI", system-ui, -apple-system, Roboto, sans-serif;--display: "Arial Black", "Segoe UI Black", Impact, system-ui, sans-serif;--top-bar: 40px}html{font-size:clamp(13px,.6vw + 8px,22px);background:var(--bg);color-scheme:dark}*,*:before,*:after{box-sizing:border-box}body{margin:0;overflow:hidden;background:var(--bg);color:var(--ink);font-family:var(--font);line-height:1.35;-webkit-font-smoothing:antialiased;user-select:none;-webkit-user-select:none;touch-action:none}[hidden]{display:none!important}#game,#fx{position:fixed;inset:var(--top-bar) 0 0 0;width:100vw;height:calc(100vh - var(--top-bar));display:block;touch-action:none}#fx{pointer-events:none;z-index:5}#ui{position:fixed;inset:var(--top-bar) 0 0 0;pointer-events:none;z-index:10}.top-bar{position:fixed;top:0;left:0;right:0;z-index:60;height:var(--top-bar);display:flex;align-items:center;gap:16px;padding:0 max(16px,env(safe-area-inset-right)) 0 max(16px,env(safe-area-inset-left));background:#111827eb;color:#f9fafb;font:14px/1 system-ui,-apple-system,Segoe UI,Roboto,sans-serif}.top-bar-home{color:inherit;text-decoration:none;padding:6px 4px;border-radius:4px}.top-bar-home:hover{text-decoration:underline}.top-bar-home:focus-visible{outline:2px solid #f9fafb;outline-offset:2px}.top-bar-title{opacity:.6;letter-spacing:.08em;text-transform:uppercase;font-size:12px;color:inherit;text-decoration:none}.top-bar-title:hover{opacity:1;text-decoration:underline}.top-bar-title:focus-visible{outline:2px solid #f9fafb;outline-offset:2px}.overlay{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;pointer-events:auto;padding:16px max(16px,env(safe-area-inset-right)) max(16px,env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left))}.panel{background:var(--panel);border:1px solid rgba(255,255,255,.08);border-radius:14px;padding:20px 22px;width:min(440px,100%);max-height:100%;overflow:auto;box-shadow:0 20px 60px #00000080;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.panel h1{margin:0 0 4px;font-family:var(--display);font-size:2.2rem;letter-spacing:.04em;background:linear-gradient(90deg,var(--orange),var(--magenta) 60%,var(--cyan));-webkit-background-clip:text;background-clip:text;color:transparent}.panel h2{margin:0 0 10px;font-size:1.1rem}.panel p{margin:0 0 12px;color:var(--muted);font-size:.9rem}.tagline{color:var(--muted);margin:0 0 14px}label.field{display:block;font-size:.8rem;color:var(--muted);margin:10px 0 4px;letter-spacing:.06em;text-transform:uppercase}input[type=text]{width:100%;font:inherit;font-size:1.05rem;padding:10px 12px;border-radius:8px;border:1px solid rgba(255,255,255,.15);background:#00000059;color:var(--ink);user-select:text;-webkit-user-select:text}input[type=text]:focus{outline:2px solid var(--cyan);outline-offset:1px}input.code{text-transform:uppercase;letter-spacing:.4em;text-align:center;font-family:var(--display)}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;width:100%;margin-top:10px;padding:12px 16px;border-radius:10px;border:0;font:inherit;font-weight:700;font-size:1.05rem;letter-spacing:.04em;color:#120a1f;background:var(--orange);cursor:pointer;pointer-events:auto}.btn:hover{filter:brightness(1.08)}.btn:focus-visible{outline:2px solid var(--ink);outline-offset:2px}.btn.secondary{background:#ffffff1a;color:var(--ink)}.btn.cyan{background:var(--cyan)}.btn:disabled{opacity:.5;cursor:default}.row{display:flex;gap:10px}.row .btn{margin-top:10px}.keys{font-size:.78rem;color:var(--muted);margin-top:14px;line-height:1.7}kbd{display:inline-block;padding:1px 6px;border-radius:4px;background:#ffffff1f;border:1px solid rgba(255,255,255,.18);font:.75rem/1.4 ui-monospace,Menlo,monospace;color:var(--ink)}.settings{display:flex;align-items:center;gap:10px;font-size:.85rem;color:var(--muted);margin-top:12px}.settings input[type=range]{flex:1;accent-color:var(--cyan)}table.results{width:100%;border-collapse:collapse;font-size:.95rem;margin:6px 0 10px}table.results td,table.results th{padding:6px 4px;text-align:left;border-bottom:1px solid rgba(255,255,255,.07)}table.results th{color:var(--muted);font-weight:600;font-size:.75rem;letter-spacing:.06em;text-transform:uppercase}table.results tr.me td{color:var(--cyan);font-weight:700}table.results td.num{text-align:right;font-variant-numeric:tabular-nums}.place{display:inline-block;width:1.6em;font-family:var(--display)}.lobby-list{list-style:none;padding:0;margin:0 0 10px}.lobby-list li{display:flex;justify-content:space-between;padding:6px 0;border-bottom:1px solid rgba(255,255,255,.07)}.lobby-list .tag{color:var(--muted);font-size:.8rem}.code-big{font-family:var(--display);font-size:2rem;letter-spacing:.3em;text-align:center;margin:4px 0 10px;color:var(--cyan)}#hud{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none}.hud-speed{position:absolute;right:max(18px,env(safe-area-inset-right));bottom:max(14px,env(safe-area-inset-bottom));text-align:right;font-family:var(--display);line-height:1;text-shadow:0 2px 12px rgba(0,0,0,.6)}.hud-speed .num{font-size:clamp(2.4rem,6vw,4.2rem);font-variant-numeric:tabular-nums}.hud-speed .unit{font-size:.75rem;letter-spacing:.2em;color:var(--muted)}.hud-nitro{position:absolute;right:max(18px,env(safe-area-inset-right));bottom:calc(max(14px,env(safe-area-inset-bottom)) + clamp(3.6rem,8vw,5.6rem));display:flex;gap:4px;width:clamp(140px,22vw,240px);height:12px}.hud-nitro .seg{flex:1;background:#ffffff1f;border-radius:3px;overflow:hidden}.hud-nitro .seg i{display:block;height:100%;width:0;background:var(--cyan);transition:width .08s linear}.hud-nitro.boost .seg i{background:var(--orange)}.hud-chain{position:absolute;right:max(18px,env(safe-area-inset-right));bottom:calc(max(14px,env(safe-area-inset-bottom)) + clamp(3.6rem,8vw,5.6rem) + 18px);font-family:var(--display);color:var(--orange);font-size:1.1rem;opacity:0;transition:opacity .15s}.hud-chain.on{opacity:1}.hud-lap{position:absolute;left:max(18px,env(safe-area-inset-left));top:14px;font-family:var(--display);font-size:1.2rem;text-shadow:0 2px 10px rgba(0,0,0,.6)}.hud-lap .pos{font-size:2rem;color:var(--orange);display:block}.hud-lap .pos sup{font-size:.9rem}.hud-time{position:absolute;left:50%;top:12px;transform:translate(-50%);font:700 .95rem ui-monospace,Menlo,monospace;color:var(--muted)}.hud-center{position:absolute;left:50%;top:36%;transform:translate(-50%,-50%);font-family:var(--display);font-size:clamp(3rem,12vw,8rem);color:var(--ink);text-shadow:0 0 30px rgba(61,242,255,.6),0 4px 20px rgba(0,0,0,.6);opacity:0;pointer-events:none}.hud-center.pop{animation:pop .9s ease-out}@keyframes pop{0%{opacity:0;transform:translate(-50%,-50%) scale(1.6)}15%{opacity:1;transform:translate(-50%,-50%) scale(1)}80%{opacity:1}to{opacity:0;transform:translate(-50%,-50%) scale(.9)}}#toasts{position:absolute;left:50%;top:56%;transform:translate(-50%);display:flex;flex-direction:column;align-items:center;gap:4px;pointer-events:none}.toast{font-family:var(--display);font-size:clamp(1rem,3vw,1.6rem);letter-spacing:.08em;color:var(--cyan);text-shadow:0 2px 14px rgba(0,0,0,.7);animation:toast 1.2s ease-out forwards}.toast.orange{color:var(--orange)}.toast.magenta{color:var(--magenta)}@keyframes toast{0%{opacity:0;transform:translateY(12px) scale(.8)}15%{opacity:1;transform:translateY(0) scale(1.05)}70%{opacity:1}to{opacity:0;transform:translateY(-16px)}}.hud-map{position:absolute;right:max(18px,env(safe-area-inset-right));top:12px;width:120px;height:120px;opacity:.85}.hud-hint{position:absolute;left:50%;bottom:max(12px,env(safe-area-inset-bottom));transform:translate(-50%);font-size:.78rem;color:var(--muted);white-space:nowrap;text-shadow:0 1px 6px rgba(0,0,0,.8)}.hud-vignette{position:absolute;top:0;right:0;bottom:0;left:0;background:radial-gradient(ellipse at center,#0000 55%,#ff28288c);opacity:0;transition:opacity .1s}#touch{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:auto;touch-action:none}.tbtn{position:absolute;display:flex;align-items:center;justify-content:center;border-radius:50%;background:#ffffff1a;border:2px solid rgba(255,255,255,.25);color:#ffffffd9;font:700 .9rem var(--font);letter-spacing:.06em;width:68px;height:68px}.tbtn.down{background:#3df2ff59;border-color:var(--cyan)}.tb-left{left:max(14px,env(safe-area-inset-left));bottom:max(22px,env(safe-area-inset-bottom));width:84px;height:84px;font-size:1.6rem}.tb-right{left:calc(max(14px,env(safe-area-inset-left)) + 100px);bottom:max(22px,env(safe-area-inset-bottom));width:84px;height:84px;font-size:1.6rem}.tb-nitro{right:calc(max(14px,env(safe-area-inset-right)) + 200px);bottom:max(22px,env(safe-area-inset-bottom));width:92px;height:92px;background:#ff7a3d38;border-color:#ff7a3db3}.tb-nitro.down{background:#ff7a3d99}.tb-drift{right:calc(max(14px,env(safe-area-inset-right)) + 110px);bottom:calc(max(22px,env(safe-area-inset-bottom)) + 60px)}.tb-brake{right:calc(max(14px,env(safe-area-inset-right)) + 110px);bottom:max(22px,env(safe-area-inset-bottom));width:60px;height:60px;font-size:.7rem}.tb-trick{right:calc(max(14px,env(safe-area-inset-right)) + 290px);bottom:calc(max(22px,env(safe-area-inset-bottom)) + 70px);width:58px;height:58px;font-size:.7rem}.tb-recentre{display:none;left:max(14px,env(safe-area-inset-left));bottom:calc(max(22px,env(safe-area-inset-bottom)) + 100px);width:58px;height:58px;font-size:.62rem}#touch.tilt-on .tb-left,#touch.tilt-on .tb-right{display:none}#touch.tilt-on .tb-recentre{display:flex}.settings.tilt{flex-wrap:wrap}.settings.tilt label{display:inline-flex;align-items:center;gap:6px}.settings.tilt select{font:inherit;background:#00000059;color:var(--ink);border:1px solid rgba(255,255,255,.15);border-radius:6px;padding:4px 6px}.settings.tilt input[type=checkbox]{accent-color:var(--cyan);width:18px;height:18px}.tilt-status{color:var(--cyan);font-size:.78rem}.rotate-hint{display:none;position:absolute;top:0;right:0;bottom:0;left:0;align-items:center;justify-content:center;background:var(--bg);font-size:1.2rem;pointer-events:auto}@media(pointer:coarse)and (orientation:portrait){.rotate-hint{display:flex}}.noscript{padding:40px;text-align:center}.speaker{position:absolute;top:10px;left:50%;transform:translate(60px);pointer-events:auto;background:#00000059;border:1px solid rgba(255,255,255,.15);color:var(--ink);border-radius:8px;width:34px;height:30px;cursor:pointer}