@view-transition {
  navigation: auto;
}

::view-transition-old(root) {
  animation: 90ms ease-in both arshin-native-slide-out;
}

::view-transition-new(root) {
  animation: 120ms ease-out both arshin-native-slide-in;
}

@keyframes arshin-native-slide-out {
  to { opacity: 0; transform: translateY(-6px); }
}

@keyframes arshin-native-slide-in {
  from { opacity: 0; transform: translateY(6px); }
}

@media (prefers-reduced-motion: reduce) {
  ::view-transition-old(root),
  ::view-transition-new(root) { animation-duration: 0.01ms; }
}