/* Design tokens. One light theme: clean off-white page, white cards, near-black actions, one fresh green.
   Every colour pair used for text on a soft fill passes 4.5:1. */
:root {
  --font: "Manrope", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --font-num: "Manrope", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --font-display: "Manrope", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --font-mono: ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace;

  --bg: #f5f7f6;
  --surface: #ffffff;
  --surface-2: #eceff0;
  --border: #e9edeb;
  --border-strong: #ccd4d0;
  --text: #0f1714;
  --text-2: #56625d;
  --ink: #0f1714;
  --ink-2: #28332e;
  --accent: #15a06b;
  --accent-ink: #052418;
  --accent-soft: #dff5ea;
  --accent-fg: #0b7a50;
  --focus: #1b5fd6;

  /* the one call-to-action colour */
  --cta: #0f1714;          --cta-hover: #28332e;      --cta-ink: #ffffff;
  --cta-soft: #dff5ea;

  /* roles: fill (chips, avatars), soft fill, text on soft fill, ink on fill */
  --donor: #b45309;        --donor-soft: #fdecc8;        --donor-fg: #92400e;        --donor-ink: #ffffff;
  --receiver: #1d4ed8;     --receiver-soft: #dbe7fe;     --receiver-fg: #1d4ed8;     --receiver-ink: #ffffff;
  --coordinator: #6d28d9;  --coordinator-soft: #ebdffb;  --coordinator-fg: #6d28d9;  --coordinator-ink: #ffffff;

  /* stage families: -bg is a soft fill, -fg passes 4.5:1 on it */
  --offered-bg: #fdf0d2;   --offered-fg: #7a4a00;
  --progress-bg: #dbe8fb;  --progress-fg: #12408f;
  --done-bg: #d9f2e4;      --done-fg: #14583a;
  --exception-bg: #fbe0de; --exception-fg: #8f1d1d;
  --dispute-bg: #fbe0de;   --dispute-fg: #8f1d1d;
  --warn-bg: #fdecc8;      --warn-fg: #7a4a00;
  /* the one saturated red: a count mismatch or a refusal only */
  --alert: #c62d27;        --alert-ink: #ffffff;

  /* quantity bar segments */
  --q-distributed: #15a06b;
  --q-returned: #3b78d8;
  --q-disposed: #9aa5a0;
  --q-remaining: #dde4e0;

  --space-1: 4px; --space-2: 8px; --space-3: 12px; --space-4: 16px;
  --space-5: 24px; --space-6: 32px; --space-7: 48px;
  --radius-s: 12px; --radius-m: 20px; --radius-l: 28px; --radius-btn: 14px; --radius-pill: 999px;

  --fs-xs: 0.78rem; --fs-s: 0.9rem; --fs-m: 1rem; --fs-l: 1.2rem;
  --fs-xl: 1.5rem; --fs-num: 2.4rem;

  --shadow-1: 0 1px 2px rgba(16, 24, 20, 0.04), 0 8px 24px -12px rgba(16, 24, 20, 0.12);
  --shadow-2: 0 2px 4px rgba(16, 24, 20, 0.06), 0 18px 40px -14px rgba(16, 24, 20, 0.3);
  --shadow-accent: 0 8px 18px -10px rgba(15, 23, 20, 0.6);
  --glass: color-mix(in srgb, var(--surface) 86%, transparent);

  --ease: cubic-bezier(0.2, 0.8, 0.2, 1);
  --dur: 180ms;

  --tap: 44px;
  --safe-bottom: env(safe-area-inset-bottom, 0px);
  --safe-top: env(safe-area-inset-top, 0px);
}

@media (prefers-reduced-motion: reduce) {
  :root { --dur: 0ms; }
}