.pss-bar,.pss-rad{background-color:#def;--pss-color:#123}.pss-bar{width:200px;border-radius:5rem;position:relative;--pss-fill:50%;background-image:linear-gradient(to right,var(--pss-color) var(--pss-fill),transparent var(--pss-fill))}.pss-bar:after{color:#def;content:attr(data-pss);display:inline-block;position:absolute;top:0;left:calc(100% + .8rem);height:100%;display:flex;align-items:center}.pss-rad{width:140px;height:140px;border-radius:50%;--pss-fill:65%;--pss-center:transparent;background-image:radial-gradient(circle,var(--pss-center) calc(72% - 1rem),transparent 0),conic-gradient(transparent calc(100% - var(--pss-fill)),var(--pss-color) 0);mask:radial-gradient(circle,var(--pss-center) calc(72% - 1rem),#000 0)}