:root {
  /* --- Primary palette (medical light blue) --- */
  --color-primary:        hsl(205, 45%, 48%);
  --color-primary-light:  hsl(205, 50%, 62%);
  --color-primary-dark:   hsl(205, 45%, 36%);
  --color-primary-bg:     hsl(205, 40%, 96%);

  /* --- Neutral palette --- */
  --color-bg:             hsl(210, 25%, 97%);
  --color-surface:        #ffffff;
  --color-border:         hsl(210, 15%, 88%);
  --color-text:           hsl(210, 15%, 20%);
  --color-text-secondary: hsl(210, 10%, 46%);
  --color-text-muted:     hsl(210, 8%, 62%);

  /* --- Severity colors (WCAG AA on white) --- */
  --color-normal:         #357A56;
  --color-normal-bg:      hsl(152, 40%, 94%);
  --color-mild:           #B08D10;
  --color-mild-bg:        hsl(42, 70%, 94%);
  --color-moderate:       #C56A25;
  --color-moderate-bg:    hsl(24, 70%, 94%);
  --color-severe:         #B82D2D;
  --color-severe-bg:      hsl(0, 55%, 95%);

  /* --- Functional --- */
  --color-focus:          hsl(205, 70%, 55%);
  --color-error:          hsl(0, 55%, 50%);
  --color-error-bg:       hsl(0, 50%, 96%);

  /* --- Shadows --- */
  --shadow-sm:  0 1px 3px hsla(210, 20%, 20%, 0.08);
  --shadow-md:  0 4px 12px hsla(210, 20%, 20%, 0.10);
  --shadow-lg:  0 8px 24px hsla(210, 20%, 20%, 0.12);

  /* --- Typography --- */
  --font-family: 'IBM Plex Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', system-ui, sans-serif;

  --text-xs:    clamp(0.7rem, 0.65rem + 0.25vw, 0.75rem);
  --text-sm:    clamp(0.8rem, 0.75rem + 0.25vw, 0.875rem);
  --text-base:  clamp(0.9rem, 0.85rem + 0.25vw, 1rem);
  --text-lg:    clamp(1.05rem, 1rem + 0.25vw, 1.175rem);
  --text-xl:    clamp(1.25rem, 1.1rem + 0.75vw, 1.5rem);
  --text-2xl:   clamp(1.5rem, 1.25rem + 1.25vw, 2rem);
  --text-3xl:   clamp(2rem, 1.5rem + 2.5vw, 3rem);
  --text-hero:  clamp(2.5rem, 2rem + 2.5vw, 3.5rem);

  --leading-tight:   1.2;
  --leading-normal:  1.5;
  --leading-relaxed: 1.7;

  --weight-regular:  400;
  --weight-medium:   500;
  --weight-semibold: 600;
  --weight-bold:     700;

  /* --- Spacing --- */
  --space-xs:  0.25rem;
  --space-sm:  0.5rem;
  --space-md:  1rem;
  --space-lg:  1.5rem;
  --space-xl:  2rem;
  --space-2xl: 3rem;
  --space-3xl: 4rem;

  /* --- Radii --- */
  --radius-sm:   8px;
  --radius-md:   12px;
  --radius-lg:   16px;
  --radius-full: 9999px;

  /* --- Transitions --- */
  --transition-fast:   150ms ease;
  --transition-normal: 300ms ease;
  --transition-slow:   500ms ease;

  /* --- Layout --- */
  --max-width:  540px;
  --header-height: 56px;
}
