/* ASTRA · Sistema de tokens
   Fuente única de verdad del diseño. Se carga antes que style.css y observatory.css,
   que a partir de ahora solo consumen estas variables y no redefinen ninguna.

   Resolución del conflicto anterior: style.css y observatory.css declaraban dos
   paletas distintas (--bg #0b101c vs #080f1c, --gold #c8ad79 vs #d1b77f) y ganaba
   el orden de carga. Se adoptan los valores de observatory.css, que son los del
   rediseño más reciente y los que se ven hoy en la carta: azul algo más profundo
   y dorado ligeramente más luminoso, que es donde la marca tiene más contraste
   sobre fondo oscuro. */

:root {
  color-scheme: dark;

  /* --- Color --- */
  --bg: #080f1c;
  --bg-deep: #050a14;
  --panel: #0e1929;
  --panel2: #141c2b;
  --gold: #d1b77f;
  --gold-light: #f0debb;
  --gold-deep: #a8874c;
  --text: #f2eee5;
  --muted: #999fae;
  --line: #c7ae7830;
  --line-strong: #c7ae7855;

  /* Naturaleza de los aspectos: armónicos en dorado, tensos en rojo apagado. */
  --aspect-flow: #d1b77f;
  --aspect-tension: #c0736a;
  --aspect-union: #f0debb;

  /* Elementos */
  --element-fire: #e1a57c;
  --element-earth: #cdbd8d;
  --element-air: #8abacb;
  --element-water: #b6a2dc;

  /* --- Tipografía --- */
  --serif: "Cormorant Garamond", Georgia, "Times New Roman", serif;
  --sans: "Manrope", system-ui, -apple-system, "Segoe UI", sans-serif;
  --tracking-eyebrow: 0.18em;
  --tracking-title: 0.01em;

  /* --- Espaciado (escala de 4) --- */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 48px;
  --space-8: 64px;
  --space-9: 96px;

  /* --- Radios --- */
  --radius-sm: 6px;
  --radius-md: 12px;
  --radius-lg: 20px;
  --radius-pill: 999px;

  /* --- Sombras y luz --- */
  --shadow-panel: 0 24px 60px -30px #000000cc;
  --shadow-raised: 0 12px 32px -18px #000000aa;
  --glow-gold: 0 0 24px #d1b77f40;

  /* --- Movimiento ---
     Una sola curva principal para todo el producto. Duraciones en tres pasos:
     micro (foco, hover), media (transiciones de contenido), escena (revelados). */
  --ease: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --duration-micro: 600ms;
  --duration-entry: 1800ms;
  --duration-atmosphere: 90000ms;
  --duration-breath: 8000ms;
  --chart-shadow: #00000088;
  --nebula: #52658c;
  --solar: #efd191;
  --lunar: #c5d8ec;
  --duration-medium: 600ms;
  --duration-scene: 1100ms;
  --stagger: 60ms;
}

@media (prefers-reduced-motion: reduce) {
  :root {
    --duration-micro: 1ms;
    --duration-medium: 1ms;
    --duration-scene: 1ms;
    --stagger: 0ms;
  }
}