3D Tilt Button

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

【演出内容】
- ポインタの位置に応じてボタンが奥行き方向に傾き、カードを指で押さえて傾けているように見せる
- ポインタが左にあれば左が奥へ、上にあれば上が奥へ倒れる

【品質要件】
- 傾きは最大18度前後まで。追従の遅れは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]
- The button tilts in depth according to the pointer position, as if it were a card being pressed and tipped by a finger
- A pointer on the left tips the left side away; a pointer above tips the top away

[Quality requirements]
- Tilt up to about 18 degrees. Keep the follow lag under 0.2s so it stays responsive
- Return it to flat when the pointer leaves
- On devices without a pointer, do not tilt it
- 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