@property --chart-value{syntax:"<percentage>";inherits:true;initial-value:0}.chart{transition:--chart-value .5s}.chart:before{background:conic-gradient(#f4f3f9 12%,var(--chart-color) 12%,var(--chart-color) calc(var(--chart-value)*.76 + 12%),#f4f3f9 0);transition:inherit}.chart:after,.chart:before{border-radius:50%;content:" ";height:100%;left:0;position:absolute;top:0;transform:rotate(180deg);width:100%}.chart:after{background:conic-gradient(#fff 12%,hsla(0,0%,100%,0) 12%,hsla(0,0%,100%,0) 88%,#fff 0)}.spin{animation:spin 1s linear infinite}@keyframes spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}