:root {
  --bg: #FAFAF7;
  --surface: #FFFFFF;
  --surface-warm: #F4F1EA;
  --surface-blue: #F6FAFD;
  --text: #101828;
  --text-primary: #101828;
  --text-secondary: #475467;
  --text-muted: #667085;
  --clinical-blue: #D7E8F7;
  --clinical-blue-strong: #8EBFE5;
  --trust-teal: #2A9D8F;
  --verified-green: #1F7A5A;
  --amber: #B7791F;
  --error: #B42318;
  --border: rgba(16, 24, 40, 0.08);
  --border-strong: rgba(16, 24, 40, 0.14);
  --shadow-sm: 0 1px 2px rgba(16, 24, 40, 0.04);
  --shadow-md: 0 12px 32px rgba(16, 24, 40, 0.08);
  --shadow-lg: 0 28px 80px rgba(16, 24, 40, 0.12);
  --radius-sm: 8px;
  --radius-md: 14px;
  --radius-lg: 22px;
  --radius-xl: 32px;
  --container: 1180px;
  --font-body: 'Inter', 'Public Sans', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-display: 'Inter', 'Public Sans', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

  /* Compatibility aliases for older backend templates. */
  --white: var(--surface);
  --paper: var(--bg);
  --canvas: var(--surface-warm);
  --mist: var(--border);
  --line: var(--border-strong);
  --muted: var(--text-muted);
  --ink-soft: var(--text-secondary);
  --ink: var(--text);
  --ink-deep: var(--text);
  --off-white: var(--surface-warm);
  --navy: var(--text);
  --sky: var(--clinical-blue-strong);
  --sky-light: var(--clinical-blue);
  --coral: var(--trust-teal);
  --coral-dark: #207D72;
  --coral-light: #BDE8E2;
  --sage: var(--verified-green);
  --sage-dark: #175D44;
  --sage-light: #E8F5F0;
  --red: var(--error);
  --red-light: #FEF3F2;
  --s-1: 0.25rem;
  --s-2: 0.5rem;
  --s-3: 0.75rem;
  --s-4: 1rem;
  --s-5: 1.5rem;
  --s-6: 2rem;
  --s-7: 3rem;
  --s-8: 4rem;
  --s-9: 6rem;
}
