/*
 * Design tokens — Smart Money Sweeps.
 *
 * Transcribed VERBATIM from docs/sms-design-tokens.md v0.1. That file is the
 * source of truth; this one is its machine-readable copy.
 *
 * Do not introduce a value here that is not in the spec. If a new colour or
 * size is needed, add it to the spec first, then mirror it here. A token that
 * exists only in CSS is how a design system starts drifting.
 *
 * This file declares tokens ONLY. Applying them — overriding Mercury's
 * `.space-*` selectors — is Phase 5. Loading this file changes nothing
 * visually on its own, which is deliberate: Phase 2 proves the plumbing
 * works, Phase 5 spends it.
 */

:root {

  /* ---------------------------------------------------------------------
   * 1. Colour  (spec §1)
   *
   * Two tiers. Sage is ENVIRONMENTAL — temperature and structure, never an
   * action. One accent carries all actions, so a single button on a calm
   * page carries enormous weight. At most one --action element per
   * viewport-height of scroll.
   * ------------------------------------------------------------------ */

  /* Surfaces — warm paper, never gray, never pure white */
  --paper:            #F7F3EA;  /* page background */
  --paper-raised:     #FDFBF6;  /* cards, table rows on hover */
  --paper-sunk:       #EFE9DC;  /* table headers, inset panels */

  /* Ink — warm near-black, never #000 */
  --ink:              #211E1A;  /* body text, headlines */
  --ink-secondary:    #57514A;  /* supporting copy, captions */
  --ink-muted:        #857D72;  /* metadata, timestamps, disabled */

  /* Sage — environmental only. Structure, tags, fills, the logo mark. */
  --sage-50:          #EEF1E7;
  --sage-100:         #DCE3D2;
  --sage-200:         #C1CCB2;
  --sage-400:         #94A480;
  --sage-700:         #4C5A3E;  /* sage as readable text — 6.5:1 on paper */
  --sage-900:         #2F3826;

  /* Action — field-guide ink blue. Affiliate CTAs and primary links ONLY. */
  --action:           #1D4E6B;
  --action-hover:     #163D54;
  --action-quiet:     #E3EBF0;  /* link hover wash, focus ring bed */

  /* Rules — hairlines carry the structure. No drop shadows. */
  --rule:             #DED6C6;  /* standard hairline */
  --rule-strong:      #B9AE99;  /* section dividers, table outer edge */

  /* Data semantics — for scores and reliability grades.
     Deliberately distinct from sage (environment) and action (interaction).
     Never rely on colour alone: always pair with a label or numeral. */
  --data-good:        #3E6B4A;
  --data-caution:     #96680F;
  --data-poor:        #A33A2C;
  --data-unknown:     var(--ink-muted);

  /* ---------------------------------------------------------------------
   * 2. Typography  (spec §2)
   *
   * Three roles. Display used with restraint; body does the heavy lifting;
   * utility scoped tightly to metadata. Faces are self-hosted — see
   * fonts.css. Young Serif is single-weight: never synthetic bold.
   * ------------------------------------------------------------------ */

  /* Display — headlines, edition titles, operator names. Single weight;
     use size and case for hierarchy, not weight. */
  --font-display: "Young Serif", "Bitter", Georgia, serif;

  /* Body & UI — chosen for legibility as a thesis, not a default.
     Atkinson Hyperlegible was designed for maximum character disambiguation. */
  --font-body: "Atkinson Hyperlegible", "Public Sans", system-ui, sans-serif;

  /* Utility — datestamps, table labels, changelog entries, score
     annotations. Small sizes only. */
  --font-utility: "IBM Plex Mono", ui-monospace, monospace;

  /* Scale — 1.25 ratio, base 16px, deliberate jump at display sizes */
  --text-xs:   0.75rem;   /* 12px — utility labels, datestamps */
  --text-sm:   0.875rem;  /* 14px — table cells, captions */
  --text-base: 1rem;      /* 16px — body */
  --text-lg:   1.125rem;  /* 18px — lead paragraphs */
  --text-xl:   1.375rem;  /* 22px — subheads */
  --text-2xl:  1.75rem;   /* 28px — section heads */
  --text-3xl:  2.375rem;  /* 38px — page titles */
  --text-4xl:  3.25rem;   /* 52px — edition covers only */

  --leading-tight: 1.15;  /* display */
  --leading-snug:  1.35;  /* subheads, table cells */
  --leading-body:  1.6;   /* body copy */

  --tracking-display: -0.01em;
  --tracking-label:    0.08em;  /* uppercase utility labels */

  /* ---------------------------------------------------------------------
   * 3. Space, rules, and shape  (spec §3)
   *
   * Almanacs are made of rules and alignment, not cards and shadows.
   * Shadows are absent because they are not used — depth comes from
   * --paper-sunk and hairlines.
   * ------------------------------------------------------------------ */

  --space-1:  0.25rem;
  --space-2:  0.5rem;
  --space-3:  0.75rem;
  --space-4:  1rem;
  --space-6:  1.5rem;
  --space-8:  2rem;
  --space-12: 3rem;
  --space-16: 4rem;
  --space-24: 6rem;   /* section separation */

  /* Shape — near-square. Roundness reads as app; square reads as print. */
  --radius-none: 0;
  --radius-sm:   2px;   /* buttons, inputs */
  --radius-md:   4px;   /* maximum permitted anywhere */

  --border-hairline: 1px solid var(--rule);
  --border-section:  2px solid var(--rule-strong);

}
