:root {
  --bg: #08071c;
  --panel: rgba(17, 16, 48, 0.9);
  --panel-2: #151442;
  --line: rgba(156, 164, 255, 0.17);
  --text: #f4f6ff;
  --muted: #9fa6ce;
  --cyan: #27e4ff;
  --blue: #4d7cff;
  --purple: #9d4dff;
  --pink: #ff45b5;
  --drift: #ff5368;
  --yellow: #ffd850;
  --green: #5cf4a6;
  --danger: #ff637c;
  --display: "Oxanium", sans-serif;
  --body: "Be Vietnam Pro", sans-serif;
}

* { box-sizing: border-box; }
html { min-width: 320px; scroll-behavior: smooth; }
body {
  margin: 0;
  color: var(--text);
  font-family: var(--body);
  background:
    radial-gradient(circle at 78% 8%, rgba(93, 72, 255, 0.2), transparent 28rem),
    radial-gradient(circle at 5% 60%, rgba(0, 212, 255, 0.1), transparent 30rem),
    linear-gradient(145deg, #08071c 0%, #0c0a2b 58%, #08071c 100%);
  min-height: 100vh;
  overflow-x: hidden;
}

button, input { font: inherit; }
button { color: inherit; }
button:focus-visible, a:focus-visible { outline: 3px solid var(--yellow); outline-offset: 3px; }

.speed-lines {
  position: fixed; inset: 0; pointer-events: none; opacity: .24; z-index: -1;
  background-image: linear-gradient(115deg, transparent 0 47%, rgba(71, 201, 255, .1) 48%, transparent 49% 100%);
  background-size: 150px 90px;
  transform: skewY(-5deg) scale(1.2);
}

.topbar {
  height: 72px; max-width: 1440px; margin: auto; padding: 0 34px;
  display: flex; align-items: center; gap: 30px; border-bottom: 1px solid var(--line);
}
.brand { display: flex; align-items: center; gap: 10px; color: #fff; text-decoration: none; margin-right: auto; }
.brand-mark {
  width: 38px; height: 38px; display: grid; place-items: center; transform: skew(-12deg);
  font: 900 25px/1 var(--display); background: linear-gradient(135deg, var(--cyan), var(--purple));
  box-shadow: 0 0 24px rgba(39, 228, 255, .3); clip-path: polygon(16% 0, 100% 0, 84% 100%, 0 100%);
}
.brand > span:last-child { display: flex; flex-direction: column; font: 800 16px/14px var(--display); letter-spacing: .08em; }
.brand em { font-style: normal; color: var(--cyan); font-size: 10px; letter-spacing: .3em; }
.cycle-chip { display: flex; align-items: baseline; gap: 5px; padding: 8px 18px; border-left: 1px solid var(--line); border-right: 1px solid var(--line); }
.cycle-chip span { font-size: 10px; letter-spacing: .18em; color: var(--muted); }
.cycle-chip strong { font: 800 23px var(--display); color: var(--cyan); }
.cycle-chip small { color: var(--muted); }
.currency { display: flex; gap: 18px; }
.currency > div { display: flex; align-items: center; gap: 8px; font: 700 13px var(--display); }
.currency-icon { width: 25px; height: 25px; display: grid; place-items: center; border-radius: 50%; font-size: 11px; }
.currency-icon.coin { color: #18122a; background: var(--yellow); box-shadow: 0 0 12px rgba(255,216,80,.3); }
.currency-icon.bolt { color: #15112b; background: var(--cyan); }
.icon-button, .tiny-button { border: 1px solid var(--line); background: rgba(255,255,255,.04); cursor: pointer; }
.icon-button { width: 36px; height: 36px; border-radius: 50%; font: 700 18px var(--display); }
.icon-button[aria-pressed="false"] { color: var(--muted); }

.app-shell { width: min(1380px, calc(100% - 48px)); margin: 26px auto 60px; }
.hero-panel {
  height: 210px; position: relative; overflow: hidden; display: flex; align-items: center; padding: 28px 52px;
  border: 1px solid rgba(106, 131, 255, .22); background: linear-gradient(105deg, rgba(24,20,74,.97), rgba(16,18,60,.8));
  clip-path: polygon(0 0, 96.5% 0, 100% 26%, 100% 100%, 3.5% 100%, 0 74%);
}
.hero-panel::before { content:""; position:absolute; inset:0; background: repeating-linear-gradient(115deg, transparent 0 80px, rgba(255,255,255,.025) 81px 83px); }
.hero-copy { position: relative; z-index: 2; }
.eyebrow { color: var(--cyan); font: 700 10px var(--display); letter-spacing: .2em; }
.eyebrow span { display: inline-block; width: 28px; height: 2px; vertical-align: middle; margin-right: 8px; background: var(--cyan); box-shadow: 0 0 8px var(--cyan); }
.hero-copy h1 { margin: 8px 0 5px; font: 900 44px/.84 var(--display); letter-spacing: -.04em; font-style: italic; }
.hero-copy h1 em { color: transparent; -webkit-text-stroke: 1.5px var(--cyan); text-shadow: 0 0 16px rgba(39,228,255,.25); }
.hero-copy p { font-size: 12px; color: var(--muted); margin: 15px 0 0; }
.hero-car-wrap { position: absolute; width: 58%; height: 100%; right: 8%; bottom: 0; perspective: 700px; }
.hero-glow { position: absolute; width: 380px; height: 140px; right: 7%; top: 30%; background: var(--purple); filter: blur(65px); opacity: .24; }
.hero-road { position: absolute; left: 2%; right: -20%; bottom: -36px; height: 100px; transform: rotate(-7deg); border-top: 1px solid rgba(39,228,255,.25); background: linear-gradient(rgba(30,25,70,.5), rgba(4,3,14,.7)); }
.hero-road i { position:absolute; width: 22%; height: 3px; bottom: 40px; background: var(--cyan); transform: skewX(-40deg); box-shadow: 0 0 12px var(--cyan); }
.hero-road i:nth-child(2){left:35%}.hero-road i:nth-child(3){left:70%}
.hero-car { position: absolute; width: 380px; height: 116px; right: 4%; top: 43px; transform: skewX(-6deg) rotate(-2deg); filter: drop-shadow(0 18px 18px rgba(0,0,0,.55)); }
.car-body { position:absolute; width: 330px; height: 72px; right:0; top:35px; border-radius: 60% 16% 20% 30%; background: linear-gradient(165deg, #8e5aff 5%, #4b36ca 38%, #161446 75%); clip-path: polygon(7% 19%, 28% 0, 70% 5%, 92% 33%, 100% 70%, 92% 94%, 15% 100%, 0 73%); box-shadow: inset 0 4px 0 rgba(255,255,255,.35), inset 0 -8px 20px rgba(8,5,49,.8); }
.car-body::after { content:""; position:absolute; inset: 48% 5% 25% 8%; background: linear-gradient(90deg, var(--pink), var(--cyan)); clip-path: polygon(0 44%, 88% 0, 100% 38%, 14% 100%); opacity:.85; }
.car-roof { position:absolute; width:170px; height:48px; top:12px; left:115px; border-radius: 70% 40% 0 0; background:linear-gradient(145deg,#5248a7,#0e173a 70%); clip-path:polygon(26% 0,77% 8%,100% 100%,0 100%); box-shadow:inset 0 3px 0 rgba(129,233,255,.5); }
.car-wing { position:absolute; width:78px; height:8px; left:15px; top:31px; background:#8b5aff; transform:rotate(-4deg); box-shadow:0 0 10px rgba(157,77,255,.7); }
.car-wing::after { content:""; position:absolute; width:8px;height:22px;right:8px;top:5px;background:#2d226f; }
.car-wheel { position:absolute; width:58px;height:58px;border:9px solid #070714;border-radius:50%;top:75px;background:radial-gradient(circle,#7e86b7 0 18%,#1d1d39 20% 42%,#7d4cff 44% 50%,#111 52%); z-index:3; box-shadow:0 0 10px rgba(75,100,255,.45); }
.car-wheel.wl{left:72px}.car-wheel.wr{right:40px}
.car-light { position:absolute;width:43px;height:9px;right:1px;top:61px;background:var(--cyan);clip-path:polygon(0 0,100% 25%,74% 100%,8% 82%);z-index:4;box-shadow:0 0 18px var(--cyan); }
.car-light.l{right:50px;width:27px;opacity:.45}
.hero-rank { position:absolute;right:23px;top:19px;display:flex;flex-direction:column;align-items:center;z-index:3; }
.hero-rank span{font:600 8px var(--display);letter-spacing:.14em;color:var(--muted)}
.hero-rank strong{font:900 48px/.9 var(--display);color:var(--yellow);font-style:italic;text-shadow:0 0 14px rgba(255,216,80,.35)}

.step-nav { height: 74px; display:grid;grid-template-columns:repeat(5,1fr);margin:16px 0;gap:2px; }
.step { position:relative;display:flex;align-items:center;justify-content:center;gap:11px;border:1px solid var(--line);background:rgba(17,16,48,.8);cursor:pointer;transition:.2s;overflow:hidden; }
.step::before { content:"";position:absolute;inset:auto 0 0;height:2px;background:linear-gradient(90deg,var(--cyan),var(--purple));transform:scaleX(0);transition:.2s; }
.step:hover,.step.active{background:rgba(41,38,100,.9);border-color:rgba(82,209,255,.38)}
.step.active::before{transform:scaleX(1)}
.step b{font:800 18px var(--display);color:#54577e}.step.active b{color:var(--cyan)}
.step span{font-size:11px;text-align:left;font-weight:700;line-height:1.05}.step small{color:var(--muted);font-size:9px;font-weight:500}
.step i{position:absolute;width:8px;height:8px;right:-5px;background:var(--bg);border-right:1px solid var(--line);border-top:1px solid var(--line);transform:rotate(45deg);z-index:2}
.step.done b{color:var(--green)}

.content-grid { display:grid;grid-template-columns:280px minmax(0,1fr);gap:16px; }
.mission-card,.game-card { border:1px solid var(--line);background:var(--panel);box-shadow:0 18px 50px rgba(0,0,0,.18); }
.mission-card { padding:22px;align-self:start;min-height:550px; }
.card-heading { display:flex;justify-content:space-between;align-items:flex-start;padding-bottom:16px;border-bottom:1px solid var(--line); }
.card-heading span,.section-title > div > span,.production-header span,.module-header span { display:block;color:var(--cyan);font:700 9px var(--display);letter-spacing:.16em;margin-bottom:5px; }
.card-heading strong{font:700 14px var(--display)}
.tiny-button{width:28px;height:28px;border-radius:50%;cursor:pointer;color:var(--cyan)}
.mission-progress{height:3px;background:rgba(255,255,255,.08);margin:18px 0}.mission-progress span{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--cyan),var(--purple));box-shadow:0 0 10px rgba(39,228,255,.5);transition:.35s}
.mission-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:14px}
.mission-list li{display:flex;gap:10px;align-items:center;color:var(--muted);font-size:11px;line-height:1.35}
.mission-list li i{width:20px;height:20px;border:1px solid #4f527b;border-radius:50%;display:grid;place-items:center;font-style:normal;font-size:10px;flex:0 0 auto}
.mission-list li.done{color:#fff}.mission-list li.done i{background:var(--green);border-color:var(--green);color:#0a1820}
.special-order{margin-top:24px;padding:17px;background:linear-gradient(135deg,rgba(157,77,255,.13),rgba(39,228,255,.04));border:1px solid rgba(157,77,255,.25);clip-path:polygon(0 0,92% 0,100% 18%,100% 100%,0 100%)}
.special-order span{font:700 8px var(--display);letter-spacing:.16em;color:var(--pink)}
.special-order strong{display:block;margin:7px 0;font:700 12px var(--display)}
.special-order p{font-size:9px;line-height:1.5;color:var(--muted);margin:0}
.game-card{min-height:650px;position:relative;overflow:hidden}.screen{display:none;padding:29px 32px 34px}.screen.active{display:block;animation:screen-in .25s ease-out}@keyframes screen-in{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}
.section-title,.race-head{display:flex;align-items:flex-start;justify-content:space-between;margin-bottom:23px}.section-title h2,.race-head h2{font:800 23px var(--display);margin:0;letter-spacing:-.02em}.section-lead{font-size:11px;color:var(--muted);margin:-10px 0 23px}
.live-badge{font:700 9px var(--display);letter-spacing:.1em;border:1px solid rgba(92,244,166,.3);padding:7px 11px;color:var(--green)}.live-badge i{display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--green);box-shadow:0 0 8px var(--green);margin-right:5px}
.market-grid{display:grid;grid-template-columns:1.4fr 1fr;gap:15px}.demand-card,.forecast-card{border:1px solid var(--line);background:rgba(255,255,255,.025)}
.demand-card.primary{--demand-color:var(--cyan);min-height:320px;padding:30px;position:relative;overflow:hidden;background:radial-gradient(circle at 80% 25%,color-mix(in srgb,var(--demand-color) 20%,transparent),transparent 14rem),linear-gradient(145deg,rgba(28,24,90,.85),rgba(15,15,49,.9));clip-path:polygon(0 0,94% 0,100% 12%,100% 100%,0 100%)}
.demand-card.primary::after{content:"";position:absolute;width:220px;height:220px;right:-80px;bottom:-100px;border:1px solid color-mix(in srgb,var(--demand-color) 30%,transparent);border-radius:50%;box-shadow:0 0 0 30px color-mix(in srgb,var(--demand-color) 4%,transparent),0 0 0 60px color-mix(in srgb,var(--demand-color) 3%,transparent)}
.demand-card > span,.forecast-card > span{font:700 9px var(--display);color:var(--muted);letter-spacing:.14em}.demand-icon{position:absolute;right:30px;top:52px;width:88px;height:88px;border:1px solid color-mix(in srgb,var(--demand-color) 45%,transparent);display:grid;place-items:center;transform:rotate(45deg);font:800 24px var(--display);color:var(--demand-color);box-shadow:inset 0 0 25px color-mix(in srgb,var(--demand-color) 10%,transparent),0 0 30px color-mix(in srgb,var(--demand-color) 8%,transparent)}.demand-icon::first-line{transform:rotate(-45deg)}
.demand-card h3{font:900 34px var(--display);font-style:italic;margin:55px 0 8px;color:var(--demand-color);text-shadow:0 0 16px color-mix(in srgb,var(--demand-color) 35%,transparent)}.demand-card p,.forecast-card p{color:var(--muted);font-size:10px;max-width:60%;line-height:1.55}.trend{position:absolute;bottom:28px;left:30px;right:30px;display:flex;align-items:end;justify-content:space-between;border-top:1px solid var(--line);padding-top:16px}.trend span{font:600 9px var(--display);color:var(--muted)}.trend b{font:800 24px var(--display);color:var(--green)}
.market-side{display:grid;grid-template-rows:1fr 1fr;gap:15px}.demand-card.compact,.forecast-card{padding:23px}.demand-card.compact{--demand-color:var(--drift);display:flex;align-items:center;justify-content:space-between;border-color:color-mix(in srgb,var(--demand-color) 25%,transparent)}.demand-card.compact span{font:600 8px var(--display);color:var(--muted);letter-spacing:.12em}.demand-card.compact h3{font-size:22px;margin:8px 0;color:var(--demand-color)}.demand-card.compact b{font:800 18px var(--display);color:var(--green)}.forecast-card{--demand-color:var(--yellow);background:linear-gradient(135deg,color-mix(in srgb,var(--demand-color) 10%,transparent),rgba(255,255,255,.02));border-color:color-mix(in srgb,var(--demand-color) 20%,transparent)}.forecast-card strong{display:block;margin:15px 0 3px;font:800 21px var(--display);color:var(--demand-color)}.forecast-card p{max-width:none}
.primary-button,.outline-button,.text-button{border:0;cursor:pointer;font:700 10px var(--display);letter-spacing:.08em}.primary-button{min-height:43px;padding:0 20px;background:linear-gradient(105deg,#416cff,#8b4dff);box-shadow:0 9px 22px rgba(82,74,255,.25);clip-path:polygon(0 0,93% 0,100% 32%,100% 100%,7% 100%,0 68%)}.primary-button span{margin-left:15px;color:var(--cyan);font-size:16px}.primary-button:disabled{filter:grayscale(.8);opacity:.45;cursor:not-allowed;box-shadow:none}.screen-briefing{}.market-grid + .primary-button,#screen-briefing>.primary-button{display:block;margin:20px 0 0 auto}.outline-button{padding:10px 14px;border:1px solid rgba(70,208,255,.3);background:rgba(39,228,255,.05);color:var(--cyan)}.outline-button b{color:var(--yellow)}.text-button{background:none;color:var(--muted);padding:10px}

.production-layout{display:grid;grid-template-columns:1.08fr .92fr;gap:18px}.part-catalog{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}.part-card{position:relative;padding:15px 14px;border:1px solid var(--line);background:rgba(255,255,255,.025);cursor:pointer;text-align:left;transition:.2s;min-height:107px;overflow:hidden}.part-card:hover,.part-card.selected{transform:translateY(-2px);border-color:var(--part-color);box-shadow:inset 0 0 25px color-mix(in srgb,var(--part-color) 8%,transparent)}.part-card::after{content:"";position:absolute;width:55px;height:55px;right:-20px;top:-20px;border:1px solid var(--part-color);transform:rotate(45deg);opacity:.25}.part-card span{font:700 8px var(--display);color:var(--part-color);letter-spacing:.12em}.part-card strong{display:block;font:700 12px var(--display);margin:7px 0 5px}.part-card small{font-size:8px;color:var(--muted)}.part-card b{position:absolute;right:10px;bottom:9px;font:700 10px var(--display);color:var(--yellow)}
.production-area{border:1px solid var(--line);padding:17px;background:rgba(9,8,33,.5)}.production-header,.module-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}.production-header span,.module-header span{margin:0}.production-header small,.module-header small{font:600 8px var(--display);color:var(--muted)}.production-slots{display:flex;flex-direction:column;gap:9px;min-height:260px}.production-slot{height:69px;border:1px dashed #393c69;display:flex;align-items:center;padding:10px;gap:11px;position:relative;color:var(--muted);font-size:10px}.production-slot.filled{border-style:solid;border-color:color-mix(in srgb,var(--part-color) 32%,transparent);background:color-mix(in srgb,var(--part-color) 5%,transparent)}.slot-icon{width:40px;height:40px;display:grid;place-items:center;background:color-mix(in srgb,var(--part-color,var(--cyan)) 9%,transparent);border:1px solid color-mix(in srgb,var(--part-color,var(--cyan)) 24%,transparent);font:800 13px var(--display);color:var(--part-color,var(--cyan))}.production-slot strong{display:block;color:#fff;font:700 10px var(--display);margin-bottom:4px}.production-slot small{font-size:8px;color:var(--muted)}.production-slot button{margin-left:auto;border:0;background:none;color:var(--danger);cursor:pointer}.production-area>.primary-button{width:100%;margin-top:14px}

.quality-meter{text-align:right}.quality-meter span{display:block;font:600 8px var(--display);color:var(--muted);letter-spacing:.12em}.quality-meter strong{display:block;font:800 23px var(--display);color:var(--cyan)}.quality-meter small{display:block;font:700 7px var(--display);color:var(--yellow);letter-spacing:.08em;margin-top:2px}.tuning-layout{display:grid;grid-template-columns:minmax(330px,.9fr) minmax(280px,1.1fr);gap:22px}.tuning-toolbar{display:flex;justify-content:space-between;margin-bottom:10px}kbd{border:1px solid rgba(255,255,255,.2);padding:2px 5px;border-radius:3px;font:600 8px var(--display);background:rgba(255,255,255,.08)}.tuning-grid{width:min(100%,440px);aspect-ratio:var(--board-ratio,1);display:grid;grid-template-columns:repeat(var(--board-cols,5),1fr);grid-template-rows:repeat(var(--board-rows,5),1fr);gap:4px;padding:8px;background:#090925;border:1px solid rgba(77,124,255,.3);box-shadow:inset 0 0 30px rgba(0,0,0,.4);transition:border-color .15s,box-shadow .15s}.tuning-grid.drop-active{border-color:var(--cyan);box-shadow:inset 0 0 30px rgba(0,0,0,.4),0 0 22px rgba(39,228,255,.12)}.grid-cell{border:1px solid rgba(98,107,180,.18);background:linear-gradient(135deg,rgba(255,255,255,.025),rgba(33,37,89,.16));cursor:default;position:relative;transition:.1s;min-width:0;min-height:0}.grid-cell.drop-target{border-color:var(--yellow);background:rgba(255,216,80,.11);box-shadow:inset 0 0 12px rgba(255,216,80,.16)}.grid-cell.blocked{border:0;background:transparent;pointer-events:none}.grid-cell.blocked::before,.grid-cell.blocked::after{content:"";position:absolute;left:12%;right:12%;top:50%;height:1px;background:rgba(98,107,180,.15);transform:rotate(45deg)}.grid-cell.blocked::after{transform:rotate(-45deg)}.grid-cell.filled{background:color-mix(in srgb,var(--cell-color) 34%,#111339);border-color:var(--cell-color);box-shadow:inset 0 0 10px color-mix(in srgb,var(--cell-color) 25%,transparent),0 0 7px color-mix(in srgb,var(--cell-color) 30%,transparent)}.grid-cell.filled::after{content:"";position:absolute;inset:22%;height:auto;background:transparent;border:1px solid color-mix(in srgb,var(--cell-color) 65%,white);transform:rotate(45deg);opacity:.7}.grid-legend{display:flex;flex-wrap:wrap;gap:13px;margin-top:10px;font-size:8px;color:var(--muted)}.grid-legend i{display:inline-block;width:7px;height:7px;margin-right:5px}.grid-legend .nitro{background:var(--cyan)}.grid-legend .drift{background:var(--drift)}.grid-legend .speed{background:var(--yellow)}.grid-legend .balance{background:var(--purple)}
.grid-cell.blocked{pointer-events:auto;cursor:not-allowed}.grid-cell.drop-preview{z-index:2;border:1px dashed var(--preview-color);background:color-mix(in srgb,var(--preview-color) 24%,#111339);box-shadow:inset 0 0 16px color-mix(in srgb,var(--preview-color) 22%,transparent),0 0 9px color-mix(in srgb,var(--preview-color) 25%,transparent);opacity:.68}.grid-cell.drop-preview::before{content:"";position:absolute;inset:25%;border:1px solid color-mix(in srgb,var(--preview-color) 75%,white);background:color-mix(in srgb,var(--preview-color) 12%,transparent);transform:rotate(45deg);opacity:.8}.grid-cell.drop-preview.preview-invalid{background:repeating-linear-gradient(135deg,color-mix(in srgb,var(--danger) 26%,#111339) 0 6px,color-mix(in srgb,var(--danger) 9%,#111339) 6px 12px);border-color:var(--danger)}.tuning-grid.preview-valid{border-color:var(--cyan);box-shadow:inset 0 0 30px rgba(0,0,0,.4),0 0 22px rgba(39,228,255,.16)}.tuning-grid.preview-invalid{border-color:var(--danger);box-shadow:inset 0 0 30px rgba(0,0,0,.4),0 0 22px rgba(255,83,104,.16)}
.module-panel{border-left:1px solid var(--line);padding-left:20px}.module-list{display:grid;grid-template-columns:repeat(2,1fr);gap:8px;max-height:270px;overflow:auto;padding-right:3px}.module-card{min-height:75px;border:1px solid var(--line);background:rgba(255,255,255,.025);padding:10px;cursor:grab;display:flex;gap:10px;text-align:left;touch-action:none;user-select:none;position:relative}.module-card:active{cursor:grabbing}.module-card:hover,.module-card.selected{border-color:var(--part-color);background:color-mix(in srgb,var(--part-color) 8%,transparent)}.module-card.selected::after{content:"↻";position:absolute;right:7px;top:5px;color:var(--part-color);font:800 12px var(--display)}.module-card.dragging{opacity:.35}.module-card.used{opacity:.28;pointer-events:none}.drag-ghost{position:fixed;z-index:100;pointer-events:none;width:150px;opacity:.9;transform:translate(-50%,-50%) rotate(-3deg);box-shadow:0 15px 35px rgba(0,0,0,.45);border-color:var(--part-color)!important;background:#151442!important}.mini-shape{width:35px;height:35px;display:grid;grid-template-columns:repeat(3,10px);grid-template-rows:repeat(3,10px);gap:2px;flex:0 0 auto}.mini-shape i{background:transparent}.mini-shape i.on{background:var(--part-color);box-shadow:0 0 5px color-mix(in srgb,var(--part-color) 50%,transparent)}.module-card strong{display:block;font:700 9px var(--display);margin-bottom:4px}.module-card span{font-size:7px;color:var(--part-color);text-transform:uppercase}.build-stats{margin:15px 0;display:grid;grid-template-columns:repeat(3,1fr);gap:6px}.build-stats div{padding:9px;background:rgba(255,255,255,.025);text-align:center;border-top:2px solid var(--line)}.build-stats span{display:block;font:600 7px var(--display);color:var(--muted)}.build-stats b{font:800 14px var(--display)}.module-panel>.primary-button{width:100%}

.race-head{margin-bottom:13px}.race-head>div>span{font:700 8px var(--display);letter-spacing:.14em;color:var(--cyan)}.race-stats{display:flex!important;gap:20px}.race-stats>span{display:block;text-align:right}.race-stats small{display:block;font:600 7px var(--display);color:var(--muted);letter-spacing:.1em}.race-stats b{font:800 16px var(--display)}.race-stage{position:relative;background:#050516;overflow:hidden;border:1px solid rgba(77,124,255,.25);aspect-ratio:16/8.3;min-height:370px}.race-stage.impact{animation:impact-shake .22s linear}.race-stage.impact::after{content:"VA CHẠM · −30 C";position:absolute;left:50%;top:30%;transform:translate(-50%,-50%);z-index:2;color:#fff;background:rgba(255,83,104,.88);padding:8px 15px;font:800 11px var(--display);letter-spacing:.08em;box-shadow:0 0 25px rgba(255,83,104,.6)}@keyframes impact-shake{0%,100%{transform:none}25%{transform:translateX(-7px)}75%{transform:translateX(7px)}}.race-stage canvas{width:100%;height:100%;display:block}.race-overlay{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;background:radial-gradient(circle,rgba(23,20,78,.55),rgba(5,5,22,.9));padding:25px;z-index:3}.race-overlay.hidden{display:none}.race-overlay>span{font:700 9px var(--display);color:var(--muted);letter-spacing:.13em}.race-overlay>span b{color:var(--cyan)}.race-overlay h3{font:900 27px var(--display);font-style:italic;margin:11px 0 7px}.race-overlay p{font-size:9px;color:var(--muted);margin:0 0 20px}.race-hud{position:absolute;inset:16px;pointer-events:none;display:flex;justify-content:space-between;align-items:flex-end}.race-hud.hidden{display:none}.speedometer strong{font:900 29px var(--display);font-style:italic}.speedometer span{display:block;font:700 8px var(--display);color:var(--cyan)}.nitro-bar{width:160px;text-align:right;font:700 7px var(--display)}.nitro-bar>span{color:var(--cyan)}.nitro-bar>div{height:7px;background:rgba(255,255,255,.14);margin:5px 0}.nitro-bar i{display:block;width:100%;height:100%;background:linear-gradient(90deg,var(--blue),var(--cyan));box-shadow:0 0 8px var(--cyan)}.mobile-controls{display:none;position:absolute;left:10px;right:10px;bottom:8px;justify-content:space-between;z-index:2}.mobile-controls button{width:52px;height:42px;border:1px solid rgba(255,255,255,.22);background:rgba(11,10,42,.65);color:#fff;font:700 9px var(--display);backdrop-filter:blur(5px)}.mobile-controls button:first-child,.mobile-controls button:last-child{font-size:23px}

.result-layout{display:grid;grid-template-columns:1.3fr .7fr;gap:20px}.result-summary{border:1px solid var(--line);padding:24px;background:radial-gradient(circle at 30% 30%,rgba(83,78,255,.18),transparent 15rem)}.result-car{height:170px;position:relative;overflow:hidden}.result-car span{position:absolute;width:260px;height:84px;left:50%;top:50%;transform:translate(-50%,-50%) skewX(-10deg);background:linear-gradient(155deg,#764aff,#202070);clip-path:polygon(7% 34%,26% 5%,70% 0,92% 33%,100% 72%,88% 95%,12% 100%,0 70%);filter:drop-shadow(0 16px 14px #03030e)}.result-car span::after{content:"";position:absolute;left:15%;right:8%;top:51%;height:10px;background:linear-gradient(90deg,var(--pink),var(--cyan));transform:skewX(-35deg)}.result-car i,.result-car b{position:absolute;width:48px;height:48px;border:8px solid #080814;border-radius:50%;top:58%;z-index:2;background:radial-gradient(circle,#8a8bbd 0 18%,#242044 20% 46%,var(--cyan) 49% 53%,#111 55%)}.result-car i{left:28%}.result-car b{right:25%}.result-bars{display:flex;flex-direction:column;gap:11px}.result-bars>div{display:grid;grid-template-columns:110px 1fr 38px;align-items:center;gap:9px;font-size:8px;color:var(--muted)}.result-bars i{height:5px;background:rgba(255,255,255,.09)}.result-bars i b{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--blue),var(--cyan));transition:.5s}.result-bars strong{text-align:right;color:#fff;font:700 9px var(--display)}.revenue-card{border:1px solid rgba(255,216,80,.2);background:linear-gradient(145deg,rgba(255,216,80,.07),rgba(157,77,255,.06));padding:25px;display:flex;flex-direction:column;justify-content:center}.revenue-card>span{font:700 8px var(--display);letter-spacing:.12em;color:var(--muted)}.revenue-card>strong{font:900 35px var(--display);color:var(--yellow);margin:14px 0 16px}.revenue-card>strong i{display:inline-grid;place-items:center;width:27px;height:27px;background:var(--yellow);color:#171127;border-radius:50%;font:800 13px var(--display)}.coin-breakdown{border-top:1px solid var(--line);padding-top:10px;margin-bottom:18px}.coin-breakdown>div{display:flex;justify-content:space-between;gap:12px;font-size:8px;padding:5px 0}.coin-breakdown span{color:var(--muted)}.coin-breakdown b{font:700 8px var(--display);color:var(--green);white-space:nowrap}.coin-breakdown .penalty b{color:var(--danger)}.coin-breakdown .bonus{border-top:1px solid var(--line);margin-top:5px;padding-top:9px}.coin-breakdown .bonus b{color:var(--yellow)}
.result-grade{font:900 45px var(--display);color:var(--yellow);font-style:italic;text-shadow:0 0 15px rgba(255,216,80,.3)}

.reset-game-button{height:36px;padding:0 13px;border:1px solid rgba(255,83,104,.28);background:rgba(255,83,104,.06);color:var(--danger);display:flex;align-items:center;gap:7px;cursor:pointer;font:700 8px var(--display);letter-spacing:.08em;transition:.2s}.reset-game-button:hover{border-color:var(--danger);background:rgba(255,83,104,.12)}.reset-game-button span{font-size:16px}.cycle-score-line{display:flex;align-items:center;justify-content:space-between;margin:0 0 14px;padding:10px 12px;background:rgba(39,228,255,.06);border-left:2px solid var(--cyan)}.cycle-score-line span{font:700 8px var(--display);color:var(--muted);letter-spacing:.1em}.cycle-score-line b{font:800 13px var(--display);color:var(--cyan)}

.opening-modal{width:100vw;max-width:none;height:100vh;max-height:none;margin:0;padding:0;border:0;color:var(--text);background:radial-gradient(circle at 72% 45%,#292080 0,#10103a 29%,#060618 68%);overflow:hidden}.opening-modal::backdrop{background:#04040f}.opening-bg{position:absolute;inset:-20%;transform:skewY(-7deg);background:repeating-linear-gradient(105deg,transparent 0 115px,rgba(39,228,255,.045) 116px 118px)}.opening-bg i{position:absolute;height:2px;width:48vw;background:linear-gradient(90deg,transparent,var(--cyan),transparent);box-shadow:0 0 13px var(--cyan);animation:opening-line 3.4s linear infinite;opacity:.45}.opening-bg i:nth-child(1){top:29%;left:28%;animation-delay:-.4s}.opening-bg i:nth-child(2){top:47%;left:45%;animation-delay:-1.8s}.opening-bg i:nth-child(3){top:65%;left:11%;animation-delay:-2.7s}.opening-bg i:nth-child(4){top:82%;left:57%;animation-delay:-1.1s}@keyframes opening-line{from{transform:translateX(-35vw)}to{transform:translateX(65vw)}}.opening-city{position:absolute;left:0;right:0;bottom:0;height:37%;opacity:.65;background:linear-gradient(transparent,rgba(6,6,28,.82))}.opening-city i{position:absolute;bottom:0;width:10%;background:#080824;border-top:1px solid rgba(39,228,255,.22);box-shadow:inset 8px 0 0 rgba(83,75,255,.05)}.opening-city i::after{content:"";position:absolute;inset:12px 14px;background:repeating-linear-gradient(180deg,rgba(39,228,255,.18) 0 3px,transparent 3px 15px)}.opening-city i:nth-child(1){left:1%;height:42%}.opening-city i:nth-child(2){left:13%;height:72%;width:13%}.opening-city i:nth-child(3){left:29%;height:51%;width:8%}.opening-city i:nth-child(4){right:29%;height:78%;width:12%}.opening-city i:nth-child(5){right:13%;height:56%;width:13%}.opening-city i:nth-child(6){right:1%;height:39%}.opening-content{position:absolute;left:max(6vw,45px);top:50%;transform:translateY(-52%);z-index:3;width:min(520px,43vw)}.opening-kicker{font:700 10px var(--display);color:var(--cyan);letter-spacing:.22em}.opening-logo{display:flex;align-items:center;gap:11px;margin:18px 0 32px}.opening-logo>b{width:43px;height:43px;display:grid;place-items:center;transform:skew(-12deg);background:linear-gradient(135deg,var(--cyan),var(--purple));clip-path:polygon(16% 0,100% 0,84% 100%,0 100%);font:900 28px var(--display)}.opening-logo>span{display:flex;flex-direction:column;font:800 19px/16px var(--display);letter-spacing:.08em}.opening-logo em{font-style:normal;font-size:10px;letter-spacing:.31em;color:var(--cyan)}.opening-content h1{font:900 clamp(43px,6vw,84px)/.82 var(--display);font-style:italic;letter-spacing:-.055em;margin:0;text-shadow:0 15px 38px rgba(0,0,0,.45)}.opening-content h1 em{font-style:italic;color:transparent;-webkit-text-stroke:1.5px var(--cyan);text-shadow:0 0 25px rgba(39,228,255,.25)}.opening-content>p{font-size:12px;color:var(--muted);margin:25px 0 22px}.opening-route{display:flex;align-items:center;gap:10px;color:#c8ccef;font:600 8px var(--display);letter-spacing:.08em}.opening-route span{display:flex;align-items:center;gap:5px}.opening-route b{color:var(--cyan)}.opening-route i{width:24px;height:1px;background:rgba(255,255,255,.18)}.opening-button{display:flex;align-items:center;justify-content:space-between;width:235px;height:52px;margin-top:30px;padding:0 21px;border:0;color:#fff;cursor:pointer;background:linear-gradient(105deg,#3975ff,#9c45ff);clip-path:polygon(0 0,92% 0,100% 35%,100% 100%,8% 100%,0 65%);font:800 11px var(--display);letter-spacing:.1em;box-shadow:0 15px 35px rgba(76,74,255,.3)}.opening-button span{font-size:20px;color:var(--cyan)}.opening-content>small{display:block;margin-top:12px;color:#656b99;font-size:8px}.opening-car-scene{position:absolute;right:3vw;top:42%;width:52vw;height:320px;z-index:2;transform:translateY(-38%)}.opening-car-shadow{position:absolute;left:15%;right:2%;bottom:4%;height:55px;background:#02020c;filter:blur(18px);border-radius:50%}.opening-car{position:absolute;right:5%;bottom:13%;width:610px;height:205px;filter:drop-shadow(0 30px 24px rgba(0,0,0,.7));animation:opening-car-in 1s cubic-bezier(.15,.8,.2,1) both}@keyframes opening-car-in{from{transform:translateX(35vw);opacity:0}to{transform:none;opacity:1}}.opening-car>span{position:absolute;left:40px;right:0;bottom:20px;height:130px;background:linear-gradient(160deg,#9b57ff 0,#5843dc 35%,#171347 77%);clip-path:polygon(4% 28%,28% 3%,68% 0,91% 24%,100% 61%,91% 87%,14% 100%,0 73%);box-shadow:inset 0 7px 0 rgba(255,255,255,.25)}.opening-car>span::after{content:"";position:absolute;left:8%;right:5%;top:52%;height:18px;background:linear-gradient(90deg,var(--drift),var(--cyan));clip-path:polygon(0 40%,91% 0,100% 35%,13% 100%)}.opening-car>i,.opening-car>b{position:absolute;bottom:0;width:105px;height:105px;border:17px solid #05050d;border-radius:50%;background:radial-gradient(circle,#8c91bd 0 16%,#29254e 18% 43%,var(--cyan) 45% 50%,#111 52%);z-index:2;box-shadow:0 0 24px rgba(39,228,255,.24)}.opening-car>i{left:100px}.opening-car>b{right:67px}.opening-car>em{position:absolute;width:255px;height:85px;right:130px;top:0;background:linear-gradient(145deg,#5152a9,#0c1639 70%);clip-path:polygon(27% 0,77% 8%,100% 100%,0 100%);box-shadow:inset 0 4px 0 rgba(39,228,255,.35)}.opening-trails{position:absolute;right:28%;bottom:23%;width:65%;height:40%}.opening-trails i{position:absolute;right:20%;height:3px;width:75%;background:linear-gradient(90deg,transparent,var(--cyan));transform:skewX(-28deg);box-shadow:0 0 12px var(--cyan)}.opening-trails i:nth-child(2){top:33%;right:31%;width:58%;background:linear-gradient(90deg,transparent,var(--purple))}.opening-trails i:nth-child(3){top:66%;right:14%;width:86%;background:linear-gradient(90deg,transparent,var(--drift))}.opening-skip{position:absolute;right:28px;bottom:22px;font:600 7px var(--display);letter-spacing:.15em;color:#60658d}

.reset-modal{text-align:center}.reset-modal .reset-icon{width:68px;height:68px;margin:20px auto 8px;display:grid;place-items:center;border:1px solid rgba(255,83,104,.3);border-radius:50%;color:var(--danger);font:700 32px var(--display);background:rgba(255,83,104,.06)}.reset-modal h2{margin-bottom:10px}.reset-modal>p{font-size:10px;line-height:1.7;color:var(--muted);max-width:430px;margin:0 auto 24px}.modal-actions{display:flex;justify-content:center;gap:10px}.modal-actions button{min-width:175px}

.season-modal{width:min(1040px,calc(100% - 32px));max-width:none;max-height:94vh;padding:32px;color:var(--text);border:1px solid rgba(93,111,255,.4);background:radial-gradient(circle at 80% 5%,rgba(123,70,255,.22),transparent 25rem),linear-gradient(145deg,#12103c,#080720);box-shadow:0 35px 100px rgba(0,0,0,.72);overflow:auto}.season-modal::backdrop{background:rgba(3,2,14,.84);backdrop-filter:blur(7px)}.season-burst{position:absolute;width:440px;height:440px;right:-150px;top:-250px;border-radius:50%;border:1px solid rgba(39,228,255,.15);box-shadow:0 0 0 45px rgba(39,228,255,.025),0 0 0 90px rgba(157,77,255,.025);pointer-events:none}.season-header{display:flex;justify-content:space-between;align-items:flex-start;padding-bottom:19px;border-bottom:1px solid var(--line)}.season-header span,.career-heading span{font:700 9px var(--display);color:var(--cyan);letter-spacing:.18em}.season-header h2{margin:6px 0 0;font:900 28px var(--display);font-style:italic}.season-rank{text-align:center}.season-rank small{display:block;color:var(--muted);font:600 7px var(--display)}.season-rank strong{font:900 47px/.9 var(--display);font-style:italic;color:var(--yellow);text-shadow:0 0 17px rgba(255,216,80,.35)}.season-scoreboard{display:grid;grid-template-columns:1.55fr repeat(3,1fr);gap:10px;margin:18px 0}.season-scoreboard>div{min-height:95px;padding:16px;border:1px solid var(--line);background:rgba(255,255,255,.025);display:flex;flex-direction:column;justify-content:center}.season-scoreboard span{font:700 7px var(--display);color:var(--muted);letter-spacing:.1em}.season-scoreboard strong{font:800 23px var(--display);margin-top:8px}.season-scoreboard .main-season-score{background:linear-gradient(135deg,rgba(39,228,255,.12),rgba(157,77,255,.08));border-color:rgba(39,228,255,.24);display:grid;grid-template-columns:1fr auto;grid-template-rows:auto auto;align-items:end}.main-season-score span{grid-column:1/-1}.main-season-score strong{font-size:38px;color:var(--cyan);line-height:1}.main-season-score small{font:700 9px var(--display);color:var(--muted);padding-bottom:5px}.season-cycle-row{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;margin-bottom:18px}.season-cycle-card{padding:11px 12px;background:rgba(255,255,255,.025);border-left:2px solid var(--blue);display:flex;justify-content:space-between;align-items:center}.season-cycle-card span{font:600 7px var(--display);color:var(--muted)}.season-cycle-card b{font:800 10px var(--display)}.career-section{padding:20px;border:1px solid rgba(157,77,255,.24);background:rgba(157,77,255,.045)}.career-heading{display:flex;justify-content:space-between;align-items:end}.career-heading h3{font:800 17px var(--display);margin:5px 0 0}.career-heading>strong{font:700 8px var(--display);color:var(--yellow)}.career-progress{position:relative;height:7px;margin:20px 0 17px;background:rgba(255,255,255,.09)}.career-progress span{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--blue),var(--cyan),var(--yellow));box-shadow:0 0 12px rgba(39,228,255,.38);transition:width .8s ease}.career-progress i{position:absolute;top:50%;left:0;width:14px;height:14px;border:3px solid var(--cyan);background:#11103a;border-radius:50%;transform:translate(-50%,-50%);transition:left .8s ease}.milestone-list{display:grid;grid-template-columns:repeat(4,1fr);gap:9px}.milestone-card{position:relative;min-height:105px;padding:13px;border:1px solid var(--line);background:rgba(8,7,32,.5);overflow:hidden}.milestone-card::after{content:"";position:absolute;width:50px;height:50px;right:-27px;top:-27px;border:1px solid var(--milestone-color,var(--purple));transform:rotate(45deg);opacity:.35}.milestone-card.unlocked{border-color:color-mix(in srgb,var(--milestone-color) 48%,transparent);background:color-mix(in srgb,var(--milestone-color) 7%,transparent)}.milestone-card.new{animation:reward-pulse 1s ease-in-out 2}@keyframes reward-pulse{50%{box-shadow:0 0 25px color-mix(in srgb,var(--milestone-color) 40%,transparent);transform:translateY(-2px)}}.milestone-card>span{font:700 8px var(--display);color:var(--milestone-color);letter-spacing:.08em}.milestone-card strong{display:block;font:800 14px var(--display);margin:12px 0 7px}.milestone-card small{font-size:7px;color:var(--muted)}.milestone-card b{position:absolute;right:10px;bottom:9px;font:700 7px var(--display);color:var(--muted)}.milestone-card.unlocked b{color:var(--green)}.season-footer{display:flex;justify-content:space-between;align-items:center;margin-top:20px}.season-footer p{font-size:9px;color:var(--muted);margin:0}.season-footer .primary-button{min-width:225px}

.toast{position:fixed;left:50%;bottom:28px;transform:translate(-50%,20px);padding:11px 18px;background:#fff;color:#11112c;font:700 10px var(--body);border-left:4px solid var(--cyan);opacity:0;pointer-events:none;transition:.25s;z-index:10;box-shadow:0 12px 35px rgba(0,0,0,.35)}.toast.show{opacity:1;transform:translate(-50%,0)}
.modal{width:min(560px,calc(100% - 34px));color:var(--text);border:1px solid rgba(80,164,255,.35);background:linear-gradient(145deg,#151345,#0a0928);padding:34px;box-shadow:0 30px 80px rgba(0,0,0,.6)}.modal::backdrop{background:rgba(3,2,15,.78);backdrop-filter:blur(5px)}.modal-close{position:absolute;right:14px;top:12px;border:0;background:none;color:var(--muted);font-size:24px;cursor:pointer}.modal h2{font:800 25px var(--display);margin:11px 0 22px}.tutorial-steps{display:grid;gap:9px;margin-bottom:24px}.tutorial-steps>div{display:flex;align-items:center;gap:12px;padding:10px;background:rgba(255,255,255,.03);border-left:2px solid var(--cyan)}.tutorial-steps b{font:800 15px var(--display);color:var(--cyan)}.tutorial-steps span{display:flex;flex-direction:column}.tutorial-steps strong{font-size:10px}.tutorial-steps small{font-size:8px;color:var(--muted);margin-top:2px}.reward-modal{text-align:center;overflow:hidden}.reward-burst{position:absolute;width:350px;height:350px;left:50%;top:15%;transform:translate(-50%,-50%);background:repeating-conic-gradient(from 0deg,rgba(255,216,80,.12) 0 4deg,transparent 4deg 16deg);border-radius:50%;animation:spin 14s linear infinite;z-index:-1}@keyframes spin{to{transform:translate(-50%,-50%) rotate(360deg)}}.reward-icon{font-size:50px;margin-top:22px}.reward-modal p{color:var(--muted);font-size:10px;margin:-8px 0 23px}.reward-modal .primary-button{min-width:180px}
footer{max-width:1380px;margin:0 auto 25px;padding:0 25px;display:flex;justify-content:space-between;color:#60658e;font:600 8px var(--display);letter-spacing:.08em}footer p{font:400 8px var(--body);margin:0;letter-spacing:0}

@media (max-width: 980px){
  .hero-car-wrap{right:-5%;width:65%;opacity:.8}.content-grid{grid-template-columns:1fr}.mission-card{min-height:auto}.mission-list{display:grid;grid-template-columns:repeat(2,1fr)}.special-order{margin-top:18px}.production-layout,.tuning-layout,.result-layout{grid-template-columns:1fr}.module-panel{border-left:0;border-top:1px solid var(--line);padding:18px 0 0}.tuning-grid{margin:auto}.mobile-controls{display:flex}.race-hud{bottom:55px}
}
@media (max-width: 700px){
  .topbar{height:60px;padding:0 14px;gap:12px}.brand>span:last-child{display:none}.cycle-chip{padding:6px 9px}.cycle-chip span{display:none}.currency{gap:8px}.currency>div{font-size:10px}.app-shell{width:calc(100% - 20px);margin-top:12px}.hero-panel{height:170px;padding:24px 27px}.hero-copy h1{font-size:34px}.hero-copy p{font-size:9px}.hero-car-wrap{right:-34%;width:100%;opacity:.55}.hero-car{transform:scale(.72) skewX(-6deg);transform-origin:right center}.hero-rank{right:16px}.step-nav{height:59px}.step{gap:4px}.step b{font-size:13px}.step span{display:none}.content-grid{gap:10px}.mission-card{padding:17px}.mission-list{grid-template-columns:1fr}.screen{padding:21px 16px 25px}.section-title h2,.race-head h2{font-size:18px}.market-grid{grid-template-columns:1fr}.demand-card.primary{min-height:270px;padding:23px}.demand-card h3{margin-top:48px}.market-side{grid-template-columns:1fr 1fr;grid-template-rows:auto}.demand-card.compact,.forecast-card{padding:16px}.demand-card.compact{display:block}.demand-card.compact h3{font-size:15px}.forecast-card strong{font-size:14px;margin:8px 0}.part-catalog{grid-template-columns:1fr 1fr}.part-card{min-height:100px}.tuning-layout{grid-template-columns:1fr}.module-list{grid-template-columns:1fr 1fr}.race-stage{min-height:420px;aspect-ratio:auto}.race-head{display:block}.race-stats{margin-top:12px;justify-content:flex-start}.race-stats>span{text-align:left}.race-overlay h3{font-size:20px}.result-bars>div{grid-template-columns:90px 1fr 35px}footer{display:block;text-align:center}footer p{margin-top:7px}
}
@media (max-width: 420px){.part-catalog,.module-list,.market-side{grid-template-columns:1fr}.hero-car-wrap{right:-48%}.currency-icon{display:none}.screen{padding-left:12px;padding-right:12px}.modal{padding:28px 20px}.race-overlay p{max-width:260px}.mobile-controls button{width:48px}}

@media (max-width: 980px){.opening-content{left:5vw;width:48vw}.opening-car-scene{right:-17vw;width:70vw;opacity:.72}.opening-car{transform:scale(.82);transform-origin:right center}.season-scoreboard{grid-template-columns:1.4fr 1fr 1fr}.season-scoreboard>div:last-child{grid-column:2/4}.milestone-list{grid-template-columns:repeat(2,1fr)}}
@media (max-width: 700px){.reset-game-button{width:36px;padding:0;justify-content:center}.reset-game-button b{display:none}.opening-content{left:24px;right:24px;top:auto;bottom:42px;width:auto;transform:none}.opening-kicker{font-size:8px}.opening-logo{margin:10px 0 20px}.opening-content h1{font-size:45px}.opening-content>p{font-size:9px;margin:16px 0}.opening-route{display:none}.opening-button{margin-top:19px;width:100%;max-width:310px}.opening-car-scene{top:26%;right:-28%;width:120vw;height:250px;opacity:.52;transform:translateY(-50%)}.opening-car{transform:scale(.58);transform-origin:right center}.opening-city{height:43%}.opening-skip{display:none}.season-modal{padding:21px 15px}.season-header h2{font-size:20px}.season-scoreboard{grid-template-columns:1fr 1fr}.season-scoreboard .main-season-score{grid-column:1/-1}.season-scoreboard>div:last-child{grid-column:auto}.season-cycle-row{grid-template-columns:1fr}.season-cycle-card{padding:9px 11px}.career-heading{display:block}.career-heading>strong{display:block;margin-top:8px}.season-footer{display:block}.season-footer p{margin-bottom:14px}.season-footer .primary-button{width:100%}.modal-actions{flex-direction:column}.modal-actions button{width:100%;min-width:0}}
@media (max-width: 420px){.milestone-list{grid-template-columns:1fr}.season-scoreboard{grid-template-columns:1fr}.season-scoreboard>div:last-child{grid-column:auto}.opening-content h1{font-size:39px}.opening-car-scene{right:-45%}}

@media (prefers-reduced-motion: reduce){*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.01ms!important}}

/* Speed Garage visual system — bright mobile-racing HUD */
:root{
  --bg:#041226;
  --panel:rgba(6,35,68,.94);
  --panel-2:#0b3761;
  --line:rgba(117,210,255,.28);
  --text:#f8fcff;
  --muted:#a9c8df;
  --cyan:#27e4ff;
  --blue:#168cff;
  --purple:#9d4dff;
  --pink:#ff4b9b;
  --yellow:#ffba24;
  --green:#5cf4a6;
  --display:"Rajdhani","Oxanium",sans-serif;
}

body{
  background:
    radial-gradient(circle at 77% 4%,rgba(43,178,255,.28),transparent 28rem),
    radial-gradient(circle at 8% 58%,rgba(0,114,255,.18),transparent 34rem),
    linear-gradient(145deg,#061b36 0%,#06294e 44%,#041326 100%);
}
body::before{
  content:"";position:fixed;inset:0;z-index:-2;pointer-events:none;opacity:.34;
  background:
    linear-gradient(115deg,transparent 0 65%,rgba(43,219,255,.12) 65.2% 65.7%,transparent 66%),
    repeating-linear-gradient(0deg,transparent 0 47px,rgba(117,210,255,.04) 48px 49px);
}
.speed-lines{opacity:.38;background-image:linear-gradient(112deg,transparent 0 46%,rgba(35,205,255,.18) 47%,transparent 48% 100%)}

.topbar{
  max-width:none;height:68px;padding:0 max(26px,calc((100vw - 1380px)/2));
  background:linear-gradient(90deg,rgba(3,19,40,.98),rgba(7,55,94,.94) 55%,rgba(3,21,43,.98));
  border-bottom:2px solid rgba(39,228,255,.55);box-shadow:0 7px 26px rgba(0,0,0,.24);
}
.brand-mark,.opening-logo>b{
  background:linear-gradient(145deg,#32e9ff 0 28%,#148fff 29% 70%,#0645a6 71%);
  border:1px solid rgba(255,255,255,.58);box-shadow:0 0 22px rgba(39,228,255,.38);
}
.brand > span:last-child,.opening-logo>span{font-family:var(--display);font-style:italic}
.brand strong,.opening-logo strong{letter-spacing:.04em}
.brand em,.opening-logo em{color:#7deeff}
.cycle-chip{background:linear-gradient(180deg,rgba(27,137,222,.24),rgba(5,49,90,.3));clip-path:polygon(8px 0,100% 0,calc(100% - 8px) 100%,0 100%);border-color:rgba(117,217,255,.4)}
.cycle-chip strong{color:#fff;text-shadow:0 0 12px var(--cyan)}
.currency>div{padding:6px 10px;background:rgba(4,24,48,.72);border:1px solid rgba(112,204,255,.2);clip-path:polygon(6px 0,100% 0,calc(100% - 6px) 100%,0 100%)}
.currency-icon.coin{background:radial-gradient(circle at 35% 28%,#fff5b6 0 10%,#ffd447 11% 45%,#ff8a13 46% 100%);border:2px solid #fff0a3;color:#8c3b00}
.currency-icon.bolt{background:linear-gradient(145deg,#80f6ff,#13a9ff);border:1px solid white}
.icon-button{border-color:rgba(111,215,255,.4);background:linear-gradient(180deg,rgba(30,150,229,.3),rgba(6,48,90,.5))}
.reset-game-button{border-color:rgba(255,154,42,.55);background:linear-gradient(180deg,rgba(255,151,26,.19),rgba(103,46,5,.22));color:#ffc063;clip-path:polygon(8px 0,100% 0,calc(100% - 8px) 100%,0 100%)}

.app-shell{margin-top:20px}
.hero-panel{
  height:224px;padding-left:56px;border:1px solid rgba(130,224,255,.55);
  background:
    linear-gradient(105deg,rgba(5,33,65,.98) 0 34%,rgba(7,72,123,.83) 62%,rgba(10,109,168,.48) 100%),
    repeating-linear-gradient(115deg,transparent 0 90px,rgba(255,255,255,.04) 91px 92px);
  box-shadow:inset 0 0 40px rgba(22,140,255,.14),0 16px 35px rgba(0,0,0,.2);
}
.hero-panel::after{content:"";position:absolute;inset:0;background:linear-gradient(100deg,transparent 0 56%,rgba(39,228,255,.15) 56.5%,transparent 57%);pointer-events:none}
.hero-copy h1{font-size:49px;line-height:.78;text-transform:uppercase;text-shadow:0 7px 22px rgba(0,0,0,.4)}
.hero-copy h1 em{-webkit-text-stroke:1.5px #6deaff;color:rgba(62,202,255,.08)}
.hero-copy p{color:#d0e9f7}
.hero-car-wrap{right:5%;width:62%;z-index:1}
.hero-glow{right:14%;top:34%;background:#25caff;opacity:.34}
.hero-car-image{position:absolute;right:3%;top:8px;width:min(650px,82%);height:205px;object-fit:contain;object-position:center;filter:drop-shadow(0 24px 18px rgba(0,0,0,.54)) drop-shadow(0 0 24px rgba(40,224,255,.2));z-index:2;animation:hero-car-float 4.2s ease-in-out infinite}
@keyframes hero-car-float{50%{transform:translateY(-5px)}}
.hero-road{background:linear-gradient(rgba(8,54,91,.38),rgba(1,12,26,.84));border-top-color:rgba(97,225,255,.54)}
.hero-road i{background:#f7fbff;box-shadow:0 0 14px #27e4ff}
.hero-rank{background:rgba(2,25,49,.66);padding:8px 12px;clip-path:polygon(8px 0,100% 0,calc(100% - 8px) 100%,0 100%)}

.step-nav{gap:5px;height:70px}
.step{background:linear-gradient(180deg,rgba(10,63,109,.95),rgba(5,36,70,.96));border-color:rgba(116,211,255,.28);clip-path:polygon(10px 0,100% 0,calc(100% - 10px) 100%,0 100%)}
.step:hover,.step.active{background:linear-gradient(180deg,rgba(23,141,222,.92),rgba(5,75,131,.96));border-color:#74eaff;box-shadow:inset 0 0 18px rgba(39,228,255,.14)}
.step::before{height:4px;background:linear-gradient(90deg,#35e8ff,#fff,#ff9d24)}
.step b{color:#6d9dbd;font-size:20px}.step.active b{color:#fff;text-shadow:0 0 10px #41e9ff}.step small{color:#8fbad5}

.mission-card,.game-card{background:linear-gradient(145deg,rgba(7,47,84,.97),rgba(4,27,54,.98));border-color:rgba(112,207,255,.35);box-shadow:0 18px 45px rgba(0,0,0,.27),inset 0 1px rgba(255,255,255,.04)}
.mission-card{clip-path:polygon(0 0,calc(100% - 18px) 0,100% 18px,100% 100%,0 100%)}
.game-card{clip-path:polygon(0 0,calc(100% - 22px) 0,100% 22px,100% 100%,0 100%)}
.card-heading span,.section-title>div>span,.production-header span,.module-header span{color:#6eeaff}
.tiny-button{background:rgba(24,145,222,.22);border-color:rgba(102,224,255,.46)}
.mission-progress{height:5px;background:#061a31;transform:skewX(-18deg)}
.mission-progress span{background:linear-gradient(90deg,#138fff,#32eaff,#fff)}
.mission-list li i{border-radius:3px;border-color:#3e80aa;background:#082a4e}
.mission-list li.done i{background:linear-gradient(145deg,#6ef9cf,#1dcc8b);border-color:#9affdc}
.special-order{background:linear-gradient(135deg,rgba(157,77,255,.22),rgba(27,144,232,.12));border-color:rgba(174,118,255,.45)}

.primary-button,.opening-button{
  color:#201205;background:linear-gradient(180deg,#ffd85a 0,#ffad23 48%,#f47c0c 100%);
  border:1px solid #fff1a0;box-shadow:inset 0 1px rgba(255,255,255,.65),0 7px 18px rgba(221,91,0,.28);
  text-shadow:0 1px rgba(255,255,255,.3);clip-path:polygon(9px 0,calc(100% - 13px) 0,100% 13px,calc(100% - 9px) 100%,9px 100%,0 calc(100% - 10px),0 10px);
  transition:filter .18s,transform .18s;
}
.primary-button:hover,.opening-button:hover{filter:brightness(1.12);transform:translateY(-1px)}
.primary-button span,.opening-button span{color:#6d2b00}
.outline-button{color:#dff9ff;border-color:rgba(97,224,255,.55);background:linear-gradient(180deg,rgba(25,138,217,.3),rgba(4,45,84,.5));clip-path:polygon(7px 0,100% 0,calc(100% - 7px) 100%,0 100%)}
.outline-button:hover{background:linear-gradient(180deg,rgba(39,187,242,.4),rgba(5,71,123,.56))}

.demand-card,.forecast-card,.production-area,.module-panel,.revenue-card{border-color:rgba(113,211,255,.33);background-color:rgba(3,28,55,.58)}
.demand-card.primary{background:radial-gradient(circle at 82% 20%,color-mix(in srgb,var(--demand-color) 24%,transparent),transparent 13rem),linear-gradient(145deg,rgba(9,83,139,.83),rgba(3,30,60,.94));border-top:2px solid var(--demand-color)}
.demand-icon{background:rgba(3,30,58,.74);border-width:2px}
.trend b,.demand-card.compact b{color:#ffd048}
.forecast-card{background:linear-gradient(135deg,color-mix(in srgb,var(--demand-color) 17%,transparent),rgba(2,35,66,.74))}

.part-card{background:linear-gradient(145deg,rgba(11,75,124,.68),rgba(3,35,67,.88));border-color:color-mix(in srgb,var(--part-color) 35%,rgba(111,209,255,.22));clip-path:polygon(0 0,calc(100% - 11px) 0,100% 11px,100% 100%,8px 100%,0 calc(100% - 8px))}
.part-card::before{content:"";position:absolute;right:13px;top:13px;width:28px;height:20px;border:1px solid var(--part-color);border-radius:50%;box-shadow:inset 0 0 9px var(--part-color);opacity:.7}
.part-card-icon{position:absolute;right:16px;top:15px;width:22px;text-align:center;color:var(--part-color);font:800 8px var(--display);font-style:normal;z-index:2;text-shadow:0 0 8px var(--part-color)}
.part-card:hover{background:linear-gradient(145deg,color-mix(in srgb,var(--part-color) 16%,#075188),#062a50)}
.production-area{background:linear-gradient(145deg,rgba(8,67,113,.75),rgba(3,28,55,.84));clip-path:polygon(0 0,calc(100% - 14px) 0,100% 14px,100% 100%,0 100%)}
.production-slot{border-color:#397ba6;background:rgba(1,23,45,.48);clip-path:polygon(7px 0,100% 0,calc(100% - 7px) 100%,0 100%)}
.production-slot.filled{background:linear-gradient(90deg,color-mix(in srgb,var(--part-color) 15%,#052b50),#052544)}
.slot-icon{border-radius:50%;border-width:2px;box-shadow:inset 0 0 13px color-mix(in srgb,var(--part-color,var(--cyan)) 24%,transparent)}

.tuning-grid{padding:12px;gap:5px;background:linear-gradient(145deg,#0f6092,#052c52 14%,#021a36 86%,#0d5a8b);border:2px solid #7cdfff;box-shadow:inset 0 0 0 4px rgba(1,18,38,.72),inset 0 0 32px rgba(0,0,0,.48),0 0 0 1px rgba(255,255,255,.17),0 12px 25px rgba(0,0,0,.25);clip-path:polygon(14px 0,calc(100% - 14px) 0,100% 14px,100% calc(100% - 14px),calc(100% - 14px) 100%,14px 100%,0 calc(100% - 14px),0 14px)}
.grid-cell{border-color:rgba(87,187,236,.32);background:linear-gradient(145deg,rgba(20,95,145,.68),rgba(3,37,72,.8));box-shadow:inset 0 0 0 1px rgba(255,255,255,.025)}
.grid-cell::before{content:"";position:absolute;left:13%;right:13%;top:48%;height:1px;background:rgba(98,218,255,.12);box-shadow:0 -8px rgba(98,218,255,.055),0 8px rgba(98,218,255,.055)}
.grid-cell.blocked{background:repeating-linear-gradient(135deg,rgba(2,16,34,.8) 0 4px,rgba(17,64,94,.3) 4px 7px);border:1px solid rgba(59,126,165,.2)}
.grid-cell.filled{background:linear-gradient(145deg,color-mix(in srgb,var(--cell-color) 50%,#0a3154),color-mix(in srgb,var(--cell-color) 18%,#031f3d));border-width:2px}
.grid-cell.filled::after{inset:27%;border-radius:50%;transform:none;box-shadow:0 0 10px var(--cell-color)}
.module-panel{background:linear-gradient(145deg,rgba(9,72,119,.54),rgba(3,27,53,.72));padding:16px;border:1px solid rgba(107,207,255,.25)}
.module-card{background:linear-gradient(145deg,rgba(9,71,118,.7),rgba(3,28,55,.9));border-color:color-mix(in srgb,var(--part-color) 42%,rgba(109,209,255,.2));clip-path:polygon(8px 0,100% 0,calc(100% - 8px) 100%,0 100%)}
.module-card.selected{background:linear-gradient(145deg,color-mix(in srgb,var(--part-color) 22%,#0b5b91),#052b52)}
.mini-shape{background:#031a32;padding:3px;border:1px solid rgba(96,196,238,.25)}
.mini-shape i.on{border-radius:2px;background:linear-gradient(145deg,#fff,var(--part-color) 35%,color-mix(in srgb,var(--part-color) 62%,#072c52));box-shadow:inset 0 0 0 1px rgba(255,255,255,.25),0 0 7px color-mix(in srgb,var(--part-color) 50%,transparent)}

.race-stage{border:2px solid rgba(104,221,255,.58);box-shadow:0 12px 35px rgba(0,0,0,.33),0 0 0 4px rgba(3,28,55,.8);clip-path:polygon(14px 0,calc(100% - 14px) 0,100% 14px,100% calc(100% - 14px),calc(100% - 14px) 100%,14px 100%,0 calc(100% - 14px),0 14px)}
.race-overlay{background:radial-gradient(circle at 50% 38%,rgba(25,154,235,.44),rgba(2,16,35,.91) 62%)}
.race-stats>span,.speedometer,.nitro-bar{background:linear-gradient(180deg,rgba(8,73,121,.84),rgba(2,30,59,.9));border-color:rgba(106,220,255,.35);clip-path:polygon(7px 0,100% 0,calc(100% - 7px) 100%,0 100%)}
.race-head>div>span b{color:var(--cyan);font-weight:800;text-shadow:0 0 9px color-mix(in srgb,var(--cyan) 55%,transparent)}
.race-stage[data-map="autumn"]{border-color:rgba(255,166,56,.78)}
.race-stage[data-map="ice"]{border-color:rgba(184,124,255,.78)}
.race-stage[data-map="gold"]{border-color:rgba(255,190,58,.85)}
.race-stage[data-map="neon"]{border-color:rgba(234,91,255,.72)}
.mobile-controls button{background:linear-gradient(180deg,rgba(27,157,229,.82),rgba(4,55,102,.92));border-color:#78e8ff}
.mobile-controls button[data-control="nitro"]{background:linear-gradient(180deg,#ffd64c,#ed7f0d);border-color:#fff0a2;color:#4e2100}

.result-car{height:190px;background:radial-gradient(ellipse at 50% 72%,rgba(32,199,255,.34),transparent 55%)}
.result-car img{width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 22px 14px rgba(0,0,0,.55))}
.revenue-card{background:linear-gradient(145deg,rgba(255,176,29,.12),rgba(6,60,104,.62));border-color:rgba(255,190,58,.42);clip-path:polygon(0 0,calc(100% - 14px) 0,100% 14px,100% 100%,0 100%)}
.cycle-score-line{background:linear-gradient(90deg,rgba(28,164,236,.2),rgba(3,40,73,.2));border-left-color:#4eeaff}

.opening-modal{background:radial-gradient(circle at 74% 42%,#1269ad 0,#073968 30%,#03172f 68%)}
.opening-modal::after{content:"";position:absolute;inset:0;background:linear-gradient(105deg,rgba(1,14,31,.82) 0 39%,transparent 63%);pointer-events:none}
.opening-bg{background:repeating-linear-gradient(105deg,transparent 0 115px,rgba(71,224,255,.075) 116px 118px)}
.opening-content{z-index:4}
.opening-kicker{color:#80f3ff}
.opening-content h1 em{-webkit-text-stroke:1.5px #65ecff}
.opening-content>p{color:#d0e5f4}
.opening-car-scene{z-index:3;right:1vw;width:57vw;height:390px}
.opening-car-image{position:absolute;right:0;bottom:0;width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 34px 24px rgba(0,0,0,.7)) drop-shadow(0 0 28px rgba(64,220,255,.2));animation:opening-image-in 1s cubic-bezier(.15,.8,.2,1) both}
@keyframes opening-image-in{from{transform:translateX(35vw) scale(.92);opacity:0}to{transform:none;opacity:1}}
.opening-car-shadow{left:18%;right:3%;bottom:2%;background:#010817}
.opening-city{opacity:.43}

.modal,.season-modal{background:radial-gradient(circle at 80% 5%,rgba(22,146,227,.28),transparent 25rem),linear-gradient(145deg,#0a4878,#031c38);border-color:rgba(112,222,255,.54)}
.season-header{position:relative;min-height:95px;align-items:flex-start;overflow:hidden}
.season-car-image{position:absolute;right:105px;top:-24px;width:275px;height:145px;object-fit:contain;filter:drop-shadow(0 16px 10px rgba(0,0,0,.48));opacity:.94}
.season-scoreboard>div,.season-cycle-card,.milestone-card{background:linear-gradient(145deg,rgba(10,76,123,.68),rgba(2,31,59,.76));border-color:rgba(101,204,249,.24)}
.season-scoreboard .main-season-score{background:linear-gradient(135deg,rgba(24,153,226,.3),rgba(3,46,81,.73));border-color:rgba(75,224,255,.48)}
.career-section{background:linear-gradient(145deg,rgba(9,83,133,.48),rgba(8,39,81,.55));border-color:rgba(101,214,255,.31)}
.career-progress{background:#02162c;height:9px}
.milestone-card.unlocked{background:linear-gradient(145deg,color-mix(in srgb,var(--milestone-color) 14%,#07507f),#052747)}
.toast{background:linear-gradient(180deg,#f9feff,#d9f4ff);color:#042342;border-left-color:#ff9b1d}

@media (max-width:980px){
  .hero-car-image{right:-2%;width:88%}.season-car-image{right:78px;opacity:.62}
}
@media (max-width:700px){
  .topbar{padding:0 14px}.hero-copy h1{font-size:37px}.hero-car-wrap{right:-22%;width:88%}.hero-car-image{top:17px;width:100%;height:160px}.opening-car-scene{right:-24vw;width:108vw;height:290px}.opening-car-image{opacity:.82}.opening-modal::after{background:linear-gradient(0deg,rgba(1,14,31,.92) 0 42%,transparent 72%)}.season-car-image{display:none}.season-header{min-height:0}.game-card,.mission-card{clip-path:none}
}
@media (max-width:420px){.hero-car-wrap{right:-37%}.opening-car-scene{right:-43vw;width:135vw}}
