/* Canonical design tokens. Propshaft serves this file to the Rails app, and the
   prototypes in docs/design/app/ link it directly, so a change here is a one-file edit
   for all of them — the public pages and the signed-in screens included. */

:root {
  color-scheme: light;

  /* --- palette (OKLCH) --- */
  --ground:        oklch(0.986 0.004 258);   /* navy-tinted off-white, not cream */
  --surface:       oklch(1 0 0);
  --surface-sunk:  oklch(0.975 0.006 258);
  --ink:           oklch(0.27 0.055 258);     /* deep navy — headings */
  --ink-body:      oklch(0.33 0.045 258);     /* body text */
  --ink-muted:     oklch(0.47 0.032 258);     /* secondary text / labels */
  --ink-faint:     oklch(0.60 0.024 258);
  /* Placeholder and unchosen text. Cut to 4.57:1 on white, above the 4.5:1
     floor: a placeholder states what to type ("Last, First") and an unchosen
     select states what the box is for, so both have to be readable rather than
     merely present. It was oklch(0.72 …), which read at 2.48:1. */
  --ink-ghost:     oklch(0.565 0.014 258);
  --hair:          oklch(0.905 0.010 258);    /* hairline borders */
  --hair-strong:   oklch(0.85 0.014 258);

  --accent:        oklch(0.535 0.118 55);     /* burnt ochre — decision points */
  --accent-strong: oklch(0.47 0.108 52);      /* hover */
  --accent-ink:    oklch(0.44 0.10 52);       /* ochre text on wash */
  --accent-wash:   oklch(0.958 0.033 72);     /* light amber flag bg */
  --accent-hair:   oklch(0.855 0.058 72);

  --check:         oklch(0.45 0.03 258);      /* settled/mapped glyph (neutral) */

  /* The DRAFT flag on an unapproved passage: a dashed outline in its own
     neutral, so it reads as a note about the page rather than as content. */
  --flag-ink:      oklch(0.45 0.020 264);
  --flag-border:   oklch(0.72 0.020 264);
  --flag-bg:       oklch(0.965 0.004 264);

  /* The homepage draws two passages in a serif — the LEDES explainer and the
     founder note. Spectral was cut on 2026-08-03 rather than ship a third
     family for two passages, so this stack names only faces a reader's own
     machine has. --good marks the finished file on the homepage; the app marks
     a settled value with the neutral --check instead. */
  --serif: Georgia, "Times New Roman", serif;
  --good:  oklch(0.55 0.090 155);

  /* The two reds. --warn is the quiet one, for the flash band that reports
     something the customer has to act on: it is cut to the same lightness and
     chroma as --accent and --good, so it reads as a member of this palette.
     --error is the loud one, for a box the server refused and the summary that
     lists them — a refusal has to be found on the page before it can be fixed,
     and --warn at this size read as muted. It is GOV.UK's error red (#ca3535)
     in this palette's notation, at 5.16:1 on white. */
  --warn:  oklch(0.52 0.115 25);
  --error: oklch(0.558 0.186 26);

  /* --- type scale (~1.25) --- */
  --step--2: 0.78rem;
  --step--1: 0.9rem;
  --step-0:  1.0625rem;   /* 17px body */
  --step-1:  1.33rem;
  --step-2:  1.72rem;
  --step-3:  2.2rem;
  --step-4:  clamp(2.55rem, 1.6rem + 3.4vw, 3.45rem);

  --sans: "Schibsted Grotesk", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  --mono: "JetBrains Mono", ui-monospace, "SF Mono", "Cascadia Code", Menlo, Consolas, monospace;

  /* --- 4pt spacing --- */
  --s1: 4px;  --s2: 8px;  --s3: 12px; --s4: 16px; --s5: 24px;
  --s6: 32px; --s7: 48px; --s8: 64px;

  --measure: 66ch;
  --radius: 10px;
  --radius-sm: 6px;

  /* The two page measures. The app column is 720px with 24px of edge padding;
     a public page runs to 1180px and pads by a proportion of the viewport, so
     the text never touches the bezel on a phone. .wrap reads --wrap-max and
     --wrap-pad, and .wrap-wide swaps in the two below. */
  --edge: clamp(1.15rem, 4vw, 3rem);
  --maxw: 1180px;
  --wrap-pad: var(--s5);

  --z-header: 100;
}