/* ============================================================
   TOKENS — the whole design lives in this file.

   These names are the KIT TOKEN CONTRACT. Rename nothing;
   RE-VALUE everything. See DESIGN-LANGUAGE.md for the argument
   each value is making.

   The palette is the house palette from `btmz-brand`:

     Chop Red   #B4120A   the mark, and NOTHING else
     Stock      #F7F2EA   the paper the mark is pressed on
     Ink        #1A1614   text

   Those three are fixed brand values. Everything else here is a
   ramp derived from them so the sheet has depth without
   introducing a fourth hue.

   CHOP RED IS RESERVED. It is bound to --brand and --brand is
   painted on exactly one element: the mark. If you find yourself
   reaching for it for a button, a link or a rule, the answer is
   --ink. A signature that appears twice on a page stops being a
   signature and becomes decoration.

   STRUCTURAL WARNING — the APCA gate parses this file by selector
   block. Keep the three blocks exactly as they are (`:root`, then
   `:root, :root[data-theme="dark"]`, then `:root[data-theme="light"]`)
   or the gate will read an empty palette and silently pass nothing.
   ============================================================ */

:root {
  /* Rockwell is the MARK's face and the mark's alone — it ships as
     outlines in the SVG, so nothing here depends on it being
     installed. The page is set in a grotesque for the same reason
     the launch screens are: a name set in Rockwell competes with
     the chop instead of sitting under it. */
  --font-sans: ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --font-mono: ui-monospace, "SF Mono", Menlo, Consolas, monospace;
  --fs-xs: 0.85rem;
  --fs-xxs: 0.72rem;
  --dur-fast: 160ms;
  --dur-slow: 700ms;
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-conveyor: cubic-bezier(0.3, 0, 0.2, 1);
  --radius: 3px;
  --radius-l: 4px;
  --gutter: clamp(1.25rem, 5vw, 3rem);
}

/* The night shift. Keyed BY NAME — the gate finds the dark palette by
   [data-theme="dark"] and the light one by [data-theme="light"].

   The ground sits BELOW Ink rather than at it. A true #1A1614 ground
   would put the mark's own field at the same value as the page and the
   chop would stop reading as something pressed ONTO a surface. Dropping
   the ground is the same move splash.py makes for the dark launch
   screen, and for the same reason. */
:root,
:root[data-theme="dark"] {
  color-scheme: dark;
  --bg: #14110F;
  --bg-2: #1E1A17;
  --bg-3: #262119;
  --bg-inset: #0D0B0A;
  --ink: #F4EEE3;
  --ink-soft: #DCD4C6;
  --ink-mute: #C2B9A8;
  --ink-faint: #7C7365;
  --line: #332C25;
  --line-strong: #4A4137;
  /* Chop Red, unchanged — the brand value is fixed and does not get a
     night variant. It is also NOT GATED in this shift, deliberately: the
     mark ships its own Stock ground, so at night the red sits on Stock and
     never touches --bg. Gating it here would measure a pairing that is not
     on screen. See the note beside the pair in sitekit.config.mjs. */
  --brand: #B4120A;
  --action: #E8E1D4;
  --action-bright: #F4EEE3;
  --eco: #9BC0A7;
  --accent: #D9A45E;
  --accent-2: #AB8A68;
}

/* The day shift — this is the one that carries the identity. Stock is
   the ground because the whole conceit is a sheet of paper with a chop
   pressed into it; the night shift is that same sheet after hours. */
:root[data-theme="light"] {
  color-scheme: light;
  --bg: #F7F2EA;
  --bg-2: #FFFDF8;
  --bg-3: #EFE8DB;
  --bg-inset: #E8E0D1;
  --ink: #1A1614;
  --ink-soft: #3B3530;
  --ink-mute: #5A5149;
  --ink-faint: #948A7E;
  --line: #DFD5C5;
  --line-strong: #C3B7A4;
  --brand: #B4120A;
  --action: #262019;
  --action-bright: #1A1614;
  --eco: #3F7354;
  --accent: #7D6127;
  --accent-2: #77604A;
}
