:root {
  color-scheme: dark;

  /* Color Palette */
  --oz-red: #ff1e1e;
  --oz-red-dark: #b50f14;
  --oz-black: #050505;
  --oz-rich-black: #1a1a1a;
  --oz-charcoal: #2b2b2b;
  --oz-gray: #6c6c6c;
  --oz-gray-light: #c9c9c9;
  --oz-white: #ffffff;
  --oz-tile: #0d0d0d;

  /* Color Variants */
  --oz-neon-red-low: rgba(255, 30, 30, 0.28);
  --oz-neon-red-high: rgba(255, 30, 30, 0.55);

  /* Border Radius */
  --oz-radius-sm: 6px;
  --oz-radius-md: 10px;
  --oz-radius-lg: 14px;
  --oz-radius-xl: 20px;
  --oz-radius-pill: 999px;

  /* Elevation */
  --oz-elevation-card: 0 4px 24px rgba(0, 0, 0, 0.45);
  --oz-elevation-panel: 0 2px 12px rgba(0, 0, 0, 0.35);

  /* Typography */
  --oz-font-headline: "Space Grotesk", system-ui, sans-serif;
  --oz-font-body: "Inter", system-ui, sans-serif;

  /* Borders */
  --oz-line: rgba(201, 201, 201, 0.14);

  /* Semantic Tokens */
  --surface-0: var(--oz-rich-black);
  --surface-1: var(--oz-charcoal);
  --surface-2: var(--oz-black);
  
  --text-primary: var(--oz-white);
  --text-secondary: var(--oz-gray-light);
  --text-tertiary: var(--oz-gray);
  
  --accent-red: var(--oz-red);
  --accent-red-dark: var(--oz-red-dark);
  
  --border-color: var(--oz-line);
  --border-radius-sm: var(--oz-radius-sm);
  --border-radius-md: var(--oz-radius-md);
  --border-radius-lg: var(--oz-radius-lg);
  
  --elevation-card: var(--oz-elevation-card);
  --elevation-panel: var(--oz-elevation-panel);
}