/* mudda-theme: the manuscript look, light. Navy ink on cream paper, slate for quieter text, brass
   for labels and marks, vermilion as the one accent. Brass is a 3:1 accent on paper, so a surface
   that carries paper-coloured text (a secondary button, a warning badge) uses the deeper
   --brass-fill. Surfaces are flat and told apart by hairlines; corners are near-square.

   Tokens are named by role, so dark.css flips every colour under the same names. This file is
   self-contained (no url(), no layers) and doubles as the static copy for public/ pages.

   Generated from tokens/*.json by scripts/build.mjs: edit the JSON, then run `npm run build`. */
:root {
  color-scheme: light;

  --paper: #f1e6ce;
  --paper-200: #e9dcc0;
  --paper-300: #dfd0b0;
  --ink: #1b2a4a;
  --ink-muted: #46536e;
  --brass: #8c6a2e;
  --brass-fill: #7f5f28;
  --vermilion: #b3341c;
  --hairline: rgb(27 42 74 / 0.2);

  --face-body: "IBM Plex Sans", "IBM Plex Sans Arabic", -apple-system, BlinkMacSystemFont, "Segoe UI", "Noto Sans", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji";
  --face-display: Amiri, "Noto Naskh Arabic", Georgia, serif;
  --face-mono: "JetBrains Mono", ui-monospace, monospace;

  --corner: 3px;

  --focus-ring-width: 2px;
  --focus-ring-offset: 2px;
  --focus-ring-color: var(--vermilion);
}