.pattern-preview.progress-preview{--progress-track:rgba(148,163,184,0.22);--progress-fill:linear-gradient(90deg,rgba(103,232,249,0.92),rgba(167,139,250,0.95));--progress-height:12px;--progress-stripe-duration:1.4s;display:grid;align-content:center;grid-gap:10px;gap:10px;padding:18px;height:180px;overflow:hidden;isolation:isolate}.pattern-preview.progress-preview.pattern-preview--inspector{height:auto;min-height:220px;padding:28px;gap:14px}.progress-preview__label{display:flex;justify-content:space-between;font-size:12px;color:var(--muted,rgba(148,163,184,.85));font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}.progress-bar{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}.progress-skin{position:relative;width:100%;height:var(--progress-height);border-radius:999px;background:var(--progress-track);overflow:hidden}.progress-skin__fill{position:absolute;inset:0;height:100%;border-radius:inherit;background:var(--progress-fill);background-size:30px 30px;transform:scaleX(0);transform-origin:left center;animation:progressFillSweep var(--progress-cycle-duration,2.8s) ease-in-out infinite}.progress-variant--gradient .progress-skin__fill,.progress-variant--rainbow .progress-skin__fill{background-size:100% 100%}.progress-variant--striped .progress-skin__fill{animation:progressFillSweep var(--progress-cycle-duration,2.8s) ease-in-out infinite,progressStripeScroll var(--progress-stripe-duration) linear infinite}@keyframes progressFillSweep{0%{transform:scaleX(0)}70%,90%{transform:scaleX(var(--progress-target,1))}to{transform:scaleX(0)}}@keyframes progressStripeScroll{0%{background-position:0 0}to{background-position:60px 0}}@media (prefers-reduced-motion:reduce){.progress-skin__fill,.progress-variant--striped .progress-skin__fill{animation:none;transform:scaleX(var(--progress-target,1))}}