Cursor Swap Button

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

【演出内容】
- ボタンの上ではOSのカーソルを隠し、代わりに短いラベル入りの円がポインタ位置に現れて追従する
- ボタンから出た瞬間に円は消え、通常のカーソルへ戻る

【品質要件】
- 表示の判定も消える判定も、必ずボタンの範囲を基準にする（周囲の余白から出たときに消える作りにしない）
- 円の出入りは0.2秒前後のフェードとスケールで行う
- ポインタを持たない環境ではカーソルを隠さない
- prefers-reduced-motion 時は演出を無効化し、状態変化だけが分かる静的表示にフォールバックする
- ラベルの可読性を落とさない。文字が読めなくなる瞬間を作らない

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

[Motion]
- Over the button the OS cursor is hidden and replaced by a small circle carrying a short label, which follows the pointer
- The moment the pointer leaves the button, the circle disappears and the normal cursor returns

[Quality requirements]
- Base both the show and the hide on the button's own bounds (do not hide it only once the pointer leaves the surrounding whitespace)
- Fade and scale the circle in and out over about 0.2s
- On devices without a pointer, do not hide the cursor
- 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