Counter-rotating Rings

【対象要素】
- ページ内のアクセントとして置く円形のテキスト装飾に適用する

【演出内容】
- 外側と内側の2重の円周テキストを、互いに逆方向に回転させ続ける
- 外側は大きくゆっくり、内側は小さくやや速く回す

【品質要件】
- 内側のリングは文字数を絞り、字間を広めに取って窮屈に見せない
- ループの継ぎ目が分からないよう、終了時の状態と開始時の状態を完全に一致させる
- prefers-reduced-motion 時はアニメーションを止め、静止した完成状態で表示する

[Target]
- A circular text ornament used as a page accent

[Motion]
- Two concentric text rings rotate in opposite directions
- Outer ring: large and slow; inner ring: small and slightly faster

[Quality]
- Give the inner ring fewer characters and wider spacing so it never looks cramped
- Make the loop seamless: the end state must match the start state exactly
- With prefers-reduced-motion, stop the animation and show a static finished state