/* Keep the outgoing page opaque until the incoming page covers it. */
@view-transition{navigation:auto}
html{background:#f6f5ef}
::view-transition-group(root){animation-duration:260ms}
::view-transition-image-pair(root){isolation:isolate}
::view-transition-old(root){animation:none;mix-blend-mode:normal}
::view-transition-new(root){animation:page-in 260ms ease-out both;mix-blend-mode:normal}
@keyframes page-in{from{clip-path:inset(0 0 100% 0)}to{clip-path:inset(0)}}
.work-page main{animation:content-in 420ms cubic-bezier(.2,.65,.3,1) both}
@keyframes content-in{from{transform:translateY(10px)}to{transform:none}}
@media(prefers-reduced-motion:reduce){::view-transition-old(root),::view-transition-new(root),.work-page main{animation:none}}
