/* ─────────────────────────────────────────────────────────────────────────
   CubePilot design tokens · v0.4.0
   Generated by scripts/build-tokens.mjs from src/tokens/tokens.json.
   DO NOT EDIT by hand — re-run `pnpm tokens:build`.
   ───────────────────────────────────────────────────────────────────────── */

:root {
  /* color.cube */
  --cp-color-cube-orange: #F26522;
  --cp-color-cube-red: #D6242D;
  --cp-color-cube-yellow: #F2B705;
  --cp-color-cube-blue: #1D8AC2;
  --cp-color-cube-green: #2FB271;
  --cp-color-cube-purple: #6F4FB0;
  --cp-color-cube-black: #1B1A18;
  --cp-color-cube-white: #FFFFFF;

  /* color.paper */
  --cp-color-paper-0: #FFFFFF;
  --cp-color-paper-50: #F6F8FB;
  --cp-color-paper-100: #EAEEF5;
  --cp-color-paper-200: #D5DEEC;

  /* color.ink */
  --cp-color-ink-0: #0E1219;
  --cp-color-ink-100: #2E3540;
  --cp-color-ink-200: #525C6B;
  --cp-color-ink-300: #8893A2;
  --cp-color-ink-400: #CCD3DE;

  /* color.void */
  --cp-color-void-0: #07101D;
  --cp-color-void-50: #0D1320;
  --cp-color-void-100: #161E2D;
  --cp-color-void-200: #232D3F;

  /* color.chalk */
  --cp-color-chalk-0: #DCE3EE;
  --cp-color-chalk-100: #B0B9C9;
  --cp-color-chalk-200: #9AA4B5;
  --cp-color-chalk-300: #5A6477;
  --cp-color-chalk-400: #1F2A3D;

  /* color.status */
  --cp-color-status-success: #2FB271;
  --cp-color-status-warning: #F2B705;
  --cp-color-status-danger: #D6242D;
  --cp-color-status-info: #1D8AC2;

  /* font.family */
  --cp-font-family-display: "CubePilot", "Saira", system-ui, sans-serif;
  --cp-font-family-body: "Saira", system-ui, -apple-system, "Segoe UI", sans-serif;
  --cp-font-family-mono: "IBM Plex Mono", "SF Mono", ui-monospace, monospace;

  /* font.weight */
  --cp-font-weight-regular: 400;
  --cp-font-weight-medium: 500;
  --cp-font-weight-semibold: 600;
  --cp-font-weight-bold: 700;

  /* font.size */
  --cp-font-size-10: 10px;
  --cp-font-size-11: 11px;
  --cp-font-size-12: 12px;
  --cp-font-size-14: 14px;
  --cp-font-size-16: 16px;
  --cp-font-size-18: 18px;
  --cp-font-size-20: 20px;
  --cp-font-size-24: 24px;
  --cp-font-size-32: 32px;
  --cp-font-size-40: 40px;
  --cp-font-size-56: 56px;
  --cp-font-size-72: 72px;

  /* font.line-height */
  --cp-line-height-tight: 1.10;
  --cp-line-height-snug: 1.25;
  --cp-line-height-normal: 1.45;
  --cp-line-height-loose: 1.65;

  /* font.letter-spacing */
  --cp-tracking-tight: -0.02em;
  --cp-tracking-normal: 0;
  --cp-tracking-wide: 0.04em;
  --cp-tracking-caps: 0.12em;

  /* space */
  --cp-space-0: 0;
  --cp-space-1: 2px;
  --cp-space-2: 4px;
  --cp-space-3: 6px;
  --cp-space-4: 8px;
  --cp-space-5: 10px;
  --cp-space-6: 12px;
  --cp-space-7: 14px;
  --cp-space-8: 16px;
  --cp-space-9: 20px;
  --cp-space-10: 24px;
  --cp-space-11: 32px;
  --cp-space-12: 40px;
  --cp-space-13: 48px;
  --cp-space-14: 64px;
  --cp-space-15: 80px;
  --cp-space-16: 96px;

  /* radius */
  --cp-radius-0: 0;
  --cp-radius-xs: 3px;
  --cp-radius-sm: 5px;
  --cp-radius-md: 8px;
  --cp-radius-lg: 12px;
  --cp-radius-xl: 20px;
  --cp-radius-pill: 999px;

  /* border */
  --cp-border-hairline: 1px;
  --cp-border-thin: 1.5px;
  --cp-border-thick: 2.5px;

  /* shadow */
  --cp-shadow-1: 0 1px 2px rgba(27,26,24,0.08), 0 1px 1px rgba(27,26,24,0.04);
  --cp-shadow-2: 0 4px 12px rgba(27,26,24,0.10), 0 2px 4px rgba(27,26,24,0.06);
  --cp-shadow-3: 0 8px 28px rgba(27,26,24,0.16), 0 4px 8px rgba(27,26,24,0.08);
  --cp-shadow-none: none;
  --cp-shadow-stamp: 4px 5px 0 var(--cp-color-border);
  --cp-shadow-focus: 0 0 0 3px color-mix(in srgb, var(--cp-color-border-focus) 32%, transparent);

  /* motion.duration */
  --cp-duration-instant: 80ms;
  --cp-duration-fast: 120ms;
  --cp-duration-normal: 200ms;
  --cp-duration-slow: 320ms;

  /* motion.ease */
  --cp-ease-standard: cubic-bezier(0.2, 0.0, 0.0, 1.0);
  --cp-ease-out: cubic-bezier(0.0, 0.0, 0.0, 1.0);
  --cp-ease-in: cubic-bezier(0.4, 0.0, 1.0, 1.0);
  --cp-ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1.0);

  /* z-index */
  --cp-z-base: 0;
  --cp-z-raised: 10;
  --cp-z-sticky: 30;
  --cp-z-overlay: 50;
  --cp-z-modal: 70;
  --cp-z-toast: 80;
  --cp-z-tooltip: 90;

  /* target */
  --cp-target-touch: 44px;
  --cp-target-mouse: 32px;
  --cp-target-compact: 24px;
}

