:root {
  /* BMW M core tokens */
  --bmw-canvas: #000000;
  --bmw-surface-card: #1a1a1a;
  --bmw-surface-elevated: #262626;
  --bmw-surface-soft: #0d0d0d;
  --bmw-hairline: #3c3c3c;
  --bmw-text-primary: #ffffff;
  --bmw-text-body: #bbbbbb;
  --bmw-text-muted: #7e7e7e;

  /* M tricolor */
  --bmw-m-blue-light: #0066b1;
  --bmw-m-blue-dark: #1c69d4;
  --bmw-m-red: #e22718;

  /* Heritage */
  --bmw-blue: #1c69d4;
  --bmw-electric-blue: #0653b6;

  /* Semantic */
  --bmw-success: #0fa336;
  --bmw-warning: #f4b400;
  --bmw-error: #e22718;

  /* Typography scale */
  --font-display-xl: 80px;
  --font-display-lg: 56px;
  --font-display-md: 40px;
  --font-display-sm: 32px;
  --font-title-lg: 24px;
  --font-title-md: 20px;
  --font-title-sm: 18px;
  --font-body-md: 16px;
  --font-body-sm: 14px;
  --font-caption: 12px;
  --font-button: 14px;

  --weight-display: 700;
  --weight-body: 300;
  --weight-regular: 400;

  --spacing-xxs: 4px;
  --spacing-xs: 8px;
  --spacing-sm: 12px;
  --spacing-md: 16px;
  --spacing-lg: 24px;
  --spacing-xl: 40px;
  --spacing-xxl: 64px;
  --spacing-section: 96px;

  --radius-none: 0px;
  --radius-xs: 2px;
  --radius-sm: 4px;
  --radius-md: 6px;
  --radius-full: 9999px;
}