.radial-progress{--value: 0;--size: 5rem;--thickness: calc(var(--size) / 10);position:relative;display:inline-grid;height:var(--size);width:var(--size);place-content:center;border-radius:50%;background:transparent;vertical-align:middle;box-sizing:content-box}.radial-progress::-moz-progress-bar{appearance:none;background:transparent}.radial-progress::-webkit-progress-value{appearance:none;background:transparent}.radial-progress::-webkit-progress-bar{appearance:none;background:transparent}.radial-progress:before,.radial-progress:after{position:absolute;border-radius:50%;content:""}.radial-progress:before{inset:0;background:radial-gradient(farthest-side,currentColor 98%,transparent) top/var(--thickness) var(--thickness) no-repeat,conic-gradient(currentColor calc(var(--value) * 1%),#e5e7eb calc(var(--value) * 1%) 100%);-webkit-mask:radial-gradient(farthest-side,transparent calc(99% - var(--thickness)),#000 calc(100% - var(--thickness)));mask:radial-gradient(farthest-side,transparent calc(99% - var(--thickness)),#000 calc(100% - var(--thickness)))}.radial-progress:after{inset:calc(50% - var(--thickness) / 2);transform:rotate(calc(var(--value) * 3.6deg - 90deg)) translate(calc(var(--size) / 2 - 50%));background:currentColor;width:var(--thickness);height:var(--thickness)}