/**
 * Spirited Energy — PUB report design tokens
 * Unified color system:
 *   Plan contrast — Gas / problem = orange; Hybrid / solution = green
 *   Ledger       — Thermal = gold (heat); Electric = ice (power)
 * WCAG 2.2 AA target on white (#ffffff) backgrounds.
 */

:root {
  /* Brand greens (hybrid / solution / site chrome) */
  --se-green-900: #0b3d2e;
  --se-green-700: #14532d;
  --se-green-600: #1b6b3a;
  --se-green-mid: #4cae7a;
  --se-green-light: #a7d7c5;
  --se-green-bg: #d8f3e4;

  /* Ice / electric ledger */
  --se-ice-700: #0e4d6b;
  --se-ice-500: #1a7a9c;
  --se-ice-100: #e8f4f8;

  /* Neutrals */
  --se-charcoal: #1f2933;
  --se-slate: #52606d;
  --se-paper: #f7fafc;
  --se-white: #ffffff;
  --se-border: #cbd2d9;
  --se-rose: #9b1c1c;

  /* Warm spectrum: gas/problem orange vs thermal gold (distinct) */
  --se-orange: #c65d1a;
  --se-orange-mid: #e07a3a;
  --se-orange-light: #f0b48a;
  --se-orange-bg: #fff0e6;
  --se-amber: #a16207;
  --se-amber-bg: #fef6e0;

  /* Plan contrast aliases */
  --se-gas: var(--se-orange);
  --se-gas-mid: var(--se-orange-mid);
  --se-gas-light: var(--se-orange-light);
  --se-gas-bg: var(--se-orange-bg);
  --se-hybrid: var(--se-green-700);
  --se-hybrid-mid: var(--se-green-mid);
  --se-hybrid-light: var(--se-green-light);
  --se-hybrid-bg: var(--se-green-bg);
  --se-problem: var(--se-gas);
  --se-problem-bg: var(--se-gas-bg);
  --se-solution: var(--se-hybrid);
  --se-solution-bg: var(--se-hybrid-bg);

  /* Ledger aliases (orthogonal to plan contrast) */
  --se-thermal: var(--se-amber);
  --se-thermal-bg: var(--se-amber-bg);
  --se-electric: var(--se-ice-700);
  --se-electric-bg: var(--se-ice-100);
  --se-mw-electric: var(--se-electric);
  --se-mw-electric-bg: var(--se-electric-bg);
  --se-mwth-thermal: var(--se-thermal);
  --se-mwth-thermal-bg: var(--se-thermal-bg);

  /* Evidence class chips — AA on white */
  --se-ev-o: #0b3d2e;
  --se-ev-o-bg: #d8f3e4;
  --se-ev-c: #0e4d6b;
  --se-ev-c-bg: #d9eef7;
  --se-ev-e: #6b4f00;
  --se-ev-e-bg: #fff3c4;
  --se-ev-a: #7a2e0b;
  --se-ev-a-bg: #ffe8d9;
  --se-ev-pd: #3d2c6b;
  --se-ev-pd-bg: #eee8f8;

  /* Type */
  --se-font-display: "Fraunces", "Source Serif 4", "Source Serif Pro", Georgia, serif;
  --se-font-body: "Source Sans 3", "Source Sans Pro", "Segoe UI", sans-serif;
  --se-font-mono: "IBM Plex Mono", "Consolas", monospace;

  --se-fs-display: clamp(2rem, 4vw, 3.25rem);
  --se-fs-h1: 1.85rem;
  --se-fs-h2: 1.35rem;
  --se-fs-body: 1.05rem;
  --se-fs-caption: 0.85rem;
  --se-lh-body: 1.55;
  --se-measure: 68ch;

  /* Layout rail */
  --se-gutter: clamp(1.25rem, 4vw, 4rem);
  --se-rail: 68rem;

  /* Motion (HTML preview only) */
  --se-ease: cubic-bezier(0.22, 1, 0.36, 1);
  --se-dur: 480ms;
}

.badge-electric {
  color: var(--se-electric);
  background: var(--se-electric-bg);
  border: 1px solid var(--se-ice-500);
  font-family: var(--se-font-body);
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  padding: 0.15rem 0.45rem;
}

.badge-thermal {
  color: var(--se-thermal);
  background: var(--se-thermal-bg);
  border: 1px solid var(--se-amber);
  font-family: var(--se-font-body);
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  padding: 0.15rem 0.45rem;
}

.chip-o { color: var(--se-ev-o); background: var(--se-ev-o-bg); }
.chip-c { color: var(--se-ev-c); background: var(--se-ev-c-bg); }
.chip-e { color: var(--se-ev-e); background: var(--se-ev-e-bg); }
.chip-a { color: var(--se-ev-a); background: var(--se-ev-a-bg); }
.chip-pd { color: var(--se-ev-pd); background: var(--se-ev-pd-bg); }

.chip {
  display: inline-block;
  font-family: var(--se-font-mono);
  font-size: 0.72rem;
  font-weight: 700;
  padding: 0.1rem 0.4rem;
  border-radius: 2px;
}