/* ═══════════════════════════════════════════════════════════
   FINDEQ Design Tokens
   Industrial Mission Control
   ═══════════════════════════════════════════════════════════ */

@import url('https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@300;400;500;600;700&family=IBM+Plex+Sans:wght@300;400;500;600;700&display=swap');

:root {
  /* ── Surface ─────────────────────────────────────────── */
  --bg-0: #06060a;
  --bg-1: #0c0c14;
  --bg-2: #12121e;
  --bg-3: #1a1a2a;
  --bg-4: #222236;
  --bg-hover: #1e1e30;
  --bg-active: #262640;

  /* ── Borders ─────────────────────────────────────────── */
  --border-0: #1a1a2e;
  --border-1: #252540;
  --border-2: #333355;
  --border-glow: rgba(0, 220, 255, 0.15);

  /* ── Text ────────────────────────────────────────────── */
  --text-0: #e8e8f0;
  --text-1: #b0b0c8;
  --text-2: #7878a0;
  --text-3: #4e4e70;
  --text-inv: #06060a;

  /* ── Accent: Signals ─────────────────────────────────── */
  --green: #00e676;
  --green-dim: rgba(0, 230, 118, 0.15);
  --green-glow: rgba(0, 230, 118, 0.4);

  --red: #ff3d57;
  --red-dim: rgba(255, 61, 87, 0.15);
  --red-glow: rgba(255, 61, 87, 0.4);

  --amber: #ffab00;
  --amber-dim: rgba(255, 171, 0, 0.15);
  --amber-glow: rgba(255, 171, 0, 0.4);

  --cyan: #00deff;
  --cyan-dim: rgba(0, 222, 255, 0.12);
  --cyan-glow: rgba(0, 222, 255, 0.35);

  --purple: #b388ff;
  --purple-dim: rgba(179, 136, 255, 0.12);

  /* ── Typography ──────────────────────────────────────── */
  --font-mono: 'JetBrains Mono', 'Cascadia Code', 'Fira Code', monospace;
  --font-sans: 'IBM Plex Sans', -apple-system, BlinkMacSystemFont, sans-serif;

  --fs-xs: 10px;
  --fs-sm: 11px;
  --fs-base: 13px;
  --fs-md: 14px;
  --fs-lg: 16px;
  --fs-xl: 20px;
  --fs-2xl: 26px;
  --fs-3xl: 34px;

  --fw-light: 300;
  --fw-regular: 400;
  --fw-medium: 500;
  --fw-semibold: 600;
  --fw-bold: 700;

  --lh-tight: 1.2;
  --lh-normal: 1.5;
  --lh-relaxed: 1.7;

  /* ── Spacing ─────────────────────────────────────────── */
  --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;

  /* ── Radius ──────────────────────────────────────────── */
  --r-sm: 4px;
  --r-md: 6px;
  --r-lg: 10px;
  --r-xl: 14px;

  /* ── Shadows ─────────────────────────────────────────── */
  --shadow-sm: 0 1px 3px rgba(0,0,0,0.4);
  --shadow-md: 0 4px 12px rgba(0,0,0,0.5);
  --shadow-lg: 0 8px 30px rgba(0,0,0,0.6);
  --shadow-glow-green: 0 0 12px var(--green-glow);
  --shadow-glow-cyan: 0 0 12px var(--cyan-glow);
  --shadow-glow-red: 0 0 12px var(--red-glow);

  /* ── Transitions ─────────────────────────────────────── */
  --ease-out: cubic-bezier(0.22, 1, 0.36, 1);
  --ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);
  --dur-fast: 120ms;
  --dur-normal: 200ms;
  --dur-slow: 350ms;

  /* ── Layout ──────────────────────────────────────────── */
  --topbar-h: 52px;
  --sidebar-w: 56px;
  --content-max: 1600px;
}