.halo-progress{--halo-progress-value:60%;--halo-progress-color:#6366f1;--halo-progress-label-color:#fff;--halo-progress-percent-color:#fff;--halo-progress-height:36px;--halo-progress-speed:1.2s;box-sizing:border-box;width:100%;margin:1.25em 0}.halo-progress__track{position:relative;box-sizing:border-box;height:var(--halo-progress-height);overflow:hidden;border:3px solid var(--halo-progress-color);border-radius:999px;background:color-mix(in srgb,var(--halo-progress-color) 9%,transparent)}.halo-progress__fill{position:absolute;inset:3px auto 3px 3px;width:calc(var(--halo-progress-value) - 6px);min-width:0;max-width:calc(100% - 6px);overflow:hidden;border-radius:999px;background-color:var(--halo-progress-color);background-image:linear-gradient(135deg,rgb(255 255 255 / 30%) 25%,transparent 25%,transparent 50%,rgb(255 255 255 / 30%) 50%,rgb(255 255 255 / 30%) 75%,transparent 75%,transparent);background-size:32px 32px;animation:halo-progress-stripes var(--halo-progress-speed) linear infinite}.halo-progress__content{position:absolute;inset:0;z-index:1;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:0 14px;color:#fff;font-size:clamp(12px,calc(var(--halo-progress-height) * .38),18px);font-weight:700;line-height:1;text-shadow:0 1px 2px rgb(0 0 0 / 55%);pointer-events:none}.halo-progress__label{overflow:hidden;color:var(--halo-progress-label-color);text-overflow:ellipsis;white-space:nowrap}.halo-progress__percent{flex:none;color:var(--halo-progress-percent-color);font-variant-numeric:tabular-nums}@keyframes halo-progress-stripes{from{background-position:0 0}to{background-position:32px 0}}@media(prefers-reduced-motion:reduce){.halo-progress__fill{animation:none}}