/* Transições de tela e modal — CSS/JS puro, funciona em qualquer navegador
   (transitions.js cuida do fade-out antes de navegar; aqui cuidamos do
   fade-in de entrada e da animação dos modais). */

body {
  animation: nux-fade-in 220ms ease-out;
}

@keyframes nux-fade-in {
  from { opacity: 0; }
  to { opacity: 1; }
}

/* Bônus progressivo: cross-fade nativo em navegadores com suporte
   à View Transitions API para navegação entre documentos. */
@view-transition {
  navigation: auto;
}

#modalBackdrop {
  transition: opacity 160ms ease;
}

#modalCard {
  transition: opacity 160ms ease, transform 160ms ease;
}

@media (prefers-reduced-motion: reduce) {
  body { animation: none !important; }
  #modalBackdrop, #modalCard { transition: none !important; }
  @view-transition { navigation: none; }
}