/* Hakken design tokens: colours, type, spacing, radii and motion for the Carbon (dark) and Paper (light) themes, and the web fonts (Electrolize, Inter, IBM Plex Mono). Loaded by every page, first. */
:root, [data-theme="carbon"] {
  --surface-000: #0c0e11;
  --surface-100: #101418;
  --surface-200: #151a1f;
  --surface-300: #22272b;
  --overlay: rgba(12,14,17,0.8);
  --ink: #eeece6;
  --ink-muted: rgba(238,236,230,0.62);
  --ink-faint: rgba(238,236,230,0.38);
  --line: rgba(255,255,255,0.08);
  --line-strong: rgba(255,255,255,0.16);
  --line-control: rgba(238,236,230,0.38);
  --dot: rgba(255,255,255,0.16);
  --accent: #43c6d8;
  --accent-hover: #6fd5e3;
  --accent-text: #43c6d8;
  --accent-soft: rgba(67,198,216,0.14);
  --on-accent: #0c0e11;
  --accent-2: #1a86ef;
  --glow: rgba(67,198,216,0.7);
  --signal-00: #00f2bb;
  --signal-01: #03e9c0;
  --signal-02: #06d9c7;
  --signal-03: #08d0cc;
  --signal-04: #0ac6d0;
  --signal-05: #0eb4d5;
  --signal-06: #11a3d8;
  --signal-07: #139ee2;
  --signal-08: #188eeb;
  --signal-09: #1a7ff2;
  --signal-10: #1c74f2;
  --signal-11: #206bfd;
  --letter-h: #03eabf;
  --letter-a: #08d0cc;
  --letter-k1: #0eb4d5;
  --letter-k2: #12a1dd;
  --letter-e: #188dec;
  --letter-n: #1c73f3;
  --success: #34d399;
  --warning: #fbbf24;
  --error: #f87171;
  --info: #38bdf8;
  --success-text: var(--success);
  --warning-text: var(--warning);
  --error-text: var(--error);
  --info-text: var(--info);
  --data-violet: #8b5cf6;
  --data-magenta: #ec4899;
  --data-lime: #a3e635;
  --data-amber: #f59e0b;
  --decision-lime: #b9f227;
  --shadow-none: none;
  --shadow-overlay: 0 12px 32px rgba(0,0,0,0.5);
  --shadow-plane: 0 30px 60px rgba(0,0,0,0.5);
  --shadow-slide: 0 30px 80px rgba(0,0,0,0.55);
  --shadow-node: 0 0 10px rgba(67,198,216,0.7);
}
[data-theme="paper"] {
  --surface-000: #f6f5f1;
  --surface-100: #ffffff;
  --surface-200: #ebe9e3;
  --surface-300: #e2e0d9;
  --overlay: rgba(20,24,28,0.4);
  --ink: #14181c;
  --ink-muted: rgba(20,24,28,0.66);
  --ink-faint: rgba(20,24,28,0.42);
  --line: rgba(20,24,28,0.10);
  --line-strong: rgba(20,24,28,0.20);
  --line-control: rgba(20,24,28,0.50);
  --dot: rgba(20,24,28,0.14);
  --accent: #0b93a3;
  --accent-hover: #0a7f8d;
  --accent-text: #087480;
  --accent-soft: rgba(11,147,163,0.12);
  --on-accent: #0c0e11;
  --accent-2: #0f6fd1;
  --glow: rgba(11,147,163,0.35);
  --success-text: #047857;
  --warning-text: #b45309;
  --error-text: #b91c1c;
  --info-text: #0369a1;
  --shadow-overlay: 0 12px 32px rgba(20,24,28,0.14);
  --shadow-plane: 0 30px 60px rgba(20,24,28,0.14);
  --shadow-slide: 0 30px 80px rgba(20,24,28,0.14);
  --shadow-node: 0 0 8px rgba(11,147,163,0.35);
}
:root {
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 48px;
  --space-8: 64px;
  --space-9: 96px;
  --dot-grid: 28px;
  --slide-margin: 200px;
  --radius-xs: 4px;
  --radius-sm: 6px;
  --radius-md: 8px;
  --radius-lg: 12px;
  --radius-xl: 16px;
  --radius-full: 999px;
  --duration-hover: 120ms;
  --duration-standard: 200ms;
  --duration-node: 220ms;
  --duration-layer: 350ms;
  --duration-reveal: 3000ms;
  --ease-standard: cubic-bezier(.4,0,.2,1);
  --ease-layer: cubic-bezier(.65,0,.35,1);
  --ease-node: cubic-bezier(.34,1.56,.64,1);
  --font-display: Electrolize, "Archivo", system-ui, sans-serif;
  --font-sans: Inter, system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-mono: "IBM Plex Mono", ui-monospace, "SFMono-Regular", Menlo, monospace;
}
.display-xl { font-family: var(--font-display); font-size: 72px; line-height: 76px; font-weight: 400; letter-spacing: -0.01em; }
.display-lg { font-family: var(--font-display); font-size: 56px; line-height: 62px; font-weight: 400; letter-spacing: -0.01em; }
.headline { font-family: var(--font-display); font-size: 40px; line-height: 46px; font-weight: 400; letter-spacing: 0; }
.title { font-family: var(--font-display); font-size: 28px; line-height: 34px; font-weight: 400; letter-spacing: 0; }
.subtitle { font-family: var(--font-display); font-size: 20px; line-height: 26px; font-weight: 400; letter-spacing: 0.01em; }
.numeral { font-family: var(--font-display); font-size: 52px; line-height: 56px; font-weight: 400; letter-spacing: 0; }
.lead { font-family: var(--font-sans); font-size: 17px; line-height: 27px; font-weight: 400; }
.body { font-family: var(--font-sans); font-size: 15px; line-height: 24px; font-weight: 400; }
.body-sm { font-family: var(--font-sans); font-size: 13px; line-height: 20px; font-weight: 400; }
.label { font-family: var(--font-sans); font-size: 13px; line-height: 16px; font-weight: 500; }
.label-strong { font-family: var(--font-sans); font-size: 14px; line-height: 18px; font-weight: 600; }
.eyebrow { font-family: var(--font-mono); font-size: 11px; line-height: 16px; font-weight: 500; letter-spacing: 0.14em; }
.meta { font-family: var(--font-mono); font-size: 12px; line-height: 16px; font-weight: 500; letter-spacing: 0.08em; }
.data { font-family: var(--font-mono); font-size: 14px; line-height: 20px; font-weight: 500; letter-spacing: 0; }
.tag { font-family: var(--font-mono); font-size: 10px; line-height: 14px; font-weight: 500; letter-spacing: 0.12em; }
.slide-headline { font-family: var(--font-display); font-size: 64px; line-height: 73px; font-weight: 400; letter-spacing: -0.01em; }
.slide-quote { font-family: var(--font-display); font-size: 56px; line-height: 72px; font-weight: 400; letter-spacing: -0.01em; }
.slide-body { font-family: var(--font-sans); font-size: 24px; line-height: 37px; font-weight: 400; }
.slide-caption { font-family: var(--font-mono); font-size: 18px; line-height: 24px; font-weight: 500; letter-spacing: 0.08em; }
@font-face { font-family: "Electrolize"; src: url("../fonts/Electrolize-Regular.woff2") format("woff2"); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: "Inter"; src: url("../fonts/Inter-Variable.woff2") format("woff2"); font-weight: 100 900; font-style: normal; font-display: swap; }
@font-face { font-family: "IBM Plex Mono"; src: url("../fonts/IBMPlexMono-Regular.woff2") format("woff2"); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: "IBM Plex Mono"; src: url("../fonts/IBMPlexMono-Medium.woff2") format("woff2"); font-weight: 500; font-style: normal; font-display: swap; }
@font-face { font-family: "IBM Plex Mono"; src: url("../fonts/IBMPlexMono-Bold.woff2") format("woff2"); font-weight: 700; font-style: normal; font-display: swap; }