/* Design tokens. Source: docs/design.md §3–5. Change values there first. */
:root {
  /* Color (§3) */
  --blue-900: #003763;
  --blue-700: #1D4F7C;
  --blue-100: #E3ECF5;
  --blue-50: #F0F5FA;
  --gold-500: #FFBF3B;
  --gold-100: #FFF1CC;
  --gold-700: #C99A2E;
  --gold-text: #5C3F00;
  --green-500: #85BC00;
  --green-100: #E8F4CF;
  --green-text: #355000;
  --green-icon: #5C7F00;
  --teal-100: #E2F0F3;
  --teal-text: #0B4F5E;
  --purple-100: #EEE8F6;
  --purple-text: #4B2D7A;
  --ink: #1B2633;
  --text: #404041;
  --text-muted: #5C5D60;
  --text-on-blue: #C9D6E3;
  --ground: #F5F7FA;
  --surface: #FFFFFF;
  --border: #DDE1E6;
  --divider: #EEF0F2;
  --danger-100: #FBE3DA;
  --danger-text: #8A2B0E;
  --danger-border: #E8B4A3;

  /* Type (§4) */
  --font-sans: "Inter", system-ui, sans-serif;
  --font-mono: "JetBrains Mono", ui-monospace, monospace;
  --text-page-title: 28px;
  --text-page-title-phone: 22px;
  --text-section: 17px;
  --text-card-title: 16px;
  --text-body: 15px;
  --text-secondary: 13px;
  --text-small: 12px;

  /* Spacing (§5): 4px base */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-8: 32px;

  /* Radius (§5) */
  --radius-control: 8px;
  --radius-banner: 10px;
  --radius-card: 12px;
  --radius-pill: 999px;

  /* Layout (§6) */
  --header-height: 64px;
  --content-max: 1360px;
  --tap-min: 44px;
}