/* Krieger Analytics — design tokens (from design_tokens/, concatenated) */
@import url('https://fonts.googleapis.com/css2?family=Hanken+Grotesk:ital,wght@0,400..800;1,400..600&display=swap');

:root {
  /* Brand: Clay Red */
  --red-50:#fbf1ee; --red-100:#f5ded7; --red-200:#e9bcb1; --red-300:#db9889;
  --red-400:#c86b58; --red-500:#af4035; --red-600:#97362a; --red-700:#7c2c22;
  --red-800:#5d231b; --red-900:#3f1812;
  /* Warm neutrals */
  --neutral-0:#ffffff; --neutral-25:#fbfaf8; --neutral-50:#f5f3ef; --neutral-100:#ece9e3;
  --neutral-200:#ddd9d1; --neutral-300:#c4bfb4; --neutral-400:#a39e92; --neutral-500:#847f73;
  --neutral-600:#635f55; --neutral-700:#46433c; --neutral-800:#2a2b2a; --neutral-900:#1a1b19;
  /* Support / data-viz */
  --green-500:#2e7d5b; --green-50:#e4f1ea; --amber-500:#c08828; --amber-50:#f8efd9;
  --slate-500:#3c5a78; --slate-50:#e6edf3;
  /* Semantic surfaces */
  --color-bg:var(--neutral-25); --surface-card:var(--neutral-0); --surface-sunken:var(--neutral-50);
  --surface-inverse:var(--neutral-800); --surface-brand:var(--red-500); --surface-brand-tint:var(--red-50);
  /* Text */
  --text-strong:var(--neutral-900); --text-body:var(--neutral-800); --text-muted:var(--neutral-600);
  --text-subtle:var(--neutral-500); --text-on-brand:var(--neutral-0); --text-on-dark:var(--neutral-25);
  --text-brand:var(--red-500);
  /* Borders */
  --border-subtle:var(--neutral-200); --border-default:var(--neutral-300); --border-strong:var(--neutral-400);
  /* Brand interaction */
  --brand:var(--red-500); --brand-hover:var(--red-600); --brand-press:var(--red-700);
  --focus-ring:color-mix(in oklab, var(--red-500) 45%, transparent);
  /* Status */
  --status-positive:var(--green-500); --status-caution:var(--amber-500);
  --status-info:var(--slate-500); --status-negative:var(--red-600);

  /* Typography */
  --font-display:'Hanken Grotesk', system-ui, -apple-system, sans-serif;
  --font-sans:'Hanken Grotesk', system-ui, -apple-system, sans-serif;
  --font-mono:'Hanken Grotesk', system-ui, -apple-system, sans-serif;
  --fw-regular:400; --fw-medium:500; --fw-semibold:600; --fw-bold:700; --fw-extra:800;
  --text-xs:0.75rem; --text-sm:0.875rem; --text-base:1rem; --text-md:1.125rem; --text-lg:1.375rem;
  --text-xl:1.75rem; --text-2xl:2.25rem; --text-3xl:3rem; --text-4xl:3.75rem; --text-5xl:4.75rem;
  --lh-tight:1.04; --lh-snug:1.18; --lh-normal:1.5; --lh-relaxed:1.65;
  --ls-tight:-0.022em; --ls-snug:-0.012em; --ls-normal:0em; --ls-wide:0.04em; --ls-caps:0.08em;

  /* Spacing */
  --space-1:0.25rem; --space-2:0.5rem; --space-3:0.75rem; --space-4:1rem; --space-5:1.5rem;
  --space-6:2rem; --space-7:2.5rem; --space-8:3rem; --space-9:4rem; --space-10:5rem; --space-12:7rem;
  --container-max:1200px; --container-prose:680px; --gutter:var(--space-5); --section-y:var(--space-12);

  /* Radii / borders */
  --radius-xs:4px; --radius-sm:6px; --radius-md:10px; --radius-lg:16px; --radius-xl:24px; --radius-pill:999px;
  --border-width:1px; --border-hairline:1px solid var(--border-subtle);

  /* Shadows */
  --shadow-xs:0 1px 2px rgba(42,27,24,.06);
  --shadow-sm:0 1px 3px rgba(42,27,24,.08), 0 1px 2px rgba(42,27,24,.05);
  --shadow-md:0 4px 12px rgba(42,27,24,.08), 0 2px 4px rgba(42,27,24,.05);
  --shadow-lg:0 12px 28px rgba(42,27,24,.10), 0 4px 10px rgba(42,27,24,.05);
  --shadow-xl:0 24px 48px rgba(42,27,24,.14);
  --shadow-brand:0 8px 20px rgba(175,64,53,.22);
  --ring:0 0 0 3px var(--focus-ring);

  /* Motion */
  --ease-out:cubic-bezier(0.22,0.61,0.36,1); --ease-inout:cubic-bezier(0.65,0,0.35,1);
  --dur-fast:120ms; --dur-base:200ms; --dur-slow:360ms;
}