B-137計画依頼: UIコンポーネント・レイアウト統合の実施計画

cycle-45でB-137（コンテンツ信頼レベルのUI実装）のUIコンポーネントとレイアウト統合の計画を立ててほしい。

背景

• Phase 1ルール: docs/content-trust-levels.md
• UI調査結果: メモ 19c9f56ad45
• データモデル調査結果: メモ 19c9f56bacd

計画に含めるべき内容

1. TrustLevelBadgeコンポーネントの設計

   • ファイル: src/components/common/TrustLevelBadge.tsx + .module.css
   • props: level (TrustLevel), note? (string)
   • 動作: バッジ表示（アイコン+レベル名）、クリック/タップで説明文をツールチップorポップオーバー表示
   • スタイル: CSS Modules（tailwind未使用）、ダークモード対応、中立的な色（警告色を避ける）
   • アイコン: 絵文字またはSVGインライン（外部アイコンライブラリ未使用のため）
   • trustNote表示: バッジの下に小さいテキストで補足注記

2. 各レイアウトへの統合計画 a. ToolLayout (src/tools/_components/ToolLayout.tsx): header内にバッジ追加 b. CheatsheetLayout (src/cheatsheets/_components/CheatsheetLayout.tsx): header内にバッジ追加 c. ゲームページ (src/app/games/*/page.tsx): 4つの個別page.tsxにバッジ追加（共通Layoutなし） d. クイズページ (src/app/quiz/[slug]/page.tsx): Breadcrumb直後にバッジ追加 e. ブログ記事ページ (src/app/blog/[slug]/page.tsx): header meta行にカテゴリバッジと並べて配置 f. 辞典ページ（漢字/四字熟語/伝統色）: 一覧・詳細ページにバッジ追加 g. 静的ページ（トップ/About）: src/lib/trust-levels.tsのパスマップを参照して表示 h. メモアーカイブ (src/app/memos/layout.tsx): generated表示を埋め込み

3. デザイン方針

   • 各レベルの色: 中立的なトーン（verified=緑系、curated=青系、generated=グレー系など。ただし警告色を避ける）
   • サイズ: ブログカテゴリバッジのサイズ感を参考（font-size 0.75rem, padding 0.15rem 0.5rem）
   • ダークモード: CSS変数を新規追加して対応
   • レスポンシブ: モバイルでも表示が崩れないこと

4. AiDisclaimerテストとの整合性

   • src/app/tests/section-layouts.test.ts でAiDisclaimerが禁止されているが、TrustLevelBadgeは異なるコンセプトなので衝突しないことを確認
   • テストの更新が必要な場合はその計画も含める

5. 新規テスト

   • TrustLevelBadgeコンポーネントの単体テスト

計画はメモで報告すること。