Mini Progress Bar

Create a stack of mini progress bars. A card with 3 task rows. Each row: a monospace label and percentage on top, and a slim 5px progress track (rounded, hairline background) below. The fills animate from 0 to their values over 1.1s with easing cubic-bezier(0.22, 1, 0.36, 1), starting one after another (0.3s apart) so the card reads top to bottom. Fills use a subtle left-to-right accent gradient; a task at 100% switches to solid accent and earns a small check icon that fades in next to its percentage about a second after its bar starts. Keep the percentage labels in the muted color, with the completed row's percentage in the accent color. Accessibility: each track uses role="progressbar" with aria-valuenow/min/max and an aria-label naming the task. If prefers-reduced-motion is set, render all bars at their final widths immediately. Trigger the fills when the card enters the viewport. Build the component, not this demo of it. - Ambient motion that IS the component may loop: a drifting background, a marquee, a spinner while something is genuinely loading. - Do not add any timer, interval, loop or script that performs a person's action by itself. No auto-hover, no auto-click, no cycling through states, no pretend submitting, no replaying the interaction on a schedule. - Every state that answers a person waits for a real event from that person. - Placeholder copy and sample content are welcome. Simulated behaviour is not.