/* Vesta — generated from tokens.json */
:root, [data-theme="default"] {
  --gold-300: #f0c64a; /* Quellwert Gold hell — accent-hover im Nachtregen. In UI nur über accent-hover. */
  --gold-400: #e6b62f; /* Quellwert Gold — accent im Nachtregen (die Laterne). In UI nur über accent. */
  --gold-500: #d9a521; /* Quellwert Gold dunkel — accent im Sonnentag. In UI nur über accent. */
  --gold-600: #c29118; /* Quellwert Gold tief — accent-hover im Sonnentag. In UI nur über accent-hover. */
  --gold-700: #7d600e; /* Quellwert Gold tiefst — tint in Lichtung und Sonnentag. In UI nur über tint. */
  --umber-700: #6b520f; /* Quellwert Umber hell — Druck-Schatten (accent-shadow im Sonnentag). Print, Slides. */
  --umber-800: #55430d; /* Quellwert Umber dunkel — Druck-Schatten (accent-shadow im Nachtregen). Print, Slides. */
  --forest-900: #071a13; /* Quellwert Nachtregen-Grund (bg im Default). Slides und Marken-Flächen ohne Stylesheet. */
  --sage-200: #ecefcf; /* Quellwert Sonnentag-Grund (bg im Light). Slides und Marken-Flächen ohne Stylesheet. */
  --paper: #f2eee4; /* Papier für Print, Mono-Marken (mark-paper-*, outline-paper-*) und Text auf Umber-Flächen; kein UI-Grund. */
  --black-900: #12100d; /* Near-Black hinter App-Icon, Favicon und Avatar; accent-ink in beiden Themes. */
  --bg: #071a13; /* Seitengrund. Ink, ink-muted und accent (Nachtregen) lesen darauf. Lichtung: Wert aus Exploration G2f (m6-ruhe). */
  --surface: #0e2a1f; /* Gehobene Fläche: Karten, Panes, Tabellen, Dialoge, Auth-Karte. Im Nachtregen noch provisorisch. Lichtung: Wert aus Exploration G2f (m6-ruhe). */
  --surface-soft: #0a2018; /* Abgesenkte Fläche: Leerzustand, Zebra, Feld-Hintergrund, Code-Blöcke. Lichtung: Wert aus Exploration G2f (m6-ruhe). */
  --border: #25493b; /* Hairlines und Zellrahmen auf bg und surface; Kicker-Trenner. Tonal, trägt keine Bedeutung. Lichtung: Wert aus Exploration G2f (m6-ruhe). */
  --border-soft: #183828; /* Inset-Rahmen um Tiles und Zebra-Zeilen auf surface. Lichtung: Wert aus Exploration G2f (m6-ruhe). */
  --border-strong: #4e7261; /* Hover- und Fokus-Rahmen von Eingaben. Im Sonnentag 2,4:1 auf bg — Fokus zusätzlich per accent-Outline. Lichtung: Wert aus Exploration G2f (m6-ruhe). */
  --ink: #e9f0ea; /* Body, Titel, Button-Ghost-Text auf bg, surface und surface-soft (≥11,7:1 in beiden Themes). Lichtung: Wert aus Exploration G2f (m6-ruhe). */
  --ink-muted: #96afa2; /* Lead-Absätze, Nebentext, Tabellen-Meta auf bg, surface und surface-soft (≥4,8:1 in beiden Themes). Lichtung: Wert aus Exploration G2f (m6-ruhe). */
  --ink-faint: #6e8b7d; /* Kleine Mono-Captions und Labels. Hält 4,5:1 nur auf bg und surface-soft im Nachtregen; auf surface (4,1:1) und im Sonnentag (2,8–3,1:1) unter der Schwelle — Quellwert beibehalten, dort ink-muted nehmen. Lichtung: Wert aus Exploration G2f (m6-ruhe). */
  --accent: #e6b62f; /* Der eine Akzent: Primary-Button-Fläche, Status-Dot, „C1" im Lockup, Fokus-Outline, Fliesstext-Markierung (.mark), Links im Nachtregen (9,5:1 auf bg). Im Sonnentag nur als Fläche (1,9:1 auf bg). Lichtung: Wert aus Exploration G2f (m6-ruhe). */
  --accent-hover: #f0c64a; /* Hover der Primary-Fläche und von Links. Lichtung: Wert aus Exploration G2f (m6-ruhe). */
  --accent-ink: #12100d; /* Text und Glyphen auf accent und accent-hover (≥6,6:1 in beiden Themes); Selection-Text. Lichtung: wie Sonnentag (G2f überschreibt ihn nicht). */
  --tint: #e6b62f; /* Gold als Text- und Glyphfarbe: globaler App-Tint nativer Apps (Links, Toolbar- und Navigations-Glyphen, Text-Buttons, Aufnahme-Symbol). Nachtregen = accent (9,5:1 auf bg, 8,1:1 auf surface). Lichtung/Sonnentag #7D600E (gold-700): ≥4,9:1 bzw. ≥4,5:1 auf allen Gründen. accent bleibt die Fläche; Gold als Text in Lichtung nur 2,3:1. */
  --highlight: rgba(230,182,47,.2); /* Leise Gold-Fläche: Hover von Zeilen und Karten, aktive Nav-Unterstreichung (inset box-shadow), Zustands-Kreise. Nicht mehr die Fliesstext-Markierung — die ist accent/accent-ink (.mark). Lichtung: Wert aus Exploration G2f (m6-ruhe). */
  --ring: rgba(230,182,47,.18); /* 5px-Halo um den 9px-Status-Dot (.kicker .dot). Lichtung: Wert aus Exploration G2f (m6-ruhe). */
  --druck-ghost: #03110b; /* Versatz-Farbe der „Druck"-Ghost-Variante (Explorations, Print); das Bundle setzt heute ink. Lichtung: wie Sonnentag (G2f überschreibt ihn nicht). */
  --druck-ghost-hover: #020c08; /* Hover-Versatz der „Druck"-Ghost-Variante. Lichtung: wie Sonnentag (G2f überschreibt ihn nicht). */
  --ink-gold: #e6b62f; /* Gold als zweite Textfarbe für kleine Beschriftungen (Datum, Zeitstempel, aktives Segment) — aus Exploration G2f „Gold-Ink". Lichtung/Sonnentag #B08512: 3,3:1 bzw. 2,9:1 auf bg — unter 4,5:1, nur für dekorative Meta-Zeilen, nicht für Pflichtinformation. Nachtregen-Wert = accent (vorläufig, 9,5:1). */
  --ink-green: #8fcfae; /* Tiefes Waldgrün als Textfarbe für Listen-Icons/Kategorien (.lic.t2 in G2f). Lichtung 7,9:1, Sonnentag 6,9:1. Nachtregen-Wert #8FCFAE ist ein Vorschlag (10:1), nicht aus einer Exploration — bitte prüfen. */
  --accent-shadow: #55430d; /* Umber-Versatz der „Druck"-Primary-Variante (Explorations, Print, Farbkarten); das Bundle setzt heute ink. */
  --accent-shadow-hover: #6b520f; /* Hover-Versatz der „Druck"-Primary-Variante. */
}
[data-theme="light"] {
  --bg: #ecefcf;
  --surface: #dfe7b4;
  --surface-soft: #e7ecc4;
  --border: #c4cf97;
  --border-soft: #d5ddab;
  --border-strong: #90a257;
  --ink: #1d2a11;
  --ink-muted: #53683a;
  --ink-faint: #788c5f;
  --accent: #d9a521;
  --accent-hover: #c29118;
  --accent-ink: #12100d;
  --tint: #7d600e;
  --highlight: rgba(217,165,33,.32);
  --ring: rgba(217,165,33,.2);
  --druck-ghost: #c9d39e;
  --druck-ghost-hover: #bbc78c;
  --ink-gold: #b08512;
  --ink-green: #1f5a3f;
  --accent-shadow: #6b520f;
  --accent-shadow-hover: #55430d;
}
[data-theme="lichtung"] {
  --bg: #fbfcfa;
  --surface: #e3ede4;
  --surface-soft: #f1f6f1;
  --border: #cbdccf;
  --border-soft: #dde8df;
  --border-strong: #93b09d;
  --ink: #1a3326;
  --ink-muted: #4a6b58;
  --ink-faint: #7a9686;
  --accent: #d4a11e;
  --accent-hover: #bf8f15;
  --accent-ink: #12100d;
  --tint: #7d600e;
  --highlight: rgba(212,161,30,.3);
  --ring: rgba(31,90,63,.14);
  --druck-ghost: #c9d39e;
  --druck-ghost-hover: #bbc78c;
  --ink-gold: #b08512;
  --ink-green: #1f5a3f;
}
:root {
  --space-1: 4px; /* Feinabstand: Dot-zu-Text, Inset-Ränder. */
  --space-2: 8px; /* Abstand in Gruppen: Pill-Gap, Label zu Feld. */
  --space-3: 12px; /* Zell-Innenabstand, Ghost-Button-Gap. */
  --space-4: 16px; /* Button-Reihen, Formular-Zeilen. */
  --space-5: 20px; /* Kicker-zu-Titel, Tile-Padding. */
  --space-6: 24px; /* Karten- und Pane-Innenabstand. */
  --space-8: 32px; /* Abstand zwischen Karten und Listen. */
  --space-10: 40px; /* Abschnittsabstand in der App, page-y. */
  --space-12: 48px; /* Abschnittsabstand auf der Landing. */
  --space-14: 56px; /* Hero-Abstände, page-x. */
  --page-x: 56px; /* Horizontales Seiten-Padding (Landing, App-Shell). */
  --page-y: 40px; /* Vertikales Seiten-Padding. */
  --radius: 4px; /* Überall: Buttons, Karten, Felder, Swatches, Tiles. */
  --radius-pill: 999px; /* Nur Pills, Status-Dots und der runde Avatar. */
  --tracking-display: -0.02em; /* Display-Serif (Stil display). */
  --tracking-caps: 0.14em; /* Mono-Caps für Meta und Labels (Stile meta, meta-sm). */
  --tracking-caps-wide: 0.2em; /* Kicker-Caps (Stil kicker). */
  --leading-display: 0.94; /* Display-Serif (Stil display); Body 1.55, Artikel 1.65. */
  --text-display: clamp(56px,9.2vw,152px); /* Fluide Display-Grösse (Stil display: Hero, App-Begrüssung, Folientitel). */
  --text-h1: clamp(36px,4.4vw,64px); /* Fluide H1 (Stil h1: Seitentitel unterhalb des Hero). */
  --text-lead: clamp(17px,1.5vw,22px); /* Fluider Lead-Absatz (Stil lead). */
  --text-h2: 28px; /* Stil h2: Abschnittstitel. */
  --text-h3: 21px; /* Stil h3: Zwischentitel in Panes und Artikeln, 600. */
  --text-body: 17px; /* Stil body: Fliesstext und Artikel. */
  --text-ui: 16px; /* Stil ui: Button lg, Felder, Navigation. */
  --text-small: 15px; /* Stil small: Tabellen, Hinweise, Footer. */
  --text-meta: 13px; /* Stil meta und kicker: Mono-Metadaten, Kicker. */
  --text-meta-sm: 12px; /* Stil meta-sm: Mono-Captions, Trust-Signale. */
  --slide-meta: 24px; /* Folien (1920 breit): Mono-Labels, Nachsätze, Quellenzeile, Foliennummer. */
  --slide-body: 28px; /* Folien: Spaltentext, Listen, Tabellenzellen, Button. */
  --slide-lead: 32px; /* Folien: Lead-Satz, Kernaussagen, Schlusssatz. */
  --slide-h3: 36px; /* Folien: Spalten- und Zeilentitel, 600. */
  --slide-title: 84px; /* Folien: Folientitel in Instrument Serif 400, Zeilenhöhe 1. */
  --slide-display: 128px; /* Folien: Titelfolie, Kapiteltrenner, Kennzahl, Abschluss — Instrument Serif 400. */
  --font-display: 'Instrument Serif',Georgia,serif;
  --font-sans: 'Work Sans',system-ui,sans-serif;
  --font-system: -apple-system,BlinkMacSystemFont,'SF Pro Text','Helvetica Neue',Helvetica,Arial,sans-serif;
  --font-mono: 'IBM Plex Mono',ui-monospace,monospace;
  --text-kicker: 500 13px/1.4 var(--font-mono); /* Der Kicker (.kicker in bundle.css) — Caps, mit Status-Dot und Trenner. */
}
.display {
  font-family: var(--font-display);
  font-size: 152px;
  line-height: 0.94;
  font-weight: 400;
  letter-spacing: -0.02em;
}
.h1 {
  font-family: var(--font-sans);
  font-size: 64px;
  line-height: 1.1;
  font-weight: 600;
  letter-spacing: -0.01em;
}
.h2 {
  font-family: var(--font-sans);
  font-size: 28px;
  line-height: 1.2;
  font-weight: 600;
  letter-spacing: -0.01em;
}
.h3 {
  font-family: var(--font-sans);
  font-size: 21px;
  line-height: 1.3;
  font-weight: 600;
  letter-spacing: -0.01em;
}
.lead {
  font-family: var(--font-sans);
  font-size: 22px;
  line-height: 1.55;
  font-weight: 400;
  letter-spacing: 0;
}
.body {
  font-family: var(--font-sans);
  font-size: 17px;
  line-height: 1.55;
  font-weight: 400;
  letter-spacing: 0;
}
.ui {
  font-family: var(--font-sans);
  font-size: 16px;
  line-height: 1.4;
  font-weight: 500;
  letter-spacing: 0;
}
.small {
  font-family: var(--font-sans);
  font-size: 15px;
  line-height: 1.5;
  font-weight: 400;
  letter-spacing: 0;
}
.kicker {
  font-family: var(--font-mono);
  font-size: 13px;
  line-height: 1.4;
  font-weight: 500;
  letter-spacing: 0.2em;
}
.meta {
  font-family: var(--font-mono);
  font-size: 13px;
  line-height: 1.5;
  font-weight: 400;
  letter-spacing: 0.14em;
}
.meta-sm {
  font-family: var(--font-mono);
  font-size: 12px;
  line-height: 1.5;
  font-weight: 400;
  letter-spacing: 0.14em;
}
@font-face {
  font-family: "Instrument Serif";
  src: url(/fonts/InstrumentSerif-Regular.woff2) format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Instrument Serif";
  src: url(/fonts/InstrumentSerif-Italic.woff2) format("woff2");
  font-weight: 400;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: "Work Sans";
  src: url(/fonts/WorkSans.woff2) format("woff2");
  font-weight: 300 700;
  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;
}