/* Subspace tokens (aus design-system/tokens). Schriften: ss-fonts.css. */
:root {
  /* base */
  --ss-void: #0A0C0F;        /* page background */
  --ss-void-2: #0C0E12;      /* alternating section band */
  --ss-panel: #0F1216;       /* cards, terminals, hover fill */
  --ss-scope: #0D1014;       /* oscilloscope screen */
  --ss-grid: #141820;        /* hero background grid */
  --ss-grid-2: #181C23;      /* scope graticule */
  --ss-line: #1E232A;        /* hairlines, dividers */
  --ss-line-2: #2A3038;      /* card borders, button outlines */
  --ss-ink: #E8EAED;         /* primary text, logo ink */
  --ss-ink-2: #B4BAC3;       /* lead / code text */
  --ss-ink-3: #9AA1AB;       /* body secondary */
  --ss-ink-4: #7D848E;       /* mono labels, captions */
  --ss-ink-5: #5A616B;       /* queued / inactive */
  --ss-ink-6: #4A515B;       /* line numbers */
  --ss-ink-7: #353B44;       /* unlit log lines */
  --ss-signal: #FF5C8A;      /* THE accent. one accent only */
  --ss-signal-hover: #FF7AA0;
  --ss-signal-tint: rgba(255, 92, 138, 0.04);
  --ss-signal-tint-2: rgba(255, 92, 138, 0.05);
  --ss-signal-line: #2A1C24; /* dividers inside accent-bordered cards */
  --ss-paper: #E8EAED;       /* light "browser" mock panel */
  --ss-paper-line: #C9CDD3;
  /* semantic */
  --surface-page: var(--ss-void);
  --surface-band: var(--ss-void-2);
  --surface-card: var(--ss-panel);
  --border-subtle: var(--ss-line);
  --border-default: var(--ss-line-2);
  --border-accent: var(--ss-signal);
  --text-primary: var(--ss-ink);
  --text-lead: var(--ss-ink-2);
  --text-secondary: var(--ss-ink-3);
  --text-label: var(--ss-ink-4);
  --text-on-accent: var(--ss-void);
  --accent: var(--ss-signal);
  --accent-hover: var(--ss-signal-hover);
  --header-bg: rgba(10, 12, 15, 0.84);
}
:root {
  --font-sans: 'Geist', system-ui, sans-serif;
  --font-mono: 'Geist Mono', ui-monospace, monospace;
  /* display */
  --type-h1-size: clamp(56px, 8vw, 104px); --type-h1-lh: 0.92; --type-h1-ls: -0.05em; --type-h1-weight: 600;
  --type-h1-agents-size: clamp(48px, 7.4vw, 96px); /* subpage hero, lh 0.94 */
  --type-h2-size: clamp(32px, 4.4vw, 52px); --type-h2-lh: 1; --type-h2-ls: -0.04em;
  --type-callout-size: clamp(28px, 3.8vw, 46px); --type-callout-lh: 1.08; --type-callout-ls: -0.035em;
  --type-h3-size: 22px; --type-h3-ls: -0.02em;
  --type-stage-title-size: 21px; /* crypto stage card title, lh 1.15 */
  /* text */
  --type-lead-size: clamp(17px, 1.6vw, 19px);
  --type-body-size: 16px; --type-body-lh: 1.55;
  --type-small-size: 14.5px;
  --type-caption-size: 14px;
  --type-nav-size: 14px;
  --type-wordmark-size: 21px; --type-wordmark-ls: -0.04em; /* Geist 600, lowercase */
  /* mono */
  --type-eyebrow-size: 12px; --type-eyebrow-ls: 0.14em;   /* accent, UPPERCASE */
  --type-label-size: 11px; --type-label-ls: 0.08em;       /* 0.08-0.12em */
  --type-micro-size: 10px; --type-micro-ls: 0.12em;       /* scope HUD */
  --type-code-size: 13.5px; --type-code-lh: 1.75;
  --type-data-size: 14px;
  --type-odometer-size: clamp(40px, 7vw, 84px);           /* Geist Mono 500 */
}
:root {
  --container-max: 1180px;
  --gutter: clamp(20px, 4vw, 40px);
  --anchor-scroll-padding: 120px;
  --section-y: clamp(72px, 10vw, 128px);       /* home */
  --section-y-agents: clamp(64px, 9vw, 112px); /* agents */
  --hero-top: clamp(56px, 9vw, 108px);
  --hero-bottom: clamp(56px, 8vw, 96px);
  --space-1: 2px; --space-2: 5px; --space-3: 8px; --space-4: 10px; --space-5: 12px;
  --space-6: 14px; --space-7: 16px; --space-8: 20px; --space-9: 24px; --space-10: 28px;
  --space-11: 32px; --space-12: 40px; --space-13: 48px; --space-14: 64px;
  --radius-xs: 4px;   /* readouts, badges */
  --radius-sm: 6px;   /* nav button */
  --radius-md: 7px;   /* CTAs */
  --radius-lg: 8px;   /* inputs, address bar */
  --radius-xl: 10px;  /* stage cards, notes */
  --radius-2xl: 12px; /* panels, terminals, grids */
  --radius-3xl: 14px; /* big callout */
  --radius-pill: 999px;
  --shadow-hero: 0 40px 120px -40px rgba(255, 92, 138, 0.25);
  --glow-dot: 0 0 8px var(--ss-signal);
  --glow-bar: 0 0 10px var(--ss-signal);
  --blur-header: 12px;
  --grid-cell: 40px;
}
@media (max-width: 840px) {
  :root { --anchor-scroll-padding: 168px; }
}
@media (max-width: 640px), (max-height: 500px) {
  :root { --anchor-scroll-padding: 36px; }
}
:root {
  --ease-reveal: cubic-bezier(.2, .7, .2, 1);
  --dur-reveal: 800ms;          /* opacity 0→1, translateY(22px)→0 */
  --stagger: 80ms;              /* per sibling */
  --dur-state: 350ms;           /* border/background state changes */
  --dur-hover: 200ms;           /* link color */
  --blink-cursor: 530ms;        /* on/off half-period, off = opacity .15 */
  --blink-status: 900ms;
  --scramble-tick: 55ms;
  --noise-tick: 110ms;          /* 400ms in calm mode */
  --calm-multiplier: 1.5;       /* all loop durations × 1.5 when calm */
}
@keyframes ss-reveal { from { opacity: 0; transform: translateY(22px); } to { opacity: 1; transform: none; } }
@keyframes ss-blink { 0%, 49.9% { opacity: 1; } 50%, 100% { opacity: .15; } }
@media (prefers-reduced-motion: reduce) {
  :root { --dur-reveal: 0ms; --stagger: 0ms; }
}
