/* tuppence.ai design tokens v1.0 */
:root {
  /* Brand core */
  --tp-blue: #3b5bff; /* Tuppence Blue */
  --tp-mint: #00d1a7; /* Fresh Mint */
  --tp-midnight: #0b1020; /* Midnight */
  --tp-cloud: #f4f6fb; /* Cloud */
  --tp-lilac: #e9e5ff; /* Lilac */
  --tp-sunrise: #ff8a5b; /* Sunrise */

  /* Scales */
  --blue-50: #eef1ff;
  --blue-100: #dde3ff;
  --blue-200: #bcc7ff;
  --blue-300: #93a5ff;
  --blue-400: #6680ff;
  --blue-500: #3b5bff;
  --blue-600: #2a45e6;
  --blue-700: #2035b8;
  --blue-800: #1a2b8c;
  --blue-900: #141f5e;
  --mint-50: #e6fbf6;
  --mint-100: #c2f5e9;
  --mint-200: #8aedd7;
  --mint-300: #4de2c3;
  --mint-400: #1ad8b2;
  --mint-500: #00d1a7;
  --mint-600: #00ad8b;
  --mint-700: #007a62;
  --mint-800: #006b57;
  --mint-900: #004d3f;
  --ink-50: #f4f6fb;
  --ink-100: #eceef5;
  --ink-200: #dce0ec;
  --ink-300: #b8bed6;
  --ink-400: #9096b0;
  --ink-500: #6b7190;
  --ink-600: #4a5068;
  --ink-700: #3a4260;
  --ink-800: #232a40;
  --ink-900: #0b1020;
  --sunrise-50: #fff4ee;
  --sunrise-100: #ffe4d6;
  --sunrise-200: #ffc6aa;
  --sunrise-300: #ffa67f;
  --sunrise-400: #ff8a5b;
  --sunrise-500: #f06a36;
  --sunrise-600: #d9531f;
  --sunrise-700: #b8461b;
  --sunrise-800: #8f3714;
  --sunrise-900: #62250d;
  --lilac-50: #f6f4ff;
  --lilac-100: #e9e5ff;
  --lilac-200: #d4ccff;
  --lilac-300: #b6a8ff;
  --lilac-400: #9683fa;
  --lilac-500: #7b66f0;
  --lilac-600: #6b5bd6;
  --lilac-700: #4b3fb8;
  --lilac-800: #3a3190;
  --lilac-900: #282266;

  /* Semantic */
  --text-primary: var(--ink-900);
  --text-secondary: var(--ink-600);
  --text-muted: var(--ink-500);
  --surface-page: var(--ink-50);
  --surface-card: #ffffff;
  --border-default: var(--ink-200);
  --action-primary: var(--blue-500);
  --action-primary-hover: var(--blue-600);
  --focus-ring: var(--blue-200);
  --status-success: var(--mint-700);
  --status-success-bg: var(--mint-50);
  --status-attention: var(--sunrise-700);
  --status-attention-bg: var(--sunrise-100);
  --status-danger: #d93a4a;
  --status-danger-bg: #fdecee;
  --status-ai: var(--lilac-700);
  --status-ai-bg: var(--lilac-100);

  /* Type */
  --font-sans: "Inter", system-ui, -apple-system, sans-serif;
  --font-display: "Inter Display", "Inter", system-ui, sans-serif;
  --fs-display: 80px;
  --lh-display: 80px;
  --ls-display: -0.04em;
  --fs-h1: 56px;
  --lh-h1: 60px;
  --ls-h1: -0.03em;
  --fs-h2: 40px;
  --lh-h2: 46px;
  --ls-h2: -0.025em;
  --fs-h3: 28px;
  --lh-h3: 34px;
  --ls-h3: -0.02em;
  --fs-h4: 20px;
  --lh-h4: 28px;
  --fs-body-lg: 18px;
  --lh-body-lg: 28px;
  --fs-body: 16px;
  --lh-body: 24px;
  --fs-label: 14px;
  --lh-label: 20px;
  --fs-caption: 12px;
  --lh-caption: 16px;
  --ls-eyebrow: 0.18em;

  /* Space (4px grid) */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-6: 24px;
  --space-8: 32px;
  --space-12: 48px;
  --space-16: 64px;
  --space-24: 96px;
  --space-32: 128px;

  /* Radius */
  --radius-sm: 8px;
  --radius-input: 12px;
  --radius-card: 16px;
  --radius-lg: 20px;
  --radius-panel: 24px;
  --radius-pill: 999px;

  /* Elevation (Midnight-tinted) */
  --shadow-sm: 0 1px 2px rgba(11, 16, 32, 0.06);
  --shadow-md: 0 4px 16px -4px rgba(11, 16, 32, 0.1), 0 1px 3px rgba(11, 16, 32, 0.06);
  --shadow-lg: 0 24px 48px -12px rgba(11, 16, 32, 0.22);

  /* Brand gradients */
  --gradient-hero: linear-gradient(135deg, #0b1020 0%, #141f5e 45%, #2a45e6 100%);
  --gradient-mint-glow: linear-gradient(160deg, #4de2c3 0%, #00d1a7 45%, #3b5bff 100%);
}