/* tokens.css — Annotated · F2 direction tokens + Gate A fixes
   Fixes applied: cover price at display size (--num-display),
   11px typographic floor (--text-floor), no box-shadow anywhere. */

@font-face {
  font-family: "Literata";
  src: url("/fonts/literata-var-latin.woff2") format("woff2");
  font-weight: 400 600;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Literata";
  src: url("/fonts/literata-var-italic-latin.woff2") format("woff2");
  font-weight: 400 500;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: "Inter";
  src: url("/fonts/inter-var-latin.woff2") format("woff2");
  font-weight: 400 700;
  font-style: normal;
  font-display: swap;
}

:root {
  color-scheme: light;
  --paper: #ffffff;
  --panel: #f6f6f4;
  --panel-2: #efefec;
  --hairline: #e4e4e0;
  --ink: #1b1d1a;
  --ink-2: #5a5c55;
  --ink-3: #6f716a;
  --study: #23251f;
  --study-ink: #f2f3ee;
  --moss: #5e8a33;
  --moss-text: #47691f;
  --moss-tint: rgba(94, 138, 51, 0.10);
  --cost: #6e6862;
  --deficit: #d03b3b;
  --dream: #b08828;
  --dream-text: #79601a;
  --warn-ink: #7d621b;
  --warn-bg: #faf3dc;
  --warn-border: #ecdfb4;
  --car: #6d53c6;
  --fsd: #0f8a6c;
  --energy: #c88a00;
  --robotaxi: #d2568e;
  --optimus: #2a78d6;
  --ease: cubic-bezier(0.22, 1, 0.36, 1);

  --font-serif: "Literata", Georgia, serif;
  --font-ui: "Inter", system-ui, -apple-system, sans-serif;
  --display: 32px;
  --h-card: 26px;
  --standfirst: 18px;
  --believe: 18px;
  --prose: 17px;
  --num-hero: 42px;
  --num-ledger: 24px;
  --num-dock: 15px;
  --ui: 13px;
  --stamp: 11px;
  --text-floor: 11px;
  /* Gate fix: cover price at display size (32-42px), never 20px */
  --num-display: clamp(34px, 10.5vw, 42px);
}

@media (prefers-color-scheme: dark) {
  :root {
    color-scheme: dark;
    --paper: #121212;
    --panel: #1b1b1a;
    --panel-2: #232322;
    --hairline: #2c2c2a;
    --ink: #edeee9;
    --ink-2: #b0b2a8;
    --ink-3: #979990;
    --study: #0d0e0c;
    --study-ink: #edeee9;
    --moss: #78a34b;
    --moss-text: #a4cd7c;
    --moss-tint: rgba(120, 163, 75, 0.14);
    --cost: #8a837c;
    --deficit: #e05252;
    --dream: #c9a03a;
    --dream-text: #d8b654;
    --warn-ink: #e8c55b;
    --warn-bg: #2a2513;
    --warn-border: #5c4e24;
    --car: #9085e9;
    --fsd: #199e70;
    --energy: #c98500;
    --robotaxi: #d55181;
    --optimus: #3987e5;
  }
  body { font-weight: 430; }
  .prose-adjust { line-height: 1.7; }
}

html[data-theme="light"] {
  color-scheme: light;
  --paper: #ffffff; --panel: #f6f6f4; --panel-2: #efefec; --hairline: #e4e4e0;
  --ink: #1b1d1a; --ink-2: #5a5c55; --ink-3: #6f716a;
  --study: #23251f; --study-ink: #f2f3ee;
  --moss: #5e8a33; --moss-text: #47691f; --moss-tint: rgba(94, 138, 51, 0.10);
  --cost: #6e6862; --deficit: #d03b3b; --dream: #b08828; --dream-text: #79601a;
  --warn-ink: #7d621b; --warn-bg: #faf3dc; --warn-border: #ecdfb4;
  --car: #6d53c6; --fsd: #0f8a6c; --energy: #c88a00;
  --robotaxi: #d2568e; --optimus: #2a78d6;
}
html[data-theme="light"] body { font-weight: 400; }

html[data-theme="dark"] {
  color-scheme: dark;
  --paper: #121212; --panel: #1b1b1a; --panel-2: #232322; --hairline: #2c2c2a;
  --ink: #edeee9; --ink-2: #b0b2a8; --ink-3: #979990;
  --study: #0d0e0c; --study-ink: #edeee9;
  --moss: #78a34b; --moss-text: #a4cd7c; --moss-tint: rgba(120, 163, 75, 0.14);
  --cost: #8a837c; --deficit: #e05252; --dream: #c9a03a; --dream-text: #d8b654;
  --warn-ink: #e8c55b; --warn-bg: #2a2513; --warn-border: #5c4e24;
  --car: #9085e9; --fsd: #199e70; --energy: #c98500;
  --robotaxi: #d55181; --optimus: #3987e5;
}
html[data-theme="dark"] body { font-weight: 430; }
html[data-theme="dark"] .prose-adjust { line-height: 1.7; }

* { box-sizing: border-box; }

html {
  background: var(--panel);
  color: var(--ink);
  scroll-behavior: smooth;
}

body {
  margin: 0;
  background: var(--paper);
  color: var(--ink);
  font-family: var(--font-serif);
  font-size: var(--prose);
  line-height: 1.6;
}

/* The two-voice rule (house signature): every numeral is an Inter .num span,
   0.94em, weight one step up, tabular figures. */
.num {
  font-family: var(--font-ui);
  font-size: 0.94em;
  font-weight: 600;
  line-height: 1;
  font-variant-numeric: tabular-nums;
  font-feature-settings: "tnum" 1;
}

.stamp, .marker, .colophon, .flag-chip, .warn-chip, .dock, .disclaimer,
.position-disclosure, .ledger-label, .dream-band, .ui, .badge, .tab-hint,
.chrome-byline, .status-tag {
  font-family: var(--font-ui);
  font-variant-numeric: tabular-nums;
  font-feature-settings: "tnum" 1;
}

/* Epistemic line code: solid ink = observed · dashed moss = calibrated ·
   dotted + amber tick = unexplained. Dreams are never underlined: fenced. */
.observed {
  display: inline-block;
  border-bottom: 2px solid var(--ink);
  padding-bottom: 3px;
}
.calibrated {
  display: inline-block;
  border-bottom: 1px dashed var(--moss);
  padding-bottom: 3px;
}
.unexplained {
  position: relative;
  display: inline-block;
  border-bottom: 1px dotted var(--ink-3);
  padding: 0 10px 4px 0;
}
.unexplained::after {
  content: "";
  position: absolute;
  right: 1px;
  bottom: -4px;
  width: 2px;
  height: 8px;
  background: var(--dream);
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after {
    animation-duration: 0s !important;
    transition-duration: 0s !important;
  }
}
