/* Eunoia Wireframe brand tokens, generated from wireframe.tokens.json (2026-10-07).
   Colour = layer: grey-white site, cyan models, amber memory. Guide: /brand/ on the docs site. */
@import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400..700&family=IBM+Plex+Sans:wght@400;500;600&family=IBM+Plex+Mono:wght@400;500&display=swap');

:root {
  --wf-navy: #0F1A2B;
  --wf-navy-raised: #16243A;
  --wf-navy-high: #22324A;
  --wf-navy-hairline: rgba(201,209,220,0.14);
  --wf-paper: #F3EFE6;
  --wf-card: #FBF9F4;
  --wf-paper-control: #FFFDF8;
  --wf-hairline: #DDD5C6;
  --wf-amber: #F0A53A;
  --wf-amber-text: #9A5B00;
  --wf-amber-text-on-tint: #8C5300;
  --wf-amber-rule: #C77F14;
  --wf-amber-tint: #F4E6CC;
  --wf-cyan: #5BC6DD;
  --wf-cyan-text: #17738A;
  --wf-cyan-tint: #E1ECEE;
  --wf-site-grey: #C9D1DC;
  --wf-rail: #33445C;
  --wf-lane-site: #16243A;
  --wf-lane-model: #112B35;
  --wf-lane-memory: #2A2214;
  --wf-lane-step-site: #22324A;
  --wf-lane-step-model: #123A45;
  --wf-lane-step-memory: #3A2B12;
  --wf-text-on-navy-heading: #EDE8DD;
  --wf-text-on-navy-body: #B9C3D1;
  --wf-text-on-navy-muted: #8A97A8;
  --wf-text-on-paper-heading: #0F1A2B;
  --wf-text-on-paper-body: #3D4A5C;
  --wf-text-on-paper-muted: #5A6678;
  --wf-status-ok-on-navy: #4CC38A;
  --wf-status-ok-on-paper: #1E7A52;
  --wf-status-alert-on-navy: #F2875A;
  --wf-status-alert-on-paper: #9A3412;
  --wf-status-alert-rule: #C2410C;
  --wf-font-display: 'Space Grotesk', Arial, sans-serif;
  --wf-font-body: 'IBM Plex Sans', Arial, sans-serif;
  --wf-font-mono: 'IBM Plex Mono', 'Courier New', monospace;
  --wf-radius-slide-card: 16px;
  --wf-radius-panel: 10px;
  --wf-radius-control: 6px;
  --wf-dur-hover: 120ms;
  --wf-dur-panel: 240ms;
  --wf-dur-reveal: 480ms;
  --wf-dur-scene: 1200ms;
  --wf-ease: cubic-bezier(0.2, 0.7, 0.2, 1);
}

@media (prefers-reduced-motion: reduce) {
  :root { --wf-dur-hover: 0ms; --wf-dur-panel: 0ms; --wf-dur-reveal: 0ms; --wf-dur-scene: 0ms; }
}