/* Crafty Pilot — design tokens.
   Palette follows GEC's plan and SOP-05 documents (ink, coral, ok, no, warn, dot, blue, violet, night).
   Light is warm paper; dark is deep night. Both are designed, not inverted. */

:root {
  /* type */
  --font-ui: 'Manrope', 'Segoe UI', system-ui, -apple-system, Arial, sans-serif;
  --font-display: 'Fraunces', Georgia, 'Times New Roman', serif;
  --font-mono: ui-monospace, 'SFMono-Regular', 'JetBrains Mono', Menlo, Consolas, monospace;

  --fs-xs: 0.75rem;
  --fs-sm: 0.8125rem;
  --fs-md: 0.9375rem;
  --fs-lg: 1.0625rem;
  --fs-xl: 1.375rem;
  --fs-2xl: 1.875rem;
  --fs-3xl: 2.5rem;

  /* space + shape */
  --sp-1: 4px; --sp-2: 8px; --sp-3: 12px; --sp-4: 16px; --sp-5: 20px; --sp-6: 24px; --sp-8: 32px; --sp-10: 40px; --sp-12: 48px;
  --r-xs: 6px; --r-sm: 10px; --r-md: 14px; --r-lg: 18px; --r-xl: 24px; --r-pill: 999px;
  --sidebar-w: 264px;
  --topbar-h: 64px;
  --content-max: 1320px;

  /* motion */
  --ease: cubic-bezier(.2, .8, .2, 1);
  --ease-spring: cubic-bezier(.34, 1.56, .64, 1);
  --t-fast: 140ms;
  --t-med: 240ms;
  --t-slow: 420ms;

  /* fixed brand colours (same in both themes) */
  --coral: #F1641E;
  --coral-2: #FF8A4C;
  --violet: #7B61FF;
  --blue: #3B6CF6;
  --ok: #2FBF7F;
  --no: #E5322D;
  --warn: #E9A21F;
  --dot: #FF8A00;

  /* Figma board (always a dark canvas, like Figma) */
  --fig-canvas: #1E1E1E;
  --fig-panel: #2C2C2C;
  --fig-line: #3A3A3A;
  --fig-text: #E6E6E6;
  --fig-muted: #9A9A9A;
  --mark-ok: #3DCB8C;
  --mark-no: #E5322D;
  --mark-dot: #FF8A00;
}

/* ------------------------------------------------------------------ light */
:root,
:root[data-theme='light'] {
  color-scheme: light;
  --bg: #F6F3EE;
  --bg-grad-1: rgba(241, 100, 30, .10);
  --bg-grad-2: rgba(123, 97, 255, .09);
  --bg-grad-3: rgba(59, 108, 246, .07);
  --surface: #FFFFFF;
  --surface-2: #FBF8F3;
  --surface-3: #F3EEE6;
  --surface-glass: rgba(255, 255, 255, .78);
  --sidebar-bg: rgba(255, 252, 247, .72);
  --overlay: rgba(22, 32, 58, .38);

  --ink: #16203A;
  --ink-2: #3A4562;
  --muted: #626B80;
  --faint: #8A92A5;
  --line: #E7E1D8;
  --line-2: #EFEAE2;
  --line-strong: #D9D1C5;

  --brand: #C8490F;           /* text/link-safe coral on light */
  --brand-strong: #B5410C;
  --brand-soft: #FFEDE3;
  --brand-glow: rgba(241, 100, 30, .28);
  --on-brand: #FFFFFF;
  --btn-primary-a: #DA561A;
  --btn-primary-b: #BF450D;

  --ok-ink: #137A4D;   --ok-soft: #DDF6EA;   --ok-line: #BDEBD3;
  --no-ink: #B4231F;   --no-soft: #FCE3E2;   --no-line: #F6C9C6;
  --warn-ink: #8A5A07; --warn-soft: #FCF0D6; --warn-line: #F3DDA6;
  --dot-ink: #9A4A00;  --dot-soft: #FFEFD9;
  --blue-ink: #2848B8; --blue-soft: #E5EBFE; --blue-line: #C9D6FC;
  --violet-ink: #5B3FD6; --violet-soft: #EEEAFF; --violet-line: #D9D0FF;

  --shadow-xs: 0 1px 2px rgba(22, 32, 58, .06);
  --shadow-sm: 0 1px 2px rgba(22, 32, 58, .05), 0 2px 8px rgba(22, 32, 58, .05);
  --shadow-md: 0 2px 6px rgba(22, 32, 58, .05), 0 12px 32px -8px rgba(22, 32, 58, .12);
  --shadow-lg: 0 8px 24px rgba(22, 32, 58, .08), 0 32px 64px -16px rgba(22, 32, 58, .22);
  --ring: 0 0 0 3px rgba(200, 73, 15, .28);
  --card-border: 1px solid var(--line);
  --code-bg: #1B2238;
  --code-ink: #E6E9F2;
}

/* ------------------------------------------------------------------- dark */
:root[data-theme='dark'] {
  color-scheme: dark;
  --bg: #0B0F1A;
  --bg-grad-1: rgba(241, 100, 30, .16);
  --bg-grad-2: rgba(123, 97, 255, .16);
  --bg-grad-3: rgba(59, 108, 246, .12);
  --surface: #121826;
  --surface-2: #161D2E;
  --surface-3: #1C2438;
  --surface-glass: rgba(18, 24, 38, .74);
  --sidebar-bg: rgba(13, 18, 30, .72);
  --overlay: rgba(3, 6, 14, .62);

  --ink: #EEF1F7;
  --ink-2: #C3C9D8;
  --muted: #8F98AD;
  --faint: #6B748A;
  --line: #232C42;
  --line-2: #1D2538;
  --line-strong: #2F3A55;

  --brand: #FF8A4C;
  --brand-strong: #FFA26E;
  --brand-soft: rgba(255, 122, 61, .14);
  --brand-glow: rgba(255, 122, 61, .34);
  --on-brand: #1A0F08;
  --btn-primary-a: #FF9A5E;
  --btn-primary-b: #F26A26;

  --ok-ink: #5EE0A8;   --ok-soft: rgba(47, 191, 127, .14);  --ok-line: rgba(47, 191, 127, .32);
  --no-ink: #FF8A85;   --no-soft: rgba(229, 50, 45, .15);   --no-line: rgba(229, 50, 45, .36);
  --warn-ink: #F5C35B; --warn-soft: rgba(233, 162, 31, .14); --warn-line: rgba(233, 162, 31, .34);
  --dot-ink: #FFB25C;  --dot-soft: rgba(255, 138, 0, .14);
  --blue-ink: #8FB0FF; --blue-soft: rgba(59, 108, 246, .16); --blue-line: rgba(59, 108, 246, .38);
  --violet-ink: #B6A5FF; --violet-soft: rgba(123, 97, 255, .17); --violet-line: rgba(123, 97, 255, .38);

  --shadow-xs: 0 1px 2px rgba(0, 0, 0, .3);
  --shadow-sm: 0 1px 2px rgba(0, 0, 0, .35), 0 2px 10px rgba(0, 0, 0, .2);
  --shadow-md: 0 2px 8px rgba(0, 0, 0, .35), 0 16px 40px -10px rgba(0, 0, 0, .55);
  --shadow-lg: 0 10px 30px rgba(0, 0, 0, .45), 0 40px 80px -20px rgba(0, 0, 0, .7);
  --ring: 0 0 0 3px rgba(255, 138, 76, .38);
  --card-border: 1px solid var(--line);
  --code-bg: #0A0E18;
  --code-ink: #DCE2EF;
}