/**
 * Gist Shared Brand Tokens (v3.5) — Single Source of Truth
 *
 * v3.5 — warm cream paper, translucent ink tiers, Instrument Sans
 * family. Canonical reference:
 * packages/ui/brand-guide/production/index.html.
 *
 * LOAD ORDER:
 * SSR templates link this file **before** their page-specific CSS so
 * the v3.5 cascade is in place when page selectors resolve `var(--ink)`,
 * `var(--paper)`, etc. Consumers today:
 *   - join.ts + join-success.ts -> tokens.css then join.css
 *   - policy-shell.ts (/about, /tos, /privacy) -> tokens.css then home.css then policy.css
 *   - docs/shell.ts (/docs/*) -> tokens.css then docs.css
 *   - help-contact.ts (/help, /help/contact) -> tokens.css then help-contact.css
 *   - welcome.ts (/welcome) -> tokens.css then welcome.css
 *   - url-prefix.ts inline <style> reuses --bg / --text-primary; the
 *     link still loads tokens.css so the v3.5 cascade is available.
 * `try.css` (/, /try) is the historical token home and continues to
 * declare its own `:root`; pages that load `try.css` do not need
 * `tokens.css` separately. When the two diverge, `try.css` is
 * presumed wrong — `tokens.css` is the canonical value.
 *
 * If brand tokens change, edit THIS file. join.css / docs.css /
 * help-contact.css consume `var(--ink)` directly post-refactor; any
 * surviving `--<prefix>-*` token in those files is genuinely
 * page-local (spacing, radius scale, page-only feedback wash).
 */

:root {
  /* Typography */
  --font-sans: 'Instrument Sans', -apple-system, BlinkMacSystemFont, 'Helvetica Neue', sans-serif;
  --font-serif: 'Instrument Serif', Georgia, 'Times New Roman', serif;
  --font-display: 'Instrument Sans', -apple-system, BlinkMacSystemFont, 'Helvetica Neue', sans-serif;
  --font-headline: 'Instrument Sans', -apple-system, BlinkMacSystemFont, 'Helvetica Neue', sans-serif;
  --font-mono: 'JetBrains Mono', 'SF Mono', Consolas, monospace;

  /* Text hierarchy — opacity-modulated against paper */
  --ink: #1C1C24;
  --ink-secondary: rgba(28,28,36,0.68);
  --ink-tertiary: rgba(28,28,36,0.42);
  --ink-faint: rgba(28,28,36,0.45);
  --ink-light: #FAF6EE;

  /* Background hierarchy — warm cream paper tiers */
  --paper: #FAF6EE;
  --wash: #F5EFE2;
  --surface: #ECE5D2;

  /* Borders — ink tinted so they track the paper tier */
  --border: rgba(28,28,36,0.13);
  --border-light: rgba(28,28,36,0.06);

  /* Brand — Sunrise Gradient */
  --gradient-start: #FF6B6B;
  --gradient-mid: #FFD93D;
  --gradient-end: #FF8E53;
  --gradient: linear-gradient(135deg, var(--gradient-start), var(--gradient-mid), var(--gradient-end));

  /* Feedback */
  --error: #DC2626;
  --error-wash: #fef2f2;
  --success: #10B981;
  --success-hover: #059669;
  --success-bg: #ecfdf5;
}

/* ============================================
   DESIGN TOKENS — Dark Mode (v3.5)
   Ink-as-paper inversion: warm cream becomes ink, deep charcoal
   becomes paper. Tiers re-modulate at the same percent stops as light
   so the hierarchy reads identically.
   ============================================ */
@media (prefers-color-scheme: dark) {
  :root {
    --ink: #FAF6EE;
    --ink-secondary: rgba(250,246,238,0.68);
    --ink-tertiary: rgba(250,246,238,0.42);
    --ink-faint: rgba(250,246,238,0.30);

    --paper: #15161C;
    --wash: #1C1D24;
    --surface: #22232B;

    --border: rgba(250,246,238,0.10);
    --border-light: rgba(250,246,238,0.04);
  }
}