/* Design tokens: colors, typography, spacing */
:root {
  --color-bg: #ffffff;
  --color-primary: #2E4E6F;
  --color-primary-alt: #2F4D6F;
  --color-accent: #FF3C24;
  --color-accent-alt: var(--color-blue-500);
  --color-success: #71A31E;
  --color-warning: #F6A800;
  --color-danger: #FF3C24;
  --color-neutral-100: #ffffff;
  --color-neutral-150: #EEFFEE;
  --color-neutral-200: #EAEDF1;
  --color-neutral-250: #E3E8EF;
  --color-neutral-300: #E3E8EF;
  --color-neutral-350: #EEE;
  --color-neutral-400: #B6C2D4;
  --color-neutral-450: #8EA1B8;
  --color-neutral-500: #667E9D;
  --color-neutral-550: #526B84;
  --color-neutral-600: #336189;
  --color-neutral-700: #2E4E6F;
  --color-neutral-750: #2F4D6F;
  --color-border: #B6C2D4;
  --color-border-strong: #748392;

  /* Table header brand palette */
  --color-table-header-bg: #E3E8EF; /* pale blue */
  --color-table-header-text: #2E4E6F; /* dark brand blue */

  /* Typography scale (base ?14px) */
  --font-size-xs: 0.75rem;   /* ~11px */
  --font-size-sm: 0.81rem;  /* slightly smaller base body size (~13px) */
  --font-size-md: 1rem;      /* 16px */
  --font-size-lg: 1.125rem;  /* 18px */
  --font-size-xl: 1.25rem;   /* 20px */

  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;

  --radius-sm: 2px;
  --radius-md: 4px;
  --radius-lg: 6px;

  --line-height-tight: 1.2;
  --line-height-normal: 1.4;
  --line-height-loose: 1.6;
}