/* Design tokens — Tesla-inspired in-car UI (see STYLEGUIDE.md). Not Tesla assets; Inter (OFL) as typeface. */
@font-face { font-family: 'Inter Var'; src: url('fonts/InterVariable.woff2') format('woff2'); font-weight: 100 900; font-display: swap; }
:root, [data-theme="dark"] {
  --font: 'Inter Var', system-ui, -apple-system, 'Segoe UI', Arial, sans-serif;
  /* surfaces */
  --bg: #0b0c0e; --surface-1: #17181b; --surface-2: #1f2024; --surface-3: #2a2b30; --scrim: rgba(0,0,0,.55);
  --border: rgba(255,255,255,.08); --divider: rgba(255,255,255,.06);
  /* text */
  --text-1: #f4f5f6; --text-2: #a5a8ad; --text-3: #6d7076; --text-inverse: #0b0c0e;
  /* accents */
  --accent: #3e6ae1; --accent-press: #2f57c6; --accent-soft: rgba(62,106,225,.18);
  --ok: #2fbf71; --warn: #f0a92e; --danger: #e8453c; --redline: #e8453c; --gauge-arc: #e9ebee; --gauge-track: rgba(255,255,255,.08); --boost: #3ec7e1;
  --shadow-1: 0 1px 2px rgba(0,0,0,.4); --shadow-sheet: 0 -8px 32px rgba(0,0,0,.5);
  --slider-track: #3a3b40; --switch-off: #3a3b40;
}
[data-theme="light"] {
  --bg: #e9eaec; --surface-1: #ffffff; --surface-2: #f4f4f5; --surface-3: #e4e5e7; --scrim: rgba(0,0,0,.28);
  --border: rgba(0,0,0,.08); --divider: rgba(0,0,0,.06);
  --text-1: #171a20; --text-2: #5c5e62; --text-3: #8e9095; --text-inverse: #ffffff;
  --gauge-arc: #171a20; --gauge-track: rgba(0,0,0,.08);
  --shadow-1: 0 1px 3px rgba(0,0,0,.08); --shadow-sheet: 0 -8px 32px rgba(0,0,0,.18);
  --slider-track: #d4d5d8; --switch-off: #c9cacd;
}
:root {
  /* type scale (px) — weights: 400 regular, 500 medium only; numerals 300 for big gauge digits */
  --fs-caption: 13px; --fs-body: 16px; --fs-label: 17px; --fs-title: 20px; --fs-headline: 28px; --fs-display: 64px; --fs-gauge: 112px;
  --lh-tight: 1.15; --lh-body: 1.4;
  /* spacing (4-pt grid) */
  --sp-1: 4px; --sp-2: 8px; --sp-3: 12px; --sp-4: 16px; --sp-5: 20px; --sp-6: 24px; --sp-8: 32px; --sp-10: 40px;
  /* radii */
  --r-sm: 8px; --r-md: 12px; --r-lg: 16px; --r-xl: 24px; --r-pill: 999px;
  /* touch */
  --touch: 56px; --touch-min: 44px;
  /* motion */
  --ease: cubic-bezier(.2,.8,.2,1); --dur-fast: 120ms; --dur: 220ms; --dur-sheet: 320ms;
}
