Delete and Replace Text

【対象要素】
- サイト内のテキスト1箇所（見出し・キャッチコピー・リード文等）に適用する

【演出内容】
- 最初に別の語が表示されていて、それが1文字ずつ後ろから消され、続けて本来の語が打ち込まれる
- 「言い直す」動きになるので、対比を見せたいコピーに向く

【品質要件】
- 消す速度は打つ速度より速くする（消す45ms／打つ60ms程度）
- 消し終わりと打ち始めの間に、ごく短い間を置く
- prefers-reduced-motion 時は演出を無効化し、最初から完成した状態で表示する
- 演出中も文字が判読できなくなる時間を作らない。レイアウトを揺らさない

[Target element]
- Apply to one piece of text on your site (a heading, a tagline, a lead paragraph, etc.)

[Motion]
- A different word is shown first, deleted one character at a time from the end, and then the intended word is typed in
- The "correcting itself" motion suits copy built on a contrast

[Quality requirements]
- Delete faster than you type (about 45ms deleting, 60ms typing)
- Leave a very short pause between finishing the deletion and starting to type
- When prefers-reduced-motion is set, disable the animation and show the finished state from the start
- Never let the text become unreadable during the animation, and never shift the surrounding layout