/* site.css · shared by index.html / projects.html / writing.html.

   1. Cross-document crossfade: full navigations (no router, hard load,
      back/forward that bypasses the router) fade gently in Chromium and
      Safari via the View Transitions API. router.js does its own
      DOM-level swap, so it never triggers these.
   2. The router moves focus to the new page's h1 for screen readers;
      suppress the visible ring on that programmatic focus. */

@view-transition { navigation: auto; }

::view-transition-old(root) { animation: r3-vt-out .18s ease-in both; }
::view-transition-new(root) { animation: r3-vt-in .34s cubic-bezier(.2,.7,.2,1) both; }
@keyframes r3-vt-out { to { opacity: 0; } }
@keyframes r3-vt-in  { from { opacity: 0; } }

main.col h1:focus { outline: none; }

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