:root{--bg:#0b1a2a;--bg2:#13263a;--fg:#f2f5f7;--muted:#9fb0bf;--accent:#ffb703;--accent2:#2a9d4b;--danger:#d7301f;--warn:#f59e0b;--radius:12px;--sat:env(safe-area-inset-top,0px);--sab:env(safe-area-inset-bottom,0px);--sal:env(safe-area-inset-left,0px);--sar:env(safe-area-inset-right,0px);--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}*{box-sizing:border-box}html,body{background:var(--bg);height:100%;color:var(--fg);overscroll-behavior:none;margin:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;font-size:16px;line-height:1.45}body{touch-action:none;-webkit-user-select:none;user-select:none;position:fixed;inset:0;overflow:hidden}#app{position:absolute;inset:0}button{font:inherit}a{color:var(--accent)}h1{margin:0 0 .5rem;font-size:1.8rem;line-height:1.15}h2{margin:1.2rem 0 .4rem;font-size:1.15rem}p{margin:.4rem 0}.muted{color:var(--muted)}.small{font-size:.85rem}.row{flex-wrap:wrap;gap:.8rem;margin-top:1rem;display:flex}.screen{-webkit-overflow-scrolling:touch;touch-action:pan-y;padding:calc(1.2rem + var(--sat)) calc(1.2rem + var(--sar)) calc(1.5rem + var(--sab)) calc(1.2rem + var(--sal));-webkit-user-select:text;user-select:text;background:linear-gradient(#0b1a2a 0%,#15304a 60%,#1f4a5c 100%);position:absolute;inset:0;overflow:auto}.screen.menu{text-align:center;flex-direction:column;justify-content:center;align-items:center;display:flex}.title{letter-spacing:-.02em;margin:0;font-size:clamp(2.4rem,8vw,4.2rem)}.title span{color:var(--accent);display:block}.tagline{max-width:32rem;color:var(--muted);margin:.8rem 0 1.6rem}.menu-buttons{flex-direction:column;gap:.7rem;width:min(100%,22rem);display:flex}.footer{max-width:30rem;margin-top:2rem}.btn{border-radius:var(--radius);color:var(--fg);cursor:pointer;text-align:center;background:#ffffff14;border:1px solid #ffffff2e;min-height:48px;padding:.7rem 1.2rem;display:inline-block}.btn:hover{background:#ffffff24}.btn.primary{background:var(--accent);color:#1a1200;border-color:#0000;font-weight:700}.btn.primary:hover{background:#ffc733}.btn.ghost{background:0 0}.btn.big{padding:.9rem 1.6rem;font-size:1.2rem}.btn.small{min-height:36px;padding:.3rem .7rem;font-size:.9rem}.btn.active{background:var(--accent);color:#1a1200}.btn:disabled{opacity:.5;cursor:default}.link{color:var(--accent);cursor:pointer;background:0 0;border:none;padding:0;text-decoration:underline}.check{align-items:center;gap:.5rem;margin:.6rem 0;display:flex}.check input{width:1.2rem;height:1.2rem}.hint{border-left:3px solid var(--accent);background:#ffb7031f;border-radius:6px;padding:.5rem .8rem}.levels{max-width:40rem;margin:0 auto}.level-list{flex-direction:column;gap:.6rem;margin:1rem 0;padding:0;list-style:none;display:flex}.level-list button{border-radius:var(--radius);width:100%;color:var(--fg);text-align:left;cursor:pointer;background:#ffffff0f;border:1px solid #ffffff26;align-items:center;gap:.9rem;min-height:56px;padding:.7rem .9rem;display:flex}.level-list button:hover:not(:disabled){background:#ffffff1f}.level-list .locked button{opacity:.5;cursor:default}.level-index{background:var(--accent);color:#1a1200;border-radius:50%;flex:none;place-items:center;width:2rem;height:2rem;font-weight:700;display:grid}.level-name{flex-direction:column;flex:1;display:flex}.level-name small{color:var(--muted)}.level-stars{color:#ffffff4d;flex-direction:column;align-items:center;display:flex}.level-stars i,.stars span{color:#ffffff40;font-size:1.1rem;font-style:normal}.level-stars i.on,.stars span.on{color:var(--accent)}.level-stars small{color:var(--muted)}.intro{flex-direction:column;justify-content:center;max-width:36rem;margin:0 auto;display:flex}.lead{font-size:1.05rem}.goal{border-left:3px solid var(--accent2);background:#2a9d4b2e;border-radius:6px;padding:.5rem .8rem}.form{max-width:34rem;margin:0 auto}.form label:not(.check){margin:.8rem 0;display:block}.form label output{float:right;color:var(--muted)}.form input[type=range]{width:100%;margin-top:.3rem}.form select{background:var(--bg2);color:var(--fg);border:1px solid #fff3;border-radius:8px;margin-top:.3rem;padding:.5rem;display:block}.keys th{text-align:left;color:var(--muted);vertical-align:top;padding-right:.8rem}.keys td{padding-bottom:.4rem}.prose{max-width:40rem;margin:0 auto}.figure{width:100%;max-width:30rem;color:var(--muted);background:#ffffff0d;border-radius:8px;margin:.8rem auto;padding:.4rem;display:block}.figure text{fill:var(--fg)}.game-container{position:absolute;inset:0}.game{background:#000;position:absolute;inset:0}.game-canvas{width:100%;height:100%;display:block;position:absolute;inset:0}.hud{pointer-events:none;font-variant-numeric:tabular-nums;position:absolute;inset:0}.hud-top{top:var(--sat);left:var(--sal);right:var(--sar);align-items:center;gap:.6rem;padding:.5rem .6rem;display:flex;position:absolute}.hud-title{text-shadow:0 1px 3px #000000b3;flex:1;font-size:.95rem;font-weight:600}.hud-time{text-shadow:0 1px 3px #000000b3;background:#00000059;border-radius:8px;padding:.2rem .6rem;font-size:1.1rem;font-weight:700}.hud-btn{pointer-events:auto;color:#fff;cursor:pointer;background:#00000073;border:1px solid #ffffff4d;border-radius:10px;min-width:48px;min-height:48px;font-weight:700}.hud-map{font-size:.8rem}.hud-toast{opacity:0;text-align:center;background:#0009;border-radius:10px;max-width:90%;padding:.5rem 1rem;font-weight:600;transition:opacity .2s;position:absolute;top:28%;left:50%;transform:translate(-50%)}.hud-toast.show{opacity:1}.hud-toast.good{background:#2a9d4bd9}.hud-toast.bad{background:#d7301fd9}.hud-bottom{bottom:calc(.6rem + var(--sab));left:calc(.6rem + var(--sal));right:calc(.6rem + var(--sar));justify-content:space-between;align-items:flex-end;gap:.6rem;display:flex;position:absolute}.hud-speedo{text-align:center;background:#00000073;border-radius:14px;min-width:11rem;padding:.4rem 1rem .5rem;position:relative}.hud-speed{font-size:2.6rem;font-weight:800;line-height:1}.hud-speed-unit{color:var(--muted);margin-left:.3rem;font-size:.9rem;font-weight:400}.hud-target{color:var(--muted);margin-top:.1rem;font-size:.95rem}.hud-target b{color:var(--fg)}.hud-advice{margin-left:.3rem;font-weight:700}.hud-advice.ok{color:var(--accent2)}.hud-advice.slow{color:var(--warn)}.hud-advice.fast{color:#7bdff2}.hud-speedbar{background:#ffffff26;border-radius:3px;height:6px;margin-top:.4rem;position:relative}.hud-speedbar-fill{background:var(--fg);border-radius:3px;width:0;height:100%}.hud-speedbar-target{background:var(--accent);border-radius:2px;width:3px;height:14px;position:absolute;top:-4px;transform:translate(-50%)}.hud-assist{color:var(--warn);margin-top:.2rem;font-size:.75rem}.hud-blink{color:#ffffff26;font-size:1.2rem;position:absolute;top:.5rem}.hud-blink.on{color:var(--accent)}.hud-blink-l{left:.5rem}.hud-blink-r{right:.5rem}.hud-gauge{background:#00000073;border-radius:14px;flex-direction:column;align-items:center;gap:.2rem;padding:.5rem .7rem;display:flex}.hud-gauge-bar{background:#ffffff26;border-radius:9px;align-items:flex-end;width:18px;height:70px;display:flex;overflow:hidden}.hud-gauge-fill{background:var(--accent2);width:100%;height:0;transition:height .15s}.hud-gauge-fill.red{background:var(--danger)}.hud-gauge-fill.orange{background:var(--warn)}.hud-gauge-fill.free{background:#ffffff4d}.hud-gauge-text{font-size:.95rem;font-weight:700}.hud-gauge-label{color:var(--muted);font-size:.75rem}.hud-counters{text-align:right;background:#00000073;border-radius:14px;padding:.5rem .8rem;font-size:.9rem}.hud-counters b{font-size:1.1rem}.minimap{top:calc(3.6rem + var(--sat));right:calc(.6rem + var(--sar));pointer-events:none;background:#00000080;border-radius:10px;position:absolute}.minimap[hidden]{display:none}.spacetime-live{left:calc(.6rem + var(--sal));top:calc(3.6rem + var(--sat));opacity:.92;pointer-events:none;border-radius:10px;position:absolute}.hud-touch{pointer-events:none;grid-template-columns:1fr auto 1fr;height:34%;display:grid;position:absolute;inset:auto 0 0}.hud.touch .hud-bottom{bottom:calc(34% + .4rem)}.hud.touch .hud-speedo{min-width:8rem;padding:.3rem .6rem .4rem}.hud.touch .hud-speed{font-size:1.8rem}.hud.touch .hud-gauge-bar{height:50px}.hud.touch .hud-counters{padding:.4rem .5rem;font-size:.75rem}.hud.touch .hud-gauge-text{white-space:nowrap;font-size:.8rem}@media (orientation:portrait){.hud.touch .hud-title{visibility:hidden}}.hud-touch[hidden]{display:none}.hud-pedal{pointer-events:auto;margin:0 .4rem calc(.4rem + var(--sab));letter-spacing:.1em;color:#fff9;touch-action:none;background:#ffffff14;border:2px solid #ffffff40;border-radius:16px;justify-content:center;align-items:flex-start;padding-top:.5rem;font-weight:800;display:flex;position:relative;overflow:hidden}.hud-pedal-level{background:#ffffff2e;height:0;position:absolute;bottom:0;left:0;right:0}.hud-pedal-brake.active{border-color:var(--danger)}.hud-pedal-throttle.active{border-color:var(--accent2)}.hud-pedal span{z-index:1}.hud-lanes{flex-direction:column;justify-content:center;gap:.5rem;display:flex}.hud-lanes .hud-btn{width:56px;height:56px;font-size:1.3rem}@media (orientation:landscape) and (max-height:500px){.hud-touch{grid-template-columns:30% 1fr 30%;height:55%}.hud-lanes{padding-bottom:calc(.4rem + var(--sab));flex-direction:row;align-items:flex-end}.hud.touch .hud-bottom{bottom:calc(.4rem + var(--sab));justify-content:center;left:32%;right:32%}.hud.touch .hud-gauge,.hud.touch .hud-counters{display:none}.minimap{top:calc(3.2rem + var(--sat))}}@media (orientation:portrait){.minimap{top:calc(7.8rem + var(--sat));left:50%;right:auto;transform:translate(-50%)}}@media (max-width:700px){.hud-speedo{min-width:9rem;padding:.3rem .7rem .4rem}.hud-speed{font-size:2rem}.hud-counters{font-size:.8rem}}.tutorial-box{top:calc(4rem + var(--sat));border:1px solid var(--accent);z-index:5;background:#0b1a2aeb;border-radius:12px;flex-direction:column;gap:.3rem;width:min(92%,34rem);padding:.7rem 1rem;font-size:1rem;display:flex;position:absolute;left:50%;transform:translate(-50%)}.tutorial-box .link{align-self:flex-end;font-size:.85rem}.overlay{z-index:10;background:#0009;place-items:center;display:grid;position:absolute;inset:0}.dialog{background:var(--bg2);text-align:center;border-radius:16px;flex-direction:column;gap:.7rem;width:min(90%,20rem);padding:1.5rem;display:flex}.dialog h2{margin:0 0 .5rem}.end{max-width:46rem;margin:0 auto}.end-head{flex-wrap:wrap;align-items:center;gap:1rem;display:flex}.end-head h1{margin:0}.end-head>div:first-child{flex:1}.stars span{font-size:2rem}.score{font-size:1.1rem}.score b{font-size:2rem}.badge{background:var(--accent);color:#1a1200;border-radius:6px;margin-left:.3rem;padding:0 .4rem;font-size:.8rem;font-weight:700}.tabs{border-bottom:1px solid #ffffff26;gap:.3rem;margin:1rem 0 .6rem;display:flex}.tabs button{color:var(--muted);cursor:pointer;background:0 0;border:none;border-bottom:3px solid #0000;min-height:44px;padding:.6rem .9rem}.tabs button.active{color:var(--fg);border-bottom-color:var(--accent)}.advice{padding-left:1.2rem}.advice li{margin:.3rem 0}.metrics{border-collapse:collapse;width:100%;margin-top:.8rem;font-size:.95rem}.metrics th{text-align:left;border-bottom:1px solid #ffffff1a;padding:.35rem .4rem;font-weight:500}.metrics th small{color:var(--muted);font-size:.75rem;display:block}.metrics thead th{color:var(--muted);font-size:.85rem}.metrics td{text-align:right;white-space:nowrap;border-bottom:1px solid #ffffff1a;padding:.35rem .4rem}.end-actions{flex-wrap:wrap;gap:.7rem;margin-top:1.2rem;padding-bottom:1rem;display:flex}.spacetime-canvas{border-radius:8px;width:100%;height:clamp(220px,45vh,420px);display:block}.spacetime-lanes{flex-wrap:wrap;gap:.4rem;margin-top:.5rem;display:flex}.legend{color:var(--muted);flex-wrap:wrap;gap:.8rem;margin-top:.5rem;font-size:.85rem;display:flex}.legend-item i{vertical-align:-1px;border-radius:3px;width:12px;height:12px;margin-right:.3rem;display:inline-block}.replay-view{background:#10151c;border-radius:8px;padding:.4rem;position:relative}.replay-canvas{width:100%;height:110px;display:block}.replay-canvas.ring{height:clamp(200px,40vh,320px)}.replay-label{color:var(--accent);padding:.2rem .3rem;font-size:.8rem}.replay-label.ref{color:#7bdff2}.replay-marker{opacity:0;border-radius:6px;padding:.2rem .6rem;font-size:.85rem;font-weight:600;transition:opacity .2s;position:absolute;top:.4rem;right:.6rem}.replay-marker.show{opacity:1}.replay-marker.good{background:var(--accent2)}.replay-marker.bad{background:var(--danger)}.replay-controls{flex-wrap:wrap;align-items:center;gap:.6rem;margin-top:.6rem;display:flex}.replay-controls input[type=range]{flex:1;min-width:8rem}.replay-controls select{background:var(--bg2);color:var(--fg);border:1px solid #fff3;border-radius:6px;padding:.3rem}.replay-time{font-variant-numeric:tabular-nums;min-width:3rem}.replay-markers{flex-wrap:wrap;gap:.3rem;margin-top:.5rem;display:flex}.marker{cursor:pointer;color:#fff;border:none;border-radius:6px;padding:.2rem .5rem;font-size:.8rem}.marker.good{background:var(--accent2)}.marker.bad{background:var(--danger)}@media (prefers-reduced-motion:reduce){.hud-toast,.hud-gauge-fill,.replay-marker{transition:none}}
