*{box-sizing:border-box;margin:0;padding:0}
html,body{width:100%;height:100%;overflow:hidden;background:#14102a;touch-action:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent;font-family:"Trebuchet MS","Segoe UI",system-ui,-apple-system,Roboto,Arial,sans-serif;color:#fff}
canvas#c{position:fixed;left:0;top:0;display:block}
button{font-family:inherit;cursor:pointer;border:0;color:inherit;touch-action:manipulation}
.hide{display:none!important}
#topbtns{position:fixed;top:max(10px,env(safe-area-inset-top));right:10px;display:flex;gap:8px;z-index:30}
.ib{width:46px;height:46px;border-radius:14px;background:#2a1f4f;border:3px solid #0b0818;box-shadow:0 4px 0 #0b0818;display:flex;align-items:center;justify-content:center}
.ib svg{width:26px;height:26px;fill:#fff;stroke:#fff}
.ib:active{transform:translateY(2px);box-shadow:0 2px 0 #0b0818}
.muted #mWave{display:none}
#mX{display:none}.muted #mX{display:inline}
#bMusic .mOff{display:none}#bMusic.off .mOff{display:inline}#bMusic.off{opacity:.6}
.ov{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;z-index:20;padding:12px;background:rgba(10,6,24,.35)}
.panel{background:#241a46;border:4px solid #0b0818;border-radius:22px;box-shadow:0 8px 0 #0b0818,0 0 30px rgba(255,60,200,.25);padding:14px 16px 12px;width:min(450px,100%);max-height:100%;overflow:auto;text-align:center}
.panel.small{width:min(300px,100%)}
h1{font-size:30px;line-height:1;font-weight:900;color:#ff4fd8;text-shadow:0 3px 0 #7a1468,0 5px 0 #0b0818;letter-spacing:.5px;font-style:italic}
h1 span{display:block;font-size:20px;color:#4ff0ff;text-shadow:0 3px 0 #15607a,0 5px 0 #0b0818;margin-top:4px}
h2{font-size:32px;font-weight:900;color:#ff4fd8;text-shadow:0 3px 0 #7a1468,0 5px 0 #0b0818;margin:2px 0 6px;font-style:italic}
.dpline{margin:8px 0 6px;font-size:16px;font-weight:700;color:#d8ccff;display:flex;align-items:center;justify-content:center;gap:6px}
.dpline b{font-size:20px;color:#ffd23f}
.dp{display:inline-flex;align-items:center;justify-content:center;font-style:normal;font-size:10px;font-weight:900;width:26px;height:20px;border-radius:6px;background:#ffd23f;color:#3a2600;border:2px solid #0b0818}
.row{display:flex;align-items:center;gap:8px;background:#1a1335;border-radius:16px;padding:6px;margin:6px 0}
.arr{width:40px;min-width:40px;height:56px;border-radius:12px;background:#3d2e7a;font-size:34px;line-height:1;font-weight:900;border-bottom:4px solid #0b0818}
.arr:active{transform:translateY(2px)}
.tinfo,.cinfo{flex:1;min-width:0}
.lbl{font-size:12px;letter-spacing:1.5px;text-transform:uppercase;color:#a99be0;font-weight:700}
.lbl.center{margin-top:4px}
#tName,#cName{font-size:20px;font-weight:900;color:#fff}
#tSub{font-size:13px;color:#cfc6f2;min-height:16px}
#carPrev{width:84px;height:84px}
#cStats{font-size:11px;color:#cfc6f2;text-align:left;margin-top:2px}
.st{display:flex;align-items:center;gap:6px;margin:2px 0}
.st span{width:58px}
.st i{flex:1;height:7px;background:#100b22;border-radius:4px;overflow:hidden;position:relative}
.st i b{position:absolute;left:0;top:0;bottom:0;background:#4ff0ff;border-radius:4px}
#tune{display:flex;gap:6px;margin:6px 0}
.tb{flex:1;background:#1a1335;border:3px solid #0b0818;border-radius:12px;padding:5px 2px;font-size:13px;font-weight:900;line-height:1.25}
.tb .pips{display:block;letter-spacing:2px;color:#4ff0ff;font-size:12px}
.tb .pr{display:block;font-size:11px;color:#ffd23f}
.tb.max .pr{color:#7dff9a}
.tb:active{transform:translateY(2px)}
#sw{display:flex;flex-wrap:wrap;justify-content:center;gap:6px;margin:6px 0}
.swc{width:32px;height:32px;border-radius:50%;border:3px solid #0b0818;position:relative;font-size:9px;font-weight:900;color:#fff;text-shadow:0 1px 2px #000}
.swc.sel{outline:3px solid #ffd23f;outline-offset:2px}
.swc.lock{opacity:.55}
.swc.lock::after{content:attr(data-p);position:absolute;inset:0;display:flex;align-items:center;justify-content:center}
#msg{min-height:18px;font-size:14px;color:#ffb36b;font-weight:700;margin:2px 0}
.big{display:block;width:100%;font-size:26px;font-weight:900;padding:12px;border-radius:16px;background:#ff2fa8;border:3px solid #0b0818;box-shadow:0 6px 0 #0b0818;color:#fff;text-shadow:0 2px 0 #8a0f58;margin:6px 0 10px;letter-spacing:1px;font-style:italic}
.big:active{transform:translateY(3px);box-shadow:0 3px 0 #0b0818}
.big.off{background:#5a5286;text-shadow:none}
.big.buy{background:#2fb45a;text-shadow:0 2px 0 #145f2c}
.mid{flex:1;font-size:18px;font-weight:900;padding:10px;border-radius:14px;background:#3d2e7a;border:3px solid #0b0818;box-shadow:0 4px 0 #0b0818;width:100%}
.mid:active{transform:translateY(2px);box-shadow:0 2px 0 #0b0818}
.row2{display:flex;gap:8px}
.tog{display:flex;align-items:center;justify-content:center;gap:8px;font-size:15px;font-weight:700;color:#e3dcff}
.tog input{width:20px;height:20px;accent-color:#ff2fa8}
.hint{font-size:12px;color:#a99be0;margin-top:6px}
#rMedal{font-size:20px;font-weight:900;margin:2px 0 4px}
#rScore{font-size:46px;font-weight:900;color:#ffd23f;text-shadow:0 3px 0 #7a4d00,0 5px 0 #0b0818;font-style:italic}
#rInfo{font-size:16px;color:#e3dcff;line-height:1.55;background:#1a1335;border-radius:14px;padding:8px 10px;margin:6px 0}
#rInfo b{color:#fff}
#rMsg{min-height:20px;font-size:16px;font-weight:900;color:#4ff0ff;margin:4px 0}
#touch{position:fixed;left:0;right:0;bottom:0;display:flex;justify-content:space-between;align-items:flex-end;padding:0 12px max(14px,env(safe-area-inset-bottom));z-index:10;pointer-events:none}
#touch .tl,#touch .tr{display:flex;gap:10px;pointer-events:auto;align-items:flex-end}
#touch button{width:78px;height:78px;border-radius:22px;background:rgba(42,31,79,.72);border:3px solid rgba(11,8,24,.9);font-size:30px;font-weight:900;box-shadow:0 5px 0 rgba(11,8,24,.8)}
#touch #tGas,#touch #tBrake,#touch #tHand{font-size:14px;line-height:1.1}
#touch #tHand{background:rgba(255,47,168,.78);width:92px;height:92px}
#touch #tGas{background:rgba(47,180,90,.8);height:96px}
#touch #tBrake{background:rgba(120,110,160,.7);width:62px;height:62px;font-size:12px}
#touch button.on{transform:translateY(3px);box-shadow:0 2px 0 rgba(11,8,24,.8);filter:brightness(1.3)}
@media (max-width:420px){#touch button{width:68px;height:68px}#touch #tHand{width:82px;height:82px}#touch #tBrake{width:54px;height:54px}#touch .tr{gap:7px}}
@media (max-height:640px){.panel{padding:10px 12px 8px}h1{font-size:22px}h1 span{font-size:16px}.big{font-size:22px;padding:9px}#carPrev{width:64px;height:64px}.arr{height:46px}.hint{display:none}#rScore{font-size:36px}}
@media (max-width:420px){#sw{gap:4px}.swc{width:28px;height:28px}.panel{padding:12px 10px 10px}}