/* ==========================================================================
   Algo Tools — Design Tokens
   Single source of truth for color, type, spacing, radius, layout, motion.
   Every shared and tool-specific stylesheet reads from these variables only.
   ========================================================================== */
:root {
  /* Color — Ink Navy base with Violet / Signal Teal accents */
  --c-bg: #0A0E1A;
  --c-bg-alt: #0F1526;
  --c-surface: #151C30;
  --c-surface-2: #1B233C;
  --c-border: #262F4A;
  --c-text: #F4F6FB;
  --c-text-muted: #9AA3BD;
  --c-text-faint: #6B7590;
  --c-accent: #33e496;
  --c-accent-soft: rgba(108, 92, 231, 0.14);
  --c-accent-2: #24b8fd;
  --c-accent-2-soft: rgba(22, 224, 189, 0.14);
  --c-warn: #F5A623;
  --c-danger: #EF4560;
  --c-success: #2ED573;

  --shadow-sm: 0 2px 8px rgba(4, 6, 16, 0.35);
  --shadow-md: 0 12px 32px rgba(4, 6, 16, 0.45);
  --shadow-glow: 0 0 0 1px rgba(108, 92, 231, 0.25), 0 8px 30px rgba(108, 92, 231, 0.20);

  /* Typography */
  --font-display: 'Space Grotesk', 'Segoe UI', sans-serif;
  --font-body: 'Inter', 'Segoe UI', sans-serif;
  --font-mono: 'JetBrains Mono', 'Courier New', monospace;
  --font-bn: 'Noto Sans Bengali', 'Inter', sans-serif;

  --fs-xs: 0.75rem;
  --fs-sm: 0.875rem;
  --fs-base: 1rem;
  --fs-md: 1.125rem;
  --fs-lg: 1.375rem;
  --fs-xl: 1.75rem;
  --fs-2xl: 2.25rem;
  --fs-3xl: 3rem;
  --fs-4xl: 4rem;

  /* Spacing scale */
  --sp-1: 0.25rem;
  --sp-2: 0.5rem;
  --sp-3: 0.75rem;
  --sp-4: 1rem;
  --sp-5: 1.5rem;
  --sp-6: 2rem;
  --sp-8: 3rem;
  --sp-10: 4rem;
  --sp-12: 6rem;
  --sp-16: 8rem;

  /* Radius */
  --r-sm: 8px;
  --r-md: 14px;
  --r-lg: 22px;
  --r-full: 999px;

  /* Layout */
  --container-max: 1240px;
  --header-h: 76px;

  /* Motion */
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --dur-fast: 160ms;
  --dur-base: 320ms;
  --dur-slow: 640ms;
}

[data-theme="light"] {
  --c-bg: #F6F7FB;
  --c-bg-alt: #FFFFFF;
  --c-surface: #FFFFFF;
  --c-surface-2: #EEF0F7;
  --c-border: #E1E4EE;
  --c-text: #0F1526;
  --c-text-muted: #4B5470;
  --c-text-faint: #7B849E;
  --shadow-sm: 0 2px 8px rgba(15, 21, 38, 0.06);
  --shadow-md: 0 12px 32px rgba(15, 21, 38, 0.10);
  --shadow-glow: 0 0 0 1px rgba(108, 92, 231, 0.18), 0 8px 30px rgba(108, 92, 231, 0.14);
}