Phase 1: ヒアリング（LLM Task）
┌─────────────────────────────────────────────────────────┐
│ hearing-facilitator                                     │
│ 📖 Read: agents/hearing-facilitator.md (必要時)         │
│                                                         │
│ Output: ヒアリング結果                                   │
└─────────────────────────────────────────────────────────┘
                            ↓
Phase 2: 構成設計（LLM Task + Script Validation）
┌─────────────────────────────────────────────────────────┐
│ structure-designer → [validate-structure.js]           │
│ 📖 Read: agents/structure-designer.md                   │
│ 📖 Read: references/strategy.md (構成戦略)              │
│ 📖 Read: references/icons.md (アイコン選定時)           │
│                                                         │
│ Output: structure.md → ユーザー承認                     │
└─────────────────────────────────────────────────────────┘
                            ↓
Phase 3: HTML生成（LLM Task + Script Validation）
┌─────────────────────────────────────────────────────────┐
│ html-generator                                          │
│ 📖 Read: agents/html-generator.md                       │
│ 📖 Read: references/slide-components.md (スライドタイプ)│
│ 📖 Read: references/theme-style.md (テーマ)             │
│ 📖 Read: assets/slide-template.html (テンプレート)      │
│                                                         │
│ Output: index.html + deploy-guide.md                    │
└─────────────────────────────────────────────────────────┘
                            ↓
Phase 3.5: 視覚検証（Script Task - 100%精度）
┌─────────────────────────────────────────────────────────┐
│ [verify-slides.js]                                     │
│                                                         │
│ Input: index.html                                       │
│ Output: スクリーンショット + 問題レポート               │
│                                                         │
│ 問題発見時 → LLMが修正 → 再検証                         │
└─────────────────────────────────────────────────────────┘
                            ↓
Phase 3.6: 印刷品質検証（Script Task - 100%精度）
┌─────────────────────────────────────────────────────────┐
│ [validate-print.js]                                     │
│                                                         │
│ Input: index.html                                       │
│ Output: 12項目検証レポート（P01-P12）                   │
│                                                         │
│ 検証項目: Chrome拡張非表示・data-total動的化・           │
│ print-color-adjust・pt単位フォント・mm寸法・             │
│ ページネーション色・isolation・グラデーション等           │
│                                                         │
│ 問題発見時 → LLMが修正 → 再検証                         │
└─────────────────────────────────────────────────────────┘
                            ↓
Phase 3.7: UI/UXレビュー（LLM Task）
┌─────────────────────────────────────────────────────────┐
│ uiux-reviewer                                           │
│ 📖 Read: agents/uiux-reviewer.md                        │
│ 📖 Read: references/print-layout.md (印刷レビュー時)    │
│                                                         │
│ レビュー対象:                                            │
│ ① HTML画面表示のUI/UX（テキスト量・カードバランス）     │
│ ② A4印刷のUI/UX（溢れ・切れ・外部UI混入）              │
│                                                         │
│ Output: レビュー結果 + 改善提案（優先度付き）           │
│ 問題発見時 → LLMが修正 → 再レビュー                     │
└─────────────────────────────────────────────────────────┘
                            ↓
Phase 4: 完了（Script Task）
┌─────────────────────────────────────────────────────────┐
│ [log_usage.js] → フィードバック記録                    │
└─────────────────────────────────────────────────────────┘

凡例: [script] = Script Task (100%精度), 無印 = LLM Task

Phase 1: 修正分析（LLM Task）
┌─────────────────────────────────────────────────────────┐
│ slide-modifier                                          │
│ 📖 Read: agents/slide-modifier.md                       │
│ 📖 Read: 既存structure.md                               │
│                                                         │
│ Output: 修正案 → ユーザー承認                           │
└─────────────────────────────────────────────────────────┘
                            ↓
Phase 2: 修正適用（LLM Task）
┌─────────────────────────────────────────────────────────┐
│ html-generator（再生成）                                │
│                                                         │
│ Output: 更新されたindex.html + structure.md             │
└─────────────────────────────────────────────────────────┘
                            ↓
Phase 3: 視覚検証 + UI/UXレビュー + 完了
（createモードのPhase 3.5 → 3.7 → 4と同様）

<div class="slider" id="slider">
  <div class="slide-area">  <!-- 16:9強制コンテナ -->
    <div class="slider__container">
      <!-- スライドHTML -->
    </div>
  </div>
</div>

:root {
  --slide-aspect-ratio: 16 / 9;
  --slide-max-width: min(100vw, calc(100vh * (16 / 9)));
  --slide-max-height: min(100vh, calc(100vw * (9 / 16)));
}

node scripts/verify-slides.js ./index.html --check-ratio

【HTML修正時】
index.html 修正 → structure.md 該当セクション更新 → 修正履歴追記

【構成変更時】
structure.md 修正 → ユーザー承認 → index.html 再生成

# JSON形式で検証
node scripts/validate-structure.js structure.json

# パイプで検証
echo '{"title":"Test","slides":[...]}' | node scripts/validate-structure.js

# スクリーンショット撮影（16:9ビューポート: 1920x1080）
node scripts/verify-slides.js ./index.html ./screenshots

# 16:9アスペクト比のみ検証
node scripts/verify-slides.js ./index.html --check-ratio

# 検証後に自動削除
node scripts/verify-slides.js ./index.html --auto-cleanup

# スクリーンショット削除のみ
node scripts/verify-slides.js ./index.html --cleanup

node scripts/log_usage.js --result success --phase "Phase 3" --agent "html-generator"

05_Project/
└── スライド/
    └── slide-YYYY-MM-DD-{タイトル}/
        ├── index.html        # HTML（CSS/JavaScriptは外部参照）
        ├── styles.css        # CSS分離ファイル
        ├── scripts.js        # JavaScript分離ファイル
        ├── index-single.html # 結合版（GASデプロイ用、build-single-html.jsで生成）
        ├── structure.md      # 構造化データ（改善・修正用）
        └── deploy-guide.md   # GASデプロイ手順

05_Project/
└── スライド/
    └── slide-YYYY-MM-DD-{タイトル}/
        ├── index.html      # HTML/CSS/JavaScript全てインライン
        ├── structure.md    # 構造化データ（改善・修正用）
        └── deploy-guide.md # GASデプロイ手順

// Renderer Process
const settings = await window.slideSettingsAPI.getAll();
const outputDir = settings.data.outputDirectory;