/* The first paint is black. One measured entrance follows asset readiness. */
:root{--entry-distance:72px;--entry-duration:1800ms;--entry-ease:cubic-bezier(.3,0,.4,1)}
@keyframes page-arrive{
  from{opacity:0;transform:translate3d(0,var(--entry-distance),0)}
  to{opacity:1;transform:translate3d(0,0,0)}
}
@keyframes entry-fade{from{opacity:0}to{opacity:1}}
.entry-photo-pending{opacity:0}
@media(prefers-reduced-motion:no-preference){
  html[data-page-entry="pending"] #main{transform:translate3d(0,var(--entry-distance),0)}
  html[data-page-entry="running"] #main{animation:page-arrive var(--entry-duration) var(--entry-ease) both}
  html[data-page-entry="running"] .site-header,html[data-page-entry="running"] .site-footer{animation:entry-fade 1100ms cubic-bezier(.3,0,.4,1) both}
  .entry-photo-ready{animation:entry-fade 850ms ease-out both}
}
@media(max-width:600px){:root{--entry-distance:52px;--entry-duration:1500ms}}
@media(prefers-reduced-motion:reduce){html[data-page-entry] #main,html[data-page-entry] .site-header,html[data-page-entry] .site-footer{opacity:1!important;transform:none!important;animation:none!important}.entry-photo-ready{animation:none}}
