.loader{width:220px;height:220px;border-radius:50%;position:relative;border:5px solid transparent;box-shadow:5px 5px 5px rgb(12,12,12),inset 5px 5px 5px rgb(24,23,23),inset -1px -1px 10px rgba(153,148,148,.432),-1px -1px 10px rgba(206,198,198,.281)}.loader:before{content:"";width:180px;height:180px;transform:translate(-50%,-50%);box-shadow:5px 5px 20px black,-2px -2px 40px black;background:repeating-conic-gradient(rgb(61,59,59) 0,rgba(248,248,246,.534) 15%,rgb(54,52,52) 33.33%)}.ball,.loader:before{display:inline-block;position:absolute;border-radius:50%;top:50%;left:50%}.ball{width:15px;height:15px;background:radial-gradient(circle at 5px 5px,rgb(255,255,255) 1%,rgb(5,5,5) 50%);transform:translate(-50%,-50%) translateX(97.5px);animation:rotate 5s calc(var(--delay) * .2s) infinite linear}@keyframes rotate{0%{transform:translate(-50%,-50%) rotate(0deg) translateX(97.5px)}to{transform:translate(-50%,-50%) rotate(1turn) translateX(97.5px)}}