@property --value{syntax:"<number>";inherits:true;initial-value:0}@property --value-now{syntax:"<number>";inherits:true;initial-value:0}@property --min{syntax:"<number>";inherits:true;initial-value:0}@property --max{syntax:"<number>";inherits:true;initial-value:100}@property --value-max{syntax:"<number>";inherits:true;initial-value:100}@property --animation-delay{syntax:"<number>";inherits:true;initial-value:0}@scope(.instui-progress-circle){&{--value:var(--value-now);--min:0;--max:var(--value-max);--animation-delay:0;--pantoken-pc-fill:var(--instui-component-progress-circle-meter-color-brand);--pantoken-pc-track:var(--instui-component-progress-circle-track-color);--pantoken-pc-stroke:var(--instui-component-progress-circle-medium-stroke-width);width:var(--instui-component-progress-circle-medium-size);height:var(--instui-component-progress-circle-medium-size);color:var(--instui-component-progress-circle-color);font-family:var(--instui-component-progress-circle-font-family);font-weight:var(--instui-component-progress-circle-font-weight);line-height:var(--instui-component-progress-circle-line-height);justify-content:center;align-items:center;transition:--value 1s;display:inline-flex;position:relative}&:before{content:"";background:conic-gradient(var(--pantoken-pc-fill) clamp(0%, calc((var(--value) - var(--min)) / (var(--max) - var(--min)) * 100%), 100%), var(--pantoken-pc-track) 0);-webkit-mask:radial-gradient(farthest-side, #0000 calc(100% - var(--pantoken-pc-stroke)), #000 0);mask:radial-gradient(farthest-side, #0000 calc(100% - var(--pantoken-pc-stroke)), #000 0);border-radius:50%;transition:opacity .5s .2s,transform .5s;position:absolute;inset:0;transform:translate(0)scale(1)}& .value{z-index:1;justify-content:center;align-items:center;display:flex;position:relative}&.-size-xs{width:var(--instui-component-progress-circle-x-small-size);height:var(--instui-component-progress-circle-x-small-size);--pantoken-pc-stroke:var(--instui-component-progress-circle-x-small-stroke-width)}&.-size-sm{width:var(--instui-component-progress-circle-small-size);height:var(--instui-component-progress-circle-small-size);--pantoken-pc-stroke:var(--instui-component-progress-circle-small-stroke-width)}&.-size-md{width:var(--instui-component-progress-circle-medium-size);height:var(--instui-component-progress-circle-medium-size);--pantoken-pc-stroke:var(--instui-component-progress-circle-medium-stroke-width)}&.-size-lg{width:var(--instui-component-progress-circle-large-size);height:var(--instui-component-progress-circle-large-size);--pantoken-pc-stroke:var(--instui-component-progress-circle-large-stroke-width)}&:is(.-color-brand,.-meter-color-brand){--pantoken-pc-fill:var(--instui-component-progress-circle-meter-color-brand)}&.-color-primary-inverse:is(.-color-brand,.-meter-color-brand){--pantoken-pc-fill:var(--instui-component-progress-circle-meter-color-brand-inverse)}&:is(.-color-info,.-meter-color-info){--pantoken-pc-fill:var(--instui-component-progress-circle-meter-color-info)}&.-color-primary-inverse:is(.-color-info,.-meter-color-info){--pantoken-pc-fill:var(--instui-component-progress-circle-meter-color-info-inverse)}&:is(.-color-success,.-meter-color-success){--pantoken-pc-fill:var(--instui-component-progress-circle-meter-color-success)}&.-color-primary-inverse:is(.-color-success,.-meter-color-success){--pantoken-pc-fill:var(--instui-component-progress-circle-meter-color-success-inverse)}&:is(.-color-warning,.-meter-color-warning,.-meter-color-alert){--pantoken-pc-fill:var(--instui-component-progress-circle-meter-color-warning)}&.-color-primary-inverse:is(.-color-warning,.-meter-color-warning,.-meter-color-alert){--pantoken-pc-fill:var(--instui-component-progress-circle-meter-color-warning-inverse)}&:is(.-color-danger,.-meter-color-danger){--pantoken-pc-fill:var(--instui-component-progress-circle-meter-color-danger)}&.-color-primary-inverse:is(.-color-danger,.-meter-color-danger){--pantoken-pc-fill:var(--instui-component-progress-circle-meter-color-danger-inverse)}&.-color-primary-inverse{--pantoken-pc-fill:var(--instui-component-progress-circle-meter-color-brand-inverse);--pantoken-pc-track:var(--instui-component-progress-circle-track-color-inverse);color:var(--instui-component-progress-circle-color-inverse)}@keyframes pantoken-progress-circle-indeterminate{to{transform:rotate(1turn)}}&:indeterminate{--value:25;--min:0;--max:100}&:indeterminate:before{animation:1s linear infinite pantoken-progress-circle-indeterminate}&:indeterminate .value{visibility:hidden}&>.value{transition:opacity .5s 1s,transform .5s 1s;transform:translate(0)}&:is(.-should-animate,.-should-animate-on-mount,.-shold-animate-on-mount){--value:0!important}&:is(.-should-animate,.-should-animate-on-mount,.-shold-animate-on-mount):before{opacity:0;transform:translate(0)scale(.75)}&:is(.-should-animate,.-should-animate-on-mount,.-shold-animate-on-mount)>.value{opacity:0;transform:translateY(10%)}&.-size-x-small{width:var(--instui-component-progress-circle-x-small-size);height:var(--instui-component-progress-circle-x-small-size);--pantoken-pc-stroke:var(--instui-component-progress-circle-x-small-stroke-width)}&.-size-small{width:var(--instui-component-progress-circle-small-size);height:var(--instui-component-progress-circle-small-size);--pantoken-pc-stroke:var(--instui-component-progress-circle-small-stroke-width)}&.-size-medium{width:var(--instui-component-progress-circle-medium-size);height:var(--instui-component-progress-circle-medium-size);--pantoken-pc-stroke:var(--instui-component-progress-circle-medium-stroke-width)}&.-size-large{width:var(--instui-component-progress-circle-large-size);height:var(--instui-component-progress-circle-large-size);--pantoken-pc-stroke:var(--instui-component-progress-circle-large-stroke-width)}}
