graph TD
Start([Start: Build HTML Presentation]) --> Phase1[Phase 1: Read Source Documents
Requirements, Architecture, Tech Spec, ADRs, Guides]
Phase1 --> Phase2[Phase 2: Validate Source Exists
Check required/optional files]
Phase2 --> Phase3[Phase 3: Validate Content Quality
Mermaid diagrams, placeholders, min length]
Phase3 --> Phase4[Phase 4: Create Presentation Directory
docs/presentation/ + README.md]
Phase4 --> Phase5[Phase 5: Copy Templates to Project
12 HTML/CSS/JS template files]
Phase5 --> Phase6[Phase 6: Content Injection
Build 6 tabs + parse Mermaid + cleanup examples]
Phase6 --> Phase7[Phase 7: Build Final HTML
Combine tabs + CSS + JS → presentation_final.html]
Phase7 --> End([End: ✓ Interactive presentation created])
%% Styling
classDef discovery fill:#E3F2FD,stroke:#1976D2,stroke-width:2px
classDef processing fill:#FFF9C4,stroke:#F57C00,stroke-width:2px
classDef action fill:#C8E6C9,stroke:#388E3C,stroke-width:2px
class Phase1,Phase2,Phase3 discovery
class Phase4,Phase5,Phase6 processing
class Phase7 action