/* MORE OF EVERYTHING — color tokens
   Sampled from the shipped B-012 BAFFLE page (source of truth) and the
   Branding Bible §7.1. Ratio target: ~45% black / 30% red / 25% cream-white.
   Red is a signal, never a fill. Only lines/type carry flat blocked color —
   photographic fields should be dithered/halftoned, not tinted with these. */

:root {
  /* base palette */
  --moe-cream: #F1EBE0;   /* Page X / body paper background */
  --moe-white: #FFFFFF;   /* product-page bg variant, cooler / more "technical" */
  --moe-black: #12100E;   /* ink, structural fields, load-bearing dark */
  --moe-black-warm: #0d0b09; /* deepest hero/hardware black, slightly warmer */
  --moe-red: #DD3B26;     /* wordmark, designations, section markers, signal accent */

  /* per-letter accents — additive, one per catalog entry at launch */
  --moe-accent-a: #E8A23A; /* A-15 WINK — amber. placeholder pending final sample */
  --moe-accent-b: #5057E8; /* B-012 BAFFLE — locked value, sampled from shipped page */

  /* semantic aliases */
  --surface-page: var(--moe-cream);
  --surface-page-alt: var(--moe-white);
  --surface-dark: var(--moe-black);
  --surface-dark-deep: var(--moe-black-warm);
  --text-ink: var(--moe-black);
  --text-on-dark: var(--moe-cream);
  --text-signal: var(--moe-red);
  --border-hairline-on-dark: rgba(241, 235, 224, 0.28);
  --border-hairline-on-dark-faint: rgba(241, 235, 224, 0.08);
  --selection-bg: var(--moe-accent-b);
  --selection-fg: var(--moe-cream);
}

/* per-product theme scopes — set data-moe-accent="a|b" on a page root to
   swap the running accent without touching component code */
[data-moe-accent="a"] { --moe-accent: var(--moe-accent-a); }
[data-moe-accent="b"] { --moe-accent: var(--moe-accent-b); }
:root { --moe-accent: var(--moe-red); }