/* Design tokens from the Landing Design System (first draft, 2026-11).
   Style with these variables, never raw colour values. */

/* Dark is the default theme. Light applies under [data-theme="light"]. Hue 264 neutrals; one blue accent; agent violet. */
:root{
  --bg:oklch(0.145 0.004 264);
  --bg-2:oklch(0.175 0.005 264);
  --card:oklch(0.195 0.006 264);
  --card-2:oklch(0.225 0.007 264);
  --fg:oklch(0.97 0.002 264);
  --fg-2:oklch(0.72 0.01 264);
  --fg-3:oklch(0.56 0.01 264);
  --line:oklch(0.28 0.008 264);
  --line-2:oklch(0.34 0.009 264);
  --primary:oklch(0.70 0.14 258);
  --primary-fg:oklch(0.16 0.01 264);
  --btn:oklch(0.97 0.002 264);
  --btn-fg:oklch(0.15 0.004 264);
  --agent:oklch(0.76 0.13 300);
  --agent-soft:oklch(0.27 0.05 300);
  --done:oklch(0.72 0.09 158);
  --review:oklch(0.75 0.15 292);
  --progress:oklch(0.77 0.13 70);
  --stale:oklch(0.80 0.11 72);
  --stale-bg:oklch(0.25 0.045 72);
  --stale-line:oklch(0.38 0.07 72);
  --add:oklch(0.78 0.10 158);
  --add-bg:oklch(0.25 0.045 158);
  --del:oklch(0.78 0.13 25);
  --del-bg:oklch(0.26 0.05 25);
  --terminal-bg:oklch(0.13 0.004 264);
  --terminal-fg:oklch(0.92 0.004 264);
  --terminal-tool:oklch(0.80 0.10 300);
  --terminal-dim:oklch(0.62 0.01 264);
  --terminal-line:oklch(1 0 0 / 0.07);
  --terminal-hl:oklch(0.70 0.14 258 / 0.14);
  --terminal-add:oklch(0.78 0.10 158);
  --terminal-add-bg:oklch(0.25 0.045 158 / 0.7);
  --terminal-del:oklch(0.78 0.13 25);
  --terminal-del-bg:oklch(0.26 0.05 25 / 0.7);
  --glow:oklch(0.55 0.14 258 / 0.22);
  --shadow-window:0 0 0 1px oklch(1 0 0 / 0.04),0 30px 80px -20px oklch(0 0 0 / 0.6);
  --shadow-pop:0 0 0 1px oklch(1 0 0 / 0.05),0 16px 40px -12px oklch(0 0 0 / 0.55);

  /* semantic aliases */
  --surface-page:var(--bg);
  --surface-sunken:var(--bg-2);
  --surface-card:var(--card);
  --surface-raised:var(--card-2);
  --text-strong:var(--fg);
  --text-body:var(--fg-2);
  --text-muted:var(--fg-3);
  --border-subtle:var(--line);
  --border-strong:var(--line-2);
  --action-solid-bg:var(--btn);
  --action-solid-fg:var(--btn-fg);
  --link:var(--primary);
  --focus-ring:var(--primary);
}
[data-theme="light"]{
  --bg:oklch(0.995 0.001 264);
  --bg-2:oklch(0.975 0.002 264);
  --card:oklch(1 0 0);
  --card-2:oklch(0.97 0.003 264);
  --fg:oklch(0.19 0.008 264);
  --fg-2:oklch(0.46 0.011 264);
  --fg-3:oklch(0.58 0.01 264);
  --line:oklch(0.915 0.004 264);
  --line-2:oklch(0.86 0.006 264);
  --primary:oklch(0.50 0.15 258);
  --primary-fg:oklch(0.99 0.002 264);
  --btn:oklch(0.19 0.008 264);
  --btn-fg:oklch(0.99 0.002 264);
  --agent:oklch(0.475 0.135 300);
  --agent-soft:oklch(0.965 0.02 300);
  --done:oklch(0.47 0.075 158);
  --review:oklch(0.48 0.17 292);
  --progress:oklch(0.485 0.115 68);
  --stale:oklch(0.42 0.11 62);
  --stale-bg:oklch(0.975 0.03 72);
  --stale-line:oklch(0.87 0.06 72);
  --add:oklch(0.40 0.085 158);
  --add-bg:oklch(0.955 0.04 158);
  --del:oklch(0.45 0.155 25);
  --del-bg:oklch(0.962 0.032 25);
  --glow:oklch(0.62 0.12 258 / 0.14);
  --shadow-window:0 0 0 1px oklch(0 0 0 / 0.05),0 30px 80px -24px oklch(0.25 0.03 264 / 0.25);
  --shadow-pop:0 0 0 1px oklch(0 0 0 / 0.06),0 16px 40px -12px oklch(0.25 0.03 264 / 0.22);
}

