/* design-tokens.css — the canonical PlatAtlas brand tokens (single source of truth).
 *
 * These are the values landing.css (.landing-root) and the console (:root) already
 * use; this file makes them the SHARED source so a brand change propagates instead
 * of drifting per surface. Adopt it on a surface by mapping the surface's local
 * names to these `--pa-*` tokens (with a literal fallback so a missing file can
 * never break a page), e.g.  --paper: var(--pa-paper, #ede4ce);
 *
 * Light is the default. Dark is OPT-IN per page: a page that was styled for it sets
 * <html data-pa-auto-theme> (follows the system setting) or data-theme="dark" (forced);
 * data-theme="light" pins light. The console never sets it, so it never flips. Marketing
 * pages (/, /runs/, /setup, /demo/films/, /demo/record/) opt in, and so do the app pages
 * styled for it (the inbox and steward page, /demo/try/, /<org>/inbox/), where a person's
 * own chosen look is set inline and wins over these tokens.
 * Honesty/brand note: ONE accent (McNally highway terra). Never introduce a second
 * accent per surface. --pa-ok is a status colour (PASS, MEASURED), not an accent.
 */
:root {
  /* paper / surfaces (warm cream) */
  --pa-paper:      #ede4ce;
  --pa-paper-2:    #e5dabe;
  --pa-paper-3:    #d8c9a3;
  --pa-paper-deep: #b9a677;

  /* ink */
  --pa-ink:        #1a1611;
  --pa-ink-2:      #4a4239;
  --pa-ink-faint:  #655d4f;   /* WCAG AA fix (parity w/ console A8): old #8a7f6c failed 4.5:1 vs --pa-paper-2 (2.83:1) */

  /* rules + edges */
  --pa-rule:       #c4b591;
  --pa-rule-soft:  #d8caa6;
  --pa-rule-deep:  #a89668;

  /* the single accent — McNally highway terra */
  --pa-accent:      #b14a3a;
  --pa-accent-deep: #8c3a2c;
  --pa-accent-tint: rgba(177, 74, 58, 0.10);

  /* status: PASS and MEASURED (5.0:1 with paper both ways); FAIL is the deep accent */
  --pa-ok:          #2f6b45;
  --pa-fail:        var(--pa-accent-deep);

  /* spacing, 4px base */
  --pa-s1: 4px;  --pa-s2: 8px;  --pa-s3: 12px; --pa-s4: 16px; --pa-s5: 24px;
  --pa-s6: 32px; --pa-s7: 48px; --pa-s8: 64px; --pa-s9: 96px;

  /* type */
  --pa-font-serif: "Spectral", "Iowan Old Style", "Georgia", serif;
  --pa-font-sans:  "IBM Plex Sans", system-ui, sans-serif;
  --pa-font-mono:  "IBM Plex Mono", "SF Mono", ui-monospace, "Menlo", monospace;
}

/* Dark, opt-in (see the header). The same values twice: once for a page that follows the system setting,
   once for a page or a viewer that forces dark. */
@media (prefers-color-scheme: dark) {
  :root[data-pa-auto-theme]:not([data-theme=light]) {
    --pa-paper:      #16130f;
    --pa-paper-2:    #211c16;
    --pa-paper-3:    #2b251d;
    --pa-ink:        #ece3cf;   /* 14.5:1 on paper */
    --pa-ink-2:      #b9ae98;   /* 8.4:1 */
    --pa-ink-faint:  #8f8573;   /* 5.1:1 */
    --pa-rule:       #3a3329;
    --pa-rule-soft:  #2b251d;
    --pa-accent:      #e0907a;
    --pa-accent-deep: #d98a74;  /* 6.9:1: links, primary button, FAIL */
    --pa-accent-tint: rgba(224, 144, 122, 0.12);
    --pa-ok:          #7fbf93;  /* 8.6:1; chip text on it is #16130f */
    --pa-fail:        #d98a74;
    color-scheme: dark;
  }
}
:root[data-theme=dark] {
  --pa-paper:      #16130f;
  --pa-paper-2:    #211c16;
  --pa-paper-3:    #2b251d;
  --pa-ink:        #ece3cf;   /* 14.5:1 on paper */
  --pa-ink-2:      #b9ae98;   /* 8.4:1 */
  --pa-ink-faint:  #8f8573;   /* 5.1:1 */
  --pa-rule:       #3a3329;
  --pa-rule-soft:  #2b251d;
  --pa-accent:      #e0907a;
  --pa-accent-deep: #d98a74;  /* 6.9:1: links, primary button, FAIL */
  --pa-accent-tint: rgba(224, 144, 122, 0.12);
  --pa-ok:          #7fbf93;  /* 8.6:1; chip text on it is #16130f */
  --pa-fail:        #d98a74;
  color-scheme: dark;
}