feat: client-side Mermaid diagram rendering with interactive viewer

Render mermaid code blocks as SVG diagrams instead of syntax-highlighted
source code. Includes a full pan/zoom viewer with drag, scroll wheel zoom,
pinch-to-zoom, fit-to-view, and fullscreen support. Theme-aware (dark/light).

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

package.json

@@ -15,7 +15,12 @@
   "author": "",
   "license": "ISC",
   "type": "module",
-  "browserslist": ["chrome 111", "edge 111", "firefox 111", "safari 16.4"],
+  "browserslist": [
+    "chrome 111",
+    "edge 111",
+    "firefox 111",
+    "safari 16.4"
+  ],
   "dependencies": {
     "@emotion/is-prop-valid": "^1.4.0",
     "@radix-ui/react-dialog": "^1.1.15",
@@ -25,6 +30,7 @@
     "contentlayer2": "^0.5.8",
     "gray-matter": "^4.0.3",
     "markdown-wasm": "^1.2.0",
+    "mermaid": "^11.12.3",
     "next": "^16.0.7",
     "next-contentlayer2": "^0.5.8",
     "next-themes": "^0.4.6",