/* ==========================================================================
   Movimiento — entrada escalonada y transición al cambiar de tema
   --------------------------------------------------------------------------
   Encendido por defecto, también con "reducir movimiento" del sistema (Windows
   lo activa al apagar los efectos de animación y el sitio quedaba quieto).
   El interruptor "Efectos de fondo" del menú de configuración pone html.fx-off y apaga todo.
   ========================================================================== */

@keyframes fx-rise {
  from { opacity: 0; transform: translateY(10px); }
  to   { opacity: 1; transform: none; }
}

html[data-theme]:not(.fx-off) .main-content > *,
html[data-theme]:not(.fx-off) .sidebar > * {
  animation: fx-rise .6s var(--ease) both;
}
html[data-theme]:not(.fx-off) .main-content > :nth-child(2)   { animation-delay: .05s; }
html[data-theme]:not(.fx-off) .main-content > :nth-child(3)   { animation-delay: .10s; }
html[data-theme]:not(.fx-off) .main-content > :nth-child(4)   { animation-delay: .15s; }
html[data-theme]:not(.fx-off) .main-content > :nth-child(n+5) { animation-delay: .20s; }
html[data-theme]:not(.fx-off) .sidebar > :nth-child(1)        { animation-delay: .08s; }
html[data-theme]:not(.fx-off) .sidebar > :nth-child(2)        { animation-delay: .14s; }
html[data-theme]:not(.fx-off) .sidebar > :nth-child(3)        { animation-delay: .20s; }

/* Efectos apagados: sin animaciones de entrada */
html.fx-off .main-content > *,
html.fx-off .sidebar > * { animation: none !important; }

/* theme.js añade .theme-fade durante el cambio de modo para que no sea un salto */
html.theme-fade *,
html.theme-fade *::before,
html.theme-fade *::after {
  transition: background-color .45s var(--ease), border-color .45s var(--ease), color .45s var(--ease) !important;
}