:root{
  --font-sans:"Instrument Sans",-apple-system,"Segoe UI",Helvetica,sans-serif;
  --font-mono:"Geist Mono",ui-monospace,"SF Mono",Menlo,monospace;

  /* marketing display — weight 600, tight tracking */
  --type-hero-size:clamp(46px,8vw,92px);   --type-hero-lh:0.98;  --type-hero-track:-0.045em;
  --type-cta-size:clamp(40px,6vw,72px);    --type-cta-lh:1;      --type-cta-track:-0.045em;
  --type-h2-size:clamp(36px,5vw,60px);     --type-h2-lh:1.02;    --type-h2-track:-0.04em;
  --type-h3-size:24px;                     --type-h3-track:-0.02em;
  --type-h4-size:19px;                     --type-h4-track:-0.015em;
  --type-stat-size:44px;                   --type-stat-track:-0.045em;
  --type-lede-size:18px;
  --type-hero-lede-size:clamp(17px,1.6vw,20px);

  /* body + UI */
  --type-body-size:16px;   --type-body-lh:1.55;
  --type-small-size:15px;
  --type-ui-size:14px;
  --type-caption-size:13px;
  --type-micro-size:12px;
  --type-mono-size:12.5px; --type-mono-lh:1.8;

  /* docs prose */
  --doc-h1-size:40px;  --doc-h1-track:-0.035em;
  --doc-h2-size:26px;  --doc-h2-track:-0.025em;
  --doc-h3-size:19px;  --doc-h3-track:-0.015em;
  --doc-body-size:16px; --doc-body-lh:1.7;
  --doc-code-size:13.5px;
  --doc-measure:68ch;
}

:root{
  --space-1:4px; --space-2:6px; --space-3:8px; --space-4:10px; --space-5:12px; --space-6:16px;
  --space-7:18px; --space-8:22px; --space-9:26px; --space-10:28px; --space-11:32px; --space-12:40px; --space-13:56px;

  --container:1200px;
  --container-narrow:820px;
  --gutter:clamp(20px,4vw,32px);
  --section-y:clamp(96px,12vw,160px);
  --hero-y:clamp(72px,10vw,128px);
  --nav-h:60px;
  --docs-sidebar-w:248px;
  --docs-toc-w:220px;

  --radius-pill:999px;   /* buttons, tabs, chips, install command */
  --radius-tile:20px;    /* feature tiles, comparison panels */
  --radius-window:16px;  /* browser frames around screenshots */
  --radius-panel:12px;   /* terminal, inset lists, toasts */
  --radius-inset:10px;   /* diff blocks, confirm boxes */
  --radius-control:8px;  /* nav links, segmented track */
  --radius-sm:7px;       /* compact app buttons, timeline bars */
  --radius-xs:6px;       /* segment items, small tags */

  --control-h-lg:48px; --control-h-md:34px; --control-h-sm:30px; --tab-h:36px;
  --ease:cubic-bezier(.2,.7,.2,1); --dur:150ms;
}
