:root{
      --bg:#0b0f17; --card:#121826; --card-2:#0e1420; --text:#eef2ff; --muted:#a6b0bb; --accent:#64d2ff;
      --btn:#1f2a44; --btn-hover:#273453; --accent-btn:#1b8bff; --danger:#ef4444; --ok:#16a34a;
      --border: rgba(255,255,255,.14); --shadow: 0 10px 30px rgba(0,0,0,.35);
      --radius: 18px; --pad: clamp(16px, 4vw, 24px);
      --tag:#0e1f3a;
    }
    *{ box-sizing:border-box; -webkit-tap-highlight-color:transparent; }
    html,body{ height:100%; }
    body{ margin:0; color:var(--text); font-family:system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;
      background: radial-gradient(1200px 800px at 50% 10%, #111a2a 0%, var(--bg) 80%) fixed;
      padding: env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);
    }
    .wrap{ min-height:100%; display:grid; place-items:center; padding:var(--pad); }
    .card{ width:min(560px,100%); background:linear-gradient(180deg,var(--card),var(--card-2)); border:1px solid var(--border);
      border-radius:var(--radius); box-shadow:var(--shadow); padding:var(--pad); }
    h1{ text-align:center; font-size:clamp(24px,6vw,34px); margin:0 0 8px; color:var(--accent); text-shadow:0 0 10px rgba(100,210,255,.35); }
    .credits{ text-align:center; color:var(--muted); margin-bottom:6px; font-weight:600; font-size:clamp(14px,3.5vw,16px); }
    .active-vehicle{ text-align:center; color:var(--text); font-weight:800; font-size:clamp(13px,3.2vw,15px); margin-bottom:clamp(12px,3.5vw,18px); }
    .muted{ color:var(--muted); font-weight:600; }
    .menu{ display:flex; flex-direction:column; gap:12px; }
    button{ appearance:none; border:0; width:100%; background:var(--btn); color:var(--text); font-size:clamp(16px,4.5vw,18px);
      font-weight:700; padding:16px; border-radius:16px; box-shadow:0 4px 12px rgba(0,0,0,.35); transition:transform .06s, background .2s;
      touch-action:manipulation; min-height:56px; }
    button:active{ transform:translateY(1px) scale(.998); } button:hover{ background:var(--btn-hover); }
    .danger{ background:var(--danger);} .danger:hover{ filter:brightness(1.05); }
    .hidden{ display:none; }
    .form{ display:flex; flex-direction:column; gap:12px; }
    label{ font-size:clamp(13px,3.2vw,14px); color:var(--muted); }
    select{ background:#121826; color:var(--text); border:1px solid var(--border); border-radius:14px; padding:12px; font-size:clamp(15px,4.2vw,16px); width:100%; }
    .actions{ display:flex; gap:12px; margin-top:4px; flex-wrap:wrap; }
    .results{ margin-top:14px; display:grid; gap:10px; }
    .item{ display:flex; flex-direction:column; gap:8px; padding:12px 14px; border:1px solid var(--border); border-radius:14px; background:#101828; }
    .row-top{ display:flex; justify-content:space-between; align-items:center; gap:12px; }
    .name{ font-weight:800; font-size:clamp(14px,4vw,16px); }
    .price{ font-weight:800; }
    .engine,.trans,.fuel,.boost,.power,.torque,.weight,.effects{ font-size:clamp(12px,3.2vw,13px); color:var(--muted); }
    .buy{ background:var(--accent-btn); border-radius:12px; padding:10px 14px; font-weight:800; font-size:clamp(14px,4vw,15px);
      box-shadow:0 6px 16px rgba(27,139,255,.35); }
    .buy:disabled{ opacity:.55; filter:grayscale(.3); cursor:not-allowed; }
    .sell{ background:var(--danger); border-radius:12px; padding:10px 14px; font-weight:800; font-size:clamp(14px,4vw,15px); box-shadow:0 6px 16px rgba(239,68,68,.35); }
    .select{ background:#64d2ff; color:#001018; border-radius:12px; padding:10px 14px; font-weight:800; font-size:clamp(14px,4vw,15px); box-shadow:0 6px 16px rgba(100,210,255,.35); }
    .tag{ background:var(--tag); color:#9ecbff; border:1px solid var(--border); border-radius:999px; padding:4px 10px; font-size:12px; font-weight:800; }
    .chip{ display:block; text-align:center; margin:8px auto; }
    .grid-upg{ display:grid; grid-template-columns:1fr; gap:10px; } @media(min-width:560px){ .grid-upg{ grid-template-columns:1fr 1fr; } }
    .upg{ display:flex; flex-direction:column; gap:8px; padding:12px 14px; border:1px solid var(--border); border-radius:14px; background:#101828; }
    .upg h3{ margin:0; font-size:16px; } .levels{ display:flex; gap:6px; } .lvl{ flex:1; height:10px; border-radius:6px; background:#223148; border:1px solid var(--border); } .lvl.on{ background:#1b8bff; }
    .row{ display:flex; justify-content:space-between; align-items:center; gap:10px; } .price-small{ color:var(--muted); font-weight:700; font-size:14px; }
    .warn{ color:#f59e0b; font-weight:700; font-size:14px; text-align:center; }
    .toast{ position:fixed; left:50%; bottom:20px; transform:translateX(-50%); background:#0b4a2a; color:#d6ffe7; border:1px solid #1a6b3d; border-radius:14px; padding:12px 16px; box-shadow:0 10px 30px rgba(0,0,0,.35); font-weight:800; z-index:9999; opacity:0; pointer-events:none; transition:opacity .2s, transform .2s; }
    .toast.show{ opacity:1; transform:translateX(-50%) translateY(-4px); }
    .center-btn{ width:auto; margin:0 auto; padding:12px 18px; min-width:180px; display:inline-block; }
    .vswrap{ text-align:center; margin:4px 0 6px; line-height:1.25; }
    .vsline{ font-weight:800; font-size:clamp(13px,3.2vw,15px); }