3つのドットが順番に跳ねるローダー。animation-delayをずらすだけで「順番に動く」リズムが生まれます。
プレビュー枠は右下をドラッグすると高さを変えられます
書き換えるとプレビューに即反映されます。変更はこのページ内だけで、リロードすると元に戻ります。
3つのドットは同じアニメーションを共有し、:nth-child()でanimation-delayを0.15秒ずつずらしているだけです。この「同じ動き+時間差」はスタッガー（stagger）と呼ばれ、CSSアニメーションで律動感を出す基本テクニックです。0%と100%を同じ状態にするとループの継ぎ目が見えなくなります。
reduced-motion時は跳ねる動きをやめ、その場で明滅する控えめな表現に差し替えています。