/* Asterwise Design Tokens — source of truth. Never hardcode values. */

:root {
  /* Backgrounds */
  --bg: #080810;
  --surface: #0E0E1C;
  --surface-2: #16162A;

  /* Borders */
  --border: #1E1E3A;
  --border-bright: #2E2E5A;

  /* Primary — Indigo */
  --primary: #6366F1;
  --primary-hover: #4F52D6;
  --primary-glow: rgba(99, 102, 241, 0.15);
  --primary-glow-strong: rgba(99, 102, 241, 0.30);

  /* Accent — Amber */
  --accent: #F59E0B;
  --accent-dim: rgba(245, 158, 11, 0.15);

  /* Text */
  --text: #F1F5F9;
  --text-muted: #64748B;
  --text-dim: #334155;

  /* Semantic */
  --success: #10B981;
  --error: #EF4444;

  /* Code */
  --code-bg: #0A0A18;
  --code-keyword: #C792EA;
  --code-string: #C3E88D;
  --code-number: #F78C6C;
  --code-property: #82AAFF;
  --code-comment: #546E7A;
  --code-text: #E2E8F0;

  /* Gradients */
  --gradient-hero: radial-gradient(
    ellipse 80% 50% at 50% -20%,
    rgba(99, 102, 241, 0.25),
    transparent
  );
  --gradient-glow: radial-gradient(
    ellipse 60% 60% at 70% 50%,
    rgba(99, 102, 241, 0.12),
    transparent
  );
  --gradient-text: linear-gradient(135deg, #F1F5F9 0%, #6366F1 100%);

  /* Font sizes */
  --text-xs: 0.75rem;
  --text-sm: 0.875rem;
  --text-base: 1rem;
  --text-lg: 1.125rem;
  --text-xl: 1.25rem;
  --text-2xl: 1.5rem;
  --text-3xl: 1.875rem;
  --text-4xl: 2.25rem;
  --text-5xl: 3rem;
  --text-6xl: 3.5rem;

  /* Spacing */
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.25rem;
  --space-6: 1.5rem;
  --space-8: 2rem;
  --space-10: 2.5rem;
  --space-12: 3rem;
  --space-16: 4rem;
  --space-20: 5rem;
  --space-24: 6rem;
  --space-32: 8rem;

  /* Radius */
  --radius-sm: 0.375rem;
  --radius-md: 0.5rem;
  --radius-lg: 0.75rem;
  --radius-xl: 1rem;
  --radius-full: 9999px;
}