:root {
  /* Colors — OKLCH, amber/bronze accent, teal secondary. NO purple, NO pink. */
  --bg-primary: oklch(0.985 0.005 90);
  --bg-surface: oklch(0.97 0.008 90);
  --bg-elevated: oklch(1 0 0);
  --text-primary: oklch(0.18 0.01 250);
  --text-secondary: oklch(0.45 0.01 250);
  --text-tertiary: oklch(0.60 0.01 250);
  --accent: oklch(0.70 0.18 50);
  --accent-hover: oklch(0.65 0.18 50);
  --accent-light: oklch(0.94 0.06 50);
  --accent-secondary: oklch(0.65 0.15 180);
  --success: oklch(0.65 0.15 150);
  --error: oklch(0.60 0.20 25);
  --warning: oklch(0.75 0.15 75);
  --border: oklch(0.88 0.01 90);
  --border-strong: oklch(0.78 0.01 90);
  --shadow-color: oklch(0 0 0 / 0.06);
  --overlay: oklch(0 0 0 / 0.4);

  /* Spacing */
  --space-2: 0.125rem;
  --space-4: 0.25rem;
  --space-6: 0.375rem;
  --space-8: 0.5rem;
  --space-10: 0.625rem;
  --space-12: 0.75rem;
  --space-16: 1rem;
  --space-20: 1.25rem;
  --space-24: 1.5rem;
  --space-32: 2rem;
  --space-40: 2.5rem;
  --space-48: 3rem;
  --space-64: 4rem;

  /* Typography */
  --font-family: 'Inter', system-ui, -apple-system, sans-serif;
  --fw-regular: 400;
  --fw-medium: 500;
  --fw-semibold: 600;
  --fw-bold: 700;
  --text-11: 0.6875rem;
  --text-12: 0.75rem;
  --text-13: 0.8125rem;
  --text-14: 0.875rem;
  --text-15: 0.9375rem;
  --text-16: 1rem;
  --text-18: 1.125rem;
  --text-20: 1.25rem;
  --text-24: 1.5rem;
  --text-28: 1.75rem;
  --text-32: 2rem;

  /* Radii */
  --radius-4: 4px;
  --radius-6: 6px;
  --radius-8: 8px;
  --radius-12: 12px;
  --radius-16: 16px;
  --radius-20: 20px;
  --radius-24: 24px;
  --radius-pill: 9999px;

  /* Shadows */
  --shadow-xs: 0 1px 2px var(--shadow-color);
  --shadow-sm: 0 1px 3px var(--shadow-color), 0 1px 2px oklch(0 0 0 / 0.03);
  --shadow-md: 0 4px 6px -1px var(--shadow-color), 0 2px 4px -2px var(--shadow-color);
  --shadow-lg: 0 10px 15px -3px var(--shadow-color), 0 4px 6px -4px var(--shadow-color);
  --shadow-xl: 0 20px 25px -5px var(--shadow-color), 0 8px 10px -6px var(--shadow-color);

  /* Transitions */
  --ease-out-quart: cubic-bezier(0.25, 1, 0.5, 1);
  --ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);
  --transition-fast: 150ms var(--ease-out-quart);
  --transition-normal: 200ms var(--ease-out-quart);
  --transition-slow: 300ms var(--ease-out-quart);

  /* Z-index */
  --z-base: 0;
  --z-dropdown: 100;
  --z-sticky: 200;
  --z-overlay: 300;
  --z-modal: 400;
  --z-toast: 500;
}

[data-theme='dark'] {
  --bg-primary: oklch(0.15 0.01 250);
  --bg-surface: oklch(0.20 0.01 250);
  --bg-elevated: oklch(0.25 0.01 250);
  --text-primary: oklch(0.93 0.005 90);
  --text-secondary: oklch(0.65 0.005 90);
  --text-tertiary: oklch(0.50 0.005 90);
  --accent: oklch(0.75 0.18 50);
  --accent-hover: oklch(0.80 0.18 50);
  --accent-light: oklch(0.30 0.06 50);
  --accent-secondary: oklch(0.70 0.15 180);
  --success: oklch(0.70 0.15 150);
  --error: oklch(0.65 0.20 25);
  --warning: oklch(0.80 0.15 75);
  --border: oklch(0.28 0.01 250);
  --border-strong: oklch(0.35 0.01 250);
  --shadow-color: oklch(0 0 0 / 0.3);
  --overlay: oklch(0 0 0 / 0.6);
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme='light']) {
    --bg-primary: oklch(0.15 0.01 250);
    --bg-surface: oklch(0.20 0.01 250);
    --bg-elevated: oklch(0.25 0.01 250);
    --text-primary: oklch(0.93 0.005 90);
    --text-secondary: oklch(0.65 0.005 90);
    --text-tertiary: oklch(0.50 0.005 90);
    --accent: oklch(0.75 0.18 50);
    --accent-hover: oklch(0.80 0.18 50);
    --accent-light: oklch(0.30 0.06 50);
    --accent-secondary: oklch(0.70 0.15 180);
    --success: oklch(0.70 0.15 150);
    --error: oklch(0.65 0.20 25);
    --warning: oklch(0.80 0.15 75);
    --border: oklch(0.28 0.01 250);
    --border-strong: oklch(0.35 0.01 250);
    --shadow-color: oklch(0 0 0 / 0.3);
    --overlay: oklch(0 0 0 / 0.6);
  }
}