/* Keep navigation native: URLs, forms, downloads and browser history are unchanged. */
@media (prefers-reduced-motion: no-preference) {
    @view-transition { navigation: auto; }
    main { view-transition-name: app-content; }
    ::view-transition-group(root), ::view-transition-group(app-content) { animation: none; }
    ::view-transition-old(root) { animation: none; display: none; }
    ::view-transition-new(root) { animation: none; }
    ::view-transition-old(app-content) { animation: app-page-out 140ms ease-out both; }
    ::view-transition-new(app-content) { animation: app-page-in 200ms ease-out both; }
    .navigation-fallback main { animation: app-page-in 180ms ease-out; }
}
@keyframes app-page-in { from { opacity: 0; } to { opacity: 1; } }
@keyframes app-page-out { from { opacity: 1; } to { opacity: 0; } }
@media (prefers-reduced-motion: reduce) {
    @view-transition { navigation: none; }
    main { view-transition-name: none; }
    ::view-transition-group(*), ::view-transition-old(*), ::view-transition-new(*) { animation: none !important; }
}
@media print { main { view-transition-name: none; animation: none !important; } }
