/* Layout and existing motion remain authored by each page. */
.studio-image-wait{visibility:hidden!important}
.studio-image-loading{position:fixed;z-index:2147483000;left:50%;bottom:24px;transform:translateX(-50%);max-width:calc(100vw - 32px);padding:9px 14px;border:1px solid #b8cbd466;background:#102735ed;color:#e7eef2;font:12px/1.5 sans-serif;letter-spacing:.03em;pointer-events:none}
.studio-image-loading[hidden]{display:none!important}

/* Hold image entrances before their first paint, rather than rewinding visible motion. */
@media(prefers-reduced-motion:no-preference){
 html.studio-image-boot :is(.page,.studio-menu-enter,.intro-item,.char-view.active,.version-card,.operator-card,.dupe-card,.ca-card,.ca-version,.reveal):has(img):not([data-studio-image-state="ready"]):not([data-studio-image-state="partial"]),
 html.studio-image-boot .menu-card:not([data-studio-image-state="ready"]):not([data-studio-image-state="partial"]){animation-play-state:paused!important}
 @keyframes studioMenuSlide{from{opacity:0;transform:translate3d(0,10px,0)}to{opacity:1;transform:none}}
 @keyframes charCardSlide{from{opacity:0;transform:translate3d(0,10px,0)}to{opacity:1;transform:none}}
 @keyframes charIn{from{opacity:0;transform:translate3d(0,10px,0)}to{opacity:1;transform:none}}
 @keyframes cardSlideIn{from{opacity:0;transform:translate3d(0,10px,0)}to{opacity:1;transform:none}}
 @keyframes caSlide{from{opacity:0;transform:translate3d(0,10px,0)}to{opacity:1;transform:none}}
 @keyframes caEnter{from{opacity:0;transform:translate3d(0,10px,0)}to{opacity:1;transform:none}}
 @keyframes efEquipmentSlide{from{opacity:0;transform:translate3d(0,10px,0)}to{opacity:1;transform:none}}
 .zzz-slide:not(.zzz-slide-visible){transform:translate3d(0,10px,0)}
 body:is([data-studio-page=genshin],[data-studio-page=wutheringwave]) .studio-menu-enter{animation-duration:1s!important;animation-delay:var(--menu-delay,.08s)!important}
}