.loader-container{display:inline-flex;justify-content:center;align-items:center;padding:28px 24px 36px;position:relative}.loader-container.scale-75{transform:scale(.45);transform-origin:top center}.loader-container.scale-100{transform:scale(1)}.loader-container.scale-125{transform:scale(1.25)}.loader-container:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 50% 45%,rgba(124,92,255,.35),transparent 55%),radial-gradient(circle at 35% 60%,rgba(35,196,248,.28),transparent 60%),radial-gradient(circle at 65% 40%,rgba(232,121,249,.22),transparent 60%);filter:blur(18px);animation:aura-pulse 4s ease-in-out infinite;z-index:0;pointer-events:none}@keyframes aura-pulse{0%,to{opacity:.75;transform:scale(.95)}50%{opacity:1;transform:scale(1.05)}}.loader{--background:linear-gradient(135deg,#2563eb,#7c3aed 55%,#c026d3);--spine:linear-gradient(180deg,#f5d27a,#e0a93f 50%,#8a5a1a);--shadow:rgba(76,29,149,.35);--text:#6d28d9;--page:hsla(0,0%,100%,.42);--page-fold:hsla(0,0%,100%,.6);--duration:3s;width:200px;height:140px;position:relative;z-index:1}.loader:after,.loader:before{--r:-6deg;content:"";position:absolute;bottom:6px;width:130px;top:82%;box-shadow:0 18px 22px var(--shadow);transform:rotate(var(--r));filter:blur(1px)}.loader:before{left:4px}.loader:after{--r:6deg;right:4px}.loader>div{width:100%;height:100%;border-radius:14px;position:relative;z-index:1;perspective:600px;box-shadow:0 18px 30px var(--shadow),inset 0 0 0 1px hsla(0,0%,100%,.18),inset 0 1px 0 hsla(0,0%,100%,.35);background-image:var(--background);overflow:hidden}.loader>div:before{content:"";position:absolute;left:50%;top:0;bottom:0;width:6px;margin-left:-3px;background:var(--spine);box-shadow:0 0 8px hsla(43,86%,72%,.55),inset 0 0 0 1px rgba(0,0,0,.18);z-index:3;border-radius:1px}.loader>div:after{content:"";position:absolute;inset:0;background:radial-gradient(circle at 20% 15%,hsla(0,0%,100%,.25),transparent 35%),radial-gradient(circle at 80% 90%,rgba(0,0,0,.18),transparent 50%);pointer-events:none;z-index:2}.loader ul{margin:0;padding:0;list-style:none;position:relative}.loader ul li{--r:180deg;--o:0;--c:var(--page);position:absolute;top:10px;left:10px;transform-origin:100% 50%;color:var(--c);opacity:var(--o);transform:rotateY(var(--r));animation:var(--duration) ease infinite;filter:drop-shadow(0 2px 4px rgba(0,0,0,.15))}.loader ul li:nth-child(2){--c:var(--page-fold);animation-name:page-2}.loader ul li:nth-child(3){--c:var(--page-fold);animation-name:page-3}.loader ul li:nth-child(4){--c:var(--page-fold);animation-name:page-4}.loader ul li:nth-child(5){--c:var(--page-fold);animation-name:page-5}.loader ul li svg{width:90px;height:120px;display:block}.loader ul li:first-child{--r:0deg;--o:1}.loader ul li:last-child{--o:1}.loader span{display:block;left:0;right:0;top:100%;margin-top:20px;text-align:center;color:var(--text);font-weight:500;letter-spacing:.02em}.loader-container .sparkle{position:absolute;width:10px;height:10px;pointer-events:none;z-index:2;background:radial-gradient(circle,#fff 0,hsla(0,0%,100%,.9) 30%,transparent 65%);border-radius:50%;filter:drop-shadow(0 0 6px rgba(255,255,255,.9));animation:sparkle-twinkle 2.4s ease-in-out infinite}.loader-container .sparkle:after,.loader-container .sparkle:before{content:"";position:absolute;inset:-2px;background:inherit;border-radius:inherit;transform:rotate(45deg);opacity:.85}.loader-container .sparkle:first-child{top:14%;left:10%;width:8px;height:8px;animation-delay:0s}.loader-container .sparkle:nth-child(2){top:8%;right:14%;width:12px;height:12px;animation-delay:.6s}.loader-container .sparkle:nth-child(3){bottom:26%;left:6%;width:7px;height:7px;animation-delay:1.2s}.loader-container .sparkle:nth-child(4){bottom:18%;right:8%;width:9px;height:9px;animation-delay:1.8s}@keyframes sparkle-twinkle{0%,to{opacity:0;transform:scale(.4)}50%{opacity:1;transform:scale(1)}}@keyframes page-2{0%{transform:rotateY(180deg);opacity:0}20%{opacity:1}35%,to{opacity:0}50%,to{transform:rotateY(0deg)}}@keyframes page-3{15%{transform:rotateY(180deg);opacity:0}35%{opacity:1}50%,to{opacity:0}65%,to{transform:rotateY(0deg)}}@keyframes page-4{30%{transform:rotateY(180deg);opacity:0}50%{opacity:1}65%,to{opacity:0}80%,to{transform:rotateY(0deg)}}@keyframes page-5{45%{transform:rotateY(180deg);opacity:0}65%{opacity:1}80%,to{opacity:0}95%,to{transform:rotateY(0deg)}}