.loader-container{width:100%;height:100%;display:flex;justify-content:center;align-items:center}.loader{width:50px;aspect-ratio:1;display:grid}.loader:after,.loader:before{--color:#4a525e;--background:#fbfaf7;content:"";grid-area:1/1;margin:0 0 15px 15px;--c:var(--background) calc(100% / 3),var(--color) 0 calc(2 * 100% / 3),var(--background) 0;--c1:linear-gradient(90deg,var(--c));--c2:linear-gradient(0deg,var(--c));background:var(--c1),var(--c2),var(--c1),var(--c2);background-size:300% 4px,4px 300%;background-repeat:no-repeat;animation:animate 1s linear infinite}.loader:after{margin:15px 15px 0 0;transform:scale(-1)}@keyframes animate{0%{background-position:50% 0,100% 100%,0 100%,0 0}25%{background-position:0 0,100% 50%,0 100%,0 0}50%{background-position:0 0,100% 0,50% 100%,0 0}75%{background-position:0 0,100% 0,100% 100%,0 50%}75.01%{background-position:100% 0,100% 0,100% 100%,0 50%}to{background-position:50% 0,100% 0,100% 100%,0 100%}}