/* The navigation holds its place while the next page settles in. */
@view-transition{navigation:auto}
.modern-nav{view-transition-name:site-navigation}
::view-transition-old(root){animation:site-page-out .18s ease both}
::view-transition-new(root){animation:site-page-in .36s cubic-bezier(.22,.61,.36,1) both}
::view-transition-group(site-navigation){animation-duration:.36s;animation-timing-function:cubic-bezier(.22,.61,.36,1)}
::view-transition-old(site-navigation),::view-transition-new(site-navigation){mix-blend-mode:normal}
@keyframes site-page-out{to{opacity:0}}
@keyframes site-page-in{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:translateY(0)}}
@media(prefers-reduced-motion:reduce){
 @view-transition{navigation:none}
 ::view-transition-old(root),::view-transition-new(root),::view-transition-group(site-navigation){animation:none}
}