#main{view-transition-name:blackbook-main}
@keyframes bb-arrive{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:translateY(0)}}
@keyframes bb-view-out{to{opacity:0;transform:translateY(-9px)}}
@keyframes bb-view-in{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}
@media(prefers-reduced-motion:no-preference){
 .hub :is(.hub-intro,.hub-section-learn,.hub-feature-grid,.hub-section-resource,.hub-secondary){animation:bb-arrive .65s cubic-bezier(.2,.75,.2,1) both}
 .hub .hub-section-learn{animation-delay:.07s}.hub .hub-feature-grid{animation-delay:.14s}.hub .hub-section-resource{animation-delay:.21s}.hub .hub-secondary{animation-delay:.25s}
 html.bb-booting .hub>*{animation-play-state:paused}
 html.bb-navigating .hub>*{animation:none}
 ::view-transition-old(root),::view-transition-new(root){animation:none;mix-blend-mode:normal}
 ::view-transition-old(blackbook-main){animation:bb-view-out .19s ease both}
 ::view-transition-new(blackbook-main){animation:bb-view-in .4s cubic-bezier(.2,.75,.2,1) both}
 .hub :is(.hub-card,.hub-feature,.hub-compact):active{transform:perspective(1300px) scale(.99);transition-duration:.12s}
}
@media(prefers-reduced-motion:reduce){::view-transition-group(*),::view-transition-old(*),::view-transition-new(*){animation:none!important}}
