.page-loader{position:fixed;inset:0 0 auto;height:2px;z-index:1000;pointer-events:none;overflow:hidden;background:#ffffff0c;opacity:1;transition:opacity .18s ease}
.page-loader[hidden]{display:none}.page-loader.is-finished{opacity:0}.page-loader::before{content:'';display:block;width:35%;height:100%;background:#eee;animation:page-progress 1.2s ease-in-out infinite}
@keyframes page-progress{from{transform:translateX(-110%)}to{transform:translateX(400%)}}
img[data-load-state=pending]{opacity:0}img[data-load-state=ready]{opacity:1;animation:image-appear .25s ease} @keyframes image-appear{from{opacity:0}to{opacity:1}}
.generated-device,.phone,.desktop-screen{position:relative}.image-loading-spinner{position:absolute;left:50%;top:50%;width:18px;height:18px;margin:-9px;pointer-events:none;border:1px solid #ffffff26;border-top-color:#eee;border-radius:50%;animation:loading-turn 1s linear infinite;z-index:2}
.product-demo[aria-busy=true] .demo-placeholder::before{content:'';display:block;width:20px;height:20px;border:1px solid #ffffff26;border-top-color:#ddd;border-radius:50%;animation:loading-turn 1s linear infinite}
.product-demo[aria-busy=true] .demo-placeholder::before{margin:0 auto 18px}.image-loading-spinner[hidden]{display:none}
@keyframes loading-turn{to{transform:rotate(360deg)}}
@media(prefers-reduced-motion:reduce){.page-loader::before,.image-loading-spinner,.product-demo[aria-busy=true] .demo-placeholder::before{animation:none}.page-loader{transition:none}img[data-load-state=ready]{animation:none;transition:none}}
