/* Smooth page-to-page transitions (rollback: git tag rollback-before-page-transition)
   Modern browsers (Chrome, Edge, Safari 18+): native cross-document view transition —
   the old page softly fades/drifts away while the new one fades in, and the menu bar glides between pages as one piece. */
@view-transition { navigation: auto; }
body header:first-of-type{view-transition-name:tz-header}
::view-transition-group(root){animation-duration:.55s;animation-timing-function:cubic-bezier(.2,.7,.2,1)}
::view-transition-old(root){animation:ptOut .32s cubic-bezier(.4,0,1,1) both}
::view-transition-new(root){animation:ptIn .55s cubic-bezier(.2,.7,.2,1) .08s both}
::view-transition-group(tz-header){animation-duration:.55s;animation-timing-function:cubic-bezier(.2,.7,.2,1)}
::view-transition-old(tz-header),::view-transition-new(tz-header){animation-duration:.4s}
@keyframes ptOut{to{opacity:0;transform:translateY(-10px);filter:blur(3px)}}
@keyframes ptIn{from{opacity:0;transform:translateY(16px);filter:blur(3px)}}

/* Fallback for other browsers: fade out before leaving, fade in on arrival */
html.pt-fallback body{animation:ptIn .55s cubic-bezier(.2,.7,.2,1) both}
html.pt-leave body{animation:ptOut .28s cubic-bezier(.4,0,1,1) both!important}

@media(prefers-reduced-motion:reduce){
  ::view-transition-group(*),::view-transition-old(*),::view-transition-new(*){animation:none!important}
  html.pt-fallback body,html.pt-leave body{animation:none!important}
}