バッジカード3桁数字テスト
✅ 修正後（text-center + whitespace-nowrap）
🔬
探求者
ミックス数
104/200
🏛️
巡礼者
店舗訪問数
19/25
📊
内観者
深フレーバー
66/100
💎
極限者
限界テスト
999/999
🔥
超越者
4桁テスト
1000/1000
❌ 修正前（whitespace-nowrapなし）
🔬
探求者
ミックス数
104/200
🏛️
巡礼者
店舗訪問数
19/25
バッジ
バッジ
バッジ
テスト結果
✅ 修正後の動作
104/200→ 1行で中央表示999/999→ 3桁でも1行表示1000/1000→ 4桁でも改行されない（※小さくなるが1行）- すべてのカードで中央揃えが維持される
❌ 修正前の問題
104/200→ 改行されて2行表示- カード高さが不揃いになる
- 視覚的バランスが悪い
使用したCSSクラス
class="text-xs font-bold text-white text-center whitespace-nowrap"
whitespace-nowrap は CSS の white-space: nowrap; に相当し、テキストの自動折り返しを防ぎます。