/* Spinner and progress · the kit rules for this component, quoted from phase-2/kit (kit v3) by phase-4/src/build_pack.py.
   Tokens come from ../../styles.css. Build it as: Progress. */
/* base.css */
.spin{width:14px;height:14px;border:2px solid currentColor;border-right-color:transparent;border-radius:50%;display:inline-block;animation:kit-spin var(--motion-spin) var(--ease-linear) infinite}
/* base.css */
@media (prefers-reduced-motion:reduce){.spin{animation-duration:var(--motion-spin-reduced)}}
/* families/status-feedback/family.css */
.sf-bar{height:4px;border-radius:var(--r-pill);background:hsl(var(--muted));overflow:hidden;margin-top:8px;position:relative}
/* families/status-feedback/family.css */
.sf-bar>i{display:block;height:100%;width:var(--v,0%);background:hsl(var(--primary));border-radius:inherit;transition:width var(--motion-sheet-in)}
/* families/status-feedback/family.css */
.sf-bar.ind>i{position:absolute;width:38%;left:0;animation:sf-slide var(--motion-indeterminate) var(--ease-standard) infinite}
/* families/status-feedback/family.css */
.sf-bar.lg{height:8px;margin-top:0}
/* families/status-feedback/family.css */
.sf-bar.ok>i{background:hsl(var(--success))}
/* families/status-feedback/family.css */
.sf-bar.bad>i{background:hsl(var(--destructive))}
/* families/status-feedback/family.css */
.sf-spins{display:flex;flex-wrap:wrap;gap:var(--s-6);align-items:center}
/* families/status-feedback/family.css */
.sf-spins .spin.s12{width:12px;height:12px;border-width:2px}
/* families/status-feedback/family.css */
.sf-spins .spin.s20{width:20px;height:20px}
/* families/status-feedback/family.css */
.sf-spins .spin.s28{width:28px;height:28px;border-width:3px}
/* families/status-feedback/family.css */
.sf-spins .spin{color:hsl(var(--primary))}
/* families/status-feedback/family.css */
.sf-inl{display:inline-flex;align-items:center;gap:var(--s-2);font-size:var(--text-body);color:hsl(var(--muted-foreground))}
/* families/status-feedback/family.css */
.sf-inl .spin{color:hsl(var(--info))}
/* families/status-feedback/family.css */
.sf-prog{display:flex;flex-direction:column;gap:var(--s-2)}
/* families/status-feedback/family.css */
.sf-prog .l{display:flex;justify-content:space-between;gap:var(--s-3);font-size:var(--text-body)}
/* families/status-feedback/family.css */
.sf-prog .l b{font:var(--w-semibold) var(--text-card)/1.3 var(--font-voice);font-stretch:var(--font-stretch-title)}
/* families/status-feedback/family.css */
.sf-prog .l span{color:hsl(var(--muted-foreground));font-variant-numeric:tabular-nums}
/* families/status-feedback/family.css */
.sf-prog .s{font-size:var(--text-small);color:hsl(var(--muted-foreground))}
/* families/status-feedback/family.css */
.sf-steps{display:flex;flex-direction:column}
/* families/status-feedback/family.css */
.sf-steps li{list-style:none;display:flex;align-items:center;gap:var(--s-3);min-height:40px;border-bottom:1px solid hsl(var(--border));font-size:var(--text-body)}
/* families/status-feedback/family.css */
.sf-steps li:last-child{border-bottom:0}
/* families/status-feedback/family.css */
.sf-steps li .m{width:20px;height:20px;display:grid;place-items:center;flex:none;color:hsl(var(--muted-foreground))}
/* families/status-feedback/family.css */
.sf-steps li.done .m{color:hsl(var(--success))}
/* families/status-feedback/family.css */
.sf-steps li.run{font-weight:var(--w-medium)}
/* families/status-feedback/family.css */
.sf-steps li.run .spin{color:hsl(var(--info));width:14px;height:14px}
/* families/status-feedback/family.css */
.sf-steps li.wait{color:hsl(var(--muted-foreground))}
/* families/status-feedback/family.css */
.sf-steps li.wait .m::before{content:"";width:8px;height:8px;border-radius:50%;border:1.5px solid hsl(var(--secondary-border))}
/* families/status-feedback/family.css */
.sf-steps li .tm{margin-left:auto;font:var(--w-regular) var(--text-micro)/1 var(--font-code);color:hsl(var(--muted-foreground))}
/* families/status-feedback/family.css */
.sf-topload{height:2px;background:hsl(var(--info)/.14);position:relative;overflow:hidden}
/* families/status-feedback/family.css */
.sf-topload i{position:absolute;inset:0 auto 0 0;width:34%;background:hsl(var(--info));animation:sf-slide var(--motion-indeterminate) var(--ease-standard) infinite}