/* Keep a painted page under the next page; never fade the entire view to blank. */
html:root{background:#f7f4ed;color-scheme:light;scroll-behavior:smooth;scroll-padding-top:100px}
@view-transition{navigation:auto}
.header{view-transition-name:site-header}
.header #navigation>.nav-marker{view-transition-name:site-nav-marker}
::view-transition{background:#f7f4ed;pointer-events:none}
::view-transition-old(root){animation:none;opacity:1;mix-blend-mode:normal}
::view-transition-new(root){animation:site-page-reveal .32s ease-out both;mix-blend-mode:normal}
::view-transition-group(site-header),::view-transition-group(site-nav-marker){animation-duration:.46s;animation-timing-function:cubic-bezier(.22,1,.36,1)}
::view-transition-old(site-header),::view-transition-new(site-header),::view-transition-old(site-nav-marker),::view-transition-new(site-nav-marker){animation:none;mix-blend-mode:normal}
::view-transition-old(site-header),::view-transition-old(site-nav-marker){opacity:0}
::view-transition-new(site-header),::view-transition-new(site-nav-marker){opacity:1;height:100%}
@keyframes site-page-reveal{from{opacity:0}to{opacity:1}}
@media(prefers-reduced-motion:reduce){
 @view-transition{navigation:none}
 html:root{scroll-behavior:auto}
 ::view-transition-group(*),::view-transition-old(*),::view-transition-new(*){animation:none!important}
}
html.motion-paused{scroll-behavior:auto}
