/**
 * OuterBot design tokens (Phase 5, P5.0) — the single source of truth for
 * the settled identity: ink, cyan memory accent, rare pink recall-sparkle,
 * halftone-as-compression.
 *
 * Usage law (enforce in review):
 * - Cyan (--mem-*) appears only where memory or a primary action is present
 *   — briefing content, memory UI, the one primary CTA per view.
 * - Pink (--spark-*) appears at most once per view, only at a recall/wow
 *   moment. It is not a general accent color.
 * - Everything else is ink + text scale.
 * - Halftone dot texture (SVG pattern, in assets) is used exclusively to
 *   represent compressed/summarized content — never as decoration.
 *
 * This was kept byte-identical with web-ide/src/styles/tokens.css while
 * that surface was live; web-ide/ is retired (moved to attic/, per Fable's
 * housekeeping directive after the workspace.html/web-ide mixup recurred
 * across multiple phase briefs) — this file is now the only copy.
 *
 * Fonts are self-hosted (P5.3 perf fix), not loaded from Google Fonts.
 * Google's CDN, even with preconnect/preload, still measured as a highly
 * variable ~2s render delay on the LCP text element in production
 * Lighthouse runs (vs. a consistent <200ms same-origin once self-hosted).
 * Files live in website/fonts/, referenced relative to this file's own
 * location (website/css/tokens.css). Only "latin" unicode-range subsets
 * are included — this is an English-only product surface.
 */

@font-face {
  font-family: 'Space Grotesk';
  font-style: normal;
  font-weight: 500 700;
  font-display: swap;
  src: url('../fonts/space-grotesk-var.woff2') format('woff2');
}
@font-face {
  font-family: 'IBM Plex Sans';
  font-style: normal;
  font-weight: 400 600;
  font-display: swap;
  src: url('../fonts/ibm-plex-sans-var.woff2') format('woff2');
}
@font-face {
  font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('../fonts/ibm-plex-mono-400.woff2') format('woff2');
}
@font-face {
  font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('../fonts/ibm-plex-mono-500.woff2') format('woff2');
}

:root {
  /* Ink scale (warm-neutral dark) */
  --ink-0:#0b0d10; --ink-1:#12151a; --ink-2:#1a1e25; --ink-3:#23272e;
  --ink-border:#2e333b;
  /* Text on ink */
  --tx-hi:#eef1f4; --tx-mid:#c3cad2; --tx-low:#9aa3ad; --tx-faint:#646c76;
  /* Memory accent — cyan (from logo) */
  --mem-500:#29C5F6; --mem-300:#85e2ff; --mem-700:#0c86b3; --mem-900:#042C53;
  /* Recall sparkle — pink (from logo), RARE: one instance per view max */
  --spark-300:#F5C8F0; --spark-500:#e79ede;
  /* Semantic */
  --ok:#5DCAA5; --warn:#EF9F27; --err:#F09595;
  /* Type */
  --font-display:'Space Grotesk',sans-serif;   /* headlines only */
  --font-body:'IBM Plex Sans',sans-serif;
  --font-mono:'IBM Plex Mono',monospace;        /* anything the product demonstrates or remembers */
  /* Shape */
  --r-ctl:8px; --r-card:12px;
}