/* ============================================================
   Shared design tokens — used by every page under /pages/
   Override per-page by re-declaring on :root or a parent scope.
============================================================ */

:root {
  /* Colors — dark by default */
  --bg: #06080F;
  --bg-elev: #0B0F1A;
  --bg-elev-2: #0F1524;
  --surface: rgba(255, 255, 255, 0.03);
  --surface-2: rgba(255, 255, 255, 0.05);
  --border: rgba(255, 255, 255, 0.08);
  --border-strong: rgba(255, 255, 255, 0.14);
  --text: #F5F7FB;
  --text-2: #A8B0C2;
  --text-3: #6B7388;
  --text-4: #4A5166;

  /* Primary — blue (tweakable per page) */
  --primary: #3B82F6;
  --primary-2: #60A5FA;
  --primary-glow: rgba(59, 130, 246, 0.45);
  --primary-soft: rgba(59, 130, 246, 0.12);

  /* Semantic */
  --success: #22C55E;
  --danger: #EF4444;

  /* Glass */
  --glass-blur: 28px;
  --glass-bg: rgba(255, 255, 255, 0.04);
  --glass-bg-strong: rgba(255, 255, 255, 0.06);
  --glass-border: rgba(255, 255, 255, 0.10);
  --glass-highlight: rgba(255, 255, 255, 0.20);

  /* Radii */
  --r-sm: 10px;
  --r-md: 14px;
  --r-lg: 20px;
  --r-xl: 28px;
  --r-2xl: 36px;
  --r-pill: 999px;

  /* Type */
  --font-display: "Inter Tight", "Inter", -apple-system, sans-serif;
  --font-body: "Inter", -apple-system, sans-serif;

  /* Layout */
  --container: 1200px;
  --container-wide: 1280px;

  /* Motion */
  --ease: cubic-bezier(0.22, 1, 0.36, 1);
}

/* Light theme override */
[data-theme="light"] {
  --bg: #F6F7FA;
  --bg-elev: #FFFFFF;
  --bg-elev-2: #FFFFFF;
  --surface: rgba(15, 21, 36, 0.03);
  --surface-2: rgba(15, 21, 36, 0.05);
  --border: rgba(15, 21, 36, 0.08);
  --border-strong: rgba(15, 21, 36, 0.14);
  --text: #0B0F1A;
  --text-2: #47506A;
  --text-3: #6B7388;
  --text-4: #98A0B3;
  --glass-bg: rgba(255, 255, 255, 0.55);
  --glass-bg-strong: rgba(255, 255, 255, 0.70);
  --glass-border: rgba(15, 21, 36, 0.10);
  --glass-highlight: rgba(255, 255, 255, 0.90);
}