.ds-progress{--progress-bar-size:var(--spacing-0_5);--progress-bar-color:var(--color-feedback-success);--progress-bar-color-foreground:var(--color-surface-secondary);align-items:center;display:inline-flex;gap:var(--spacing-stack-xsm);width:100%}.ds-progress--bar .ds-progress__track{background-color:var(--progress-bar-color-foreground);height:var(--progress-bar-size);overflow:hidden;width:100%}.ds-progress__fill{background-color:var(--progress-bar-color);height:100%;transition:width var(--transition-base)}.ds-progress--sm.ds-progress--bar .ds-progress__track{height:calc(var(--progress-bar-size)/2)}.ds-progress--sm .ds-progress__value{font-size:var(--font-size-base)}.ds-progress-circle{--stroke-width:4;--circumference:282.743;align-items:center;box-sizing:border-box;display:inline-flex;flex-direction:column;gap:var(--spacing-stack-xsm);width:100%}.ds-progress-circle__percent{aspect-ratio:1/1;box-sizing:border-box;position:relative;width:100%}.ds-progress-circle__percent svg{display:block;height:100%;transform:rotate(-90deg);width:100%}.ds-progress-circle__percent svg circle{fill:none}.ds-progress-circle__percent svg circle:first-child{stroke:var(--progress-bar-color-foreground);stroke-width:var(--stroke-width)}.ds-progress-circle__percent svg circle:last-child{stroke:var(--progress-bar-color);stroke-dasharray:var(--circumference);stroke-dashoffset:calc(var(--circumference) - (var(--circumference)*var(--percent))/100);stroke-width:var(--stroke-width);transition:stroke-dashoffset var(--transition-base)}.ds-progress-circle__value{align-items:center;display:flex;inset:0;justify-content:center;position:absolute}.ds-progress__value{color:var(--color-text-body);font-family:var(--font-brand);font-size:var(--font-size-brand-display-number-l);font-weight:var(--font-weight-medium)}.ds-progress-circle__value .ds-progress__value{font-size:var(--font-size-5xl);font-weight:var(--font-weight-thin)}.ds-progress--sm.ds-progress-circle{max-width:5rem}.ds-progress--md.ds-progress-circle{height:7.5rem;width:7.5rem}.ds-progress--lg.ds-progress-circle{width:100%}.ds-progress--sm.ds-progress-circle .ds-progress__value{font-size:var(--font-size-brand-display-number-xs);font-weight:var(--font-weight-medium)}