.loader{width:48px;height:48px;display:inline-block;position:relative}.loader:before{top:-24px;animation:animloader1 2s linear infinite alternate}.loader:after,.loader:before{content:"";box-sizing:border-box;width:24px;height:24px;position:absolute;left:0}.loader:after{top:0;background:var(--spinner-white);box-shadow:0 0 10px var(--spinner-shadow);animation:animloader2 2s linear infinite alternate}@keyframes animloader1{0%,32%{box-shadow:0 24px white,24px 24px color-mix(in srgb,var(--spinner-white) 0%,transparent),24px 48px color-mix(in srgb,var(--spinner-white) 0%,transparent),0 48px color-mix(in srgb,var(--spinner-white) 0%,transparent)}33%,65%{box-shadow:0 24px white,24px 24px white,24px 48px color-mix(in srgb,var(--spinner-white) 0%,transparent),0 48px color-mix(in srgb,var(--spinner-white) 0%,transparent)}66%,99%{box-shadow:0 24px white,24px 24px white,24px 48px white,0 48px color-mix(in srgb,var(--spinner-white) 0%,transparent)}to{box-shadow:0 24px white,24px 24px white,24px 48px white,0 48px white}}@keyframes animloader2{0%{transform:translate(0) rotateX(0) rotateY(0)}33%{transform:translate(100%) rotateX(0) rotateY(180deg)}66%{transform:translate(100%,100%) rotateX(-180deg) rotateY(180deg)}to{transform:translateY(100%) rotateX(-180deg) rotateY(1turn)}}