Glare Follow Button

【対象要素】
- サイト内のボタン1点（CTA・リンクボタン・フォームの送信ボタン等）に適用する

【演出内容】
- ホバー中、ポインタの位置に合わせて淡いハイライトがボタン表面を滑る
- 光沢のある面をなぞっているように見せ、ポインタが止まれば光も止まる

【品質要件】
- ハイライトは白の淡い円形グラデーションで、輪郭を作らない
- 表示・非表示のフェードは0.3秒前後。移動そのものは遅延なくポインタへ追従させる
- 光はボタンの角丸の内側に収める
- prefers-reduced-motion 時は演出を無効化し、状態変化だけが分かる静的表示にフォールバックする
- ラベルの可読性を落とさない。文字が読めなくなる瞬間を作らない

[Target element]
- Apply to a single button on your site (a CTA, a link button, a form submit button, etc.)

[Motion]
- While hovered, a soft highlight glides across the button surface, tracking the pointer
- It should read like light moving over a glossy surface; when the pointer stops, the highlight stops

[Quality requirements]
- Use a soft white radial gradient with no visible edge
- Fade the highlight in and out over about 0.3s, but let the movement itself track the pointer without lag
- Clip the light inside the button's rounded corners
- When prefers-reduced-motion is set, disable the animation and fall back to a static state change
- Never reduce the legibility of the label; do not create a moment where the text cannot be read