.loader{box-sizing:border-box;border:5px solid;border-color:var(--color-gr-5)var(--color-gr-5)transparent transparent;border-radius:50%;width:150px;height:150px;animation:2s linear infinite rotation;display:inline-block;position:relative}.loader:after,.loader:before{transform-origin:50%;box-sizing:border-box;border:4px solid;border-color:transparent transparent var(--color-gr-3)var(--color-gr-3);content:"";border-radius:50%;width:130px;height:130px;margin:auto;animation:.7s linear infinite rotationBack;position:absolute;inset:0}.loader:before{border-color:var(--color-gr-6)var(--color-gr-6)transparent transparent;width:110px;height:110px;animation:1.5s linear infinite rotation}@keyframes rotation{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes rotationBack{0%{transform:rotate(0)}to{transform:rotate(-360deg)}}.spinner{background:linear-gradient(0deg,var(--color-gr-3)30%,var(--color-gr-4)0 70%,var(--color-gr-2)0)50%/8% 100%,linear-gradient(90deg,var(--color-gr-3)30%,var(--color-gr-4)0 70%,var(--color-gr-2)0)50%/100% 8%;aspect-ratio:1;background-repeat:no-repeat;border-radius:50%;width:30px;animation:1s steps(12,end) infinite l23;display:grid}.spinner:before,.spinner:after{opacity:.915;background:inherit;content:"";border-radius:50%;grid-area:1/1;transform:rotate(30deg)}.spinner:after{opacity:.83;transform:rotate(60deg)}@keyframes l23{to{transform:rotate(1turn)}}