flowchart TD ClaudeMD["CLAUDE.md must specify
dollar notation rule
NEVER backslash notation"]:::claudeNode Generator("chapter-content-generator
skill reads CLAUDE.md
and generates .md content"):::startNode Safe["Dollar sign delimiters
dollar and double-dollar notation"]:::authorNode Arithmatex["pymdownx.arithmatex
intercepts dollar delimiters
BEFORE Python-Markdown"]:::extensionNode Protected["Math wrapped in
protected arithmatex spans"]:::protectedNode PyMarkdown["Python-Markdown processes
headings, links, lists
Math content is safe"]:::processNode MkDocs["MkDocs Material
assembles HTML page"]:::buildNode Browser["Browser loads page"]:::buildNode Config["mathjax-config.js loads
mhchem package declared
delimiters configured"]:::configNode CDN["MathJax tex-chtml.js
loads from CDN"]:::configNode Scan["MathJax scans DOM
for protected spans"]:::mathNode Mhchem["mhchem extension
processes chemical notation
subscripts, arrows, charges"]:::mathNode Render("Equations and chemical
symbols rendered"):::successNode ClaudeMD --> Generator Generator --> Safe Safe --> Arithmatex Arithmatex --> Protected Protected --> PyMarkdown PyMarkdown --> MkDocs MkDocs --> Browser Browser --> Config Config --> CDN CDN --> Scan Scan --> Mhchem Mhchem --> Render classDef claudeNode fill:#e65100,stroke:#bf360c,stroke-width:3px,color:#fff,font-size:16px classDef startNode fill:#2e7d32,stroke:#1b5e20,stroke-width:2px,color:#fff,font-size:16px classDef authorNode fill:#43a047,stroke:#2e7d32,stroke-width:2px,color:#fff,font-size:16px classDef extensionNode fill:#1565c0,stroke:#0d47a1,stroke-width:2px,color:#fff,font-size:16px classDef protectedNode fill:#1976d2,stroke:#1565c0,stroke-width:2px,color:#fff,font-size:16px classDef processNode fill:#546e7a,stroke:#37474f,stroke-width:2px,color:#fff,font-size:16px classDef buildNode fill:#6a1b9a,stroke:#4a148c,stroke-width:2px,color:#fff,font-size:16px classDef configNode fill:#00695c,stroke:#004d40,stroke-width:2px,color:#fff,font-size:16px classDef mathNode fill:#00838f,stroke:#006064,stroke-width:2px,color:#fff,font-size:16px classDef successNode fill:#2e7d32,stroke:#1b5e20,stroke-width:3px,color:#fff,font-size:16px linkStyle default stroke:#94a3b8,stroke-width:2px,font-size:14px
Color Key
CLAUDE.md prerequisite
Content generator / success
Authoring
Python extension layer
Markdown / build layer
MkDocs / browser layer
MathJax configuration
MathJax rendering

Pipeline Step Details

Hover over any node to see a detailed explanation of that step in the rendering pipeline.