:root {
  --diget-page-fade-duration: 320ms;
  --diget-page-fade-easing: ease-out;
}

@media (prefers-reduced-motion: no-preference) {
  .diget-page-enter {
    animation: diget-page-fade-in var(--diget-page-fade-duration) var(--diget-page-fade-easing);
  }

  html.diget-js .diget-page-enter.diget-page-enter-pending {
    animation: none;
    opacity: 0;
  }

  html.diget-js .diget-page-enter:not(.diget-page-enter-pending) {
    animation: diget-page-fade-in var(--diget-page-fade-duration) var(--diget-page-fade-easing);
  }
}

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