/* Flying Snipers — design tokens (MEGA-RECODE phase 2) */

:root {
  /* Breakpoints (reference for media queries / JS) */
  --bp-xs: 375px;
  --bp-sm: 560px;
  --bp-md: 768px;
  --bp-lg: 960px;
  --bp-xl: 1280px;

  /* Surfaces */
  --bg: #0b0b0f;
  --bg-main: #0f0f14;
  --sidebar: #12121a;
  --sidebar-hover: #1a1a24;
  --sidebar-active: #1e1e2a;
  --surface: #16161f;
  --surface-2: #1c1c28;
  --card: #16161f;

  /* Lines & borders */
  --line: rgba(255, 255, 255, 0.07);
  --line-strong: rgba(255, 255, 255, 0.12);
  --border: rgba(255, 255, 255, 0.07);

  /* Brand */
  --orange: #8b5cf6;
  --orange-2: #a78bfa;
  --orange-bg: rgba(139, 92, 246, 0.12);
  --purple: #8b5cf6;
  --purple-bg: rgba(139, 92, 246, 0.12);
  --cyan: #38bdf8;

  /* Text */
  --text: #eeeef2;
  --muted: #9494a8;
  --dim: #5c5c70;

  /* Status */
  --ok: #4ade80;
  --warn: #f87171;

  /* Layout */
  --sidebar-w: 240px;
  --sidebar-collapsed: 72px;
  --topbar-h: 56px;
  --bottom-nav-h: 64px;

  /* Radius */
  --r: 8px;
  --r-lg: 12px;

  /* Scrollbar */
  --scrollbar-size: 6px;
  --scrollbar-track: rgba(255, 255, 255, 0.04);
  --scrollbar-thumb: rgba(139, 92, 246, 0.38);
  --scrollbar-thumb-hover: rgba(139, 92, 246, 0.62);
  --scrollbar-thumb-active: #a78bfa;
}