/* Choice Action design tokens.
 * The single implementation of change item 2 (the palette): every colour the site
 * uses is defined HERE and nowhere else - site.css only references these vars.
 * Contrast (WCAG 2.2 AA, verified by check/parity-check.py on these pairs):
 *   ink / ink-soft on background, surface and tint   >= 4.5:1 (body text)
 *   brand-ink and on-navy-soft on brand              >= 4.5:1
 *   teal-text and danger on background and tint      >= 4.5:1
 *   input-border on background, focus on surface     >= 3:1  (non-text UI)
 * --color-teal is decorative only (blobs, gradients); never used for text.
 */
:root {
  /* palette */
  --color-navy: #20396C;
  --color-brand: #20396C;
  --color-brand-ink: #FFFFFF;
  --color-on-navy-soft: #D6E0EF;
  --color-navy-line: #38527F;
  --color-teal: #4FC4D7;
  --color-teal-text: #167082;
  --color-tint: #EAF7FA;
  --color-background: #FAFCFD;
  --color-surface: #FFFFFF;
  --color-ink: #1F2937;
  --color-ink-soft: #4B5563;
  --color-border: #E3E9F0;
  --color-input-border: #64748B;
  --color-focus: #167082;
  --color-danger: #B3261E;

  /* type scale */
  --text-xs: 0.75rem;
  --text-sm: 0.875rem;
  --text-base: 1rem;
  --text-lg: 1.125rem;
  --text-xl: 1.25rem;
  --text-2xl: 1.5rem;
  --text-3xl: 1.875rem;
  --text-4xl: 2.25rem;
  --text-5xl: 3rem;
  --text-6xl: 3.75rem;
  --font-sans: "Inter", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;

  /* spacing scale */
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.25rem;
  --space-6: 1.5rem;
  --space-8: 2rem;
  --space-10: 2.5rem;
  --space-12: 3rem;
  --space-16: 4rem;
  --space-20: 5rem;

  /* layout */
  --container: 72rem;
  --radius-sm: 0.375rem;
  --radius-md: 0.75rem;
  --radius-lg: 1rem;
  --radius-xl: 1.5rem;
  --radius-pill: 999px;
  --shadow-sm: 0 1px 2px rgba(31, 41, 55, 0.06);
  --shadow-md: 0 4px 12px rgba(31, 41, 55, 0.08);
}