.pie
{
width: 128px;
aspect-ratio: 1;
position: relative;
display: flex;
align-items: center;
justify-content: center;
background-color: white;
border-radius: 100%;
}
.pie:before, .pie:after
{
content: "";
position: absolute;
border-radius: 50%;
inset: 0;
background: conic-gradient(yellow 100%,#0000 0);
-webkit-mask:radial-gradient(farthest-side,#0000 calc(99% - var(--b)),#000 calc(100% - var(--b)));
mask:radial-gradient(farthest-side,#0000 calc(99% - var(--b)),#000 calc(100% - var(--b)));
}
.pie:before {background: conic-gradient(yellow 100%,#0000 0);}
.pie:after {background: conic-gradient(#ff6400 calc(var(--p)*1%),#0000 0); z-index: 10;}
echo "<div class='pie' style='--p:60;--b:12px;'>60%</div>";