/* ─── Design Tokens ─── */
:root {
  /* Colors */
  --color-navy: #101585;
  --color-navy-light: #1A1FA0;
  --color-white: #FFFFFF;
  --color-terra: #E2725B;
  --color-terra-light: #F0897A;
  --color-sky: #D6E8F5;
  --color-gray-100: #F5F5F7;
  --color-gray-200: #E5E5EA;
  --color-gray-500: #636366;
  --color-gray-900: #1C1C1E;
  --color-error: #E53E3E;

  /* Spacing */
  --s-4: 4px;
  --s-8: 8px;
  --s-12: 12px;
  --s-16: 16px;
  --s-24: 24px;
  --s-32: 32px;
  --s-48: 48px;

  /* Typography */
  --font-display: 'Playfair Display', system-ui, -apple-system, sans-serif;
  --font-body: 'DM Sans', system-ui, -apple-system, sans-serif;

  /* Borders & Radii */
  --radius-sm: 10px;
  --radius-md: 12px;
  --radius-lg: 16px;
  --radius-pill: 24px;
  --radius-tab-container: 28px;

  /* Shadows */
  --shadow-card: 0 1px 3px rgba(0, 0, 0, 0.06);
  --shadow-focus: 0 0 0 3px rgba(16, 21, 133, 0.12);
  --shadow-focus-visible: 0 0 0 3px rgba(16, 21, 133, 0.2);
}

/* ─── Dark Theme Overrides ─── */
[data-theme="dark"] {
  --color-white: #1C1C1E;
  --color-gray-100: #2C2C2E;
  --color-gray-200: #3A3A3C;
  --color-gray-500: #AEAEB2;
  --color-gray-900: #F5F5F7;
  --color-navy: #4A48C7;
  --color-navy-light: #5B59D6;
  --color-sky: #2C2C3E;
  --shadow-card: 0 1px 3px rgba(0, 0, 0, 0.2);
}