:root,
[data-theme="light"] {
  --cp-color-bg: #F6F8FB;
  --cp-color-bg-elevated: #FFFFFF;
  --cp-color-bg-inset: #EAEEF5;
  --cp-color-bg-overlay: rgba(27, 26, 24, 0.42);
  --cp-color-fg: #0E1219;
  --cp-color-fg-muted: #525C6B;
  --cp-color-fg-faint: #8893A2;
  --cp-color-fg-disabled: #8893A2;
  --cp-color-fg-on-accent: #FFFFFF;
  --cp-color-border: #0E1219;
  --cp-color-border-subtle: #CCD3DE;
  --cp-color-border-focus: #F26522;
  --cp-color-accent: #F26522;
  color-scheme: light;
}

[data-theme="dark"] {
  --cp-color-bg: #0D1320;
  --cp-color-bg-elevated: #161E2D;
  --cp-color-bg-inset: #07101D;
  --cp-color-bg-overlay: rgba(0, 0, 0, 0.62);
  --cp-color-fg: #DCE3EE;
  --cp-color-fg-muted: #B0B9C9;
  --cp-color-fg-faint: #9AA4B5;
  --cp-color-fg-disabled: #5A6477;
  --cp-color-fg-on-accent: #FFFFFF;
  --cp-color-border: #DCE3EE;
  --cp-color-border-subtle: #1F2A3D;
  --cp-color-border-focus: #F26522;
  --cp-color-accent: #F26522;
  color-scheme: dark;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --cp-color-bg: #0D1320;
    --cp-color-bg-elevated: #161E2D;
    --cp-color-bg-inset: #07101D;
    --cp-color-bg-overlay: rgba(0, 0, 0, 0.62);
    --cp-color-fg: #DCE3EE;
    --cp-color-fg-muted: #B0B9C9;
    --cp-color-fg-faint: #9AA4B5;
    --cp-color-fg-disabled: #5A6477;
    --cp-color-fg-on-accent: #FFFFFF;
    --cp-color-border: #DCE3EE;
    --cp-color-border-subtle: #1F2A3D;
    --cp-color-border-focus: #F26522;
    --cp-color-accent: #F26522;
    color-scheme: dark;
  }
}

@media (prefers-reduced-motion: reduce) {
  :root {
    --cp-duration-instant: 0ms;
    --cp-duration-fast:    0ms;
    --cp-duration-normal:  0ms;
    --cp-duration-slow:    0ms;
  }
}
