/* Pilota Labs design tokens. Source of truth for the website.
   Mirrors the design system at claude.ai (Pilota Labs, Design System) and the Notion Design system page.
   Light is the page default; add data-theme="dark" to a night section (hero, 3D story, CTA band). */

:root, [data-theme="light"] {
  --surface: #F6F4EF;
  --surface-raised: #FFFFFF;
  --deep: #061626;
  --harbour: #0B2540;
  --line: #DDE2E6;
  --control-border: #74879A;
  --ink: #0B2540;
  --ink-2: #33475B;
  --muted: #5B6B7C;
  --action: #0B2540;
  --action-hover: #12365A;
  --on-action: #F6F4EF;
  --signal: #FF4F00;
  --signal-text: #C2410C;
  --signal-soft: #FFEDE3;
  --money: #1E7A4E;
  --money-soft: #E3F1EA;
  --data: #12716F;
  --chart-grid: rgba(60, 200, 200, 0.10);
  --focus: #E84500;
  --shadow-float: 0 30px 60px -30px rgba(11, 37, 64, 0.35);
}

[data-theme="dark"] {
  --surface: #061626;
  --surface-raised: #0B2540;
  --deep: #12365A;
  --harbour: #1B4A73;
  --line: #1E3550;
  --control-border: #5E7690;
  --ink: #F6F4EF;
  --ink-2: #A9B8C7;
  --muted: #8397AB;
  --action: #F6F4EF;
  --action-hover: #FFFFFF;
  --on-action: #0B2540;
  --signal: #FF4F00;
  --signal-text: #FF6A2B;
  --signal-soft: #3B1A0C;
  --money: #4ADE9A;
  --money-soft: #0E2A20;
  --data: #3CC8C8;
  --chart-grid: rgba(60, 200, 200, 0.12);
  --focus: #FF4F00;
  --shadow-float: 0 40px 80px -30px rgba(0, 0, 0, 0.7);
  color-scheme: dark;
}

:root {
  /* fixed brand colours, the same in every theme */
  --navy: #0B2540;
  --night: #061626;
  --sail: #F6F4EF;
  --orange: #FF4F00;
  --cyan: #3CC8C8;
  --scene-hull: #163B5E;
  --scene-box-1: #1B4A73;
  --scene-box-2: #12365A;
  --scene-box-3: #3D7FB0;
  --scene-box-4: #2E6E9E;
  --scene-box-5: #9FB3C6;
  --scene-box-6: #C9D4DF;

  /* type: Geist and Geist Mono from Google Fonts */
  --font-sans: "Geist", ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-mono: "Geist Mono", ui-monospace, "SF Mono", Menlo, monospace;

  /* spacing (4px base) */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-6: 24px;
  --space-8: 32px;
  --space-12: 48px;
  --space-16: 64px;
  --space-24: 96px;
  --space-32: 128px;

  /* radius */
  --radius-none: 0px;
  --radius-chip: 5px;
  --radius-control: 8px;
  --radius-card: 12px;

  /* motion */
  --ease-out: cubic-bezier(.2, .7, .2, 1);
  --dur-ui: 180ms;
}

/* keyboard focus, everywhere */
:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; }