fix graph.html: set explicit pixel height for vis.js container

vis.js requires a pixel-sized container — flex:1 is ignored.
Use position:fixed toolbar + JS-measured height for the graph div,
stored as window._network for resize handling.

docs/graph.html

@@ -6,17 +6,17 @@
 <script src="https://unpkg.com/vis-network@9.1.9/standalone/umd/vis-network.min.js"></script>
 <style>
   * { box-sizing: border-box; margin: 0; padding: 0; }
-  body { background: #0f172a; color: #e2e8f0; font-family: system-ui, sans-serif; height: 100vh; display: flex; flex-direction: column; }
-  #toolbar { display: flex; align-items: center; gap: 12px; padding: 10px 16px; background: #1e293b; border-bottom: 1px solid #334155; flex-shrink: 0; flex-wrap: wrap; }
+  body { background: #0f172a; color: #e2e8f0; font-family: system-ui, sans-serif; overflow: hidden; }
+  #toolbar { position: fixed; top: 0; left: 0; right: 0; z-index: 10; display: flex; align-items: center; gap: 12px; padding: 10px 16px; background: #1e293b; border-bottom: 1px solid #334155; flex-wrap: wrap; }
   #toolbar h1 { font-size: 14px; font-weight: 600; color: #94a3b8; margin-right: 8px; }
-  .filter-group { display: flex; gap: 6px; }
+  .filter-group { display: flex; gap: 6px; flex-wrap: wrap; }
   .filter-group label { display: flex; align-items: center; gap: 4px; font-size: 12px; cursor: pointer; padding: 3px 8px; border-radius: 4px; border: 1px solid #334155; }
   .filter-group label:hover { background: #334155; }
-  .dot { width: 10px; height: 10px; border-radius: 50%; display: inline-block; }
+  .dot { width: 10px; height: 10px; border-radius: 50%; display: inline-block; flex-shrink: 0; }
   #search { background: #0f172a; border: 1px solid #334155; color: #e2e8f0; padding: 4px 10px; border-radius: 6px; font-size: 12px; width: 180px; }
   #search::placeholder { color: #475569; }
-  #info { margin-left: auto; font-size: 11px; color: #64748b; }
-  #graph { flex: 1; }
+  #info { margin-left: auto; font-size: 11px; color: #64748b; white-space: nowrap; }
+  #graph { position: fixed; left: 0; right: 0; bottom: 0; }
   #tooltip { position: fixed; background: #1e293b; border: 1px solid #334155; border-radius: 6px; padding: 8px 12px; font-size: 12px; color: #e2e8f0; pointer-events: none; display: none; max-width: 320px; z-index: 100; }
 </style>
 </head>
@@ -999,7 +999,7 @@ const allEdges = [
   },
   {
     "from": 66,
-    "to": 71,
+    "to": 74,
     "arrows": "to"
   },
   {
@@ -1009,12 +1009,7 @@ const allEdges = [
   },
   {
     "from": 66,
-    "to": 67,
-    "arrows": "to"
-  },
-  {
-    "from": 66,
-    "to": 74,
+    "to": 69,
     "arrows": "to"
   },
   {
@@ -1024,7 +1019,7 @@ const allEdges = [
   },
   {
     "from": 66,
-    "to": 69,
+    "to": 71,
     "arrows": "to"
   },
   {
@@ -1032,6 +1027,11 @@ const allEdges = [
     "to": 92,
     "arrows": "to"
   },
+  {
+    "from": 66,
+    "to": 67,
+    "arrows": "to"
+  },
   {
     "from": 70,
     "to": 82,
@@ -1089,12 +1089,12 @@ const allEdges = [
   },
   {
     "from": 87,
-    "to": 82,
+    "to": 77,
     "arrows": "to"
   },
   {
     "from": 87,
-    "to": 77,
+    "to": 76,
     "arrows": "to"
   },
   {
@@ -1104,7 +1104,7 @@ const allEdges = [
   },
   {
     "from": 87,
-    "to": 76,
+    "to": 82,
     "arrows": "to"
   },
   {
@@ -1114,12 +1114,12 @@ const allEdges = [
   },
   {
     "from": 91,
-    "to": 73,
+    "to": 90,
     "arrows": "to"
   },
   {
     "from": 91,
-    "to": 90,
+    "to": 73,
     "arrows": "to"
   },
   {
@@ -1142,6 +1142,11 @@ const allEdges = [
     "to": 85,
     "arrows": "to"
   },
+  {
+    "from": 96,
+    "to": 85,
+    "arrows": "to"
+  },
   {
     "from": 96,
     "to": 82,
@@ -1153,8 +1158,8 @@ const allEdges = [
     "arrows": "to"
   },
   {
-    "from": 96,
-    "to": 85,
+    "from": 97,
+    "to": 96,
     "arrows": "to"
   },
   {
@@ -1164,7 +1169,7 @@ const allEdges = [
   },
   {
     "from": 97,
-    "to": 96,
+    "to": 94,
     "arrows": "to"
   },
   {
@@ -1177,11 +1182,6 @@ const allEdges = [
     "to": 95,
     "arrows": "to"
   },
-  {
-    "from": 97,
-    "to": 94,
-    "arrows": "to"
-  },
   {
     "from": 98,
     "to": 82,
@@ -1272,6 +1272,17 @@ const groups   = {
   }
 };
 
+// Size the graph container to fill below the toolbar
+function sizeGraph() {
+  const tb = document.getElementById('toolbar');
+  const g  = document.getElementById('graph');
+  const h  = tb.getBoundingClientRect().height;
+  g.style.top    = h + 'px';
+  g.style.height = (window.innerHeight - h) + 'px';
+}
+sizeGraph();
+window.addEventListener('resize', () => { sizeGraph(); if (window._network) window._network.redraw(); });
+
 const nodesDS = new vis.DataSet(allNodes);
 const edgesDS = new vis.DataSet(allEdges);
 
@@ -1305,6 +1316,7 @@ const options = {
 };
 
 const network = new vis.Network(container, { nodes: nodesDS, edges: edgesDS }, options);
+window._network = network;
 
 // Info count
 document.getElementById('info').textContent =