/* Design tokens v1 — working name "Larkweave" (swap via config.js)
   Light, warm paper + ink + ONE accent (signal red). No gradients. No shadows except focus ring. */
:root{
  /* colour */
  --paper:#F3EFE6;        /* page background */
  --paper-2:#EAE4D6;      /* alt band, table zebra, code bg */
  --paper-3:#DDD5C3;      /* pressed / hover on paper-2 */
  --ink:#16140F;          /* text, rules, primary button bg */
  --ink-2:#4A463C;        /* secondary text (8.2:1 on paper) */
  --ink-3:#7A7466;        /* captions, meta (4.05:1 — decorative/large only, never body text) */
  --rule:rgba(22,20,15,.18);   /* hairlines */
  --rule-strong:#16140F;       /* ledger top rules */
  --signal:#C8341E;       /* the only accent (4.6:1 on paper, OK for text; on paper-2 use --signal-ink; on ink bg only >=24px or non-text) */
  --signal-ink:#8F2210;   /* accent text on paper-2 (6.9:1) */
  --ok:#2F6B3F;           /* success only */
  --inverse-bg:#16140F; --inverse-fg:#F3EFE6; /* one dark band per page max (contact) */

  /* type */
  --font-display:"Fraunces", "Iowan Old Style", Georgia, serif;   /* opsz axis on; weight 400-500; SOFT 0 */
  --font-body:"IBM Plex Sans", system-ui, sans-serif;             /* 400, 500, 600 */
  --font-mono:"IBM Plex Mono", ui-monospace, monospace;           /* 400, 500 */

  /* type scale (fluid between 360px and 1280px viewports) */
  --t-display:clamp(2.75rem, 1.6rem + 4.6vw, 5.25rem);  /* hero h1, lh 1.02, ls -0.012em */
  --t-h2:clamp(2rem, 1.4rem + 2.2vw, 3.25rem);          /* lh 1.08, ls -0.005em */
  --t-h3:1.5rem;       /* lh 1.25, display font */
  --t-lead:1.25rem;    /* lh 1.5 */
  --t-body:1.0625rem;  /* 17px, lh 1.6 */
  --t-small:.9375rem;  /* 15px, lh 1.5 */
  --t-label:.75rem;    /* 12px mono, uppercase, ls .08em */

  /* spacing — 4px base */
  --s-1:4px; --s-2:8px; --s-3:12px; --s-4:16px; --s-5:24px; --s-6:32px;
  --s-7:48px; --s-8:64px; --s-9:96px; --s-10:144px;
  --section-y:var(--s-10);        /* desktop section padding; 96px <900px; 64px <600px */

  /* layout */
  --max:1200px; --gutter:24px; --cols:12; --measure:62ch;
  --radius:2px;                   /* everything is near-square; pills are not used */
  --hair:1px solid var(--rule);
  --focus:0 0 0 3px var(--paper), 0 0 0 5px var(--ink);
}