/* Global design tokens shared by the website and interactive tools. */
:root{
 --kb-bg:#090b12;
 --kb-fg:#f7f7fb;
 --kb-purple:#b5a8ff;
 --kb-accent:#9f7aea;
 --kb-muted:#858899;
 --kb-secondary:#a7a9b8;
 --kb-rule:rgba(155,149,208,.36);
 --kb-rule-soft:rgba(147,146,189,.22);
 --kb-font:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
 --kb-content-width:520px;
 --kb-gutter:16px;
 --kb-top-gap:24px;
 --kb-hero-gap:clamp(32px,5dvh,52px);
 --kb-rule-gap:14px;
 --kb-surface:#171a25;
 --kb-surface-hover:#242837;
 --kb-border:rgba(255,255,255,.09);
 --kb-error:#ff5d67;
 --kb-blue:#6b8cff;
 --kb-cyan:#56d9e8;
 --kb-focus:var(--kb-purple);
 --kb-radius:16px;
 --kb-control-radius:8px;
 --kb-control-height:44px;
 --kb-control-font:12px;
 --kb-control-border:#343749;
 --kb-control-hover:var(--kb-surface-hover);
 --kb-control-active:#302442;
 --kb-control-padding:10px 14px;
 --kb-tool-width:1220px;
 --kb-tool-heading:clamp(22px,4vw,44px);
 --kb-space-1:6px;
 --kb-space-2:10px;
 --kb-space-3:24px;
 --kb-space-4:40px;
 --kb-space-5:56px;
 --kb-text-body:1rem;
 --kb-text-caption:.875rem;
 --kb-text-button:1.0625rem;
 --kb-heading-1:2.25rem;
 --kb-heading-2:1.5rem;
 --kb-line-height:1.55;
}

/* Compatibility aliases for existing website components. */
:root{--color-bg:var(--kb-bg);--color-fg:var(--kb-fg);--color-muted:var(--kb-muted);--color-text-secondary:var(--kb-secondary);--color-accent:var(--kb-surface);--color-accent-hover:var(--kb-surface-hover);--color-border:var(--kb-border);--color-error:var(--kb-error);--color-purple:var(--kb-accent);--color-blue:var(--kb-blue);--color-cyan:var(--kb-cyan);--border-radius:var(--kb-radius);--font-family:var(--kb-font);--font-size-h1:var(--kb-heading-1);--font-size-h2:var(--kb-heading-2);--font-size-body:var(--kb-text-body);--font-size-caption:var(--kb-text-caption);--font-size-button:var(--kb-text-button);--font-line-height-body:var(--kb-line-height);--spacing-s:var(--kb-space-1);--spacing-m:var(--kb-space-2);--spacing-l:var(--kb-space-3);--spacing-xl:var(--kb-space-4);--spacing-2xl:var(--kb-space-5)}

/* Ambient page background, shared by every editorial route. */
:root {
 --kb-page-background:
  radial-gradient(ellipse 85% 48% at 14% 12%,rgba(99,79,191,.25),transparent 78%),
  radial-gradient(ellipse 76% 56% at 94% 62%,rgba(64,82,170,.15),transparent 82%),
  radial-gradient(ellipse 90% 42% at 35% 100%,rgba(103,57,150,.11),transparent 82%),var(--kb-bg);
 --kb-page-ambient:
  radial-gradient(ellipse 82% 42% at 36% 4%,rgba(117,95,223,.20),transparent 78%),
  radial-gradient(ellipse 65% 40% at 100% 57%,rgba(76,112,203,.11),transparent 85%);
}