/* HAI Design System — generated from tokens.json by scripts/build-tokens.py. Do not edit by hand. */

@font-face{font-family:"Jost";src:url("../fonts/jost-latin-wght-normal.woff2") format("woff2");font-weight:100 900;font-style:normal;font-display:swap}
@font-face{font-family:"IBM Plex Mono";src:url("../fonts/ibm-plex-mono-latin-400-normal.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"IBM Plex Mono";src:url("../fonts/ibm-plex-mono-latin-500-normal.woff2") format("woff2");font-weight:500;font-style:normal;font-display:swap}

:root {
  color-scheme: light;
  --bg: #f2f0ea;
  --panel: #e9e6de;
  --ink: #0b0b0b;
  --ink-2: #45423c;
  --ink-3: #6b675f;
  --line: #d2cdc2;
  --wire: #8e897f;
  --metal: #b7b2a8;
  --metal-soft: #dedad1;
  --on-metal: #0b0b0b;
  --page-max: 1200px;
  --gutter: 48px;
  --rail-width: 196px;
  --column-gap: 72px;
  --section-gap: 88px;
  --head-gap: 40px;
  --stack-gap: 48px;
  --rule-pad: 40px;
  --card-pad: 20px;
  --node-pad-y: 14px;
  --node-pad-x: 16px;
  --caption-gap: 16px;
  --prose-gap: 14px;
  --edge-v: 40px;
  --edge-h: 112px;
  --edge-tight: 34px;
  --slide-pad-x: 112px;
  --post-pad: 88px;
  --radius-none: 0;
  --radius-dot: 50%;
  --border-hairline: 1px;
  --border-strong: 2px;
  --stroke-wire: 1.2px;
  --stroke-glyph: 1.5px;
  --measure-pull: 24ch;
  --measure-thesis: 26ch;
  --measure-rule: 30ch;
  --measure-lede: 44ch;
  --measure-note: 62ch;
  --measure-prose: 64ch;
  --measure-caption: 74ch;
  --opacity-kicker-on-ink: 0.65;
  --opacity-meta-on-ink: 0.7;
  --opacity-sub-on-ink: 0.8;
  --opacity-text-on-ink: 0.85;
  --opacity-venn-tint: 0.22;
  --canvas-slide: 1920px 1080px;
  --canvas-post-square: 1080px 1080px;
  --canvas-post-portrait: 1080px 1350px;
  --canvas-story: 1080px 1920px;
  --canvas-link-preview: 1200px 630px;
  --canvas-a4: 210mm 297mm;
  --canvas-letter: 8.5in 11in;
  --canvas-business-card: 85mm 55mm;
  --canvas-favicon: 512px 512px;
  --sheet-margin: 16mm 18mm 14mm;
  --duration-switch: .2s;
  --ease-switch: cubic-bezier(.2,.8,.2,1);
  --duration-travel: .85s;
  --ease-travel: cubic-bezier(.55,0,.25,1);
  --stagger-travel: .08s;
  --duration-lock: .35s;
  --ease-lock: ease-out;
  --delay-lock: 1.25s;
  --font-display: "Jost", "Futura", "Avenir Next", "Century Gothic", system-ui, sans-serif;
  --font-body: "Jost", "Avenir Next", "Segoe UI", system-ui, sans-serif;
  --font-mono: "IBM Plex Mono", ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace;
  --type-display-hero: 300 108px/0.98 var(--font-display);
  --tracking-display-hero: -0.005em;
  --type-display-section: 300 52px/1.05 var(--font-display);
  --type-display-pull: 300 40px/1.18 var(--font-display);
  --type-display-rule: 300 36px/1.2 var(--font-display);
  --type-display-say: 300 34px/1.05 var(--font-display);
  --type-display-thesis: 300 32px/1.3 var(--font-display);
  --type-heading-3: 400 27px/1.25 var(--font-display);
  --type-text-lede: 300 23px/1.45 var(--font-display);
  --type-heading-shift: 400 24px/1.25 var(--font-display);
  --type-heading-matrix: 400 23px/1.15 var(--font-display);
  --type-heading-box: 500 22px/1.15 var(--font-display);
  --type-heading-layer: 400 21px/1.2 var(--font-display);
  --type-text-brief: 400 21px/1.4 var(--font-display);
  --type-heading-offer: 400 27px/1.2 var(--font-display);
  --type-heading-card: 500 18px/1.3 var(--font-display);
  --type-heading-cell: 400 18px/1.3 var(--font-display);
  --type-heading-gate: 400 17px/1.3 var(--font-display);
  --type-heading-node: 500 16.5px/1.3 var(--font-display);
  --type-text-body: 400 17px/1.6 var(--font-body);
  --type-text-note: 400 16px/1.6 var(--font-body);
  --type-text-caption: 400 15px/1.5 var(--font-body);
  --type-text-small: 400 14px/1.45 var(--font-body);
  --type-label-kicker: 500 11.5px/1.4 var(--font-mono);
  --tracking-label-kicker: 0.14em;
  --type-label-column: 500 11px/1.3 var(--font-mono);
  --tracking-label-column: 0.12em;
  --type-label-status: 500 11px/1.3 var(--font-mono);
  --tracking-label-status: 0.06em;
  --type-label-button: 500 12px/1 var(--font-mono);
  --tracking-label-button: 0.1em;
  --type-label-edge: 400 12px/1.25 var(--font-mono);
  --type-wordmark: 500 15px/1 var(--font-display);
  --tracking-wordmark: 0.42em;
  --type-display-stat: 300 64px/1 var(--font-display);
  --tracking-display-stat: -0.01em;
  --type-text-quote: 300 32px/1.3 var(--font-display);
  --type-doc-title: 300 54px/1.02 var(--font-display);
  --type-doc-heading: 300 34px/1.05 var(--font-display);
  --type-doc-body: 400 14.5px/1.55 var(--font-body);
  --type-doc-label: 500 10px/1.4 var(--font-mono);
  --tracking-doc-label: 0.14em;
  --type-slide-title: 300 144px/1.02 var(--font-display);
  --tracking-slide-title: -0.005em;
  --type-slide-heading: 300 96px/1.02 var(--font-display);
  --type-slide-statement: 300 88px/1.12 var(--font-display);
  --type-slide-number: 300 280px/0.9 var(--font-display);
  --tracking-slide-number: -0.02em;
  --type-slide-text: 400 32px/1.45 var(--font-body);
  --type-slide-label: 500 22px/1.4 var(--font-mono);
  --tracking-slide-label: 0.14em;
  --type-post-statement: 300 96px/1.06 var(--font-display);
  --tracking-post-statement: -0.005em;
  --type-post-heading: 300 64px/1.08 var(--font-display);
  --type-post-number: 300 320px/0.9 var(--font-display);
  --tracking-post-number: -0.02em;
  --type-post-text: 400 34px/1.35 var(--font-body);
  --type-post-label: 500 24px/1.4 var(--font-mono);
  --tracking-post-label: 0.14em;
}

@media screen and (prefers-color-scheme: dark) {
:root:not([data-theme="light"]) {
  color-scheme: dark;
  --bg: #0b0b0b;
  --panel: #141413;
  --ink: #f2f0ea;
  --ink-2: #c4bfb5;
  --ink-3: #9a958c;
  --line: #2b2a27;
  --wire: #6a665f;
  --metal: #b7b2a8;
  --metal-soft: #252421;
  --on-metal: #0b0b0b;
}
}

:root[data-theme="dark"] {
  color-scheme: dark;
  --bg: #0b0b0b;
  --panel: #141413;
  --ink: #f2f0ea;
  --ink-2: #c4bfb5;
  --ink-3: #9a958c;
  --line: #2b2a27;
  --wire: #6a665f;
  --metal: #b7b2a8;
  --metal-soft: #252421;
  --on-metal: #0b0b0b;
}

/* Type styles: one utility class per style in tokens.json */
.display-hero{font-family:var(--font-display);font-size:108px;line-height:0.98;font-weight:300;letter-spacing:-0.005em}
.display-section{font-family:var(--font-display);font-size:52px;line-height:1.05;font-weight:300}
.display-pull{font-family:var(--font-display);font-size:40px;line-height:1.18;font-weight:300}
.display-rule{font-family:var(--font-display);font-size:36px;line-height:1.2;font-weight:300}
.display-say{font-family:var(--font-display);font-size:34px;line-height:1.05;font-weight:300}
.display-thesis{font-family:var(--font-display);font-size:32px;line-height:1.3;font-weight:300}
.heading-3{font-family:var(--font-display);font-size:27px;line-height:1.25;font-weight:400}
.text-lede{font-family:var(--font-display);font-size:23px;line-height:1.45;font-weight:300}
.heading-shift{font-family:var(--font-display);font-size:24px;line-height:1.25;font-weight:400}
.heading-matrix{font-family:var(--font-display);font-size:23px;line-height:1.15;font-weight:400}
.heading-box{font-family:var(--font-display);font-size:22px;line-height:1.15;font-weight:500}
.heading-layer{font-family:var(--font-display);font-size:21px;line-height:1.2;font-weight:400}
.text-brief{font-family:var(--font-display);font-size:21px;line-height:1.4;font-weight:400}
.heading-offer{font-family:var(--font-display);font-size:27px;line-height:1.2;font-weight:400}
.heading-card{font-family:var(--font-display);font-size:18px;line-height:1.3;font-weight:500}
.heading-cell{font-family:var(--font-display);font-size:18px;line-height:1.3;font-weight:400}
.heading-gate{font-family:var(--font-display);font-size:17px;line-height:1.3;font-weight:400}
.heading-node{font-family:var(--font-display);font-size:16.5px;line-height:1.3;font-weight:500}
.text-body{font-family:var(--font-body);font-size:17px;line-height:1.6;font-weight:400}
.text-note{font-family:var(--font-body);font-size:16px;line-height:1.6;font-weight:400}
.text-caption{font-family:var(--font-body);font-size:15px;line-height:1.5;font-weight:400}
.text-small{font-family:var(--font-body);font-size:14px;line-height:1.45;font-weight:400}
.label-kicker{font-family:var(--font-mono);font-size:11.5px;line-height:1.4;font-weight:500;letter-spacing:0.14em}
.label-column{font-family:var(--font-mono);font-size:11px;line-height:1.3;font-weight:500;letter-spacing:0.12em}
.label-status{font-family:var(--font-mono);font-size:11px;line-height:1.3;font-weight:500;letter-spacing:0.06em}
.label-button{font-family:var(--font-mono);font-size:12px;line-height:1;font-weight:500;letter-spacing:0.1em}
.label-edge{font-family:var(--font-mono);font-size:12px;line-height:1.25;font-weight:400}
.wordmark{font-family:var(--font-display);font-size:15px;line-height:1;font-weight:500;letter-spacing:0.42em}
.display-stat{font-family:var(--font-display);font-size:64px;line-height:1;font-weight:300;letter-spacing:-0.01em}
.text-quote{font-family:var(--font-display);font-size:32px;line-height:1.3;font-weight:300}
.doc-title{font-family:var(--font-display);font-size:54px;line-height:1.02;font-weight:300}
.doc-heading{font-family:var(--font-display);font-size:34px;line-height:1.05;font-weight:300}
.doc-body{font-family:var(--font-body);font-size:14.5px;line-height:1.55;font-weight:400}
.doc-label{font-family:var(--font-mono);font-size:10px;line-height:1.4;font-weight:500;letter-spacing:0.14em}
.slide-title{font-family:var(--font-display);font-size:144px;line-height:1.02;font-weight:300;letter-spacing:-0.005em}
.slide-heading{font-family:var(--font-display);font-size:96px;line-height:1.02;font-weight:300}
.slide-statement{font-family:var(--font-display);font-size:88px;line-height:1.12;font-weight:300}
.slide-number{font-family:var(--font-display);font-size:280px;line-height:0.9;font-weight:300;letter-spacing:-0.02em}
.slide-text{font-family:var(--font-body);font-size:32px;line-height:1.45;font-weight:400}
.slide-label{font-family:var(--font-mono);font-size:22px;line-height:1.4;font-weight:500;letter-spacing:0.14em}
.post-statement{font-family:var(--font-display);font-size:96px;line-height:1.06;font-weight:300;letter-spacing:-0.005em}
.post-heading{font-family:var(--font-display);font-size:64px;line-height:1.08;font-weight:300}
.post-number{font-family:var(--font-display);font-size:320px;line-height:0.9;font-weight:300;letter-spacing:-0.02em}
.post-text{font-family:var(--font-body);font-size:34px;line-height:1.35;font-weight:400}
.post-label{font-family:var(--font-mono);font-size:24px;line-height:1.4;font-weight:500;letter-spacing:0.14em}