/* Brainify progress bar. One component, three states: known progress, unknown length, and no measurable progress. */
.bf-progress{--bf-teal:#05786E;--bf-ink:#12100D;--bf-muted:rgba(18,16,13,.58);--bf-track:rgba(18,16,13,.10);--bf-rib:rgba(255,255,255,.13);
  font:400 14px/1.4 Inter,system-ui,sans-serif;color:var(--bf-ink);width:100%}
.bf-progress.bf-dark{--bf-teal:#2FB3A6;--bf-ink:#F6F4F0;--bf-muted:rgba(246,244,240,.62);--bf-track:rgba(246,244,240,.14);--bf-rib:rgba(18,16,13,.15)}
.bf-progress__track{position:relative;height:6px;border-radius:3px;background:var(--bf-track);overflow:hidden}
.bf-progress__fill{position:absolute;inset:0 auto 0 0;width:0;border-radius:3px;background-color:var(--bf-teal);
  /* ribbing: the script moves it backwards, against the direction of the fill */
  background-image:repeating-linear-gradient(115deg,var(--bf-rib) 0 5px,transparent 5px 14px);background-size:200% 100%;
  transition:background-color .3s}
.bf-progress__meta{display:flex;justify-content:space-between;gap:16px;margin-top:10px}
.bf-progress__label{color:var(--bf-ink);min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.bf-progress__pct{color:var(--bf-muted);font-variant-numeric:tabular-nums;flex:none}
.bf-progress.is-indeterminate .bf-progress__fill{width:32%;animation:bf-progress-slide 1.5s cubic-bezier(.45,0,.25,1) infinite}
.bf-progress.is-indeterminate .bf-progress__pct{visibility:hidden}
.bf-progress.is-done .bf-progress__fill{background-image:none}
.bf-progress.is-done .bf-progress__pct{color:var(--bf-teal);font-weight:500}
@keyframes bf-progress-slide{from{left:-32%}to{left:100%}}
@media (prefers-reduced-motion:reduce){.bf-progress__fill{background-image:none}
  .bf-progress.is-indeterminate .bf-progress__fill{animation:none;left:0;width:45%}}