/* ── View Transition animations (View Transitions API) ──────────── */
/* Requires router.js to call the DOM-swap *inside* startViewTransition */

::view-transition-old(root) {
  animation: vt-fade-out var(--av-duration-panel, 220ms) var(--av-easing-out, cubic-bezier(0.16, 1, 0.3, 1)) both;
}

::view-transition-new(root) {
  animation: vt-fade-in var(--av-duration-panel, 220ms) var(--av-easing-out, cubic-bezier(0.16, 1, 0.3, 1)) both;
}

@keyframes vt-fade-out {
  from { opacity: 1; transform: translateY(0); }
  to   { opacity: 0; transform: translateY(-4px); }
}

@keyframes vt-fade-in {
  from { opacity: 0; transform: translateY(5px); }
  to   { opacity: 1; transform: translateY(0); }
}

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