/*
 * css/tokens.css: the colour tokens of SPEC 12 A1 (and the theme-dependent shadows of A3), nothing else.
 * Dark is the default. Light is applied by js/shell/theme-boot.js from localStorage['pontica.theme'] before paint.
 * Always-dark surfaces (the home stage, the protocol page, the footer CTA band) carry data-theme="dark" in both
 * themes; so does the home header while it overlays the stage. tools/verify.mjs parses the two blocks below and
 * recomputes every contrast pair of A1: keep one declaration per line and hex values for text and grounds.
 */

/* dark */
:root,
[data-theme="dark"],
html[data-stage] .site-header:not([data-header="page"]) {
  color-scheme: dark;
  --bg: #0a0f0d;
  --bg-deep: #060a08;
  --panel: #101814;
  --panel-2: #16211b;
  --panel-3: #0c1310;
  --line: #1e2a24;
  --line-row: #18221d;
  --line-strong: #2b3a32;
  --line-input: #5e7065;
  --text: #eef1ea;
  --dim: #c9d1c9;
  --body: #a9b3ab;
  --muted: #909b93;
  --faint: #808d84;
  --accent: #3ddc97;
  --accent-tint: #10281e;
  --accent-line: #1f5a42;
  --action: #2fc98b;
  --action-hover: #52dba3;
  --on-action: #03130c;
  --danger: #ff7b70;
  --danger-tint: #2a1412;
  --warn: #e6c27a;
  --focus: #3ddc97;
  --glow: rgba(47, 201, 139, .30);
  --scrim: rgba(3, 8, 6, .72);

  --series-1: #3ddc97;
  --series-2: #5aa7c8;
  --series-3: #e6c27a;
  --series-4: #c9d1c9;
  --series-other: #5e7065;

  --hero-2nd: rgba(238, 241, 234, .62);
  --header-glass: rgba(10, 15, 13, .92);
  --term-glass: rgba(16, 24, 20, .85);
  --glow-soft: rgba(47, 201, 139, .10);
  --shadow-pop: 0 24px 60px rgba(0, 0, 0, .55);
  --shadow-card: inset 0 1px 0 rgba(238, 241, 234, .04);
  --shadow-action: 0 2px 14px var(--glow), inset 0 1px 0 rgba(255, 255, 255, .18);
  --ring: 0 0 0 3px var(--accent-tint);
}

/* light */
[data-theme="light"] {
  color-scheme: light;
  --bg: #f4f3ee;
  --bg-deep: #ebe9e2;
  --panel: #ffffff;
  --panel-2: #eceee7;
  --panel-3: #f8f8f4;
  --line: #dcded6;
  --line-row: #e6e7e0;
  --line-strong: #c3c8bf;
  --line-input: #7d877f;
  --text: #0e1713;
  --dim: #24302a;
  --body: #3a4640;
  --muted: #4f5b54;
  --faint: #5a665f;
  --accent: #0a7350;
  --accent-tint: #e2eee7;
  --accent-line: #9cc9b4;
  --action: #0b7a55;
  --action-hover: #09664a;
  --on-action: #ffffff;
  --danger: #b3261e;
  --danger-tint: #fbeceb;
  --warn: #835c00;
  --focus: #0a7350;
  --glow: rgba(11, 122, 85, .16);
  --scrim: rgba(14, 23, 19, .40);

  --series-1: #0a7350;
  --series-2: #1d6a8f;
  --series-3: #835c00;
  --series-4: #24302a;
  --series-other: #7d877f;

  --hero-2nd: rgba(14, 23, 19, .62);
  --header-glass: rgba(244, 243, 238, .92);
  --term-glass: rgba(255, 255, 255, .85);
  --glow-soft: rgba(11, 122, 85, .06);
  --shadow-pop: 0 24px 48px -24px rgba(14, 23, 19, .28);
  --shadow-card: 0 1px 2px rgba(14, 23, 19, .06);
  --shadow-action: 0 2px 14px var(--glow), inset 0 1px 0 rgba(255, 255, 255, .18);
  --ring: 0 0 0 3px var(--accent-tint);
}