/* Centered product backdrop dissolves before the original mascot/rings. */
.loader-shell{background:#fbfdff;padding-top:calc(24px + env(safe-area-inset-top));padding-bottom:calc(24px + 5svh + env(safe-area-inset-bottom))}
.loader-phone-backdrop{position:relative;isolation:isolate;width:280px;height:344px;margin:0 0 -177px;transform:translateY(-96px);pointer-events:none;padding-top:14px;mask-image:linear-gradient(to bottom,#000 0%,#000 50%,#000d 65%,transparent calc(100% - 20px));-webkit-mask-image:linear-gradient(to bottom,#000 0%,#000 50%,#000d 65%,transparent calc(100% - 20px))}
.loader-phone-backdrop img{display:block;width:280px;height:auto;max-width:none;transform-origin:50% 25%;filter:drop-shadow(0 9px 15px #0f263617);animation:roadmap-phone-sway 3.2s ease-in-out infinite}
.loader-phone-backdrop:after{content:'';position:absolute;inset:0;z-index:2;background:linear-gradient(to bottom,#fbfdff00 42%,#fbfdff32 65%,#fbfdff calc(100% - 20px))}
.loader-shell .roadmap-build-visual{z-index:3;margin-bottom:10px}
.loader-shell .loader-eyebrow,.loader-shell #loader-title,.loader-shell .loader-status{text-align:center}
.loader-shell #loader-title{display:grid;place-items:center}
.loader-screen[data-ready=true] .loader-phone-backdrop img{animation-play-state:paused}
@keyframes roadmap-phone-sway{0%,100%{transform:translateY(2px) rotate(-2deg)}50%{transform:translateY(-4px) rotate(2deg)}}
@media(max-width:600px){.loader-shell{gap:10px}.loader-phone-backdrop{width:258px;height:326px;margin-bottom:-176px}.loader-phone-backdrop img{width:258px}.loader-shell .roadmap-build-visual{width:148px;height:148px;margin-bottom:8px}.loader-shell #loader-title{font-size:34px}.loader-shell .loader-status{font-size:14px;min-height:3em}.loader-shell .roadmap-build-progress{margin-top:8px}}
@media(max-height:650px){.loader-shell{padding-top:15px;padding-bottom:20px;gap:8px}.loader-phone-backdrop{width:205px;height:222px;margin-bottom:-109px;transform:translateY(-48px)}.loader-phone-backdrop img{width:205px}.loader-shell .roadmap-build-visual{width:116px;height:116px;margin-bottom:3px}.loader-shell #loader-title{font-size:29px}.loader-shell .loader-status{font-size:13px}.loader-shell .roadmap-build-progress{margin-top:5px}}
@media(prefers-reduced-motion:reduce){.loader-phone-backdrop img{animation:none;transform:none}}

/* Keep the phone clear of the top edge on shorter phones. */
@media(min-height:651px) and (max-height:760px){.loader-phone-backdrop{transform:translateY(-35px)}}

@media(max-height:540px){.loader-phone-backdrop{transform:translateY(-16px)}}
