/* FyreFly Systems — generated from tokens.json and the site overlay by scripts/build-ff-tokens.py. Do not edit by hand. */
@font-face {
  font-family: "Host Grotesk";
  src: url("/shared/ff/fonts/host-grotesk-300-latin.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "Host Grotesk";
  src: url("/shared/ff/fonts/host-grotesk-600-latin.woff2") format("woff2");
  font-weight: 500 800;
  font-style: normal;
  font-display: swap;
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "IBM Plex Mono";
  src: url("/shared/ff/fonts/ibm-plex-mono-400-latin.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "IBM Plex Mono";
  src: url("/shared/ff/fonts/ibm-plex-mono-500-latin.woff2") format("woff2");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

:root {
  --stage-100: #ffffff;
  --stage-200: #f4f4f2;
  --stage-300: #e4e4e1;
  --paper: #ffffff;
  --ink: #1a1a1a;
  --ink-muted: #555555;
  --rule: #c0c0c0;
  --ember: #ff6600;
  --ember-ink: #b84a00;
  --on-ember: #1a1a1a;
  --alef: #7646d7;
  --alef-hover: #6035b4;
  --alef-ink: #6035b4;
  --on-alef: #ffffff;
  --alef-soft: #b899fa;
  --night: #1a1a1a;
  --on-night: #f0f0ee;
  --on-night-muted: #a6a6a6;
  --on-image: #ffffff;
  --scrim: rgba(0, 0, 0, 0.4);
  --on-image-ink: #1a1a1a;
  --veil: rgba(255, 255, 255, 0.72);
  --focus: #1a1a1a;
  --focus-on-image: #ff6600;
  --gimel: #0b7a67;
  --gimel-ink: #0a6b5a;
  --on-gimel: #ffffff;
  --ff-rule-strong: #8c8c8c;
  --ff-accent: var(--ember);
  --ff-accent-ink: var(--ember-ink);
  --ff-on-accent: var(--on-ember);
  --ff-bar-bg: var(--stage-100);
  --ff-bar-ink: var(--ink);
  --ff-bar-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
  --ff-drawer-shadow: -4px 0 20px rgba(0, 0, 0, 0.15);
  --ff-footer-bg: #000000;
  --ff-footer-ink: #ffffff;
  --ff-footer-rule: transparent;
  --font-sans: "Host Grotesk", "Segoe UI", Arial, sans-serif;
  --font-mono: "IBM Plex Mono", ui-monospace, "SF Mono", Menlo, Consolas, monospace;
  --ff-mono: var(--font-mono);
  --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;
  --space-10: 128px;
  --gutter: 48px;
  --gutter-sm: 20px;
  --topbar-height: 68px;
  --radius-none: 0;
  --radius-sm: 4px;
  --radius-md: 6px;
  --radius-lg: 18px;
  --radius-lore: 24px;
  --radius-hero-max: 100px;
  --radius-pill: 999px;
  --shadow-sheet: 0 -4px 24px rgba(0, 0, 0, 0.18);
  --shadow-tip: 0 6px 20px rgba(0, 0, 0, 0.18);
  --ease-out-quart: cubic-bezier(0.25, 1, 0.5, 1);
  --ease-reveal: cubic-bezier(0.25, 1, 0.3, 1);
  --ease-scroll: cubic-bezier(0.65, 0, 0.35, 1);
  --ease-plain: ease;
  --dur-slot-tick: 50ms;
  --dur-sweep-stagger: 50ms;
  --dur-sweep: 500ms;
  --dur-hover: 300ms;
  --dur-cta: 350ms;
  --dur-view: 500ms;
  --dur-panel: 700ms;
  --dur-hero: 800ms;
  --dur-scroll: 900ms;
  --dur-reveal: 1200ms;
  --dur-drift: 14s;
  --ff-subnav-h: 48px;
  --ff-footer-h: 60px;
  color-scheme: light;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --stage-100: #141414;
    --stage-200: #1c1c1c;
    --stage-300: #2a2a2a;
    --paper: #1f1f1f;
    --ink: #ececec;
    --ink-muted: #a6a6a6;
    --rule: #3a3a3a;
    --ember-ink: #ff8a3d;
    --alef-ink: #b899fa;
    --night: #2e2e2e;
    --focus: #ff6600;
    --gimel: #3cc4a8;
    --gimel-ink: #5fd3bb;
    --on-gimel: #06221d;
    --ff-rule-strong: #6e6e6e;
    --ff-bar-shadow: 0 1px 0 var(--rule);
    --ff-drawer-shadow: -1px 0 0 var(--rule);
    --ff-footer-rule: var(--rule);
    color-scheme: dark;
  }
}
:root[data-theme="dark"] {
  --stage-100: #141414;
  --stage-200: #1c1c1c;
  --stage-300: #2a2a2a;
  --paper: #1f1f1f;
  --ink: #ececec;
  --ink-muted: #a6a6a6;
  --rule: #3a3a3a;
  --ember-ink: #ff8a3d;
  --alef-ink: #b899fa;
  --night: #2e2e2e;
  --focus: #ff6600;
  --gimel: #3cc4a8;
  --gimel-ink: #5fd3bb;
  --on-gimel: #06221d;
  --ff-rule-strong: #6e6e6e;
  --ff-bar-shadow: 0 1px 0 var(--rule);
  --ff-drawer-shadow: -1px 0 0 var(--rule);
  --ff-footer-rule: var(--rule);
  color-scheme: dark;
}
/* Alef pages: the accent is violet. Everything that reads --ff-accent* (and the design system's
   --accent*, which site.css points at them) follows. The wordmark and the Open Alef button do not. */
body[data-page^="alef"] {
  --ff-accent: var(--alef);
  --ff-accent-ink: var(--alef-ink);
  --ff-on-accent: var(--on-alef);
}
/* Gimel pages: the accent is teal. */
body[data-page^="gimel"] {
  --ff-accent: var(--gimel);
  --ff-accent-ink: var(--gimel-ink);
  --ff-on-accent: var(--on-gimel);
}
/* Small screens: lower bars; the footer wraps onto more lines (scientific.js measures the real height). */
@media (max-width: 860px) {
  :root {
    --topbar-height: 60px;
    --ff-subnav-h: 44px;
    --ff-footer-h: 96px;
  }
}