/* ==========================================================================
   Dibs — design tokens (single source of truth)
   Generated from DESIGN.md v2. DO NOT edit values in this file without
   updating DESIGN.md first. Every Dibs surface links this file and consumes
   the variables; no surface redefines a colour locally.

   Accessibility contract: colour never carries meaning alone. Every status
   pairs a hue with a text label and a distinct icon/shape. See DESIGN.md.
   ========================================================================== */

:root {
  /* --- Ink ------------------------------------------------------------- */
  --ink:          #101C16;
  --ink-soft:     #4A5A51;
  /* Measured, not eyeballed: #77877D only reached 3.79:1 on white and 3.37:1
     on --paper-sink, so every piece of fine print sat below WCAG AA. This
     value clears 4.5:1 on all three paper tints (5.06 / 4.78 / 4.50).
     Verify with: python3 tools/check-contrast.py */
  --ink-faint:    #647269;

  /* --- Paper ----------------------------------------------------------- */
  --paper:        #FFFFFF;
  --paper-warm:   #F7F9F6;
  --paper-sink:   #EEF3EE;

  /* --- Brand ----------------------------------------------------------- */
  --brand:        #0F7A43;
  --brand-deep:   #0A5730;
  --brand-bright: #1FA85C;  /* large fills + illustration only, never text */
  --brand-wash:   #E7F3EB;

  /* --- Status (always paired with a label + icon) ---------------------- */
  --amber:        #B8791A;
  --amber-wash:   #FDF3E2;
  --slate:        #2F5D8C;
  --slate-wash:   #E9F0F7;
  --alert:        #A8321E;
  --alert-wash:   #FBEBE8;

  /* --- Lines ----------------------------------------------------------- */
  --line:         #DFE7E1;
  --line-strong:  #C3D0C7;
  /* Form controls only. WCAG 1.4.11 asks 3:1 for the boundary of an
     interactive component, and --line-strong only reaches 1.59:1 on white:
     on a white-filled input the border is the sole affordance, so it has to
     be discernible. Kept separate from --line-strong so card and button
     edges keep their lighter weight. 3.20:1 white, 3.03:1 on --paper-warm. */
  --line-input:   #89928C;

  /* --- Radius ---------------------------------------------------------- */
  --r-sm:   8px;
  --r:      12px;
  --r-lg:   18px;
  --r-pill: 999px;

  /* --- Elevation (max two levels per screen) --------------------------- */
  --shadow:      0 1px 2px rgba(16, 28, 22, .05), 0 6px 20px rgba(16, 28, 22, .06);
  --shadow-lift: 0 2px 4px rgba(16, 28, 22, .07), 0 16px 40px rgba(16, 28, 22, .12);

  /* --- Type ------------------------------------------------------------ */
  --font-display: "Bricolage Grotesque", "Inter", -apple-system, BlinkMacSystemFont, sans-serif;
  --font-body:    "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;

  --t-xs:   12px;
  --t-sm:   14px;
  --t-base: 16px;
  --t-md:   18px;
  --t-lg:   22px;
  --t-xl:   28px;
  --t-2xl:  36px;
  --t-3xl:  48px;
  --t-4xl:  64px;

  /* --- Space (4px grid) ------------------------------------------------ */
  --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; --s-16: 64px; --s-20: 80px; --s-24: 96px;

  --maxw: 1140px;
}

/* Amounts, counters, clock times and any table column of figures must not
   jitter as digits change. */
.tnum,
time,
[data-amount],
td[align="right"] { font-variant-numeric: tabular-nums; }

/* Keyboard focus is never removed, only restyled. */
:where(a, button, input, select, textarea, [tabindex]):focus-visible {
  outline: 3px solid var(--brand-deep);
  outline-offset: 2px;
  border-radius: var(--r-sm);
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
    scroll-behavior: auto !important;
  }
}