/* Hallmark · design system for Block ledger
 * genre: modern-minimal (dev-tool instrument panel) · macrostructure: Workbench
 * theme: custom — "Cobalt Night" · tone: deeper cool dark, instrument-grade
 * axes: dark paper / mono display / cool accent
 * pre-emit critique: P5 H5 E5 S5 R5 V4
 *
 * This is the live token source — index.html links it, it is not a snapshot.
 * Every colour, size, radius and duration in index.html resolves through a
 * token here; nothing is inlined. `node test.js` holds the contrast gate that
 * keeps these values honest.
 *
 * TWO COLOUR SYSTEMS, deliberately kept apart:
 *   1. Block types (--quiet / --open / --tired) encode *data* — which energy
 *      band a slot belongs to. Categorical; never used for interface chrome.
 *   2. Interface (--accent / --alarm) is *chrome* — focus, today, drag targets,
 *      over-budget. Never used to mean a block type.
 * The previous palette leaked --quiet (green) into today-markers, drag targets
 * and link hovers, so green meant both "Quiet block" and "interactive". That
 * overload is what this split fixes.
 */
:root {
  /* --- surfaces: elevation is lightness, +4.5% per level --- */
  --paper:   oklch(17%   0.014 258);  /* the ground */
  --paper-2: oklch(21.5% 0.016 258);  /* panels, filled cells, planner */
  --paper-3: oklch(26%   0.018 258);  /* task cards, row hover */

  /* --- ink: two tiers, both ≥5.8:1 on every surface --- */
  --ink:   oklch(94% 0.008 258);
  --ink-2: oklch(70% 0.014 258);

  /* --- rules: two weights, and the gap between them is the point ---
     --rule is structural and load-bearing (cell edges, inputs, section
     underlines), so it clears 3:1 on all three surfaces. --rule-2 only
     separates rows inside a list, so it stays quiet on purpose. One mid-grey
     doing both jobs is what made the old grid read mushy. */
  --rule:   oklch(54% 0.020 258);
  --rule-2: oklch(33% 0.016 258);

  /* --- block types: data encoding. ≥40° apart so none reads as another ---
     open sits on the anchor hue: it is the default, most common band, so it
     recedes into the ground instead of competing for attention. tired moved
     30° → 315° — it used to sit 3° from --alarm, which made "low-energy
     block" and "invalid / over budget" the same colour. */
  --quiet: oklch(78% 0.130 165);  /* 06–11 · protected deep work */
  --open:  oklch(74% 0.095 258);  /* 11–21 · interruptible, the default */
  --tired: oklch(72% 0.105 315);  /* 21–06 · execution only */

  /* --- interface: chrome only --- */
  --accent: oklch(80% 0.110 215);  /* focus, today, drag target, link hover */
  --alarm:  oklch(68% 0.190 25);   /* the only red on the page */
  --focus:  var(--accent);

  --scrim:        oklch(10% 0.020 258 / 0.72);
  --shadow-modal: 0 24px 64px oklch(8% 0.020 258 / 0.66);

  /* --- type: one family on purpose. a dense instrument panel wants a single
     tabular voice; a display/body pairing would fight the grid. --- */
  --mono: ui-monospace, "SF Mono", "JetBrains Mono", "IBM Plex Mono", Menlo, Consolas, monospace;
  --jelly-font-display: var(--mono);
  --jelly-font-text: var(--mono);
  --jelly-font-mono: var(--mono);

  /* six integer steps. mono renders soft at fractional px, and the old build
     had thirteen sizes between 8.5 and 20 — a spectrum, not a scale. */
  --t-2xs: 10px; --t-xs: 11px; --t-sm: 12px;
  --t-md:  13px; --t-lg: 15px; --t-xl: 20px;

  /* three tracking steps, down from seven */
  --tr-tight: 0.08em; --tr-label: 0.14em; --tr-wide: 0.2em;

  --space-3xs: 2px;  --space-2xs: 4px; --space-xs: 8px;
  --space-sm:  12px; --space-md:  16px; --space-lg: 24px; --space-xl: 40px;

  /* The board interior runs on a finer measure than the page rhythm — a week of
     28 slots has to fit one screen — so these are not on the 4pt scale. They are
     an alignment *system*, not free values, and the relationship is load-bearing:

        --board-label + --board-gap  ==  --budget-label + --cell-gap  ==  104px

     which is what puts each budget gauge directly over its own board column
     (Open spans two). One grid can only have one column-gap, so the label gutter
     absorbs the difference. Change one, re-derive the others. */
  --board-label:  92px;  /* day-name gutter on the board */
  --board-gap:    12px;  /* day-name gutter -> cells */
  --budget-label: 98px;  /* == board-label + board-gap - cell-gap */
  --cell-gap:      6px;  /* cell -> cell, and gauge -> gauge */
  --cell-pad:      5px;  /* inside a slot */
  --space-row:     6px;  /* between items inside a dense row: tick, name, hours */

  /* four radii, down from ten */
  --r-sm: 4px; --r: 6px; --r-lg: 10px; --r-pill: 99px;

  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --dur-fast: 90ms;  /* hover + colour shifts — sharp */
  --dur: 160ms;      /* surface + size changes */
}

/* The dark ground has to reach the viewport edge, not just the app box.
   overflow-x: clip, never hidden — hidden on the root makes a scroll container
   and would break any position: sticky further down the tree. */
html, body { background: var(--paper); overflow-x: clip; }