/* ============================================================
   DESIGN TOKENS · misitio · Stellar Terminal
   Cosmic void + quantum violet + glass morphism
   ============================================================ */

:root {
  /* Fondo cósmico */
  --color-bg:        #05050A;
  --color-bg-alt:    #0A0A12;

  /* Superficies glass */
  --color-surface:   rgba(255,255,255,0.04);
  --color-surface-2: rgba(147,51,234,0.08);
  --color-surface-3: rgba(255,255,255,0.07);

  /* Acentos */
  --color-accent:    #A855F7;   /* violeta cuántico */
  --color-accent-2:  #9333EA;   /* violeta profundo */
  --color-cyan:      #22D3EE;   /* cian activo */

  /* Texto */
  --color-ink:       #F8FAFC;   /* blanco estelar */
  --color-ink-soft:  #E2E8F0;
  --color-muted:     #A78BFA;   /* lavanda */
  --color-muted-2:   #94A3B8;   /* gris frío */

  /* Bordes tiling WM */
  --color-border:    rgba(255,255,255,0.08);
  --color-border-accent: rgba(168,85,247,0.25);

  /* Tipografía */
  --font-display: 'Playfair Display', Georgia, serif;
  --font-body:    'DM Sans', sans-serif;
  --font-mono:    'JetBrains Mono', 'Fira Code', 'Space Mono', monospace;

  --text-xs:   0.70rem;
  --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;

  --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;

  --radius-sm:   0.25rem;
  --radius-md:   0.5rem;
  --radius-lg:   0.75rem;
  --radius-xl:   1rem;
  --radius-full: 9999px;

  --duration:    150ms;
  --duration-lg: 350ms;
  --ease-out:    cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in-out: cubic-bezier(0.4, 0, 0.2, 1);

  /* Sombras con glow violeta */
  --shadow-sm:  0 1px 3px rgba(0,0,0,0.5);
  --shadow-md:  0 4px 20px rgba(0,0,0,0.6);
  --shadow-lg:  0 8px 40px rgba(0,0,0,0.7);
  --glow-sm:    0 0 8px rgba(168,85,247,0.3);
  --glow-md:    0 0 20px rgba(168,85,247,0.25), 0 0 40px rgba(168,85,247,0.1);
  --glow-cyan:  0 0 10px rgba(34,211,238,0.4);

  /* Glass */
  --glass-blur: blur(16px) saturate(180%);
  --glass-bg:   rgba(255,255,255,0.03);
  --glass-border: 1px solid rgba(255,255,255,0.08);
}