/* ==========================================================================
   Grid Coordination: design tokens
   Every value the components layer is allowed to use lives here.
   Derived from the seven original tokens. Nothing else may hard code a value.
   ========================================================================== */

:root {

  /* --- Palette -----------------------------------------------------------
     Established and unchanged: --nav-bg, --nav-fg, --accent, --accent-light,
     --bg, --fg, --border. Everything else is a neutral derived from them.
     No second hue was added: the problems this site has are hierarchy
     problems, and a second colour would make them worse.
     ---------------------------------------------------------------------- */

  --nav-bg:            #1a1a2e;   /* established dark */
  --nav-bg-raised:     #24243c;   /* one step up, for bands on the dark */
  --nav-fg:            #e0e0e0;   /* established nav link */
  --nav-fg-dim:        #a9acbb;   /* secondary text on dark, AA on --nav-bg */

  --accent:            #2a6e3f;   /* established green */
  --accent-dark:       #1f5330;   /* hover, and rules that need weight */
  --accent-light:      #e8f5e9;   /* established tint */
  --accent-on-dark:    #6dbb87;   /* the green, lifted to read on --nav-bg */

  --bg:                #fafafa;   /* established page */
  --surface:           #ffffff;   /* cards, table head on light */
  --surface-sunken:    #f2f2f0;   /* code, figure mats */

  --fg:                #222222;   /* established body */
  --fg-muted:          #565c64;   /* captions, secondary. AA on --bg */
  --fg-inverse:        #ffffff;
  --fg-inverse-muted:  #c3c6d0;   /* AA on --nav-bg */

  --border:            #dddddd;   /* established hairline */
  --border-strong:     #bfbfbf;   /* table rules, emphasis edges */
  --rule:              #e4e4e2;   /* section dividers, quieter than border */

  /* --- Type --------------------------------------------------------------
     System stack only. A 1.22 scale, so long argument pages differentiate.
     ---------------------------------------------------------------------- */

  --font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  --font-mono: ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace;

  --text-xs:    0.8125rem;   /* 13px: captions, footer bottom */
  --text-sm:    0.9375rem;   /* 15px: nav, table cells, card body */
  --text-base:  1.0625rem;   /* 17px: body copy */
  --text-lg:    1.1875rem;   /* 19px: h3, card heading */
  --text-xl:    1.4375rem;   /* 23px: h2 */
  --text-2xl:   1.75rem;     /* 28px: lede */
  --text-3xl:   2.25rem;     /* 36px: h1 */
  --text-4xl:   2.875rem;    /* 46px: hero h1 */

  --leading-tight:  1.14;
  --leading-snug:   1.38;
  --leading-normal: 1.65;

  --tracking-tight: -0.018em;
  --tracking-wide:  0.09em;

  --weight-normal: 400;
  --weight-medium: 500;
  --weight-bold:   600;

  /* --- Space (4px base) -------------------------------------------------- */

  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.5rem;
  --space-6: 2rem;
  --space-7: 3rem;
  --space-8: 4.5rem;

  /* --- Structure --------------------------------------------------------- */

  --max-width:  52rem;
  --gutter:     2rem;
  --radius:     4px;
  --radius-sm:  3px;
  --rule-thick: 3px;   /* accent rules on hero, callout, banner */
}

/* Narrow screens: the scale steps down in one place, not per component. */
@media (max-width: 600px) {
  :root {
    --text-2xl: 1.375rem;
    --text-3xl: 1.625rem;
    --text-4xl: 1.875rem;
    --gutter:   1.25rem;
    --space-8:  2.5rem;
    --space-7:  2rem;
  }
}

/* Print: ink on paper, no filled bands. */
@media print {
  :root {
    --bg:              #ffffff;
    --surface:         #ffffff;
    --surface-sunken:  #ffffff;
    --accent-light:    #ffffff;
    --fg:              #000000;
    --fg-muted:        #333333;
    --text-base:       11pt;
    --text-sm:         10pt;
    --text-xs:         9pt;
  }
}