steps() и @keyframes: ступенчатый прогресс загрузки
Дискретная анимация без SVG.
`animation-timing-function: steps(4, end)` делает индикатор «прыгающим» по четвертям — дешёвый skeleton для многошагового брифа.
В `@keyframes` меняйте `width` или `transform: scaleX` — transform дешевле для композитора.
- steps() — MDN — Ступенчатый easing.
- Using CSS animations — MDN — @keyframes.
Доступность
Не полагайтесь только на анимацию — дублируйте шаг текстом для screen reader.