/* Festivenomics Shell — canonical design tokens.
 *
 * One copy for every web surface, one product. The values are the Vault
 * area's token block (the fullest implementation of UI.git
 * SPECIFICATIONS.md §3 — shadow, chart, semantic backgrounds, the paper
 * facsimile), which is the canonical look every other surface aligns to.
 *
 * Two deliberate reconciliations with history:
 *   - Semantic colours are named --success/--danger, with --ok/--bad kept
 *     as aliases — older surfaces were written against the alias names and
 *     nothing should break for a rename.
 *   - The accent is ONE colour product-wide (the brand orange). The
 *     body[data-area] attribute survives as a semantic marker, but it no
 *     longer swaps the accent — the per-area colour schemes are retired.
 *
 * Consumed as real copies, not symlinks (the economics static-file guard
 * realpath()s and refuses anything resolving outside its docroot).
 * scripts/sync-shell.sh distributes this file and shell/fonts/ into each
 * area; scripts/check-shell-drift.sh fails when a copy diverges.
 */

:root {
  color-scheme: dark;

  /* surfaces */
  --bg: #0A0A0A;
  --card: #161616;
  --card2: #1D1D1D;
  --line: #2A2A2A;

  /* text */
  --txt: #F2F2F2;
  --dim: #C9C9C9;
  --mut: #9A9A9A;

  /* brand */
  --orange: #FF8A47;
  --cyan: #64EEFF;
  --yellow: #FFFA34;
  --yellow2: #FFFE7B;

  /* THE accent — one product, one accent, everywhere: the brand orange
     that leads the streak and colours the wordmark. Areas are told apart
     by their nav position and page content, never by a colour scheme. */
  --accent: var(--orange);
  --accent-ink: #0A0A0A;
  --accent-bg: color-mix(in srgb, var(--accent) 8%, transparent);
  --accent-line: color-mix(in srgb, var(--accent) 38%, transparent);

  /* semantic — shared, never module-tinted */
  --success: #7DDB7D;
  --danger: #F09595;
  --success-bg: rgba(125, 219, 125, .11);
  --danger-bg: rgba(240, 149, 149, .11);
  --yellow2-bg: rgba(255, 254, 123, .10);
  /* aliases for surfaces written against the spec's original names */
  --ok: var(--success);
  --bad: var(--danger);

  /* charts draw from the accent */
  --chart: var(--accent);
  --chart-track: color-mix(in srgb, var(--accent) 18%, transparent);

  /* light document facsimile — content, not UI surface */
  --paper: #e9e7dd;
  --paper-ink: #2b2921;
  --paper-line: #d6d3c2;

  --shadow: 0 1px 2px rgba(0, 0, 0, .4), 0 6px 20px rgba(0, 0, 0, .3);

  /* type — three roles (plus OS's serif for the paper facsimile) */
  --display: 'Space Grotesk', Arial, sans-serif;
  --body: 'Inter', Arial, sans-serif;
  --mono: 'Space Mono', 'Courier New', monospace;
  --serif: Charter, "Iowan Old Style", Georgia, "Times New Roman", serif;
}

/* body[data-area] survives as a semantic marker (scripts and app styles key
   off it), but it no longer changes the accent — spec §3: one accent, the
   brand orange, identical in every area. */
body[data-area] {
  /* Static fallbacks first so a browser without color-mix degrades to a
     visible accent rather than none (pattern from eo's shell.css). */
  --accent-bg: rgba(255, 138, 71, 0.08);
  --accent-line: rgba(255, 138, 71, 0.38);
  --accent-bg: color-mix(in srgb, var(--accent) 8%, transparent);
  --accent-line: color-mix(in srgb, var(--accent) 38%, transparent);
  --accent-ink: #0A0A0A;
  --chart: var(--accent);
}

:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
  border-radius: 4px;
}