@media not (prefers-reduced-motion: reduce) {
  @view-transition {
    navigation: auto;
  }

  ::view-transition-group(root) {
    animation-duration: 200ms;
  }

  ::view-transition-old(root),
  ::view-transition-new(root) {
    animation-timing-function: ease-out;
  }

  ::view-transition-old(.unfold-sidebar),
  ::view-transition-new(.unfold-sidebar),
  ::view-transition-old(.change-list),
  ::view-transition-new(.change-list) {
    animation: none;
  }

  ::view-transition-new(root) {
    opacity: 0;
    animation: fade-in 180ms ease-out forwards;
  }

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