/* page-transition.css - cross-document view transitions, in its own file so the effect can be switched off:
   js/fx.js disables this stylesheet when html[data-fx] lacks "page-transition" or motion is off. */
@view-transition { navigation: auto; }
.site-header { view-transition-name: site-header; }
::view-transition-group(site-header) { animation-duration: 0s; }
::view-transition-old(root) { animation: 160ms var(--ease-out) both vt-out; }
::view-transition-new(root) { animation: 240ms var(--ease-out) both vt-in; }
@keyframes vt-out { to { opacity: 0; } }
@keyframes vt-in { from { opacity: 0; transform: translateY(10px); } }
@media (prefers-reduced-motion: reduce) { @view-transition { navigation: none; } }
