/* =========================================================
   DESIGN TOKENS
   ========================================================= */
:root {
  /* Surfaces */
  --bg-0: #07070b;
  --bg-1: #0b0b13;
  --bg-2: #101018;

  /* Text */
  --fg: #e7e7ef;
  --fg-soft: #c8c8d8;
  --muted: #8a8aa3;
  --muted-2: #5e5e78;

  /* Accents */
  --accent-1: #8b5cf6;   /* violet  */
  --accent-2: #06b6d4;   /* cyan    */
  --accent-3: #22d3ee;   /* sky     */

  /* Effects */
  --ring: rgba(139, 92, 246, 0.35);
  --border: rgba(255, 255, 255, 0.08);
  --border-strong: rgba(255, 255, 255, 0.14);

  /* Typography */
  --font-display: "Space Grotesk", "Inter", system-ui, sans-serif;
  --font-sans: "Inter", system-ui, sans-serif;
  --font-mono: "JetBrains Mono", ui-monospace, Menlo, monospace;

  /* Motion */
  --ease-out: cubic-bezier(0.22, 1, 0.36, 1);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
}