/* ═══════════════════════════════════════════════════════════════════
   transitions.css — Cross-page View Transitions (Chromium-only native)
   -------------------------------------------------------------------
   Opts into multi-page View Transitions for same-origin navigation.
   Root-level fade in/out (0.35s, v1.4-BRIEF easing). Respects
   prefers-reduced-motion by disabling the transition entirely.
   Non-supporting browsers (Firefox/Safari) ignore these rules and
   show a hard cut — no JS, no fallback, no bfcache risk.
   ═══════════════════════════════════════════════════════════════════ */

/* Enable multi-page view transitions for same-origin navigation */
@view-transition {
  navigation: auto;
}

/* Root-level old/new view pseudos — fade cross-dissolve */
::view-transition-old(root),
::view-transition-new(root) {
  animation-duration: 0.35s;
  animation-timing-function: cubic-bezier(0.2, 0.7, 0.2, 1);
  animation-fill-mode: both;
  mix-blend-mode: normal;
}

::view-transition-old(root) {
  animation-name: vt-fade-out;
}

::view-transition-new(root) {
  animation-name: vt-fade-in;
}

@keyframes vt-fade-out {
  from { opacity: 1; }
  to   { opacity: 0; }
}

@keyframes vt-fade-in {
  from { opacity: 0; }
  to   { opacity: 1; }
}

/* Respect prefers-reduced-motion — disable navigation transitions entirely.
   Browser falls back to instant navigation (no JS, no flicker). */
@media (prefers-reduced-motion: reduce) {
  @view-transition {
    navigation: none;
  }
}