/* One page transition, not concurrent root + main geometry animations. */
@view-transition { navigation: auto; }
html.site-motion-enabled main,
html.site-motion-enabled main [style*="view-transition-name"] {
  view-transition-name: none !important;
}
html.site-native-transition .site-header { view-transition-name: site-header; }
html.site-native-transition.site-aft-transition .catalog-directions { view-transition-name: site-directions; }
html.site-native-transition::view-transition-group(*) { animation: none !important; }
html.site-native-transition::view-transition-old(root) {
  animation: site-page-out 560ms cubic-bezier(0.22, 0.61, 0.36, 1) both !important;
}
html.site-native-transition::view-transition-new(root) {
  animation: site-page-in 560ms cubic-bezier(0.22, 0.61, 0.36, 1) both !important;
}
/* The same specificity as the earlier restoring-return reset, loaded later:
   restore scroll silently, but do not disable the page crossfade on Back. */
html.site-native-transition::view-transition-old(site-header),
html.site-native-transition::view-transition-old(site-directions) { animation: none !important; opacity: 0; }
html.site-native-transition::view-transition-new(site-header),
html.site-native-transition::view-transition-new(site-directions) { animation: none !important; opacity: 1; }
@keyframes site-page-out { from { opacity: 1; } to { opacity: 0; } }
@keyframes site-page-in { from { opacity: 0; } to { opacity: 1; } }
@media (prefers-reduced-motion: reduce) {
  @view-transition { navigation: none; }
  html.site-native-transition::view-transition-old(*),
  html.site-native-transition::view-transition-new(*) { animation: none !important; }
}