/* ---------------------------------------------------------------------------
   Causant design tokens - "Luminous Intelligence"
   ---------------------------------------------------------------------------
   One source of truth for colour, type, space and grid. Every other stylesheet
   in this repository consumes these names and defines no raw palette of its
   own, so the product can be re-toned from this file alone.

   Two rules are load-bearing and are documented here rather than in a commit
   message, because breaking them silently is how an interface turns back into
   a mood board:

   1. Deep green carries meaning and mint carries atmosphere. Green still marks
      primary action, selected routes, verified evidence and focus; pale mint
      may create light and depth but may never imply that evidence was verified.

   2. The legacy compatibility block at the bottom exists because roughly
      16,000 lines of product CSS still reference the old names. Those names are
      remapped onto the neutral ink scale rather than onto the accent. The old
      `--green` in particular was sprayed across headings, borders and emphasis;
      pointing it at the accent would turn the whole product green and destroy
      the scarcity the accent depends on. It resolves to ink on purpose.
--------------------------------------------------------------------------- */

:root {
  color-scheme: light;

  /* Surface and ink ------------------------------------------------------ */
  --causant-canvas: #f8fbf9;
  --causant-surface: #ffffff;
  --causant-ink: #0b3028;
  --causant-ink-soft: #49645d;
  /* #737670, the value the design brief specified, measures 4.29:1 on the
     canvas. Every label, table header, caption and kicker in the system uses
     this token at 12px, so that one value put roughly fifteen distinct pieces
     of small text below the 4.5:1 AA threshold.
     The binding constraint is not the canvas, though: this text sits on ruled
     surfaces, and where a grid line passes behind a glyph the background is
     --causant-grid, not --causant-canvas. This value is solved against that
     worst case: 4.54:1 on the grid line and 5.31:1 on open canvas. */
  --causant-muted: #587169;
  --causant-faint: #a8b9b2;

  /* Structure. The grid line is deliberately far lighter than any text
     colour: the exposed grid must never compete with a word on top of it. */
  --causant-grid: #e8f1ec;
  --causant-rule: #153b33;
  --causant-rule-soft: #dce9e2;
  --causant-rule-mid: #bfd2c8;

  /* Accent. Restrained deep forest green. See rule 1 above. */
  --causant-accent: #287748;
  --causant-accent-dark: #155b35;
  /* Display green clears the 3:1 large-text threshold on the canvas. */
  --causant-highlight: #3c9c60;
  --causant-accent-soft: #dff3e5;
  --causant-accent-faint: #eff9f2;
  --causant-on-accent: #ffffff;
  --causant-glow: rgba(115, 210, 145, 0.18);
  --causant-glow-soft: rgba(115, 210, 145, 0.08);
  --causant-panel: rgba(255, 255, 255, 0.76);
  --causant-panel-strong: rgba(255, 255, 255, 0.94);
  --causant-shadow-soft: 0 24px 70px rgba(31, 83, 62, 0.10);
  --causant-shadow-control: 0 14px 40px rgba(31, 83, 62, 0.09);

  /* Semantic states. Caution and critical are rationed harder than the
     accent. Critical is for an unavailable route, a failed evidence
     condition, a destructive action, a material contradiction or a system
     state needing immediate attention. It is not a decorative badge colour. */
  /* Solved against the grid line rather than open canvas, for the same
     reason as --causant-muted: caution labels sit on ruled surfaces.
     4.50:1 on the grid, 5.26:1 on the canvas. */
  --causant-caution: #7d6422;
  --causant-caution-soft: #f0ead8;
  --causant-critical: #702f35;
  --causant-critical-soft: #eee0e1;

  /* Type ----------------------------------------------------------------- */
  --font-display: "Avenir Next", "Helvetica Neue", Inter, Arial, sans-serif;
  --font-body: Inter, "Helvetica Neue", Arial, sans-serif;
  --font-mono: "IBM Plex Mono", "SFMono-Regular", Consolas, monospace;

  /* The hero ceiling is set so a two-line headline still clears the fold on a
     1280x800 laptop. Display type larger than this reads as a poster, not as
     an instrument, and pushes the primary action off screen. */
  --text-xs: clamp(0.68rem, 0.64rem + 0.12vw, 0.78rem);
  --text-sm: clamp(0.82rem, 0.78rem + 0.16vw, 0.95rem);
  --text-base: clamp(1rem, 0.94rem + 0.24vw, 1.18rem);
  --text-lg: clamp(1.2rem, 1.06rem + 0.5vw, 1.55rem);
  --text-xl: clamp(1.55rem, 1.3rem + 0.9vw, 2.2rem);
  --text-2xl: clamp(2.1rem, 1.65rem + 1.8vw, 3.7rem);
  --text-hero: clamp(3rem, 2rem + 4.6vw, 6.8rem);

  --leading-tight: 1.04;
  --leading-snug: 1.2;
  --leading-body: 1.55;
  --measure: 66ch;
  --measure-tight: 55ch;

  /* Uppercase mono labels carry evidence class, stage and provenance. They
     are a label system, never a paragraph style. */
  --label-tracking: 0.14em;

  /* Space ---------------------------------------------------------------- */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 48px;
  --space-8: 64px;
  --space-9: 96px;
  --space-10: 128px;

  /* Grid ----------------------------------------------------------------- */
  --grid-columns: 12;
  --grid-size-desktop: minmax(72px, 1fr);
  --page-gutter: clamp(40px, 5vw, 84px);

  /* Shape and depth are quiet rather than absent. Large radii identify
     interactive starts and evidence surfaces, not every piece of content. */
  --radius: 24px;
  --radius-card: 32px;
  --radius-control: 999px;
  --border-hair: 1px;

  --focus-ring: 2px solid var(--causant-accent);
  --focus-offset: 3px;

  --motion-fast: 120ms;
  --motion-base: 180ms;
  --motion-ease: cubic-bezier(0.2, 0, 0.1, 1);
}

@media (max-width: 1024px) {
  :root {
    --grid-columns: 8;
    --page-gutter: 32px;
  }
}

@media (max-width: 700px) {
  :root {
    --grid-columns: 4;
    --page-gutter: 18px;
  }
}

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