/* HouseChalk colour — light appearance.
 *
 * THE GROUND IS NEUTRAL AND COOL, AND THE CARD IS PURE WHITE. Warm paper is
 * gone. The whole point of a cool neutral page is that white becomes a real
 * step above it rather than a slightly brighter version of it — which is what
 * makes the surface ladder legible without borders doing the work.
 *
 * THERE ARE NO TINTED GROUNDS. Sage, clay and lavender are gone, and so are the
 * -surface variants of amber and indigo. A colour now appears in exactly two
 * places: as the ACTION (blue, filled), or as a MARK — a chip's ink, an
 * eyebrow, a glyph, a figure's value, a tick. Meaning that used to be carried
 * by a tinted panel is carried by the surface ladder and by type.
 *
 * TWO RULES THAT DECIDE MOST DISPUTES.
 *   1. Blue is HouseChalk and the next product action. Green is status —
 *      settled, success, live, on site. Green never becomes a primary action.
 *   2. --primary is the TEXT-BEARING fill. --primary-flat is the raw accent for
 *      bars, dots and indicators with nothing written on top. Never write on
 *      --primary-flat.
 */
:root{
  color-scheme:light;

  /* ---- Brand palette. ---- */
  --pigment:#283EC4;            /* the action blue — between cobalt and ultramarine */
  --pigment-lift:#5A68DA;
  --pigment-ink:#1B2A8F;
  --aqua-forest:#59A686;        /* status green, carried over unchanged */
  --graphite:#15171A;
  --paper:#FFFFFF;
  --fog:#F2F2F2;
  --fog-deep:#E8E8E8;
  --signal-red:#DC2828;

  /* ---- Surfaces. THE LADDER, and the order is the whole point. The page is
     the default; a card sits ABOVE it and is the only rung that lifts; a zone
     sits BESIDE it as a region and is flat and square; the well sits BELOW a
     card, inside it. ---- */
  --surface:#F2F2F2;            /* the page — cool neutral, never white */
  --surface-card:#FFFFFF;       /* an object you can act on or cite */
  --surface-container:#E8E8E8;  /* a zone: a region of the screen, edge to edge */
  --surface-lowest:#F5F5F5;     /* a well INSIDE a card, never a third card */

  /* ---- Ink. AS TEXT GETS SMALLER, MUTED GETS DARKER. --on-surface-variant is
     the muted tone at 14px and up; --on-surface-dense is the muted tone at 13px
     and below. A measurement, not a second grey for taste. ---- */
  --on-surface:#15171A;         /* 16.0:1 on the page */
  --on-surface-variant:#5B6068; /* 5.6:1 on the page — 14px and up */
  --on-surface-dense:#494E56;   /* 7.4:1 on the page — 13px and below */

  /* ---- Edges. The hairline separates rows inside a card; the strong edge
     DRAWS a thing that has no fill — an outlined block, a chip, a pill. Both
     are inset rings, never borders.

     --control-outline IS THE RESTING EDGE OF SOMETHING YOU CAN PRESS, and the
     only edge in this file measured against WCAG 1.4.11's 3:1 — 4.17:1 on the
     card here, where --outline is 1.30:1 and the card itself is 1.12:1 against
     the page. A row divider inside a card takes the hairline; a control's own
     boundary never does. ---- */
  --outline:#E2E2E2;
  --outline-strong:#CBCBCB;
  --control-outline:#7B7C80;    /* 4.17:1 on --surface-card */
  --disabled:#B4B4B4;
  --rule-ink:color-mix(in srgb, var(--on-surface) 9%, transparent);
  --rail-ink:color-mix(in srgb, var(--on-surface) 22%, transparent);
  --hairline:var(--outline);

  /* ---- The action. ---- */
  --primary:#283EC4;            /* text-bearing fill — white on it, 8.15:1 */
  --primary-flat:#5A68DA;       /* bars, dots, indicators. NO TEXT. */
  --primary-deep:#1B2A8F;       /* ink on the blue wash */
  --on-primary:#FFFFFF;
  --primary-surface:#E8EAF9;    /* the ONE remaining wash: selected navigation */

  /* ---- Status. Green means settled, success, live, on site. ---- */
  --success:#59A686;            /* the flat status accent */
  --success-deep:#2A6349;       /* settled ink — 7.0:1 on white */
  --success-surface:#E4F2EB;    /* a MARK's disc only: a tick, never a panel */

  /* ---- Marks, not grounds. These are ink for a chip, an eyebrow, a glyph or a
     figure's value. There is deliberately no --amber-surface or
     --indigo-surface to reach for. ---- */
  --amber-deep:#8A5A17;         /* a clock is running; a costed figure */
  --indigo-deep:#4E4784;        /* somebody else: a person, a position */
  --terracotta-deep:#9A4747;    /* a genuine clash */

  /* ---- Destructive. Only ever an outline action, never a filled primary. ---- */
  --danger:#DC2828;
  --danger-deep:#A81D1D;

  /* ---- The hero band. Dark in BOTH appearances, so its ink never flips. That
     is why --on-hero is its own token and not --on-primary. ---- */
  --hero-start:#283EC4;
  --hero-end:#1B2A8F;
  --on-hero:#FFFFFF;

  /* ---- The desktop rail. A SOLID DARK NEUTRAL, not the action colour: the rail
     is permanent furniture and pigment is what you can DO, so a blue rail spends
     the action colour on the one element that is never the next action. Dark
     also lets the content beside it stay light without a border between them —
     the value change is the edge. ---- */
  --rail-surface:#1E2126;
  --on-rail:#F7F7F8;
  --on-rail-muted:#9AA0A8;
  --rail-active:var(--primary);
  --rail-hairline:color-mix(in oklch, var(--on-rail) 12%, transparent);

  /* ---- App chrome. The builder product runs on solid pigment. ---- */
  --shell:#283EC4;
  --on-shell:#FFFFFF;
  --shell-muted:color-mix(in oklch, var(--on-shell) 78%, transparent);
  --shell-selected:color-mix(in oklch, var(--on-shell) 16%, transparent);

  /* ---- Evidence wash. Behind a photograph, a document, a captured fact. ---- */
  --evidence-fill:rgba(40,62,196,0.08);
  --evidence-halo:rgba(40,62,196,0.12);
  --well:#0E1013;               /* the darker ground a document sheet rests on */
}