/* ============================================================================
 * momentos.css — Capa overlay de "Momentos S360".
 * Aislada y ADITIVA (ley 6): full-screen, no bloquea clics, no toca la UI real.
 * Ver S360/MOMENTOS_S360.md (arquitectura congelada).
 * ==========================================================================*/

/* Ambas capas: full-screen, fixed, sin capturar clics (ley 6 aditiva). */
#momentos-layer,
#momentos-layer-back {
  position: fixed;
  inset: 0;
  overflow: hidden;
  pointer-events: none;              /* los clics atraviesan hacia la UI real */
}

/* Capa FRONTAL: decoración por encima del contenido, pero por DEBAJO del chrome.
   En s360-tokens.css la escala es topbar=100, overlay/modal=200, toast=300,
   sim=99999. Fallback 90 = bajo el topbar, así ni el chrome ni los modales
   quedan tapados por un Momento. */
#momentos-layer { z-index: var(--z-momentos, 90); }

/* Capa TRASERA: el `fondo` va DETRÁS del contenido en flujo (z-index negativo). */
#momentos-layer-back { z-index: var(--z-momentos-back, -1); }

/* Por seguridad, cualquier hijo también deja pasar los clics. */
#momentos-layer > *,
#momentos-layer-back > * { pointer-events: none; }

/* El motor ya se salta las animaciones con prefers-reduced-motion; este seguro
   extra detiene cualquier CSS-animation por si un componente la usara. */
@media (prefers-reduced-motion: reduce) {
  #momentos-layer *, #momentos-layer-back * { animation: none !important; transition: none !important; }
}