/* ════════════════════════════════════════════════════════════════════
   EIR DR. — Design Tokens (Fuente única de verdad)
   Usado por: landing.html, desktop app, atelier_shell, academy, etc.
   NO EDITAR A MANO: generar desde script si se expande.
   ═════════════════════════════════════════════════════════════════════ */
:root {
  /* Color — Identidad EIR DR (Dark + Emerald Clinical) */
  --eir-bg: #070d1f;
  --eir-surface: rgba(11, 18, 41, 0.62);
  --eir-surface-solid: #1a1d24;
  --eir-verde: #00f29f;
  --eir-verde2: #00c07e;
  --eir-azul: #3b82f6;
  --eir-violeta: #7d5cff;
  --eir-text: #e1e2e7;
  --eir-muted: #8a99b5;
  --eir-border: rgba(0, 242, 159, 0.14);
  --eir-glass-border: rgba(0, 242, 159, 0.18);
  --eir-ok: #34d399;
  --eir-err: #f87171;
  --eir-warn: #fbbf24;

  /* Tipografía */
  --eir-font-display: 'Playfair Display', Georgia, serif;
  --eir-font-ui: 'Plus Jakarta Sans', 'Inter', system-ui, -apple-system, sans-serif;
  --eir-font-mono: 'JetBrains Mono', 'Fira Code', monospace;

  /* Espaciado y Forma */
  --eir-radius-sm: 10px;
  --eir-radius-md: 18px;
  --eir-radius-lg: 24px;
  --eir-radius-full: 999px;
  --eir-space-unit: 4px;

  /* Sombras */
  --eir-shadow-glass: 0 12px 40px rgba(0,0,0,.45);
  --eir-shadow-orb: 0 0 46px rgba(0,242,159,.22);
  --eir-shadow-elevated: 0 20px 50px -12px rgba(0,0,0,.5);

  /* Transiciones */
  --eir-transition-fast: 0.12s ease;
  --eir-transition-base: 0.2s ease;
  --eir-transition-slow: 0.3s cubic-bezier(.4,0,.2,1);
}
/* §M-076 · El atributo `hidden` tiene que ganarle a una clase de display.

   Un elemento que nace `<div class="flex …" hidden>` NO se oculta: la clase
   `.flex{display:flex}` le gana al `[hidden]{display:none}` del user-agent,
   que tiene menos especificidad. Se veía en producción:

     · #update-progress-wrap — la app decía "Descargando…" desde el arranque,
       sin que nadie hubiera tocado el botón de actualizar. Lo cazó una captura
       del Soberano, no un test;
     · #cowork-generic — el cartel "Fase 2" se pintaba ENCIMA del panel real de
       Recepción, los dos a la vez;
     · los indicadores "Consultando…" de los bloques nuevos, que se quedaban
       visibles junto al mensaje de error.

   OJO, y es toda la diferencia: esto es el ATRIBUTO, no la clase. Los modales
   (login, guía, ajustes, aprobación) se abren y cierran con `classList` sobre
   la clase `hidden` de Tailwind, y esta regla no los toca. */
[hidden] {
  display: none !important;
}
