/* ============================================================
   ZEBRA CROPBANK · Design tokens (§3.2)
   ============================================================ */
:root{
  /* Brand */
  --magenta-50:#FDF0F7;  --magenta-100:#FADCEC; --magenta-200:#F2B6D6;
  --magenta-500:#B41E77; --magenta-600:#991960; --magenta-700:#7A1450;

  --green-50:#EDF8F2;    --green-100:#D6EFE2;   --green-200:#AEDFC6;
  --green-500:#37A668;   --green-600:#2C8553;   --green-700:#216640;

  --navy-900:#212839;    --navy-800:#2C3448;    --navy-700:#3B4459;
  --navy-600:#4E586E;    --navy-500:#66718A;

  /* Neutrals */
  --n-0:#FFFFFF;  --n-25:#FAFBFC; --n-50:#F5F7F9; --n-100:#EDF0F3;
  --n-200:#DFE3E8; --n-300:#C6CCD4; --n-500:#6B7480; --n-700:#414A57;

  /* Semantic (derived, not brand) */
  --success:var(--green-500);
  --warning:#C77A0A;  --warning-bg:#FDF4E7;
  --danger:#C63434;   --danger-bg:#FCEDED;
  --info:#2563A8;     --info-bg:#EDF3FA;

  /* Chart series (validated for CVD separation) */
  --chart-1:var(--green-500);
  --chart-2:var(--magenta-500);
  --chart-3:var(--info);
  --chart-4:#C77A0A;
  --chart-5:var(--navy-500);
  --chart-6:#7A5FC7;

  /* Elevation · subtle only */
  --shadow-sm:0 1px 2px rgba(33,40,57,.06);
  --shadow-md:0 4px 12px rgba(33,40,57,.08);
  --shadow-lg:0 12px 32px rgba(33,40,57,.12);

  /* Radius */
  --r-sm:10px; --r-md:14px; --r-lg:20px; --r-full:999px;

  /* Spacing · 4px base */
  --s-1:4px; --s-2:8px; --s-3:12px; --s-4:16px; --s-5:20px;
  --s-6:24px; --s-8:32px; --s-10:40px; --s-12:48px;

  /* Type */
  --font-display:'Plus Jakarta Sans',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;
  --font-body:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;
  --font-mono:'JetBrains Mono',ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;

  --t-11:11px; --t-12:12px; --t-13:13px; --t-15:15px;
  --t-18:18px; --t-22:22px; --t-28:28px; --t-36:36px;

  --tr:150ms cubic-bezier(.4,0,.2,1);
}
