/*
 * tilas.xyz's own colours — the one layer the site does not take from the product.
 *
 * The page is paper; the product is a dark instrument the page displays. The app's ramp is tuned
 * for one job, being the grey card a user judges filament colour against (DESIGN.md §4.1), and a
 * page whose hero *is* that app reads best when the app is the darkest thing on it. So the site
 * redefines the semantic colour names tokens.css's alias block declares — `--surface-0` and the
 * rest — and nothing else: type, space, weights, tracking, motion and the fonts still arrive from
 * `tokens.css`, untouched. `site.css` keeps writing the same names it always did.
 *
 * Overriding the alias names rather than `--color-*` is what makes this hold under both colour
 * schemes: tokens.css's `prefers-color-scheme: light` block rewrites `--color-*`, and a later
 * `:root` definition of the alias wins over it regardless.
 *
 * `tokenSources.test.ts` sanctions exactly two files for a literal colour, this and tokens.css;
 * `palette.test.ts` checks that every alias is redefined here (so no colour falls through to the
 * app's ramp) and that every pair the site sets text in meets WCAG AA. The accent is a fill, never
 * text on paper: safety orange on this ground is 2.9:1, and the test does not list that pair
 * because the stylesheet never draws it.
 */

:root {
  color-scheme: light;

  /* Paper, raised paper, deeper paper — and the ink block a button or the pipeline strip is. */
  --surface-0: #f3f1ea;
  --surface-1: #ebe8dd;
  --surface-2: #e2ded0;
  --surface-3: #111111;

  --text-primary: #111111;
  --text-muted: #5a5851;

  /* A hairline between things, and the rule that is the whole grammar of the page. */
  --border-subtle: #c9c5b8;
  --border-strong: #111111;

  --accent: #ff4d00;
  --accent-contrast: #111111;

  /* Status is a word first (DESIGN.md §6); these are the words' colours on paper. */
  --danger: #a8291a;
  --warning: #7a4b00;
  --ok: #1f6a3a;
}
