:root{color-scheme:dark;--purple:#a743eb;--green:#60fc8c;--orange:#ff9c26;--ink:#100b21}*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;background:var(--ink);font-family:system-ui,-apple-system,Segoe UI,Arial,sans-serif;overscroll-behavior:none;touch-action:none;color:white}button{font:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent;user-select:none}button:focus-visible{outline:3px solid #fff;outline-offset:2px}.hidden{display:none!important}#game-shell,#stage{position:absolute;inset:0;width:100%;height:100%}#stage{display:block;background:linear-gradient(#8cd8f1 48%,#6cc88d 49%)}.screen{position:absolute;inset:0;display:flex;justify-content:center;align-items:center;z-index:20;background:linear-gradient(135deg,rgba(9,7,20,.88),rgba(31,11,47,.72));overflow:auto;padding:12px}.menu-card{text-align:center;max-width:440px;width:min(440px,95vw);padding:12px 20px 18px;border:2px solid #6e2a9b;border-radius:22px;background:linear-gradient(150deg,rgba(25,13,39,.97),rgba(10,9,20,.95));box-shadow:0 10px 50px #0009,0 0 45px #8d25d133;position:relative}.menu-card:before{content:'';position:absolute;inset:5px;border-radius:15px;border:1px solid #54d37740;pointer-events:none}.eyebrow{letter-spacing:.18em;font-size:11px;font-weight:900;color:#8cfbb1;margin:8px auto}.logo{width:min(150px,22vh);height:min(155px,22vh);object-fit:contain;filter:drop-shadow(0 3px 8px #000)}h1{font-size:clamp(23px,5vh,39px);line-height:.98;margin:6px 0;text-shadow:3px 4px 0 #120b20,-2px -2px 0 #16111e;color:#62d9ff;letter-spacing:-.04em}h1 span{display:block;color:var(--orange)}.tagline{font-weight:800;font-size:11px;letter-spacing:.12em;color:#d5bbe3;margin:11px 0 15px}.primary,.secondary{border:0;border-radius:10px;min-height:43px;color:white;font-weight:900;letter-spacing:.025em;transition:transform .12s,filter .12s}.primary:active,.secondary:active{transform:scale(.96);filter:brightness(1.2)}.primary{width:100%;font-size:17px;padding:10px;background:linear-gradient(120deg,#7b25b4,#ac3be8);box-shadow:0 5px 0 #431461,0 0 18px #a133e866}.secondary{padding:9px 10px;background:#29263c;border:1px solid #765596}.menu-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:12px}.menu-grid button{font-size:12px}.menu-footer{font-size:9px;color:#a78cba;font-weight:800;letter-spacing:.08em;margin-top:14px}.dialog{width:min(450px,96vw);max-height:95vh;overflow:auto;border-radius:18px;background:#171326;border:2px solid #733d97;padding:22px;text-align:center;box-shadow:0 12px 80px #000c;position:relative}.dialog.narrow{max-width:335px}.dialog h2{color:#71f0a9;font-size:clamp(26px,6vh,44px);margin:4px 0 10px}.dialog p{font-size:14px;line-height:1.5;color:#cfc5d9}.dialog .secondary.full{width:100%;margin-top:10px}.close{position:absolute;top:8px;right:8px;border:0;background:#322347;color:white;border-radius:9px;padding:8px 11px;font-size:18px}.records-table{width:100%;border-collapse:collapse;text-align:left;font-size:13px;margin:15px 0}.records-table td,.records-table th{padding:10px 5px;border-bottom:1px solid #3b304c}.records-table th{color:#65efaa}.stat{color:#65efaa;font-size:24px;font-weight:900}.option-row{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:16px 0;font-size:14px;text-align:left}.option-row select{background:#302445;border:1px solid #8e63b6;color:white;border-radius:7px;padding:8px}.garage-preview{height:100px;background:linear-gradient(#74cef5 42%,#7c7b92 43%,#5a536b);border-radius:12px;position:relative;margin:12px 0;overflow:hidden}.garage-preview:before{content:'13';position:absolute;top:15px;left:44%;font-size:68px;font-weight:1000;transform:skew(-10deg);color:#d43dfa;text-shadow:4px 4px 0 #22ff90}.smallprint{font-size:11px!important;color:#9d92b3!important}.hud-top{position:absolute;top:max(8px,env(safe-area-inset-top));left:max(12px,env(safe-area-inset-left));right:max(12px,env(safe-area-inset-right));display:flex;align-items:center;justify-content:flex-start;gap:8px;z-index:4;pointer-events:none}.hud-pill,.hud-icon{border:2px solid #835ab5;background:#181425df;box-shadow:0 3px 12px #0008;color:white;font-weight:950;border-radius:10px;min-width:74px;padding:5px 11px;text-align:center;font-size:clamp(14px,2.9vw,25px);line-height:1.2}.hud-pill.rank{color:#ffcc48}.hud-pill.lap{color:#77ffae}.hud-pill.clock{font-variant-numeric:tabular-nums;font-size:clamp(13px,2.7vw,20px);color:#fff}.hud-pill small{color:#c3a9d1;font-size:10px}.hud-icon{pointer-events:auto;margin-left:auto;min-width:40px;padding:6px 11px;background:#1e162ae9;font-size:18px}.suffix{font-size:12px}.hud-bottom{position:absolute;z-index:4;left:14px;right:14px;bottom:90px;display:flex;align-items:end;justify-content:space-between;pointer-events:none}.hud-gauge{font-size:26px;font-weight:1000;text-shadow:2px 3px 3px #000}.hud-gauge small{font-size:10px;margin-left:4px;color:#e8dce9}#turbo-meter{height:7px;width:100px;border:1px solid #7c7290;background:#22192a;border-radius:8px;overflow:hidden}#turbo-fill{width:0;height:100%;background:linear-gradient(90deg,#6bff76,#aa43f0,#ffab3e)}#item-status{max-width:210px;text-align:center;padding:8px 12px;border-radius:9px;background:#241633c7;border:1px solid #9056b6;font-size:11px;font-weight:900;color:#ffcc6c}#minimap{width:112px;height:76px;border:2px solid #a24ed5;background:#0d1224d4;border-radius:12px;overflow:hidden}#map-canvas{width:100%;height:100%}#controls{position:absolute;z-index:9;bottom:max(10px,env(safe-area-inset-bottom));width:100%;padding:0 max(18px,env(safe-area-inset-left)) 0 max(18px,env(safe-area-inset-right));display:flex;justify-content:space-between;pointer-events:none}.control-left,.control-right{display:flex;gap:13px;align-items:end;pointer-events:auto}.ctrl{border:2px solid #a0fdbcbb;min-width:64px;height:59px;background:#272142c7;color:white;border-radius:13px;font-weight:1000;font-size:13px;text-shadow:0 2px 4px #000;box-shadow:0 4px 0 #1813289e,0 0 15px #0008;touch-action:none}.ctrl.steer{width:68px;font-size:26px}.ctrl.drift{background:#6f2badcd;border-color:#c985fa}.ctrl.item{background:#24774dce;border-color:#8cfdb5}.ctrl.pressed{transform:translateY(3px) scale(.96);filter:brightness(1.4);box-shadow:0 1px 0 #181328}#countdown{position:absolute;top:37%;left:0;right:0;text-align:center;z-index:13;font-size:clamp(50px,12vw,128px);font-weight:1000;line-height:1;text-shadow:5px 7px 0 #371b54,0 0 35px #e47efe;color:#fff;pointer-events:none}#countdown.go{color:#76ff9e}#toast{z-index:15;position:absolute;top:23%;left:50%;transform:translateX(-50%);background:#1d1738eb;border:2px solid #a958eb;border-radius:12px;padding:9px 20px;color:#fff;font-weight:950;text-align:center;pointer-events:none;white-space:nowrap}#screen-flash{position:absolute;inset:0;pointer-events:none;z-index:11;background:#fff;opacity:0;transition:opacity .2s}.result-row{display:flex;align-items:center;justify-content:space-between;gap:10px;border-bottom:1px solid #403050;padding:5px 8px;font-size:12px}.result-row.you{color:#76ffaa;background:#3e274a}.results-dialog{max-width:370px}.results-dialog .primary{margin-top:13px}#rotate{position:absolute;inset:0;background:#130c20;z-index:100;display:flex;align-items:center;justify-content:center;flex-direction:column;text-align:center;padding:20px}.rotate-icon{font-size:78px;color:#66fc90}#rotate h2{color:#ad6ef0;margin-bottom:0}#rotate p{color:#d2c6dc}.touch-only{display:none}@media(pointer:coarse){.touch-only{display:initial}}@media(max-height:465px){.menu-card{padding:7px 15px}.logo{width:75px;height:75px}.menu-footer{margin-top:8px}.tagline{margin:5px 0 8px}h1{font-size:25px}.primary,.secondary{min-height:37px;padding:7px}.menu-grid{margin-top:9px}.hud-bottom{bottom:72px}.hud-gauge{font-size:22px}.ctrl{height:54px;min-width:57px}.ctrl.steer{width:61px}.dialog{padding:13px}.dialog h2{font-size:26px}}@media(orientation:portrait) and (pointer:coarse){#rotate:not(.hidden){display:flex!important}#controls{display:none}}@media(min-width:1000px) and (pointer:fine){#controls{display:none}.hud-bottom{bottom:18px}}@media(max-width:500px) and (orientation:landscape){.hud-pill{padding:3px 7px;min-width:52px;font-size:13px}.hud-gauge{font-size:19px}.ctrl{height:45px;min-width:49px}.ctrl.steer{width:51px}.hud-bottom{bottom:61px}.menu-card{padding:4px 12px}.logo{width:58px;height:58px}.tagline{display:none}}

.powerup-icon{width:38px;height:38px;border-radius:9px;object-fit:contain;flex-shrink:0;filter:drop-shadow(0 0 6px #9c5be5)}
#item-status{display:flex;gap:8px;align-items:center;justify-content:center}
#item-icon[hidden]{display:none}

/* V0.3 — actual browser fullscreen consent, four-track selection, analog joystick, item HUD */
.fullscreen-prompt{position:absolute;inset:0;z-index:110;background:linear-gradient(135deg,#060810f8,#1c1031f8);display:flex;align-items:center;justify-content:center;padding:14px;overflow-y:auto}
.fullscreen-prompt.hidden{display:none!important}
.fullscreen-card{width:min(440px,96%);padding:16px 24px;text-align:center;border:2px solid #8b42cb;background:#171326;border-radius:22px;box-shadow:0 0 60px #ad39d340}
.fullscreen-card img{height:min(125px,19vh);max-width:100%;object-fit:contain}
.fullscreen-card h2{color:#77f7a8;font-size:clamp(21px,4.7vw,32px);margin:6px 0}
.fullscreen-card p{color:#d9d4e4;font-size:13px;line-height:1.4}
.fullscreen-card .secondary.full{width:100%;margin-top:10px}
.fullscreen-card .fullscreen-note{font-size:11px;color:#aaa1be}
.fullscreen-small{border:1px solid #4b866d;background:#203a35;color:#aeffd1;font-weight:900;border-radius:8px;font-size:10px;padding:7px 10px;margin-top:8px}
.track-picker{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin:7px 0}
.track-choice{text-align:left;border:1px solid #715b88;border-radius:9px;background:#252139;color:#efe6fb;padding:8px 10px;min-height:48px;display:flex;flex-direction:column;gap:4px}
.track-choice strong{font-size:10px;letter-spacing:.025em}
.track-choice small{font-size:9px;color:#b8b1cd}
.track-choice.selected{border:2px solid #62f4a6;background:#284439;box-shadow:0 0 12px #50f2a048;padding:7px 9px}
.track-summary{color:#8af9bd;font-weight:800;font-size:10px;letter-spacing:.08em;margin:8px 0}
.item-slot{pointer-events:none;position:absolute;z-index:8;top:max(8px,env(safe-area-inset-top));left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:7px;flex-direction:column}
.item-frame{width:clamp(57px,9vh,76px);height:clamp(57px,9vh,76px);border:3px solid #f3ce71;border-radius:13px;background:linear-gradient(135deg,#25203bed,#4b285af2);box-shadow:0 0 0 3px #1b1428,0 6px 15px #000c,0 0 17px #d58bdf6f;display:flex;align-items:center;justify-content:center}
#item-slot-icon{width:83%;height:83%;object-fit:contain;filter:drop-shadow(0 0 6px #ce99ff)}
#item-empty{font-size:36px;color:#b1a3c2;font-weight:1000;line-height:1}
#item-slot-label{font-size:10px;max-width:158px;line-height:1.1;text-align:center;white-space:nowrap;text-shadow:1px 2px 4px #000;font-weight:1000;color:#ffe79b;letter-spacing:.02em}
.item-slot.roulette .item-frame{animation:rouletteFlash .13s infinite alternate}
@keyframes rouletteFlash{from{border-color:#63ffc4;transform:scale(.97)}to{border-color:#ffbe4f;transform:scale(1.05)}}
.steering-joystick{height:105px;width:140px;position:relative;border-radius:58px;background:#1d183fbc;border:2px solid #9c68d0ad;touch-action:none;user-select:none;box-shadow:0 5px 14px #0009;display:flex;justify-content:center;align-items:center;overflow:hidden}
.joy-tracks{position:absolute;inset:0;display:flex;justify-content:space-between;align-items:center;padding:0 10px;color:#86ebb8;opacity:.7;font-weight:1000;font-size:21px;pointer-events:none}
.joystick-knob{position:relative;z-index:1;width:69px;height:69px;border-radius:50%;border:3px solid #79ffb4;background:radial-gradient(circle at 37% 27%,#a65bd2,#44207b 74%);box-shadow:0 4px 12px #0009,0 0 15px #9148e8;color:#f9dc88;font-weight:1000;font-size:23px;display:grid;place-items:center;pointer-events:none;transition:transform .04s linear}
.joystick-knob span{transform:skew(-7deg)}
.steering-joystick.active{border-color:#76ffad}
@media (pointer:fine){#controls{display:none}}
@media (max-height:460px){.steering-joystick{width:119px;height:78px}.joystick-knob{width:57px;height:57px}.item-frame{height:54px;width:54px}.item-slot{gap:2px}.track-choice{min-height:41px;padding:5px 7px}.menu-card{max-height:97vh;overflow-y:auto}.tagline{margin:4px 0}.fullscreen-card{padding:8px 18px}.fullscreen-card img{height:64px}}
@media (max-width:700px) and (orientation:landscape){.menu-card{width:min(460px,93vw)}.hud-top{gap:4px}.hud-pill{font-size:14px;min-width:60px;padding:4px 7px}.hud-bottom{bottom:93px}.ctrl{min-width:50px;height:50px}.control-right{gap:8px}}


/* V0.4 — genuine circular, two-axis touch joystick. No slider track. */
.steering-joystick {
  width:134px;height:134px;aspect-ratio:1;border-radius:50%;
  border:3px solid #8cecb9;background:radial-gradient(circle at 45% 38%,#3e2c66e6 0%,#1d1734eb 69%,#0e1524f0 100%);
  box-shadow:0 5px 18px #000b,inset 0 0 0 4px #391b55,0 0 14px #52ec914f;
  overflow:hidden;touch-action:none;user-select:none; -webkit-user-select:none;
}
.steering-joystick:focus-visible{outline:3px solid #fff;outline-offset:3px}
.joystick-ring{position:absolute;inset:19px;border-radius:50%;border:2px dashed #b696cf77;pointer-events:none}
.joy-tracks{padding:0 7px;font-size:18px;color:#a2f5c2;opacity:.8}
.joystick-knob{width:62px;height:62px;flex:0 0 62px;border-radius:50%;
  border:3px solid #9dffd0;background:radial-gradient(circle at 32% 24%,#b65ae2,#54229a 66%,#31125f 100%);
  box-shadow:inset 0 0 10px #fff2,0 5px 13px #000b,0 0 13px #bd63fd7b;
  transition:transform .055s ease-out;will-change:transform;pointer-events:none;
}
.steering-joystick.active {border-color:#c9ffde;box-shadow:0 5px 18px #000b,inset 0 0 0 4px #391b55,0 0 22px #75ffb38a}
.steering-joystick.active .joystick-knob{transition:none}
@media(max-height:460px){
  .steering-joystick{width:99px;height:99px}
  .joystick-knob{width:49px;height:49px;flex-basis:49px;font-size:19px}
  .joystick-ring{inset:14px}
  .joy-tracks{font-size:13px;padding:0 4px}
}
@media(max-height:335px){.steering-joystick{width:78px;height:78px}.joystick-knob{width:40px;height:40px;flex-basis:40px;font-size:16px}.joystick-ring{inset:11px}}

/* V0.5 main-menu skill selection: responsive landscape / desktop. */
.difficulty-row{display:flex;align-items:center;justify-content:space-between;gap:10px;
 padding:7px 9px;border:1px solid #6d587b;border-radius:10px;background:#261c37d9;margin:7px 0 3px}
.difficulty-row label{font-size:11px;font-weight:1000;letter-spacing:.065em;color:#94ffbe;white-space:nowrap}
.difficulty-row select{color:#fff6d6;background:#412967;border:1px solid #bf78f2;border-radius:8px;
 font-size:13px;font-weight:900;padding:6px 10px;min-width:140px;max-width:55%;outline-offset:2px}
.difficulty-description{color:#c7bfd9;font-size:10px;line-height:1.3;min-height:13px;margin:2px 0 7px}
@media(max-height:465px){.difficulty-row{padding:3px 8px;margin:3px 0}.difficulty-row select{padding:3px 7px;font-size:12px}.difficulty-description{margin:0 0 3px;font-size:9px}}
@media(max-width:460px){.difficulty-row label{font-size:10px}.difficulty-row select{min-width:120px}}