.components-element-progressCircle{--value:62;--gap:60;--thickness:16px;--track:var(--theme-root-colors-paperBackground);--grad-start:var(--theme-root-colors-secondary);--grad-end:var(--theme-root-colors-primary);--span:calc(360deg - (var(--gap) * 1deg));--start:calc(180deg + (var(--gap) * 0.5deg));--end:calc(180deg - (var(--gap) * 0.5deg));--pdeg:calc((var(--value) / 100) * var(--span));--R:calc((var(--size) / 2) - (var(--thickness) / 2));position:relative;inline-size:var(--size);block-size:var(--size);border-radius:50%;display:grid;place-items:center;color:#0b1220;isolation:isolate}.components-element-progressCircle:after,.components-element-progressCircle:before{content:"";position:absolute;inset:0;border-radius:50%}.components-element-progressCircle:before{background:conic-gradient(from var(--start),var(--track) 0 var(--span),transparent 0 1turn);z-index:0}.components-element-progressCircle:after{background:conic-gradient(from var(--start),var(--grad-start) 0deg,var(--grad-end) var(--pdeg),transparent 0 1turn);z-index:1}.components-element-progressCircle>.progress-cap,.components-element-progressCircle>.track-cap{inline-size:var(--thickness);block-size:var(--thickness);position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);border-radius:20px;z-index:1}.components-element-progressCircle>.track-cap{background:var(--track)}.components-element-progressCircle>.track-cap.start{transform:translate(-50%,-50%) rotate(var(--start)) translateY(calc(-1 * var(--R)))}.components-element-progressCircle>.track-cap.end{transform:translate(-50%,-50%) rotate(var(--end)) translateY(calc(-1 * var(--R)))}.components-element-progressCircle>.progress-cap.start{background:var(--grad-start);transform:translate(-50%,-50%) rotate(var(--start)) translateY(calc(-1 * var(--R)))}.components-element-progressCircle>.progress-cap.end{background:var(--grad-end);transform:translate(-50%,-50%) rotate(calc(var(--start) + var(--pdeg))) translateY(calc(-1 * var(--R)))}.components-element-progressCircle[data-value="0"]>.progress-cap{display:none}.components-element-progressCircle>.hole{position:absolute;inset:calc(var(--thickness) - 1px);border-radius:50%;background:var(--theme-root-colors-paperBackground);z-index:2}.components-element-progressCircle>.hole>div{background:var(--hole-background);width:100%;height:100%;inset:calc(var(--thickness) - 1px);border-radius:50%}.components-element-progressCircle>.label{position:relative;z-index:3;font-weight:600;font-size:.95rem;color:var(--theme-box-colors-text)}