:root{color-scheme:dark;--bg:#090b0f;--panel:#11151b;--panel2:#171d25;--text:#f5f7fa;--muted:#89919d;--line:#2a313c;--accent:#f1c84b;--good:#64d996;--bad:#ff6a6a}
*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:radial-gradient(circle at 50% -20%,#242b36 0,#0b0e13 45%,#07090c 100%);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--text)}
body{padding:18px;overscroll-behavior:none}button{font:inherit}#app-shell{max-width:980px;margin:auto}.topbar{display:flex;align-items:center;justify-content:space-between;margin:6px 0 18px}.topbar h1{font-size:24px;margin:2px 0}.eyebrow{font-size:10px;letter-spacing:.22em;color:var(--muted);font-weight:800}.wallet{text-align:right;background:#0e1217;border:1px solid var(--line);padding:10px 14px}.wallet span{display:block;font-size:9px;letter-spacing:.18em;color:var(--muted)}.wallet strong{font-size:18px}.panel{background:linear-gradient(180deg,rgba(22,27,34,.97),rgba(12,15,20,.97));border:1px solid var(--line);box-shadow:0 28px 80px rgba(0,0,0,.35);padding:22px}.hidden{display:none!important}.section-head{display:flex;justify-content:space-between;align-items:center}.section-head h2{margin:3px 0 0;font-size:26px}.level-box{border-left:1px solid var(--line);padding-left:18px;color:var(--muted);font-size:12px}.level-box strong{color:var(--text);font-size:24px}
.car-stage{height:250px;display:grid;place-items:center;overflow:hidden;background:linear-gradient(180deg,rgba(255,255,255,.025),transparent);border-top:1px solid rgba(255,255,255,.03);border-bottom:1px solid rgba(255,255,255,.03);margin:18px 0 12px}.car-visual-image{position:relative;width:min(100%,760px);height:190px;display:grid;place-items:center}.car-image-shadow{position:absolute;left:14%;right:14%;bottom:12px;height:32px;background:rgba(0,0,0,.68);filter:blur(18px);border-radius:50%}#garage-car-img{position:relative;display:block;max-width:92%;max-height:168px;object-fit:contain;filter:drop-shadow(0 14px 18px rgba(0,0,0,.48));transform:translateY(-4px)}
.skin-panel{border:1px solid var(--line);background:#0d1116;margin:0 0 14px;padding:12px}.skin-head{display:flex;justify-content:space-between;align-items:end;margin-bottom:10px}.skin-head strong{font-size:15px}.skin-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.car-skin{display:flex;align-items:center;gap:10px;text-align:left;border:1px solid var(--line);background:#0b1015;color:var(--text);padding:10px 12px;cursor:pointer;transition:.16s ease}.car-skin:hover{transform:translateY(-1px);border-color:#4a5360}.car-skin.active{border-color:var(--accent);box-shadow:inset 0 0 0 1px rgba(241,200,75,.35);background:linear-gradient(180deg,#11161c,#0b1015)}.car-skin b,.car-skin small{display:block}.car-skin b{font-size:13px}.car-skin small{font-size:10px;color:var(--muted);text-transform:uppercase;letter-spacing:.12em}.swatch{width:16px;height:16px;border-radius:50%;display:inline-block;border:1px solid rgba(255,255,255,.18);box-shadow:0 0 0 2px rgba(255,255,255,.03)}.swatch.blue{background:#0b5cff}.swatch.red{background:#e11f26}.swatch.white{background:#f2f4f7}.swatch.silver{background:#98a1ad}
.stats-grid{display:grid;grid-template-columns:repeat(4,1fr);border:1px solid var(--line)}.stats-grid>div{padding:14px;border-right:1px solid var(--line)}.stats-grid>div:last-child{border:0}.stats-grid span{display:block;color:var(--muted);font-size:9px;letter-spacing:.14em;font-weight:800}.stats-grid strong{display:block;margin-top:5px;font-size:18px}.performance-line{display:flex;justify-content:space-between;align-items:center;margin:12px 0 20px;padding:12px 0;border-bottom:1px solid var(--line)}.performance-line span{font-size:11px;letter-spacing:.18em;color:var(--muted)}.performance-line strong{font-size:26px;color:var(--accent)}.upgrade-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.upgrade{appearance:none;text-align:left;border:1px solid var(--line);background:#0c1015;color:var(--text);padding:14px;cursor:pointer;transition:.16s ease}.upgrade:hover{transform:translateY(-1px);border-color:#4a5360}.upgrade:disabled{opacity:.38;cursor:not-allowed;transform:none}.upgrade span,.upgrade b,.upgrade small{display:block}.upgrade span{font-weight:700}.upgrade b{font-size:12px;color:var(--good);margin-top:4px}.upgrade small{color:var(--muted);margin-top:8px}.primary{width:100%;border:0;background:var(--accent);color:#111317;font-weight:900;letter-spacing:.06em;padding:16px;margin-top:16px;cursor:pointer}.primary:disabled{opacity:.45;cursor:not-allowed}
.race-top{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;margin-bottom:14px}.ghost{justify-self:start;border:1px solid var(--line);background:transparent;color:var(--text);padding:9px 11px;cursor:pointer}.race-title{text-align:center}.race-title strong{display:block;margin-top:3px}.rival-chip{justify-self:end;color:var(--muted);font-size:10px;text-align:right}.rival-chip b{display:block;color:var(--text);font-size:13px}.rival-chip small{display:block;margin-top:4px;font-size:10px;color:#c6ccd4}.race-panel{padding-bottom:18px}#game-wrap{position:relative;width:100%;aspect-ratio:16/7;background:#080b0f;overflow:hidden;border:1px solid var(--line);margin-bottom:12px}#phaser-game,#phaser-game canvas{width:100%!important;height:100%!important;display:block}.countdown{position:absolute;inset:0;display:grid;place-items:center;pointer-events:none;font-size:82px;font-weight:950;text-shadow:0 8px 28px #000}.shift-button{position:absolute;right:14px;bottom:14px;border:1px solid rgba(255,255,255,.25);background:rgba(6,8,11,.86);color:white;padding:14px 20px;font-weight:900;letter-spacing:.09em}.shift-button.ready{background:var(--accent);color:#111;border-color:var(--accent);box-shadow:0 0 28px rgba(241,200,75,.28)}
.telemetry-hidden{display:none!important}.cluster-shell{max-width:820px;margin:0 auto}.warning-strip{display:grid;grid-template-columns:1fr auto;gap:10px;align-items:center;border:1px solid var(--line);background:linear-gradient(180deg,#0d1217,#090d11);padding:10px 12px;margin-bottom:10px}.warning-lamps{display:flex;gap:8px;flex-wrap:wrap}.lamp{display:inline-flex;align-items:center;justify-content:center;min-width:68px;height:26px;padding:0 10px;border-radius:999px;font-size:10px;font-weight:900;letter-spacing:.14em;background:#121821;color:#59626d;border:1px solid rgba(255,255,255,.05);opacity:.42;transition:.18s ease}.lamp.active{opacity:1;box-shadow:0 0 14px currentColor}.lamp-red.active{background:rgba(191,47,47,.14);color:#ff6e6e;border-color:rgba(255,110,110,.45)}.lamp-blue.active{background:rgba(70,126,255,.14);color:#7ab0ff;border-color:rgba(122,176,255,.45)}.lamp-amber.active{background:rgba(241,200,75,.14);color:#f1c84b;border-color:rgba(241,200,75,.45)}.mini-stats{display:flex;gap:12px;flex-wrap:wrap;justify-content:flex-end}.mini-stat{display:flex;gap:6px;align-items:baseline}.mini-stat span{font-size:9px;letter-spacing:.16em;color:var(--muted);font-weight:800}.mini-stat strong{font-size:14px;color:#dbe2ea}.cockpit-panel{display:grid;grid-template-columns:1fr 240px 1fr;gap:10px;align-items:stretch}.dial-card,.shifter-card,.info-box,.boost-strip{border:1px solid var(--line);background:linear-gradient(180deg,#0e1218,#0a0d12);position:relative;overflow:hidden}.dial-card{padding:8px;min-height:190px;display:grid;place-items:center;box-shadow:inset 0 0 0 1px rgba(255,255,255,.02)}.dial-card::before,.shifter-card::before,.info-box::before,.boost-strip::before{content:'';position:absolute;inset:0;background:radial-gradient(circle at 50% 0,rgba(255,255,255,.04),transparent 52%);pointer-events:none}.dial-card canvas,.boost-strip canvas{width:100%;height:100%;display:block}.center-stack{display:grid;grid-template-rows:1fr auto;gap:10px}.shifter-card{padding:10px;display:grid;grid-template-rows:auto 1fr}.mini-label{font-size:10px;letter-spacing:.18em;color:var(--muted);font-weight:800;text-align:center}.shifter-gate{position:relative;height:132px;margin:8px auto 0;width:170px;border:1px solid rgba(255,255,255,.04);background:linear-gradient(180deg,#0a0d11,#0b0f15);border-radius:18px;box-shadow:inset 0 12px 26px rgba(255,255,255,.02), inset 0 -10px 18px rgba(0,0,0,.28)}.gate-line{position:absolute;background:#334050;border-radius:6px;box-shadow:0 0 0 1px rgba(255,255,255,.03) inset}.gate-line.v{width:6px;height:76px;top:26px}.gate-line.v.l1{left:28px}.gate-line.v.l2{left:82px}.gate-line.v.l3{left:136px}.gate-line.v.rev{left:160px;height:44px;top:26px}.gate-line.h.main{height:6px;width:138px;left:28px;top:64px}.gear-node{position:absolute;font-size:13px;font-weight:900;color:#d8dee6}.n1{left:17px;top:8px}.n2{left:17px;top:102px}.n3{left:71px;top:8px}.n4{left:71px;top:102px}.n5{left:125px;top:8px}.n6{left:125px;top:102px}.nr{left:149px;top:7px;font-size:12px}.shifter-knob{position:absolute;width:32px;height:32px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#f6f7fa 0,#d9dde5 18%,#979ea9 42%,#2c3137 78%,#0d1013 100%);box-shadow:0 8px 18px rgba(0,0,0,.55),0 0 0 1px rgba(255,255,255,.1) inset;left:12px;top:16px;transition:left .18s cubic-bezier(.2,.8,.2,1),top .18s cubic-bezier(.2,.8,.2,1),transform .18s ease}.info-grid-mini{display:grid;grid-template-columns:1fr 1fr;gap:10px}.info-box{padding:10px 12px;display:flex;justify-content:space-between;align-items:end;min-height:76px}.info-box span{font-size:10px;letter-spacing:.16em;color:var(--muted);font-weight:800}.info-box strong{font-size:26px;line-height:1;color:#f5f7fa}.info-box:first-child strong{color:var(--accent);font-size:40px}.boost-strip{margin-top:10px;min-height:72px;padding:6px 10px}.result{margin-top:14px;padding:16px;border:1px solid var(--line);background:#0a0e12}.result.win{border-color:rgba(100,217,150,.55)}.result.loss{border-color:rgba(255,106,106,.55)}.result strong{display:block;font-size:20px;margin-bottom:5px}.result small{color:var(--muted)}footer{text-align:center;color:#565e69;font-size:10px;margin:14px 0}
@media(max-width:900px){.skin-grid{grid-template-columns:1fr 1fr}.cluster-shell{max-width:100%}.warning-strip{grid-template-columns:1fr}.mini-stats{justify-content:flex-start}.cockpit-panel{grid-template-columns:1fr}.center-stack{grid-template-columns:1fr;grid-template-rows:auto auto}.dial-card{min-height:180px}}
@media(max-width:720px){body{padding:8px}.panel{padding:14px}.car-stage{height:210px}.car-visual-image{height:158px}#garage-car-img{max-height:138px}.stats-grid{grid-template-columns:1fr 1fr}.stats-grid>div:nth-child(2){border-right:0}.stats-grid>div:nth-child(-n+2){border-bottom:1px solid var(--line)}.upgrade-grid,.skin-grid{grid-template-columns:1fr}.race-top{grid-template-columns:1fr 1fr}.race-title{display:none}.countdown{font-size:58px}.topbar h1{font-size:20px}.warning-lamps{gap:6px}.lamp{min-width:56px;height:24px;font-size:9px}.mini-stats{gap:10px}.info-grid-mini{grid-template-columns:1fr}.cockpit-panel{grid-template-columns:1fr}.info-box:first-child strong{font-size:34px}}