/* Uproad Studios — design tokens
   Source: Uproad Brand Book v5.1 (2026), sections 05 Color & 06 Typography.
   "Accents are seasoning, not sauce — most layouts are ink on paper."

   Dark by default (the whole team's preference). Ground was Ink; per
   Mark's direction it's now Muted Navy — one of the brand's main colors,
   not just an accent — with Copper taking over navy's old "you are here"
   accent job (active tab, active stage, links) so it doesn't disappear
   into its own background. True brand hex values stay documented as
   literal strings on the Brand Guide page (routes/brand.js), independent
   of these tokens. */

:root {
  color-scheme: dark;

  /* Core palette */
  --up-ground: #2C3E52; /* Muted Navy — true Brand Book v5.1 hex (routes/brand.js swatches), unmodified. The ground. */
  --up-copper: #B5651D;  /* Copper — emphasis at size (14px+). Carries the "you are here" accent job navy used to (active tab/stage, links) now that navy is the ground itself */
  --up-ink: #1B1A18;     /* near-black warm ink — no longer the ground; kept for the few spots still wanting true brand Ink (e.g. text on a light-ish fill) */
  --up-paper: #F7F5F1;   /* soft paper white (Cream) — default text, and light text on accent fills */
  --up-danger: #E2725B;  /* brightened error/overdue red — #8C2B1E was tuned for cream, too dark to read on a dark ground */

  /* Warm neutral ramp (#EEEAE2 → #3B3833) — kept at its original light-mode
     values. Only the topbar (permanently ink-grounded, on-brand, in every
     theme) and a couple of small "pop" badges reference these raw stops
     directly; everything else uses the surface/line tokens below, which
     are derived from Ink/Paper so they track the dark ground. */
  --up-neutral-100: #EEEAE2;
  --up-neutral-200: #DCD7CC;
  --up-neutral-300: #BEB8AB;
  --up-neutral-400: #948E80;
  --up-neutral-500: #6A655A;
  --up-neutral-600: #3B3833;

  /* Semantic aliases */
  --up-bg: var(--up-ground);
  --up-fg: var(--up-paper);
  --up-accent: var(--up-copper);
  --up-accent-warm: var(--up-copper);
  --up-border: var(--up-line);
  --up-muted: color-mix(in srgb, var(--up-paper) 62%, var(--up-ground));

  /* Dark-ground surfaces, each one step lighter than the ground below it */
  --up-surface: color-mix(in srgb, var(--up-paper) 6%, var(--up-ground));
  --up-surface-2: color-mix(in srgb, var(--up-paper) 11%, var(--up-ground));
  --up-line: color-mix(in srgb, var(--up-paper) 18%, var(--up-ground));

  /* "You are here" fills — active tab, current stage, active doc. Paper
     text, not Ink — Copper's too saturated/mid-dark for Ink text to clear
     4.5:1 contrast against it. */
  --up-strong-bg: var(--up-copper);
  --up-strong-fg: var(--up-paper);

  /* Corner radius — two sizes cover everything from buttons to panels */
  --up-radius-sm: 6px;
  --up-radius: 10px;

  /* Typography */
  --up-font-display: "Libre Caslon Display", Georgia, serif; /* headlines, section titles, wordmark — big, upright, never italicized */
  --up-font-body: "Work Sans", "Helvetica Neue", sans-serif; /* body, quotes, captions, labels, folios, UI — weights 400–700 */

  /* Type scale (px) — Headline 34 / Subhead 22 / Body 16 / Caption 11 */
  --up-text-headline: 34px;
  --up-text-subhead: 22px;
  --up-text-body: 16px;
  --up-text-caption: 11px;

  /* Work Sans weights (display serif ships in 400 only) */
  --up-weight-regular: 400;
  --up-weight-medium: 500;
  --up-weight-semibold: 600;
  --up-weight-bold: 700;

  /* Spacing scale */
  --up-space-xs: 4px;
  --up-space-sm: 8px;
  --up-space-md: 16px;
  --up-space-lg: 24px;
  --up-space-xl: 40px;
  --up-space-2xl: 64px;
}