diff --git a/_layouts/default.html b/_layouts/default.html
index 8f69104..bf5b474 100644
--- a/_layouts/default.html
+++ b/_layouts/default.html
@@ -39,5 +39,21 @@ <h2 class="project-tagline">{{ page.description | default: site.description | de
         <span class="site-footer-credits">This page was generated by <a href="https://pages.github.com">GitHub Pages</a>.</span>
       </footer>
     </main>
+
+    <!-- Mermaid: Jekyll/kramdown does not render ```mermaid blocks on its own.
+         kramdown + Rouge wraps them as <div class="language-mermaid ...">...<code>.
+         Rewrite each to the <pre class="mermaid"> Mermaid expects, then render. -->
+    <script type="module">
+      import mermaid from 'https://cdn.jsdelivr.net/npm/mermaid@11/dist/mermaid.esm.min.mjs';
+      document.querySelectorAll('.language-mermaid, code.language-mermaid').forEach((el) => {
+        const src = el.querySelector('code') || el;
+        const pre = document.createElement('pre');
+        pre.className = 'mermaid';
+        pre.textContent = src.textContent;
+        el.replaceWith(pre);
+      });
+      mermaid.initialize({ startOnLoad: false, theme: 'default' });
+      await mermaid.run({ querySelector: 'pre.mermaid' });
+    </script>
   </body>
 </html>