feat: Mermaid.js integration #20-29 — full diagram support

- CDN: mermaid@11 from jsdelivr
- mermaid-viewer.js: init, render, templates, zoom/pan, fullscreen, focus
- All diagram types: flowchart, sequence, class, state, ER, journey, gantt,
  pie, gitGraph, requirement, mindmap, timeline, quadrant, C4 (x4), beta types
- viewer.js: auto-render Mermaid blocks after markdown rendering
- utils.js: live preview panel in editor (debounced 500ms)
- app.js: initMermaid + setupFocusMode on startup
- CSS: container, controls, error, fullscreen overlay, focus panel, live preview
- Export SVG/PNG download buttons
- Obsidian preprocessor ([[links]], ![[img]], ==highlight==)

frontend/js/viewer.js

@@ -6,6 +6,7 @@ import { TabManager, closeMobileSidebar, ContextMenuManager, RightSidebarManager
 import { syncActiveFileTreeItem, searchByTag, TagFilterService, refreshSidebarTreePreservingState, focusPathInSidebar } from './sidebar.js';
 import { AutocompleteDropdown, performAdvancedSearch } from './search.js';
 import { initDashboardTabs } from './sync.js';
+import { renderMermaidBlocks } from './mermaid-viewer.js';
 import { DashboardStatsWidget, DashboardRecentWidget, DashboardBookmarkWidget, DashboardSharedWidget, DashboardConflictsWidget } from './dashboard.js';
 import { openShareDialog } from './config.js';
 // ---------------------------------------------------------------------------
@@ -598,6 +599,9 @@ export function renderFile(data) {
     safeHighlight(block);
   });
 
+  // Render Mermaid diagrams
+  renderMermaidBlocks(area);
+
   // Wire up wikilinks
   area.querySelectorAll(".wikilink").forEach((link) => {
     link.addEventListener("click", (e) => {