@diagrammo/dgmo 0.31.0 → 0.32.0

package/dist/advanced.cjs

@@ -40,6 +40,14 @@ function makeDgmoError(line11, message, severity = "error", code) {
 function formatDgmoError(err) {
   return err.line > 0 ? `Line ${err.line}: ${err.message}` : err.message;
 }
+function makeFail(result) {
+  return (line11, message) => {
+    const diag = makeDgmoError(line11, message);
+    result.diagnostics.push(diag);
+    result.error = formatDgmoError(diag);
+    return result;
+  };
+}
 function levenshtein(a, b) {
   const m = a.length;
   const n = b.length;
@@ -403,21 +411,99 @@ function resolveColor(color, palette) {
   }
   return colorNames[lower] ?? null;
 }
+function nearestNamedColor(input) {
+  const cssHex = INVALID_CSS_COLOR_HEX[input.trim().toLowerCase()];
+  if (cssHex) input = cssHex;
+  const m = /^#([0-9a-f]{3}|[0-9a-f]{6})$/i.exec(input.trim());
+  if (!m) return null;
+  let h = m[1].toLowerCase();
+  if (h.length === 3)
+    h = h.split("").map((c) => c + c).join("");
+  const r = parseInt(h.slice(0, 2), 16) / 255;
+  const g = parseInt(h.slice(2, 4), 16) / 255;
+  const b = parseInt(h.slice(4, 6), 16) / 255;
+  const max = Math.max(r, g, b);
+  const min = Math.min(r, g, b);
+  const delta = max - min;
+  const l = (max + min) / 2;
+  const s = delta === 0 ? 0 : delta / (1 - Math.abs(2 * l - 1));
+  if (s < 0.15) {
+    if (l < 0.2) return "black";
+    if (l > 0.85) return "white";
+    return "gray";
+  }
+  let hue;
+  if (max === r) hue = 60 * ((g - b) / delta % 6);
+  else if (max === g) hue = 60 * ((b - r) / delta + 2);
+  else hue = 60 * ((r - g) / delta + 4);
+  if (hue < 0) hue += 360;
+  const anchors = [
+    ["red", 0],
+    ["orange", 30],
+    ["yellow", 55],
+    ["green", 120],
+    ["teal", 170],
+    ["cyan", 190],
+    ["blue", 225],
+    ["purple", 285],
+    ["red", 360]
+  ];
+  let best = "red";
+  let bestD = Infinity;
+  for (const [name, deg] of anchors) {
+    const d = Math.abs(hue - deg);
+    if (d < bestD) {
+      bestD = d;
+      best = name;
+    }
+  }
+  return best;
+}
+function isInvalidColorToken(token) {
+  if (/^(#|rgba?\(|hsla?\()/i.test(token)) return true;
+  const lower = token.toLowerCase();
+  return INVALID_CSS_COLOR_HEX[lower] !== void 0 && !isRecognizedColorName(lower);
+}
+function invalidColorDiagnostic(token, line11) {
+  if (!isInvalidColorToken(token)) return null;
+  const nearest = nearestNamedColor(token);
+  const near = nearest ? ` Nearest: ${nearest}.` : "";
+  return makeDgmoError(
+    line11,
+    `Color "${token}" is not a valid DGMO color \u2014 DGMO accepts only these 11 named colors: ${RECOGNIZED_COLOR_NAMES.join(", ")} (no hex, no CSS color names).${near}`,
+    "warning",
+    INVALID_COLOR_CODE
+  );
+}
 function resolveColorWithDiagnostic(color, line11, diagnostics, palette) {
   const resolved = resolveColor(color, palette);
   if (resolved !== null) return resolved;
+  if (/^(#|rgba?\(|hsla?\()/i.test(color)) {
+    const nearest = nearestNamedColor(color);
+    const near = nearest ? ` Nearest: ${nearest}.` : "";
+    diagnostics.push(
+      makeDgmoError(
+        line11,
+        `Color "${color}" is not supported \u2014 DGMO does not accept hex or CSS color values. Use a named palette color: ${RECOGNIZED_COLOR_NAMES.join(", ")}.${near}`,
+        "error",
+        INVALID_COLOR_CODE
+      )
+    );
+    return void 0;
+  }
   const hint = suggest(color, RECOGNIZED_COLOR_NAMES);
   const suggestion = hint ? ` ${hint}` : "";
   diagnostics.push(
     makeDgmoError(
       line11,
-      `Unknown color "${color}". Allowed: ${RECOGNIZED_COLOR_NAMES.join(", ")}.${suggestion}`,
-      "warning"
+      `Unknown color "${color}". DGMO accepts only these 11 named colors: ${RECOGNIZED_COLOR_NAMES.join(", ")} (no hex, no CSS color names).${suggestion}`,
+      "warning",
+      INVALID_COLOR_CODE
     )
   );
   return void 0;
 }
-var nord, colorNames, RECOGNIZED_COLOR_NAMES, CATEGORICAL_COLOR_ORDER, seriesColors;
+var nord, colorNames, RECOGNIZED_COLOR_NAMES, CATEGORICAL_COLOR_ORDER, INVALID_COLOR_CODE, INVALID_CSS_COLOR_HEX, seriesColors;
 var init_colors = __esm({
   "src/colors.ts"() {
     "use strict";
@@ -485,6 +571,92 @@ var init_colors = __esm({
       "orange",
       "cyan"
     ]);
+    INVALID_COLOR_CODE = "E_INVALID_COLOR";
+    INVALID_CSS_COLOR_HEX = Object.freeze({
+      pink: "#ffc0cb",
+      hotpink: "#ff69b4",
+      deeppink: "#ff1493",
+      lightpink: "#ffb6c1",
+      palevioletred: "#db7093",
+      crimson: "#dc143c",
+      scarlet: "#ff2400",
+      firebrick: "#b22222",
+      darkred: "#8b0000",
+      maroon: "#800000",
+      salmon: "#fa8072",
+      lightsalmon: "#ffa07a",
+      darksalmon: "#e9967a",
+      coral: "#ff7f50",
+      lightcoral: "#f08080",
+      tomato: "#ff6347",
+      orangered: "#ff4500",
+      darkorange: "#ff8c00",
+      gold: "#ffd700",
+      goldenrod: "#daa520",
+      darkgoldenrod: "#b8860b",
+      khaki: "#f0e68c",
+      darkkhaki: "#bdb76b",
+      amber: "#ffbf00",
+      lavender: "#e6e6fa",
+      violet: "#ee82ee",
+      magenta: "#ff00ff",
+      fuchsia: "#ff00ff",
+      orchid: "#da70d6",
+      plum: "#dda0dd",
+      indigo: "#4b0082",
+      navy: "#000080",
+      midnightblue: "#191970",
+      darkblue: "#00008b",
+      mediumblue: "#0000cd",
+      royalblue: "#4169e1",
+      cornflowerblue: "#6495ed",
+      dodgerblue: "#1e90ff",
+      deepskyblue: "#00bfff",
+      skyblue: "#87ceeb",
+      lightskyblue: "#87cefa",
+      lightblue: "#add8e6",
+      powderblue: "#b0e0e6",
+      steelblue: "#4682b4",
+      slateblue: "#6a5acd",
+      cadetblue: "#5f9ea0",
+      turquoise: "#40e0d0",
+      aqua: "#00ffff",
+      aquamarine: "#7fffd4",
+      lime: "#00ff00",
+      limegreen: "#32cd32",
+      lightgreen: "#90ee90",
+      palegreen: "#98fb98",
+      seagreen: "#2e8b57",
+      mediumseagreen: "#3cb371",
+      forestgreen: "#228b22",
+      darkgreen: "#006400",
+      olive: "#808000",
+      olivedrab: "#6b8e23",
+      darkolivegreen: "#556b2f",
+      chartreuse: "#7fff00",
+      lawngreen: "#7cfc00",
+      springgreen: "#00ff7f",
+      greenyellow: "#adff2f",
+      brown: "#a52a2a",
+      sienna: "#a0522d",
+      chocolate: "#d2691e",
+      peru: "#cd853f",
+      tan: "#d2b48c",
+      beige: "#f5f5dc",
+      wheat: "#f5deb3",
+      ivory: "#fffff0",
+      silver: "#c0c0c0",
+      lightgray: "#d3d3d3",
+      lightgrey: "#d3d3d3",
+      darkgray: "#a9a9a9",
+      darkgrey: "#a9a9a9",
+      dimgray: "#696969",
+      dimgrey: "#696969",
+      slategray: "#708090",
+      slategrey: "#708090",
+      gainsboro: "#dcdcdc",
+      grey: "#808080"
+    });
     seriesColors = [
       nord.nord10,
       // blue
@@ -659,7 +831,13 @@ function extractColor(label, palette, diagnostics, line11) {
   );
   if (lastSpaceIdx < 0) return { label };
   const trailing = label.substring(lastSpaceIdx + 1);
-  if (!RECOGNIZED_COLOR_SET.has(trailing)) return { label };
+  if (!RECOGNIZED_COLOR_SET.has(trailing)) {
+    if (diagnostics && line11 !== void 0) {
+      const diag = invalidColorDiagnostic(trailing, line11);
+      if (diag) diagnostics.push(diag);
+    }
+    return { label };
+  }
   let color;
   if (diagnostics && line11 !== void 0) {
     color = resolveColorWithDiagnostic(trailing, line11, diagnostics, palette);
@@ -1283,6 +1461,23 @@ function validateTagGroupNames(tagGroups, pushWarning, pushError) {
     }
   }
 }
+function cascadeTagMetadata(roots, tagGroups) {
+  const keys = tagGroups.map((g) => g.name.toLowerCase());
+  if (keys.length === 0) return;
+  const walk = (node, inherited) => {
+    const childInherited = { ...inherited };
+    for (const key of keys) {
+      const own = node.metadata[key];
+      if (own) {
+        childInherited[key] = own;
+      } else if (inherited[key]) {
+        node.metadata[key] = inherited[key];
+      }
+    }
+    for (const child of node.children) walk(child, childInherited);
+  };
+  for (const root of roots) walk(root, {});
+}
 function injectDefaultTagMetadata(entities, tagGroups, skip) {
   const defaults = [];
   for (const group of tagGroups) {
@@ -1821,7 +2016,12 @@ function parseVisualizationFull(content, palette) {
     }
     if (currentTimelineTagGroup && indent > 0) {
       const { text: entryText, isDefault } = stripDefaultModifier(line11);
-      const { label, color } = extractColor(entryText, palette);
+      const { label, color } = extractColor(
+        entryText,
+        palette,
+        result.diagnostics,
+        lineNumber
+      );
       if (color) {
         if (isDefault) {
           currentTimelineTagGroup.defaultValue = label;
@@ -3122,9 +3322,12 @@ function contrastText(bg, lightText, darkText) {
   }
   return lightText;
 }
+function themeBaseBg(palette, isDark) {
+  return isDark ? palette.surface : palette.bg;
+}
 function shapeFill(palette, intent, isDark, opts) {
   if (opts?.solid) return intent;
-  return mix(intent, isDark ? palette.surface : palette.bg, 25);
+  return mix(intent, themeBaseBg(palette, isDark), 25);
 }
 function getSeriesColors(palette) {
   const c = palette.colors;
@@ -3155,7 +3358,7 @@ function getSegmentColors(palette, count) {
 }
 function politicalTints(palette, count, isDark) {
   if (count <= 0) return [];
-  const base = isDark ? palette.surface : palette.bg;
+  const base = themeBaseBg(palette, isDark);
   const c = palette.colors;
   const swatches = [
     .../* @__PURE__ */ new Set([
@@ -3965,6 +4168,7 @@ __export(palettes_exports, {
   shade: () => shade,
   shapeFill: () => shapeFill,
   slatePalette: () => slatePalette,
+  themeBaseBg: () => themeBaseBg,
   tidewaterPalette: () => tidewaterPalette,
   tint: () => tint,
   tokyoNightPalette: () => tokyoNightPalette
@@ -4198,6 +4402,30 @@ var init_scaling = __esm({
         const clamped = Math.max(Math.min(raw, 1), minScaleFactor);
         return new _ScaleContext(clamped, minScaleFactor);
       }
+      /**
+       * Fit content into a bounding box, scaling by whichever dimension is more
+       * constraining (the smaller of the width- and height-fit ratios) so the
+       * diagram never overflows the canvas in either axis. Like {@link from}, the
+       * factor is clamped to `[minScaleFactor, 1]` (content is never enlarged, and
+       * never shrunk past the readability floor).
+       */
+      static fromBox(containerWidth, idealWidth, containerHeight, idealHeight, minScaleFactor = DEFAULT_MIN_SCALE_FACTOR) {
+        const wRaw = idealWidth > 0 ? containerWidth / idealWidth : 1;
+        const hRaw = idealHeight > 0 ? containerHeight / idealHeight : 1;
+        const raw = Math.min(wRaw, hRaw);
+        const clamped = Math.max(Math.min(raw, 1), minScaleFactor);
+        return new _ScaleContext(clamped, minScaleFactor);
+      }
+      /**
+       * Build a context from an explicit raw factor (clamped to
+       * `[minScaleFactor, 1]`). Used to refine a fit iteratively: layout scaling is
+       * non-linear (gaps shrink faster than floored text), so the first-pass factor
+       * can still overflow — re-measure the laid-out result and tighten.
+       */
+      static fromFactor(rawFactor, minScaleFactor = DEFAULT_MIN_SCALE_FACTOR) {
+        const clamped = Math.max(Math.min(rawFactor, 1), minScaleFactor);
+        return new _ScaleContext(clamped, minScaleFactor);
+      }
       static identity() {
         return new _ScaleContext(1, DEFAULT_MIN_SCALE_FACTOR);
       }
@@ -5837,12 +6065,7 @@ function parseSequenceDgmo(content, palette) {
     const trimmed = token.trim();
     return nameAliasMap.get(trimmed) ?? trimmed;
   };
-  const fail = (line11, message) => {
-    const diag = makeDgmoError(line11, message);
-    result.diagnostics.push(diag);
-    result.error = formatDgmoError(diag);
-    return result;
-  };
+  const fail = makeFail(result);
   const pushError = (line11, message) => {
     const diag = makeDgmoError(line11, message);
     result.diagnostics.push(diag);
@@ -5857,6 +6080,7 @@ function parseSequenceDgmo(content, palette) {
   const lines = content.split("\n");
   let hasExplicitChart = false;
   let contentStarted = false;
+  let bodyStarted = false;
   let firstLineIndex = -1;
   for (let fi = 0; fi < lines.length; fi++) {
     const fl = lines[fi].trim();
@@ -6168,6 +6392,7 @@ function parseSequenceDgmo(content, palette) {
         );
       }
       contentStarted = true;
+      bodyStarted = true;
       const section = {
         kind: "section",
         // Capture group 1 guaranteed present after successful match.
@@ -6383,7 +6608,7 @@ function parseSequenceDgmo(content, palette) {
         alias: bareAlias
       } = splitPipe(trimmed, lineNumber);
       const inGroup = activeGroup && measureIndent(raw) > 0;
-      if (/^\S+$/.test(bareCore) && !ARROW_PATTERN.test(bareCore) && (inGroup || !contentStarted || bareMeta)) {
+      if (/^\S+$/.test(bareCore) && !ARROW_PATTERN.test(bareCore) && (inGroup || !bodyStarted || bareMeta)) {
         contentStarted = true;
         const id = bareCore;
         if (bareAlias !== void 0) nameAliasMap.set(bareAlias, id);
@@ -6430,6 +6655,7 @@ function parseSequenceDgmo(content, palette) {
     }
     if (labeledArrow) {
       contentStarted = true;
+      bodyStarted = true;
       const { from, to, label: rawLabel, async: isAsync } = labeledArrow;
       const fromKey = addParticipant(resolveAlias(from), lineNumber);
       const toKey = addParticipant(resolveAlias(to), lineNumber);
@@ -6494,6 +6720,7 @@ function parseSequenceDgmo(content, palette) {
     const bareCall = bareCallSync || bareCallAsync;
     if (bareCall) {
       contentStarted = true;
+      bodyStarted = true;
       const from = bareCall[1];
       const to = bareCall[2];
       const fromKey = addParticipant(resolveAlias(from), lineNumber);
@@ -6515,6 +6742,7 @@ function parseSequenceDgmo(content, palette) {
     const ifMatch = trimmed.match(/^if\s+(.+)$/i);
     if (ifMatch) {
       contentStarted = true;
+      bodyStarted = true;
       const block = {
         kind: "block",
         type: "if",
@@ -6531,6 +6759,7 @@ function parseSequenceDgmo(content, palette) {
     const loopMatch = trimmed.match(/^loop\s+(.+)$/i);
     if (loopMatch) {
       contentStarted = true;
+      bodyStarted = true;
       const block = {
         kind: "block",
         type: "loop",
@@ -6547,6 +6776,7 @@ function parseSequenceDgmo(content, palette) {
     const parallelMatch = trimmed.match(/^parallel(?:\s+(.+))?$/i);
     if (parallelMatch) {
       contentStarted = true;
+      bodyStarted = true;
       const block = {
         kind: "block",
         type: "parallel",
@@ -6643,6 +6873,7 @@ function parseSequenceDgmo(content, palette) {
             lineNumber,
             endLineNumber: lineNumber
           };
+          bodyStarted = true;
           currentContainer().push(note);
           continue;
         }
@@ -6667,6 +6898,7 @@ function parseSequenceDgmo(content, palette) {
             endLineNumber: i + 1
             // i has advanced past the body lines (1-based)
           };
+          bodyStarted = true;
           currentContainer().push(note);
           continue;
         }
@@ -7511,6 +7743,15 @@ function parseNodeRef(text) {
   }
   return null;
 }
+function parseNodeRefLoose(text) {
+  const t = text.trim();
+  const shapeRe = /^(\[\[.+?\]\]|\[.+?~\]|\[.+?\]|\(.+?\)|<.+?>|\/.+?\/)\s+(\S.*)$/;
+  const m = t.match(shapeRe);
+  if (!m) return null;
+  const ref = parseNodeRef(m[1]);
+  if (!ref) return null;
+  return { ref, trailing: m[2].trim() };
+}
 function splitArrows(line11) {
   const segments = [];
   const arrowPositions = [];
@@ -7606,6 +7847,7 @@ function parseFlowchart(content, palette) {
   const notes = [];
   let contentStarted = false;
   let firstLineParsed = false;
+  let prevLineLastNodeId = null;
   const nameAliasMap = /* @__PURE__ */ new Map();
   function peelAlias2(seg) {
     const trimmed = seg.trim();
@@ -7613,6 +7855,19 @@ function parseFlowchart(content, palette) {
     if (!m) return { seg: trimmed };
     return { seg: m[1].trim(), alias: m[2] };
   }
+  const suffixWarnedLines = /* @__PURE__ */ new Set();
+  function warnUnsupportedSuffix(lineNumber, trailing) {
+    if (suffixWarnedLines.has(lineNumber)) return;
+    suffixWarnedLines.add(lineNumber);
+    result.diagnostics.push(
+      makeDgmoError(
+        lineNumber,
+        `Ignored unsupported text after a node shape: "${trailing}". Flowcharts have no tag groups or node metadata; node colors are assigned automatically by shape (e.g. terminals green/red, decisions yellow). Remove the suffix.`,
+        "warning",
+        "W_FLOWCHART_NODE_SUFFIX"
+      )
+    );
+  }
   function getOrCreateNode(ref, lineNumber) {
     const key = ref.id;
     const existing = nodeMap.get(key);
@@ -7671,6 +7926,8 @@ function parseFlowchart(content, palette) {
       indentStack[indentStack.length - 1].nodeId
     ) : null;
     const segments = splitArrows(trimmed);
+    const startsWithArrow = segments.length >= 2 && segments[0].trim() === "";
+    const effectiveSource = implicitSourceId ?? (startsWithArrow ? prevLineLastNodeId : null);
     if (segments.length === 1) {
       const peeled = peelAlias2(segments[0]);
       const ref = parseNodeRef(peeled.seg);
@@ -7680,6 +7937,13 @@ function parseFlowchart(content, palette) {
         indentStack.push({ nodeId: node.id, indent });
         return node.id;
       }
+      const loose = parseNodeRefLoose(peeled.seg);
+      if (loose) {
+        warnUnsupportedSuffix(lineNumber, loose.trailing);
+        const node = getOrCreateNode(loose.ref, lineNumber);
+        indentStack.push({ nodeId: node.id, indent });
+        return node.id;
+      }
       const aliasResolved = nameAliasMap.get(peeled.seg.trim());
       if (aliasResolved !== void 0) {
         indentStack.push({ nodeId: aliasResolved, indent });
@@ -7715,16 +7979,23 @@ function parseFlowchart(content, palette) {
           }
         }
       }
+      if (!ref) {
+        const loose = parseNodeRefLoose(peeled.seg);
+        if (loose) {
+          warnUnsupportedSuffix(lineNumber, loose.trailing);
+          ref = loose.ref;
+        }
+      }
       if (!ref) continue;
       const node = getOrCreateNode(ref, lineNumber);
       if (peeled.alias) nameAliasMap.set(peeled.alias, node.id);
       if (pendingArrow !== null) {
-        const sourceId = lastNodeId ?? implicitSourceId;
+        const sourceId = lastNodeId ?? effectiveSource;
         if (sourceId) {
           addEdge(sourceId, node.id, lineNumber, pendingArrow.label);
         }
         pendingArrow = null;
-      } else if (lastNodeId === null && implicitSourceId === null) {
+      } else if (lastNodeId === null && effectiveSource === null) {
       }
       lastNodeId = node.id;
     }
@@ -7806,7 +8077,8 @@ function parseFlowchart(content, palette) {
         continue;
       }
     }
-    processContentLine(trimmed, lineNumber, indent);
+    const lastId = processContentLine(trimmed, lineNumber, indent);
+    if (lastId) prevLineLastNodeId = lastId;
   }
   if (result.nodes.length === 0 && !result.error) {
     const diag = makeDgmoError(
@@ -8889,7 +9161,12 @@ function parseERDiagram(content, palette) {
     }
     if (currentTagGroup && !contentStarted && indent > 0) {
       const { text: cleanEntry, isDefault } = stripDefaultModifier(trimmed);
-      const { label, color } = extractColor(cleanEntry, palette);
+      const { label, color } = extractColor(
+        cleanEntry,
+        palette,
+        result.diagnostics,
+        lineNumber
+      );
       if (isDefault) {
         currentTagGroup.defaultValue = label;
       } else if (currentTagGroup.entries.length === 0) {
@@ -9207,12 +9484,7 @@ function parseOrg(content, palette) {
     diagnostics: [],
     error: null
   };
-  const fail = (line11, message) => {
-    const diag = makeDgmoError(line11, message);
-    result.diagnostics.push(diag);
-    result.error = formatDgmoError(diag);
-    return result;
-  };
+  const fail = makeFail(result);
   const pushError = (line11, message) => {
     const diag = makeDgmoError(line11, message);
     result.diagnostics.push(diag);
@@ -9321,7 +9593,12 @@ function parseOrg(content, palette) {
       const indent2 = measureIndent(line11);
       if (indent2 > 0) {
         const { text: cleanEntry, isDefault } = stripDefaultModifier(trimmed);
-        const { label, color } = extractColor(cleanEntry, palette);
+        const { label, color } = extractColor(
+          cleanEntry,
+          palette,
+          result.diagnostics,
+          lineNumber
+        );
         if (isDefault) {
           currentTagGroup.defaultValue = label;
         } else if (currentTagGroup.entries.length === 0) {
@@ -9607,12 +9884,7 @@ function parseSitemap(content, palette) {
     diagnostics: [],
     error: null
   };
-  const fail = (line11, message) => {
-    const diag = makeDgmoError(line11, message);
-    result.diagnostics.push(diag);
-    result.error = formatDgmoError(diag);
-    return result;
-  };
+  const fail = makeFail(result);
   const pushError = (line11, message) => {
     const diag = makeDgmoError(line11, message);
     result.diagnostics.push(diag);
@@ -9713,7 +9985,12 @@ function parseSitemap(content, palette) {
       const indent2 = measureIndent(line11);
       if (indent2 > 0) {
         const { text: cleanEntry, isDefault } = stripDefaultModifier(trimmed);
-        const { label, color } = extractColor(cleanEntry, palette);
+        const { label, color } = extractColor(
+          cleanEntry,
+          palette,
+          result.diagnostics,
+          lineNumber
+        );
         currentTagGroup.entries.push({
           value: label,
           color: color ?? AUTO_TAG_COLOR_SENTINEL,
@@ -11428,7 +11705,7 @@ var init_chart_types = __esm({
       },
       {
         id: "sequence",
-        description: "Message / interaction flows",
+        description: "Message request and response interaction flows",
         fallback: true
       },
       {
@@ -11502,7 +11779,7 @@ var init_chart_types = __esm({
       },
       {
         id: "map",
-        description: "Geographic map: a value or count per country, state, or region (choropleth); points of interest; routes. Use when categories are real-world places."
+        description: "Geographic concept map: highlight/score regions, drop points of interest, connect with routes or edges"
       },
       // ── Tier 3 — Specialized analytical charts ────────────────
       {
@@ -11519,7 +11796,7 @@ var init_chart_types = __esm({
       },
       {
         id: "slope",
-        description: "Change for multiple things between exactly two periods"
+        description: "Change between 2 time periods"
       },
       {
         id: "sankey",
@@ -11548,7 +11825,7 @@ var init_chart_types = __esm({
       // ── Tier 4 — General-purpose data charts ──────────────────
       {
         id: "bar",
-        description: "Categorical comparisons",
+        description: "Categorical comparisons for 3 - 5 figures",
         fallback: true
       },
       {
@@ -11810,7 +12087,9 @@ function parseChart(content, palette) {
     if (dataValues) {
       const { label: rawLabel, color: pointColor } = extractColor(
         dataValues.label,
-        palette
+        palette,
+        result.diagnostics,
+        lineNumber
       );
       const [first, ...rest] = dataValues.values;
       result.data.push({
@@ -11875,6 +12154,12 @@ function parseChart(content, palette) {
       'Chart type "bar-stacked" requires multiple series names. Use: series Name1, Name2, Name3'
     );
   }
+  if (!result.error && result.type === "bar" && (result.seriesNames?.length ?? 0) > 1) {
+    warn(
+      result.seriesLineNumber ?? 1,
+      `Plain "bar" shows only the first series ("${result.seriesNames[0]}"); the other ${result.seriesNames.length - 1} are dropped at render. Use "bar-stacked" for stacked bars or "multi-line" to plot every series.`
+    );
+  }
   if (!result.error && result.seriesNames) {
     const expectedCount = result.seriesNames.length;
     for (const dp of result.data) {
@@ -12136,7 +12421,9 @@ function parseScatterRow(line11, palette, currentCategory, lineNumber, diagnosti
   if (!dataRow || dataRow.values.length < 2) return null;
   const { label: rawLabel, color: pointColor } = extractColor(
     dataRow.label,
-    palette
+    palette,
+    diagnostics,
+    lineNumber
   );
   return {
     name: rawLabel,
@@ -12274,11 +12561,15 @@ function parseExtendedChartFull(content, palette) {
       const targetResolved = resolveSlot(rawTarget);
       const { label: source, color: sourceColor } = extractColor(
         sourceResolved,
-        palette
+        palette,
+        result.diagnostics,
+        lineNumber
       );
       const { label: target, color: targetColor } = extractColor(
         targetResolved,
-        palette
+        palette,
+        result.diagnostics,
+        lineNumber
       );
       if (sourceColor || targetColor) {
         if (!result.nodeColors) result.nodeColors = {};
@@ -12330,7 +12621,9 @@ function parseExtendedChartFull(content, palette) {
             const targetResolved = resolveSlot(dataRow2.label);
             const { label: target, color: targetColor } = extractColor(
               targetResolved,
-              palette
+              palette,
+              result.diagnostics,
+              lineNumber
             );
             if (targetColor) {
               if (!result.nodeColors) result.nodeColors = {};
@@ -12363,7 +12656,9 @@ function parseExtendedChartFull(content, palette) {
         const trimmedResolved = resolveSlot(trimmed);
         const { label: nodeName, color: nodeColor2 } = extractColor(
           trimmedResolved,
-          palette
+          palette,
+          result.diagnostics,
+          lineNumber
         );
         if (nodeColor2) {
           if (!result.nodeColors) result.nodeColors = {};
@@ -12453,8 +12748,11 @@ function parseExtendedChartFull(content, palette) {
             min: parseFloat(rangeMatch[1]),
             max: parseFloat(rangeMatch[2])
           };
+          continue;
+        }
+        if (!(result.type === "function" && trimmed.includes(":"))) {
+          continue;
         }
-        continue;
       }
     }
     if (firstToken === "no-name") {
@@ -12514,7 +12812,9 @@ function parseExtendedChartFull(content, palette) {
       if (colonIndex >= 0) {
         const { label: fnName, color: fnColor } = extractColor(
           trimmed.substring(0, colonIndex).trim(),
-          palette
+          palette,
+          result.diagnostics,
+          lineNumber
         );
         const fnValue = trimmed.substring(colonIndex + 1).trim();
         if (!result.functions) result.functions = [];
@@ -12562,7 +12862,9 @@ function parseExtendedChartFull(content, palette) {
     if (dataRow?.values.length === 1) {
       const { label: rawLabel, color: pointColor } = extractColor(
         dataRow.label,
-        palette
+        palette,
+        result.diagnostics,
+        lineNumber
       );
       result.data.push({
         label: rawLabel,
@@ -12661,11 +12963,11 @@ function buildExtendedChartOption(parsed, palette, isDark, ctx) {
   const sc = ctx ?? ScaleContext.identity();
   const { textColor, axisLineColor, gridOpacity, colors, titleConfig } = buildChartCommons(parsed, palette, isDark, sc);
   if (parsed.type === "sankey") {
-    const bg = isDark ? palette.surface : palette.bg;
+    const bg = themeBaseBg(palette, isDark);
     return buildSankeyOption(parsed, textColor, colors, bg, titleConfig, sc);
   }
   if (parsed.type === "chord") {
-    const bg = isDark ? palette.surface : palette.bg;
+    const bg = themeBaseBg(palette, isDark);
     return buildChordOption(
       parsed,
       palette,
@@ -12706,7 +13008,7 @@ function buildExtendedChartOption(parsed, palette, isDark, ctx) {
     );
   }
   if (parsed.type === "funnel") {
-    const bg = isDark ? palette.surface : palette.bg;
+    const bg = themeBaseBg(palette, isDark);
     return buildFunnelOption(
       parsed,
       palette,
@@ -13302,7 +13604,8 @@ function buildScatterOption(parsed, palette, isDark, textColor, axisLineColor, g
   const gridLeft = parsed.ylabel ? 12 : 3;
   const gridRight = 4;
   const gridBottom = hasCategories ? 15 : parsed.xlabel ? 10 : 3;
-  const gridTop = parsed.title && !parsed.noTitle ? 15 : 5;
+  const hasTitle = !!(parsed.title && !parsed.noTitle);
+  const gridTop = hasTitle ? hasCategories ? 22 : 15 : hasCategories ? 12 : 5;
   let graphic;
   if (showLabels && points.length > 0) {
     const labelPoints = [];
@@ -13442,7 +13745,7 @@ function buildScatterOption(parsed, palette, isDark, textColor, axisLineColor, g
 }
 function buildHeatmapOption(parsed, palette, isDark, textColor, axisLineColor, titleConfig, ctx) {
   const sc = ctx ?? ScaleContext.identity();
-  const bg = isDark ? palette.surface : palette.bg;
+  const bg = themeBaseBg(palette, isDark);
   const heatmapRows = parsed.heatmapRows ?? [];
   const columns = parsed.columns ?? [];
   const rowLabels = heatmapRows.map((r) => r.label);
@@ -13761,7 +14064,7 @@ function buildSimpleChartOption(parsed, palette, isDark, chartWidth, ctx) {
     colors,
     titleConfig
   } = buildChartCommons(parsed, palette, isDark, sc);
-  const bg = isDark ? palette.surface : palette.bg;
+  const bg = themeBaseBg(palette, isDark);
   switch (parsed.type) {
     case "bar":
       return buildBarOption(
@@ -14713,12 +15016,7 @@ function parseKanban(content, palette) {
     diagnostics: [],
     error: null
   };
-  const fail = (line11, message) => {
-    const diag = makeDgmoError(line11, message);
-    result.diagnostics.push(diag);
-    result.error = formatDgmoError(diag);
-    return result;
-  };
+  const fail = makeFail(result);
   const warn = (line11, message) => {
     result.diagnostics.push(makeDgmoError(line11, message, "warning"));
   };
@@ -14821,7 +15119,12 @@ function parseKanban(content, palette) {
       const indent2 = measureIndent(line11);
       if (indent2 > 0) {
         const { text: cleanEntry, isDefault } = stripDefaultModifier(trimmed);
-        const { label, color } = extractColor(cleanEntry, palette);
+        const { label, color } = extractColor(
+          cleanEntry,
+          palette,
+          result.diagnostics,
+          lineNumber
+        );
         if (isDefault) {
           currentTagGroup.defaultValue = label;
         } else if (currentTagGroup.entries.length === 0) {
@@ -14989,11 +15292,11 @@ function parseKanban(content, palette) {
   for (const col of result.columns) {
     for (const card of col.cards) {
       for (const [tagKey, tagValue] of Object.entries(card.tags)) {
-        const groupKey = metaAliasMap.get(tagKey.toLowerCase()) ?? tagKey.toLowerCase();
-        const validValues = tagValueSets.get(groupKey);
+        const groupKey2 = metaAliasMap.get(tagKey.toLowerCase()) ?? tagKey.toLowerCase();
+        const validValues = tagValueSets.get(groupKey2);
         if (validValues && !validValues.has(tagValue.toLowerCase())) {
-          const entries = result.tagGroups.find((g) => g.name.toLowerCase() === groupKey)?.entries.map((e) => e.value);
-          let msg = `Unknown tag value "${tagValue}" for group "${groupKey}"`;
+          const entries = result.tagGroups.find((g) => g.name.toLowerCase() === groupKey2)?.entries.map((e) => e.value);
+          let msg = `Unknown tag value "${tagValue}" for group "${groupKey2}"`;
           if (entries) {
             const hint = suggest(tagValue, entries);
             if (hint) msg += `. ${hint}`;
@@ -15165,12 +15468,7 @@ function parseC4(content, palette) {
     if (!result.error && severity === "error")
       result.error = formatDgmoError(diag);
   };
-  const fail = (line11, message) => {
-    const diag = makeDgmoError(line11, message);
-    result.diagnostics.push(diag);
-    result.error = formatDgmoError(diag);
-    return result;
-  };
+  const fail = makeFail(result);
   if (!content?.trim()) {
     return fail(0, "No content provided");
   }
@@ -15271,7 +15569,12 @@ function parseC4(content, palette) {
       const indent2 = measureIndent(line11);
       if (indent2 > 0) {
         const { text: cleanEntry, isDefault } = stripDefaultModifier(trimmed);
-        const { label, color } = extractColor(cleanEntry, palette);
+        const { label, color } = extractColor(
+          cleanEntry,
+          palette,
+          result.diagnostics,
+          lineNumber
+        );
         if (isDefault) {
           currentTagGroup.defaultValue = label;
         } else if (currentTagGroup.entries.length === 0) {
@@ -16936,8 +17239,66 @@ function parseInfra(content) {
     }
   }
   validateTagGroupNames(result.tagGroups, warn, setError);
+  checkReachability(result);
   return result;
 }
+function checkReachability(result) {
+  if (result.nodes.length === 0) return;
+  const entries = result.nodes.filter((n) => n.isEdge);
+  if (entries.length === 0) {
+    const line11 = result.titleLineNumber ?? result.nodes[0]?.lineNumber ?? 1;
+    result.diagnostics.push(
+      makeDgmoError(
+        line11,
+        `Infra diagram has no 'internet' or 'edge' entry point \u2014 an infra diagram traces request traffic from an entry inward, so without one nothing carries traffic. Add an 'internet' or 'edge' node and route from it.`,
+        "warning",
+        "W_INFRA_NO_ENTRY"
+      )
+    );
+    return;
+  }
+  const groupChildMap = /* @__PURE__ */ new Map();
+  for (const node of result.nodes) {
+    if (node.groupId) {
+      const list = groupChildMap.get(node.groupId) ?? [];
+      list.push(node.id);
+      groupChildMap.set(node.groupId, list);
+    }
+  }
+  const outbound = /* @__PURE__ */ new Map();
+  for (const edge of result.edges) {
+    const targets = groupChildMap.get(edge.targetId) ?? [edge.targetId];
+    const list = outbound.get(edge.sourceId) ?? [];
+    list.push(...targets);
+    outbound.set(edge.sourceId, list);
+  }
+  const reachable = /* @__PURE__ */ new Set();
+  const queue = [];
+  for (const entry of entries) {
+    reachable.add(entry.id);
+    queue.push(entry.id);
+  }
+  while (queue.length > 0) {
+    const current = queue.shift();
+    for (const next of outbound.get(current) ?? []) {
+      if (!reachable.has(next)) {
+        reachable.add(next);
+        queue.push(next);
+      }
+    }
+  }
+  for (const node of result.nodes) {
+    if (node.isEdge || reachable.has(node.id)) continue;
+    result.diagnostics.push(
+      makeDgmoError(
+        node.lineNumber,
+        `'${node.label}' is unreachable from an 'internet'/'edge' entry \u2014 no request traffic flows to it, so it's dead on an infra diagram. Connect it downstream of an entry, or remove it.`,
+        "warning",
+        "W_INFRA_UNREACHABLE"
+      )
+    );
+  }
+}
 function stripNodeDecorations(name) {
   let s = name.trim();
   const aliasMatch = s.match(/^(.*?)\s+as\s+[A-Za-z][A-Za-z0-9_]{0,11}\s*$/);
@@ -17227,7 +17588,12 @@ function parseGantt(content, palette) {
         const eraEntryMatch = line11.match(ERA_ENTRY_RE);
         if (eraEntryMatch) {
           const eraLabelRaw = eraEntryMatch[3].trim();
-          const eraExtracted = extractColor(eraLabelRaw, palette);
+          const eraExtracted = extractColor(
+            eraLabelRaw,
+            palette,
+            diagnostics,
+            lineNumber
+          );
           result.eras.push({
             startDate: eraEntryMatch[1],
             endDate: eraEntryMatch[2],
@@ -17249,7 +17615,12 @@ function parseGantt(content, palette) {
         const markerEntryMatch = line11.match(MARKER_ENTRY_RE);
         if (markerEntryMatch) {
           const markerLabelRaw = markerEntryMatch[2].trim();
-          const markerExtracted = extractColor(markerLabelRaw, palette);
+          const markerExtracted = extractColor(
+            markerLabelRaw,
+            palette,
+            diagnostics,
+            lineNumber
+          );
           result.markers.push({
             date: markerEntryMatch[1],
             label: markerExtracted.label,
@@ -17270,7 +17641,12 @@ function parseGantt(content, palette) {
       } else {
         if (COMMENT_RE.test(line11)) continue;
         const { text: cleanEntry, isDefault } = stripDefaultModifier(line11);
-        const extracted = extractColor(cleanEntry, palette);
+        const extracted = extractColor(
+          cleanEntry,
+          palette,
+          diagnostics,
+          lineNumber
+        );
         const color = extracted.color || seriesColors2[currentTagGroup.entries.length % seriesColors2.length] || "#888888";
         const isFirstEntry = currentTagGroup.entries.length === 0;
         currentTagGroup.entries.push({
@@ -17465,7 +17841,12 @@ function parseGantt(content, palette) {
         const startOff = parseOffsetPrefix("+" + eraOffsetMatch[1]);
         const endOff = parseOffsetPrefix("+" + eraOffsetMatch[2]);
         const eraLabelRaw = eraOffsetMatch[3].trim();
-        const eraExtracted = extractColor(eraLabelRaw, palette);
+        const eraExtracted = extractColor(
+          eraLabelRaw,
+          palette,
+          diagnostics,
+          lineNumber
+        );
         result.eras.push({
           startDate: "",
           endDate: "",
@@ -17481,7 +17862,12 @@ function parseGantt(content, palette) {
       if (markerOffsetMatch) {
         const dateOff = parseOffsetPrefix("+" + markerOffsetMatch[1]);
         const markerLabelRaw = markerOffsetMatch[2].trim();
-        const markerExtracted = extractColor(markerLabelRaw, palette);
+        const markerExtracted = extractColor(
+          markerLabelRaw,
+          palette,
+          diagnostics,
+          lineNumber
+        );
         result.markers.push({
           date: "",
           label: markerExtracted.label,
@@ -17555,7 +17941,12 @@ function parseGantt(content, palette) {
     const eraMatch = line11.match(ERA_RE);
     if (eraMatch) {
       const eraLabelRaw = eraMatch[3].trim();
-      const eraExtracted = extractColor(eraLabelRaw, palette);
+      const eraExtracted = extractColor(
+        eraLabelRaw,
+        palette,
+        diagnostics,
+        lineNumber
+      );
       result.eras.push({
         startDate: eraMatch[1],
         endDate: eraMatch[2],
@@ -17573,7 +17964,12 @@ function parseGantt(content, palette) {
     const markerMatch = line11.match(MARKER_RE);
     if (markerMatch) {
       const markerLabelRaw = markerMatch[2].trim();
-      const markerExtracted = extractColor(markerLabelRaw, palette);
+      const markerExtracted = extractColor(
+        markerLabelRaw,
+        palette,
+        diagnostics,
+        lineNumber
+      );
       result.markers.push({
         date: markerMatch[1],
         label: markerExtracted.label,
@@ -19045,7 +19441,7 @@ function parseBoxesAndLines(content, palette) {
     const trimmed = raw.trim();
     const indent = measureIndent2(raw);
     if (!trimmed || trimmed.startsWith("//")) continue;
-    if (trimmed.includes("|") && !/-\S*\|\S*->/.test(trimmed) && !/~\S*\|\S*~>/.test(trimmed)) {
+    if (trimmed.includes("|") && !ARROW_LABEL_PIPE_DIRECTED_RE.test(trimmed) && !ARROW_LABEL_PIPE_UNDIRECTED_RE.test(trimmed)) {
       result.diagnostics.push(
         makeDgmoError(
           lineNum,
@@ -19084,13 +19480,13 @@ function parseBoxesAndLines(content, palette) {
         for (const pair of pairs) {
           const colonIdx = pair.indexOf(":");
           if (colonIdx > 0) {
-            const groupKey = pair.substring(0, colonIdx).trim().toLowerCase();
+            const groupKey2 = pair.substring(0, colonIdx).trim().toLowerCase();
             const value = pair.substring(colonIdx + 1).trim().toLowerCase();
-            if (groupKey && value) {
-              if (!initialHiddenTagValues.has(groupKey)) {
-                initialHiddenTagValues.set(groupKey, /* @__PURE__ */ new Set());
+            if (groupKey2 && value) {
+              if (!initialHiddenTagValues.has(groupKey2)) {
+                initialHiddenTagValues.set(groupKey2, /* @__PURE__ */ new Set());
               }
-              initialHiddenTagValues.get(groupKey).add(value);
+              initialHiddenTagValues.get(groupKey2).add(value);
             }
           }
         }
@@ -19174,7 +19570,12 @@ function parseBoxesAndLines(content, palette) {
       if (tagBlockMatch.inlineValues) {
         for (const rawVal of tagBlockMatch.inlineValues) {
           const { text: cleanVal, isDefault } = stripDefaultModifier(rawVal);
-          const { label, color } = extractColor(cleanVal);
+          const { label, color } = extractColor(
+            cleanVal,
+            palette,
+            result.diagnostics,
+            lineNum
+          );
           newTagGroup.entries.push({
             value: label,
             color: color ?? AUTO_TAG_COLOR_SENTINEL,
@@ -19191,7 +19592,12 @@ function parseBoxesAndLines(content, palette) {
     }
     if (currentTagGroup && !contentStarted && indent > 0) {
       const { text: cleanEntry, isDefault } = stripDefaultModifier(trimmed);
-      const { label, color } = extractColor(cleanEntry);
+      const { label, color } = extractColor(
+        cleanEntry,
+        palette,
+        result.diagnostics,
+        lineNum
+      );
       currentTagGroup.entries.push({
         value: label,
         color: color ?? AUTO_TAG_COLOR_SENTINEL,
@@ -19789,7 +20195,7 @@ function parseEdgeLine(trimmed, lineNum, metaAliasMap, diagnostics, nameAliasMap
     metadata
   };
 }
-var MAX_GROUP_DEPTH;
+var MAX_GROUP_DEPTH, ARROW_LABEL_PIPE_DIRECTED_RE, ARROW_LABEL_PIPE_UNDIRECTED_RE;
 var init_parser18 = __esm({
   "src/boxes-and-lines/parser.ts"() {
     "use strict";
@@ -19801,6 +20207,8 @@ var init_parser18 = __esm({
     init_reserved_key_registry();
     init_notes();
     MAX_GROUP_DEPTH = 2;
+    ARROW_LABEL_PIPE_DIRECTED_RE = /-\S*\|\S*->/;
+    ARROW_LABEL_PIPE_UNDIRECTED_RE = /~\S*\|\S*~>/;
   }
 });
 
@@ -19820,12 +20228,7 @@ function parseMindmap(content, palette) {
     diagnostics: [],
     error: null
   };
-  const fail = (line11, message) => {
-    const diag = makeDgmoError(line11, message);
-    result.diagnostics.push(diag);
-    result.error = formatDgmoError(diag);
-    return result;
-  };
+  const fail = makeFail(result);
   const pushError = (line11, message) => {
     const diag = makeDgmoError(line11, message);
     result.diagnostics.push(diag);
@@ -19938,7 +20341,12 @@ function parseMindmap(content, palette) {
       const indent2 = measureIndent(line11);
       if (indent2 > 0) {
         const { text: cleanEntry, isDefault } = stripDefaultModifier(trimmed);
-        const { label, color } = extractColor(cleanEntry, palette);
+        const { label, color } = extractColor(
+          cleanEntry,
+          palette,
+          result.diagnostics,
+          lineNumber
+        );
         if (isDefault) {
           currentTagGroup.defaultValue = label;
         } else if (currentTagGroup.entries.length === 0) {
@@ -20015,6 +20423,7 @@ function parseMindmap(content, palette) {
     collectAll(result.roots);
     validateTagValues(allNodes, result.tagGroups, pushWarning, suggest);
     validateTagGroupNames(result.tagGroups, pushWarning);
+    cascadeTagMetadata(result.roots, result.tagGroups);
   }
   if (result.roots.length === 0 && !result.error) {
     const diag = makeDgmoError(1, "No nodes found in mindmap");
@@ -20621,7 +21030,12 @@ function parseWireframe(content) {
       }
       if (indent > 0 && currentTagGroup) {
         const { text: cleanEntry, isDefault } = stripDefaultModifier(trimmed);
-        const { label, color } = extractColor(cleanEntry);
+        const { label, color } = extractColor(
+          cleanEntry,
+          void 0,
+          diagnostics,
+          lineNumber
+        );
         currentTagGroup.entries.push({
           value: label,
           color: color ?? AUTO_TAG_COLOR_SENTINEL,
@@ -20869,12 +21283,7 @@ function parseTechRadar(content) {
     diagnostics: [],
     error: null
   };
-  const fail = (line11, message) => {
-    const diag = makeDgmoError(line11, message);
-    result.diagnostics.push(diag);
-    result.error = formatDgmoError(diag);
-    return result;
-  };
+  const fail = makeFail(result);
   const warn = (line11, message) => {
     result.diagnostics.push(makeDgmoError(line11, message, "warning"));
   };
@@ -21242,12 +21651,7 @@ function parseCycle(content) {
   let state = "top";
   let currentNode = null;
   let currentEdge = null;
-  const fail = (line11, message) => {
-    const diag = makeDgmoError(line11, message);
-    result.diagnostics.push(diag);
-    result.error = formatDgmoError(diag);
-    return result;
-  };
+  const fail = makeFail(result);
   const warn = (line11, message, severity = "warning") => {
     result.diagnostics.push(makeDgmoError(line11, message, severity));
   };
@@ -21524,12 +21928,7 @@ function parseJourneyMap(content, palette) {
     diagnostics: [],
     error: null
   };
-  const fail = (line11, message) => {
-    const diag = makeDgmoError(line11, message);
-    result.diagnostics.push(diag);
-    result.error = formatDgmoError(diag);
-    return result;
-  };
+  const fail = makeFail(result);
   const warn = (line11, message) => {
     result.diagnostics.push(makeDgmoError(line11, message, "warning"));
   };
@@ -21678,7 +22077,12 @@ function parseJourneyMap(content, palette) {
     if (currentTagGroup && !contentStarted) {
       if (indent > 0) {
         const { text: cleanEntry, isDefault } = stripDefaultModifier(trimmed);
-        const { label, color } = extractColor(cleanEntry, palette);
+        const { label, color } = extractColor(
+          cleanEntry,
+          palette,
+          result.diagnostics,
+          lineNumber
+        );
         if (isDefault) {
           currentTagGroup.defaultValue = label;
         } else if (currentTagGroup.entries.length === 0) {
@@ -21813,11 +22217,11 @@ function parseJourneyMap(content, palette) {
   const allSteps = hasPhases ? result.phases.flatMap((p) => p.steps) : result.steps;
   for (const step of allSteps) {
     for (const [tagKey, tagValue] of Object.entries(step.tags)) {
-      const groupKey = aliasMap.get(tagKey.toLowerCase()) ?? tagKey.toLowerCase();
-      const validValues = tagValueSets.get(groupKey);
+      const groupKey2 = aliasMap.get(tagKey.toLowerCase()) ?? tagKey.toLowerCase();
+      const validValues = tagValueSets.get(groupKey2);
       if (validValues && !validValues.has(tagValue.toLowerCase())) {
-        const entries = result.tagGroups.find((g) => g.name.toLowerCase() === groupKey)?.entries.map((e) => e.value);
-        let msg = `Unknown tag value "${tagValue}" for group "${groupKey}"`;
+        const entries = result.tagGroups.find((g) => g.name.toLowerCase() === groupKey2)?.entries.map((e) => e.value);
+        let msg = `Unknown tag value "${tagValue}" for group "${groupKey2}"`;
         if (entries) {
           const hint = suggest(tagValue, entries);
           if (hint) msg += `. ${hint}`;
@@ -22050,12 +22454,7 @@ function parsePyramid(content) {
   const lines = content.split("\n");
   let headerParsed = false;
   let currentLayer = null;
-  const fail = (line11, message) => {
-    const diag = makeDgmoError(line11, message);
-    result.diagnostics.push(diag);
-    result.error = formatDgmoError(diag);
-    return result;
-  };
+  const fail = makeFail(result);
   const warn = (line11, message, severity = "warning") => {
     result.diagnostics.push(makeDgmoError(line11, message, severity));
   };
@@ -22202,12 +22601,7 @@ function parseRing(content) {
   const lines = content.split("\n");
   let headerParsed = false;
   let currentLayer = null;
-  const fail = (line11, message) => {
-    const diag = makeDgmoError(line11, message);
-    result.diagnostics.push(diag);
-    result.error = formatDgmoError(diag);
-    return result;
-  };
+  const fail = makeFail(result);
   const warn = (line11, message, severity = "warning") => {
     result.diagnostics.push(makeDgmoError(line11, message, severity));
   };
@@ -22671,12 +23065,7 @@ function parseRaci(content, palette) {
     diagnostics: [],
     error: null
   };
-  const fail = (line11, message) => {
-    const diag = makeDgmoError(line11, message);
-    result.diagnostics.push(diag);
-    result.error = formatDgmoError(diag);
-    return result;
-  };
+  const fail = makeFail(result);
   const warn = (line11, message, code) => {
     result.diagnostics.push(makeDgmoError(line11, message, "warning", code));
   };
@@ -23279,6 +23668,81 @@ function measureInfra(content) {
   const parsed = parseInfra(content);
   return { nodes: parsed.nodes.length };
 }
+function minDimsSequence(c) {
+  return {
+    width: Math.max((c.participants ?? 2) * 80, 320),
+    height: Math.max((c.messages ?? 1) * 20 + 120, 200)
+  };
+}
+function minDimsRaci(c) {
+  return {
+    width: Math.max((c.roles ?? 2) * 50 + 180, 300),
+    height: Math.max((c.tasks ?? 1) * 28 + 80, 200)
+  };
+}
+function minDimsMindmap(c) {
+  return {
+    width: Math.max((c.nodes ?? 3) * 30, 300),
+    height: Math.max((c.depth ?? 2) * 60, 200)
+  };
+}
+function minDimsTechRadar() {
+  return { width: 360, height: 400 };
+}
+function minDimsHeatmap(c) {
+  return {
+    width: Math.max((c.columns ?? 3) * 40, 300),
+    height: Math.max((c.rows ?? 3) * 30 + 60, 200)
+  };
+}
+function minDimsArc(c) {
+  return {
+    width: 300,
+    height: Math.max((c.nodes ?? 3) * 20 + 120, 200)
+  };
+}
+function minDimsOrg(c) {
+  return {
+    width: Math.max((c.nodes ?? 3) * 60, 300),
+    height: Math.max((c.depth ?? 2) * 80, 200)
+  };
+}
+function minDimsGantt(c) {
+  return {
+    width: 400,
+    height: Math.max((c.tasks ?? 3) * 24 + 80, 200)
+  };
+}
+function minDimsKanban(c) {
+  return {
+    width: Math.max((c.columns ?? 3) * 120, 360),
+    height: 300
+  };
+}
+function minDimsEntities(c) {
+  return {
+    width: Math.max((c.nodes ?? 2) * 140, 300),
+    height: Math.max((c.nodes ?? 2) * 80, 200)
+  };
+}
+function minDimsGraph(c) {
+  return {
+    width: Math.max((c.nodes ?? 3) * 60, 300),
+    height: Math.max((c.nodes ?? 3) * 50, 200)
+  };
+}
+function minDimsPert(c) {
+  return {
+    width: Math.max((c.tasks ?? 3) * 80, 340),
+    height: Math.max((c.tasks ?? 3) * 40 + 80, 200)
+  };
+}
+function minDimsInfra(c) {
+  return {
+    width: Math.max((c.nodes ?? 3) * 80, 300),
+    height: Math.max((c.nodes ?? 3) * 60, 200)
+  };
+}
 function isExtendedChartParser(parse) {
   return EXTENDED_CHART_DOORS.has(parse);
 }
@@ -23322,33 +23786,50 @@ var init_chart_type_registry = __esm({
         id: "sequence",
         category: "diagram",
         parse: parseSequenceDgmo,
-        measure: measureSequence
+        measure: measureSequence,
+        minDims: minDimsSequence
       },
       {
         id: "flowchart",
         category: "diagram",
         parse: parseFlowchart,
-        measure: measureFlowchart
+        measure: measureFlowchart,
+        minDims: minDimsGraph
       },
       {
         id: "class",
         category: "diagram",
         parse: parseClassDiagram,
-        measure: measureClass
+        measure: measureClass,
+        minDims: minDimsEntities
+      },
+      {
+        id: "er",
+        category: "diagram",
+        parse: parseERDiagram,
+        measure: measureER,
+        minDims: minDimsEntities
       },
-      { id: "er", category: "diagram", parse: parseERDiagram, measure: measureER },
       {
         id: "state",
         category: "diagram",
         parse: parseState,
-        measure: measureStateGraph
+        measure: measureStateGraph,
+        minDims: minDimsGraph
+      },
+      {
+        id: "org",
+        category: "diagram",
+        parse: parseOrg,
+        measure: measureOrg,
+        minDims: minDimsOrg
       },
-      { id: "org", category: "diagram", parse: parseOrg, measure: measureOrg },
       {
         id: "kanban",
         category: "diagram",
         parse: parseKanban,
-        measure: measureKanban
+        measure: measureKanban,
+        minDims: minDimsKanban
       },
       { id: "c4", category: "diagram", parse: parseC4 },
       { id: "sitemap", category: "diagram", parse: parseSitemap },
@@ -23356,25 +23837,40 @@ var init_chart_type_registry = __esm({
         id: "infra",
         category: "diagram",
         parse: parseInfra,
-        measure: measureInfra
+        measure: measureInfra,
+        minDims: minDimsInfra
       },
       {
         id: "gantt",
         category: "diagram",
         parse: parseGantt,
-        measure: measureGantt
+        measure: measureGantt,
+        minDims: minDimsGantt
+      },
+      {
+        id: "pert",
+        category: "diagram",
+        parse: parsePert,
+        measure: measurePert,
+        minDims: minDimsPert
       },
-      { id: "pert", category: "diagram", parse: parsePert, measure: measurePert },
       { id: "boxes-and-lines", category: "diagram", parse: parseBoxesAndLines },
       {
         id: "mindmap",
         category: "diagram",
         parse: parseMindmap,
-        measure: measureMindmap
+        measure: measureMindmap,
+        minDims: minDimsMindmap
       },
       { id: "wireframe", category: "diagram", parse: parseWireframe },
       { id: "journey-map", category: "diagram", parse: parseJourneyMap },
-      { id: "raci", category: "diagram", parse: parseRaci, measure: measureRaci },
+      {
+        id: "raci",
+        category: "diagram",
+        parse: parseRaci,
+        measure: measureRaci,
+        minDims: minDimsRaci
+      },
       { id: "rasci", category: "diagram", parse: parseRaci, measure: measureRaci },
       { id: "daci", category: "diagram", parse: parseRaci, measure: measureRaci },
       // ── Standard ECharts charts (parseChart) ──────────────────
@@ -23396,7 +23892,8 @@ var init_chart_type_registry = __esm({
         id: "heatmap",
         category: "data-chart",
         parse: parseHeatmap,
-        measure: measureHeatmap
+        measure: measureHeatmap,
+        minDims: minDimsHeatmap
       },
       { id: "funnel", category: "data-chart", parse: parseFunnel },
       // ── D3 visualizations — own per-viz parser door (Story 109.2) ──
@@ -23406,7 +23903,8 @@ var init_chart_type_registry = __esm({
         id: "arc",
         category: "visualization",
         parse: parseArc,
-        measure: measureArc
+        measure: measureArc,
+        minDims: minDimsArc
       },
       { id: "timeline", category: "visualization", parse: parseTimeline },
       { id: "venn", category: "visualization", parse: parseVenn },
@@ -23416,7 +23914,8 @@ var init_chart_type_registry = __esm({
         id: "tech-radar",
         category: "visualization",
         parse: parseTechRadar,
-        measure: measureTechRadar
+        measure: measureTechRadar,
+        minDims: minDimsTechRadar
       },
       { id: "cycle", category: "visualization", parse: parseCycle },
       { id: "pyramid", category: "visualization", parse: parsePyramid },
@@ -24637,7 +25136,7 @@ function nodeStroke(palette, nodeColor2) {
 }
 function containerFill(palette, isDark, nodeColor2) {
   if (nodeColor2) {
-    return mix(nodeColor2, isDark ? palette.surface : palette.bg, 10);
+    return mix(nodeColor2, themeBaseBg(palette, isDark), 10);
   }
   return mix(palette.surface, palette.bg, 40);
 }
@@ -24795,10 +25294,15 @@ function renderOrg(container, parsed, layout, palette, isDark, onClickItem, expo
       const iconY = iconPad;
       const focusG = cG.append("g").attr("class", "org-focus-icon").attr("data-focus-node", c.nodeId).attr("data-export-ignore", "true").attr("transform", `translate(${iconX}, ${iconY})`);
       focusG.append("rect").attr("x", -3).attr("y", -3).attr("width", iconSize + 6).attr("height", iconSize + 6).attr("fill", "transparent");
+      const iconColor = contrastText(
+        fill2,
+        palette.textOnFillLight,
+        palette.textOnFillDark
+      );
       const cx = iconSize / 2;
       const cy = iconSize / 2;
-      focusG.append("circle").attr("cx", cx).attr("cy", cy).attr("r", iconSize / 2 - 1).attr("fill", "none").attr("stroke", palette.textMuted).attr("stroke-width", 1.5);
-      focusG.append("circle").attr("cx", cx).attr("cy", cy).attr("r", 2).attr("fill", palette.textMuted);
+      focusG.append("circle").attr("cx", cx).attr("cy", cy).attr("r", iconSize / 2 - 1).attr("fill", "none").attr("stroke", iconColor).attr("stroke-width", 1.5);
+      focusG.append("circle").attr("cx", cx).attr("cy", cy).attr("r", 2).attr("fill", iconColor);
     }
   }
   for (const edge of layout.edges) {
@@ -24887,10 +25391,11 @@ function renderOrg(container, parsed, layout, palette, isDark, onClickItem, expo
       const iconY = iconPad;
       const focusG = nodeG.append("g").attr("class", "org-focus-icon").attr("data-focus-node", node.id).attr("data-export-ignore", "true").attr("transform", `translate(${iconX}, ${iconY})`);
       focusG.append("rect").attr("x", -3).attr("y", -3).attr("width", iconSize + 6).attr("height", iconSize + 6).attr("fill", "transparent");
+      const iconColor = labelColor;
       const cx = iconSize / 2;
       const cy = iconSize / 2;
-      focusG.append("circle").attr("cx", cx).attr("cy", cy).attr("r", iconSize / 2 - 1).attr("fill", "none").attr("stroke", palette.textMuted).attr("stroke-width", 1.5);
-      focusG.append("circle").attr("cx", cx).attr("cy", cy).attr("r", 2).attr("fill", palette.textMuted);
+      focusG.append("circle").attr("cx", cx).attr("cy", cy).attr("r", iconSize / 2 - 1).attr("fill", "none").attr("stroke", iconColor).attr("stroke-width", 1.5);
+      focusG.append("circle").attr("cx", cx).attr("cy", cy).attr("r", 2).attr("fill", iconColor);
     }
   }
   if (hasAncestorTrail) {
@@ -24987,16 +25492,16 @@ function renderOrg(container, parsed, layout, palette, isDark, onClickItem, expo
       const computedLayout = legendHandle.getLayout();
       if (computedLayout.activeCapsule?.addonX != null) {
         const capsule = computedLayout.activeCapsule;
-        const groupKey = capsule.groupName.toLowerCase();
-        const isHidden = hiddenAttributes?.has(groupKey) ?? false;
+        const groupKey2 = capsule.groupName.toLowerCase();
+        const isHidden = hiddenAttributes?.has(groupKey2) ?? false;
         const activeGroupEl = legendParentBase.select(
-          `[data-legend-group="${groupKey}"]`
+          `[data-legend-group="${groupKey2}"]`
         );
         if (!activeGroupEl.empty()) {
           const eyeX = capsule.addonX;
           const eyeY = (LEGEND_HEIGHT - LEGEND_EYE_SIZE) / 2;
           const hitPad = 6;
-          const eyeG = activeGroupEl.append("g").attr("class", "org-legend-eye").attr("data-legend-visibility", groupKey).style("cursor", "pointer").attr("opacity", isHidden ? 0.4 : 0.7);
+          const eyeG = activeGroupEl.append("g").attr("class", "org-legend-eye").attr("data-legend-visibility", groupKey2).style("cursor", "pointer").attr("opacity", isHidden ? 0.4 : 0.7);
           eyeG.append("rect").attr("x", eyeX - hitPad).attr("y", eyeY - hitPad).attr("width", LEGEND_EYE_SIZE + hitPad * 2).attr("height", LEGEND_EYE_SIZE + hitPad * 2).attr("fill", "transparent").attr("pointer-events", "all");
           eyeG.append("path").attr("d", isHidden ? EYE_CLOSED_PATH : EYE_OPEN_PATH).attr("transform", `translate(${eyeX}, ${eyeY})`).attr("fill", "none").attr("stroke", palette.textMuted).attr("stroke-width", 1.2).attr("stroke-linecap", "round").attr("stroke-linejoin", "round");
         }
@@ -25811,7 +26316,7 @@ function nodeStroke2(_palette, nodeColor2) {
 }
 function containerFill2(palette, isDark, nodeColor2) {
   if (nodeColor2) {
-    return mix(nodeColor2, isDark ? palette.surface : palette.bg, 10);
+    return mix(nodeColor2, themeBaseBg(palette, isDark), 10);
   }
   return mix(palette.surface, palette.bg, 40);
 }
@@ -26114,14 +26619,14 @@ function renderLegend(parent, legendGroups, palette, isDark, activeTagGroup, fix
     const computedLayout = legendHandle.getLayout();
     if (computedLayout.activeCapsule?.addonX != null) {
       const capsule = computedLayout.activeCapsule;
-      const groupKey = capsule.groupName.toLowerCase();
-      const isHidden = hiddenAttributes?.has(groupKey) ?? false;
-      const activeGroupEl = parent.select(`[data-legend-group="${groupKey}"]`);
+      const groupKey2 = capsule.groupName.toLowerCase();
+      const isHidden = hiddenAttributes?.has(groupKey2) ?? false;
+      const activeGroupEl = parent.select(`[data-legend-group="${groupKey2}"]`);
       if (!activeGroupEl.empty()) {
         const eyeX = capsule.addonX;
         const eyeY = (LEGEND_HEIGHT - LEGEND_EYE_SIZE) / 2;
         const hitPad = 6;
-        const eyeG = activeGroupEl.append("g").attr("class", "sitemap-legend-eye").attr("data-legend-visibility", groupKey).style("cursor", "pointer").attr("opacity", isHidden ? 0.4 : 0.7);
+        const eyeG = activeGroupEl.append("g").attr("class", "sitemap-legend-eye").attr("data-legend-visibility", groupKey2).style("cursor", "pointer").attr("opacity", isHidden ? 0.4 : 0.7);
         eyeG.append("rect").attr("x", eyeX - hitPad).attr("y", eyeY - hitPad).attr("width", LEGEND_EYE_SIZE + hitPad * 2).attr("height", LEGEND_EYE_SIZE + hitPad * 2).attr("fill", "transparent").attr("pointer-events", "all");
         eyeG.append("path").attr("d", isHidden ? EYE_CLOSED_PATH : EYE_OPEN_PATH).attr("transform", `translate(${eyeX}, ${eyeY})`).attr("fill", "none").attr("stroke", palette.textMuted).attr("stroke-width", 1.2).attr("stroke-linecap", "round").attr("stroke-linejoin", "round");
       }
@@ -28708,7 +29213,8 @@ function renderBoxesAndLines(container, parsed, layout, palette, isDark, options
     onToggleDescriptions,
     onToggleControlsExpand,
     exportMode = false,
-    controlsHost
+    controlsHost,
+    rampDomain
   } = options ?? {};
   d3Selection11.select(container).selectAll(":not([data-d3-tooltip])").remove();
   const width = exportDims?.width ?? container.clientWidth;
@@ -28728,8 +29234,8 @@ function renderBoxesAndLines(container, parsed, layout, palette, isDark, options
   const sTitleY = sctx.structural(TITLE_Y);
   const nodeValues = parsed.nodes.filter((n) => n.value !== void 0).map((n) => n.value);
   const hasRamp = nodeValues.length > 0;
-  const rampMin = hasRamp ? Math.min(...nodeValues) : 0;
-  const rampMax = Math.max(...nodeValues);
+  const rampMin = rampDomain?.min ?? (hasRamp ? Math.min(...nodeValues) : 0);
+  const rampMax = rampDomain?.max ?? Math.max(...nodeValues);
   const rampHue = resolveColor(parsed.boxMetricColor ?? "", palette) ?? palette.primary;
   const rampLow = parsed.boxMetricLowColor ? resolveColor(parsed.boxMetricLowColor, palette) ?? void 0 : void 0;
   const rampBase = isDark ? mix(palette.surface, palette.text, 28) : palette.bg;
@@ -28881,7 +29387,7 @@ function renderBoxesAndLines(container, parsed, layout, palette, isDark, options
       group.collapsed ? "bl-group bl-group-collapsed" : "bl-group"
     ).attr("data-line-number", String(group.lineNumber)).attr("data-node-id", group.label).attr("data-group-toggle", group.label).style("cursor", "pointer");
     if (group.collapsed) {
-      const fillColor = isDark ? palette.surface : palette.bg;
+      const fillColor = themeBaseBg(palette, isDark);
       const strokeColor = palette.border;
       groupG.append("rect").attr("x", gx).attr("y", gy).attr("width", group.width).attr("height", group.height).attr("rx", NODE_RX).attr("ry", NODE_RX).attr("fill", fillColor).attr("stroke", strokeColor).attr("stroke-width", sNodeStrokeWidth);
       const clipId = `bl-clip-${group.label.replace(/[[\]\s]/g, "")}`;
@@ -28909,8 +29415,8 @@ function renderBoxesAndLines(container, parsed, layout, palette, isDark, options
     const color = edgeColorMap.get(i) ?? palette.textMuted;
     if (hidden.size > 0) {
       let isHidden = false;
-      for (const [groupKey, hiddenVals] of hidden) {
-        const val = le.metadata[groupKey];
+      for (const [groupKey2, hiddenVals] of hidden) {
+        const val = le.metadata[groupKey2];
         if (val && hiddenVals.has(val.toLowerCase())) {
           isHidden = true;
           break;
@@ -29010,8 +29516,8 @@ function renderBoxesAndLines(container, parsed, layout, palette, isDark, options
     if (!node) continue;
     if (hidden.size > 0) {
       let isHidden = false;
-      for (const [groupKey, hiddenVals] of hidden) {
-        const val = node.metadata[groupKey];
+      for (const [groupKey2, hiddenVals] of hidden) {
+        const val = node.metadata[groupKey2];
         if (val && hiddenVals.has(val.toLowerCase())) {
           isHidden = true;
           break;
@@ -29237,6 +29743,15 @@ function renderBoxesAndLines(container, parsed, layout, palette, isDark, options
     });
     legendG.selectAll("[data-legend-group]").classed("bl-legend-group", true);
   }
+  if (!exportDims && !exportMode) {
+    const iconSize = 14;
+    const focusG = svg.append("g").attr("class", "bl-focus-icon").attr("data-export-ignore", "true").style("display", "none").style("pointer-events", "auto").style("cursor", "pointer");
+    focusG.append("rect").attr("x", -3).attr("y", -3).attr("width", iconSize + 6).attr("height", iconSize + 6).attr("fill", "transparent");
+    const cx = iconSize / 2;
+    const cy = iconSize / 2;
+    focusG.append("circle").attr("cx", cx).attr("cy", cy).attr("r", iconSize / 2 - 1).attr("fill", palette.bg).attr("stroke", palette.textMuted).attr("stroke-width", 1.5);
+    focusG.append("circle").attr("cx", cx).attr("cy", cy).attr("r", 2).attr("fill", palette.textMuted);
+  }
 }
 function renderBoxesAndLinesForExport(container, parsed, layout, palette, isDark, options) {
   renderBoxesAndLines(container, parsed, layout, palette, isDark, {
@@ -29833,7 +30348,7 @@ function shuffle(a, r) {
   return x;
 }
 function flatten(d) {
-  const toks = d.match(/[MLQC]|-?\d*\.?\d+(?:e-?\d+)?/gi) ?? [];
+  const toks = d.match(PATH_TOKEN_RE) ?? [];
   const pts = [];
   let i = 0, cx = 0, cy = 0, cmd = "";
   const num = () => parseFloat(toks[i++]);
@@ -29877,17 +30392,10 @@ function flatten(d) {
   }
   return pts;
 }
-function segPoint(p1, p2, p3, p4) {
-  const den = (p2.x - p1.x) * (p4.y - p3.y) - (p2.y - p1.y) * (p4.x - p3.x);
-  if (Math.abs(den) < 1e-9) return null;
-  const t = ((p3.x - p1.x) * (p4.y - p3.y) - (p3.y - p1.y) * (p4.x - p3.x)) / den, u = ((p3.x - p1.x) * (p2.y - p1.y) - (p3.y - p1.y) * (p2.x - p1.x)) / den;
-  return t > 0 && t < 1 && u > 0 && u < 1 ? { x: p1.x + t * (p2.x - p1.x), y: p1.y + t * (p2.y - p1.y) } : null;
-}
-function countSplineCrossings(layout) {
-  const center = /* @__PURE__ */ new Map();
-  for (const n of layout.nodes) center.set(n.label, { x: n.x, y: n.y });
-  for (const g of layout.groups)
-    if (g.collapsed) center.set("__group_" + g.label, { x: g.x, y: g.y });
+function flatPolys(layout) {
+  const key = layout.edges;
+  const hit = FLAT_CACHE.get(key);
+  if (hit) return hit;
   const polys = layout.edges.map((e) => {
     const pts = e.points.length >= 2 ? flatten(splineGen(e.points) ?? "") : [];
     let x0 = Infinity, y0 = Infinity, x1 = -Infinity, y1 = -Infinity;
@@ -29897,8 +30405,24 @@ function countSplineCrossings(layout) {
       if (p.y < y0) y0 = p.y;
       if (p.y > y1) y1 = p.y;
     }
-    return { pts, s: e.source, t: e.target, x0, y0, x1, y1 };
+    return { pts, x0, y0, x1, y1 };
   });
+  FLAT_CACHE.set(key, polys);
+  return polys;
+}
+function segPoint(p1, p2, p3, p4) {
+  const den = (p2.x - p1.x) * (p4.y - p3.y) - (p2.y - p1.y) * (p4.x - p3.x);
+  if (Math.abs(den) < 1e-9) return null;
+  const t = ((p3.x - p1.x) * (p4.y - p3.y) - (p3.y - p1.y) * (p4.x - p3.x)) / den, u = ((p3.x - p1.x) * (p2.y - p1.y) - (p3.y - p1.y) * (p2.x - p1.x)) / den;
+  return t > 0 && t < 1 && u > 0 && u < 1 ? { x: p1.x + t * (p2.x - p1.x), y: p1.y + t * (p2.y - p1.y) } : null;
+}
+function countSplineCrossings(layout, floor = Infinity) {
+  const center = /* @__PURE__ */ new Map();
+  for (const n of layout.nodes) center.set(n.label, { x: n.x, y: n.y });
+  for (const g of layout.groups)
+    if (g.collapsed) center.set("__group_" + g.label, { x: g.x, y: g.y });
+  const polys = flatPolys(layout);
+  const edges = layout.edges;
   const R = 34;
   let total = 0;
   for (let a = 0; a < polys.length; a++)
@@ -29906,23 +30430,33 @@ function countSplineCrossings(layout) {
       const A = polys[a], B = polys[b];
       if (A.pts.length < 2 || B.pts.length < 2) continue;
       if (A.x1 < B.x0 || B.x1 < A.x0 || A.y1 < B.y0 || B.y1 < A.y0) continue;
-      const shared = [A.s, A.t].filter((n) => n === B.s || n === B.t).map((n) => center.get(n)).filter(Boolean);
+      const ea = edges[a], eb = edges[b];
+      let sh0, sh1;
+      if (ea.source === eb.source || ea.source === eb.target)
+        sh0 = center.get(ea.source);
+      if (ea.target === eb.source || ea.target === eb.target)
+        sh1 = center.get(ea.target);
       const hits = [];
-      for (let i = 1; i < A.pts.length; i++)
-        for (let j = 1; j < B.pts.length; j++) {
-          const p = segPoint(
-            A.pts[i - 1],
-            A.pts[i],
-            B.pts[j - 1],
-            B.pts[j]
-          );
+      const ap = A.pts, bp = B.pts;
+      for (let i = 1; i < ap.length; i++) {
+        const a0 = ap[i - 1], a1 = ap[i];
+        const axMin = a0.x < a1.x ? a0.x : a1.x, axMax = a0.x > a1.x ? a0.x : a1.x, ayMin = a0.y < a1.y ? a0.y : a1.y, ayMax = a0.y > a1.y ? a0.y : a1.y;
+        for (let j = 1; j < bp.length; j++) {
+          const b0 = bp[j - 1], b1 = bp[j];
+          if (axMax < (b0.x < b1.x ? b0.x : b1.x)) continue;
+          if ((b0.x > b1.x ? b0.x : b1.x) < axMin) continue;
+          if (ayMax < (b0.y < b1.y ? b0.y : b1.y)) continue;
+          if ((b0.y > b1.y ? b0.y : b1.y) < ayMin) continue;
+          const p = segPoint(a0, a1, b0, b1);
           if (!p) continue;
-          if (shared.some((c) => Math.hypot(p.x - c.x, p.y - c.y) < R))
-            continue;
+          if (sh0 && Math.hypot(p.x - sh0.x, p.y - sh0.y) < R) continue;
+          if (sh1 && Math.hypot(p.x - sh1.x, p.y - sh1.y) < R) continue;
           if (!hits.some((h) => Math.hypot(h.x - p.x, h.y - p.y) < 6))
             hits.push(p);
         }
+      }
       total += hits.length;
+      if (total > floor) return total;
     }
   return total;
 }
@@ -29960,17 +30494,8 @@ function detectEdgeOverlaps(layout, opts) {
         w: g.width,
         h: g.height
       });
-  const polys = layout.edges.map((e) => {
-    const pts = e.points.length >= 2 ? flatten(splineGen(e.points) ?? "") : [];
-    let x0 = Infinity, y0 = Infinity, x1 = -Infinity, y1 = -Infinity;
-    for (const p of pts) {
-      if (p.x < x0) x0 = p.x;
-      if (p.x > x1) x1 = p.x;
-      if (p.y < y0) y0 = p.y;
-      if (p.y > y1) y1 = p.y;
-    }
-    return { pts, s: e.source, t: e.target, x0, y0, x1, y1 };
-  });
+  const polys = flatPolys(layout);
+  const edges = layout.edges;
   const runs = [];
   for (let a = 0; a < polys.length; a++)
     for (let b = a + 1; b < polys.length; b++) {
@@ -29978,7 +30503,12 @@ function detectEdgeOverlaps(layout, opts) {
       if (A.pts.length < 2 || B.pts.length < 2) continue;
       if (A.x1 + dist < B.x0 || B.x1 + dist < A.x0 || A.y1 + dist < B.y0 || B.y1 + dist < A.y0)
         continue;
-      const shared = [A.s, A.t].filter((n) => n === B.s || n === B.t).map((n) => rect.get(n)).filter(Boolean);
+      const ea = edges[a], eb = edges[b];
+      let shr0, shr1;
+      if (ea.source === eb.source || ea.source === eb.target)
+        shr0 = rect.get(ea.source);
+      if (ea.target === eb.source || ea.target === eb.target)
+        shr1 = rect.get(ea.target);
       let run = [];
       let runLen = 0;
       const flush = () => {
@@ -29992,7 +30522,7 @@ function detectEdgeOverlaps(layout, opts) {
         runLen = 0;
       };
       for (const p of A.pts) {
-        const nearShared = shared.some((r) => pointRectDist(p, r) < nodeClear);
+        const nearShared = shr0 !== void 0 && pointRectDist(p, shr0) < nodeClear || shr1 !== void 0 && pointRectDist(p, shr1) < nodeClear;
         const covered = !nearShared && distToPoly(p, B.pts) < dist;
         if (covered) {
           if (run.length)
@@ -30027,9 +30557,10 @@ function detectEdgeNodePierces(layout, opts) {
       });
   const inside = (p, r) => Math.abs(p.x - r.x) < r.w / 2 - inset && Math.abs(p.y - r.y) < r.h / 2 - inset;
   const out = [];
+  const polys = flatPolys(layout);
   layout.edges.forEach((e, idx) => {
     if (e.points.length < 2) return;
-    const poly = flatten(splineGen(e.points) ?? "");
+    const poly = polys[idx].pts;
     for (const r of rects) {
       if (r.key === e.source || r.key === e.target || "__group_" + r.key === e.source || "__group_" + r.key === e.target)
         continue;
@@ -30376,8 +30907,10 @@ function edgeLength(layout) {
       );
   return total;
 }
-function layoutBoxesAndLinesSearch(parsed, collapseInfo, opts) {
+async function layoutBoxesAndLinesSearch(parsed, collapseInfo, opts) {
   const hideDescriptions = opts?.hideDescriptions ?? false;
+  const onProgress = opts?.onProgress;
+  const tick = onProgress ? () => new Promise((r) => setTimeout(r)) : () => void 0;
   const collapsedGroupLabels = /* @__PURE__ */ new Set();
   if (collapseInfo) {
     const missing = /* @__PURE__ */ new Set();
@@ -30791,17 +31324,25 @@ function layoutBoxesAndLinesSearch(parsed, collapseInfo, opts) {
       seed: s
     });
   const badness = (lay, floor) => {
-    const x = countSplineCrossings(lay);
+    const x = countSplineCrossings(lay, floor);
     if (x > floor) return Infinity;
     return x + countEdgeOverlaps(lay) + countEdgeNodePierces(lay) + countGroupOverlaps(lay);
   };
   const objective = (lay, viol) => viol * 1e6 + edgeLength(lay) + lambda * meanDrift(lay, prev) * 10;
+  const progressTotal = configs.length + Math.min(opts?.refineK ?? 6, configs.length);
+  let progressDone = 0;
+  const step = async (phase) => {
+    if (!onProgress) return;
+    onProgress(++progressDone, progressTotal, phase);
+    await tick();
+  };
   const pool = [];
   for (const cfg of configs) {
     try {
       pool.push(place(cfg));
     } catch {
     }
+    await step("Optimizing layout");
   }
   if (!pool.length)
     return place({ ranker: "network-simplex", nodesep: 50, ranksep: 60 });
@@ -30810,9 +31351,9 @@ function layoutBoxesAndLinesSearch(parsed, collapseInfo, opts) {
     layered = layeredCandidates(parsed, sizes);
   } catch {
   }
-  pool.sort(
-    (a, b) => objective(a, countCrossingsFast(a)) - objective(b, countCrossingsFast(b))
-  );
+  const fastKey = /* @__PURE__ */ new Map();
+  for (const lay of pool) fastKey.set(lay, objective(lay, countCrossingsFast(lay)));
+  pool.sort((a, b) => fastKey.get(a) - fastKey.get(b));
   const refineK = Math.min(REFINE_K, pool.length);
   let best = pool[0];
   let bestObj = Infinity;
@@ -30827,7 +31368,10 @@ function layoutBoxesAndLinesSearch(parsed, collapseInfo, opts) {
       best = lay;
     }
   };
-  for (const lay of pool.slice(0, refineK)) consider(lay);
+  for (const lay of pool.slice(0, refineK)) {
+    consider(lay);
+    await step("Refining layout");
+  }
   if (bestBad >= ESCALATE_THRESHOLD && n <= ESCALATE_MAX_N) {
     const extra = [];
     for (let s = seedCount; s < seedCount + ESCALATE_SEEDS; s++) {
@@ -30843,9 +31387,10 @@ function layoutBoxesAndLinesSearch(parsed, collapseInfo, opts) {
       } catch {
       }
     }
-    extra.sort(
-      (a, b) => objective(a, countCrossingsFast(a)) - objective(b, countCrossingsFast(b))
-    );
+    const extraKey = /* @__PURE__ */ new Map();
+    for (const lay of extra)
+      extraKey.set(lay, objective(lay, countCrossingsFast(lay)));
+    extra.sort((a, b) => extraKey.get(a) - extraKey.get(b));
     for (const lay of extra.slice(0, ESCALATE_REFINE)) consider(lay);
   }
   for (const lay of layered) {
@@ -30872,7 +31417,7 @@ function layoutBoxesAndLinesSearch(parsed, collapseInfo, opts) {
   }
   return best;
 }
-var import_dagre4, import_d3_shape, DEFAULT_LAMBDA, ESCALATE_THRESHOLD, ESCALATE_MAX_N, ESCALATE_SEEDS, ESCALATE_REFINE, splineGen, GROUP_LABEL_ZONE2;
+var import_dagre4, import_d3_shape, DEFAULT_LAMBDA, ESCALATE_THRESHOLD, ESCALATE_MAX_N, ESCALATE_SEEDS, ESCALATE_REFINE, splineGen, PATH_TOKEN_RE, FLAT_CACHE, GROUP_LABEL_ZONE2;
 var init_layout_search = __esm({
   "src/boxes-and-lines/layout-search.ts"() {
     "use strict";
@@ -30886,6 +31431,8 @@ var init_layout_search = __esm({
     ESCALATE_SEEDS = 18;
     ESCALATE_REFINE = 10;
     splineGen = (0, import_d3_shape.line)().x((d) => d.x).y((d) => d.y).curve(import_d3_shape.curveBasis);
+    PATH_TOKEN_RE = /[MLQC]|-?\d*\.?\d+(?:e-?\d+)?/gi;
+    FLAT_CACHE = /* @__PURE__ */ new WeakMap();
     GROUP_LABEL_ZONE2 = 32;
   }
 });
@@ -30970,12 +31517,15 @@ function computeNodeSize(node, reserveValueRow) {
 }
 async function layoutBoxesAndLines(parsed, collapseInfo, layoutOptions) {
   const { layoutBoxesAndLinesSearch: layoutBoxesAndLinesSearch2 } = await Promise.resolve().then(() => (init_layout_search(), layout_search_exports));
-  const searched = layoutBoxesAndLinesSearch2(parsed, collapseInfo, {
+  const searched = await layoutBoxesAndLinesSearch2(parsed, collapseInfo, {
     ...layoutOptions?.hideDescriptions !== void 0 && {
       hideDescriptions: layoutOptions.hideDescriptions
     },
     ...layoutOptions?.previousPositions !== void 0 && {
       previousPositions: layoutOptions.previousPositions
+    },
+    ...layoutOptions?.onProgress !== void 0 && {
+      onProgress: layoutOptions.onProgress
     }
   });
   return attachNotes(
@@ -31759,7 +32309,12 @@ function renderMindmap(container, parsed, layout, palette, isDark, onClickItem,
   const titleReserve = fixedTitle ? TITLE_HEIGHT4 : 0;
   const availWidth = containerWidth;
   const availHeight = containerHeight - DIAGRAM_PADDING7 * 2 - legendReserve - titleReserve;
-  const ctx = isExport ? ScaleContext.identity() : ScaleContext.from(availWidth, layout.width);
+  let ctx = isExport ? ScaleContext.identity() : ScaleContext.fromBox(
+    availWidth,
+    layout.width,
+    availHeight,
+    layout.height
+  );
   let renderLayout = layout;
   if (ctx.factor < 1) {
     const hiddenCounts = /* @__PURE__ */ new Map();
@@ -31768,17 +32323,37 @@ function renderMindmap(container, parsed, layout, palette, isDark, onClickItem,
         hiddenCounts.set(n.id, n.hiddenCount);
       }
     }
-    renderLayout = layoutMindmap(parsed, palette, {
+    const relayout = (c) => layoutMindmap(parsed, palette, {
       interactive: !isExport,
       ...hiddenCounts.size > 0 && { hiddenCounts },
       activeTagGroup: activeTagGroup ?? null,
       ...hideDescriptions !== void 0 && { hideDescriptions },
-      ctx
+      ctx: c
     });
+    renderLayout = relayout(ctx);
+    for (let i = 0; i < 3 && !ctx.isBelowFloor; i++) {
+      const refit = Math.min(
+        availWidth / renderLayout.width,
+        availHeight / renderLayout.height
+      );
+      if (refit >= 0.999) break;
+      ctx = ScaleContext.fromFactor(ctx.factor * refit);
+      renderLayout = relayout(ctx);
+    }
   }
-  const offsetX = Math.max(0, (availWidth - renderLayout.width) / 2);
-  const offsetY = DIAGRAM_PADDING7 + legendReserve + titleReserve + Math.max(0, (availHeight - renderLayout.height) / 2);
-  const mainG = svg.append("g").attr("transform", `translate(${offsetX}, ${offsetY})`);
+  const fitScale = isExport ? 1 : Math.min(
+    1,
+    renderLayout.width > 0 ? availWidth / renderLayout.width : 1,
+    renderLayout.height > 0 ? availHeight / renderLayout.height : 1
+  );
+  const scaledWidth = renderLayout.width * fitScale;
+  const scaledHeight = renderLayout.height * fitScale;
+  const offsetX = Math.max(0, (availWidth - scaledWidth) / 2);
+  const offsetY = DIAGRAM_PADDING7 + legendReserve + titleReserve + Math.max(0, (availHeight - scaledHeight) / 2);
+  const mainG = svg.append("g").attr(
+    "transform",
+    `translate(${offsetX}, ${offsetY})${fitScale < 1 ? ` scale(${fitScale})` : ""}`
+  );
   if (ctx.isBelowFloor) {
     svg.attr("width", "100%");
   }
@@ -39142,10 +39717,10 @@ function renderLegend3(rootSvg, legendGroups, totalWidth, legendY, palette, isDa
   });
   legendG.selectAll("[data-legend-group]").classed("infra-legend-group", true);
   for (const group of legendGroups) {
-    const groupKey = group.name.toLowerCase();
+    const groupKey2 = group.name.toLowerCase();
     for (const entry of group.entries) {
       const entryEl = legendG.select(
-        `[data-legend-group="${groupKey}"] [data-legend-entry="${entry.value.toLowerCase()}"]`
+        `[data-legend-group="${groupKey2}"] [data-legend-entry="${entry.value.toLowerCase()}"]`
       );
       if (!entryEl.empty()) {
         entryEl.attr("data-legend-entry", entry.key.toLowerCase()).attr("data-legend-color", entry.color).attr("data-legend-type", group.type).attr(
@@ -41124,7 +41699,7 @@ __export(renderer_exports11, {
   renderPertForExport: () => renderPertForExport
 });
 function analysisBlockChrome(palette, isDark) {
-  const surfaceBg = isDark ? palette.surface : palette.bg;
+  const surfaceBg = themeBaseBg(palette, isDark);
   return {
     fill: mix(palette.surface, palette.bg, 40),
     stroke: mix(palette.textMuted, surfaceBg, 35)
@@ -45836,7 +46411,7 @@ function renderState(container, graph, layout, palette, isDark, onClickItem, exp
     const gy = group.y - sGroupExtraPadding - sGroupLabelFontSize - 4;
     const gw = group.width + sGroupExtraPadding * 2;
     const gh = group.height + sGroupExtraPadding * 2 + sGroupLabelFontSize + 4;
-    const fillColor = group.color ? mix(group.color, isDark ? palette.surface : palette.bg, 10) : isDark ? palette.surface : mix(palette.border, palette.bg, 30);
+    const fillColor = group.color ? mix(group.color, themeBaseBg(palette, isDark), 10) : isDark ? palette.surface : mix(palette.border, palette.bg, 30);
     const strokeColor = group.color ?? palette.textMuted;
     const groupWrapper = contentG.append("g").attr("class", "st-group-wrapper").attr("data-line-number", String(group.lineNumber)).attr("data-group-id", group.id).attr("data-group-toggle", group.id).attr("tabindex", "0").attr("role", "button").attr("aria-expanded", "true").attr("aria-label", `Collapse group ${group.label}`).style("cursor", "pointer");
     groupWrapper.append("rect").attr("x", gx).attr("y", gy).attr("width", gw).attr("height", gh).attr("rx", 6).attr("fill", fillColor).attr("stroke", strokeColor).attr("stroke-width", 1).attr("stroke-opacity", 0.5).attr("class", "st-group");
@@ -50029,6 +50604,16 @@ __export(resolver_exports, {
   isSubNationalUsExtent: () => isSubNationalUsExtent,
   resolveMap: () => resolveMap
 });
+function containerOvershoot(span, usOriented) {
+  if (usOriented) return CONTAINER_OVERSHOOT_MAX;
+  return Math.max(
+    CONTAINER_OVERSHOOT_MIN,
+    Math.min(
+      CONTAINER_OVERSHOOT_MAX,
+      CONTAINER_OVERSHOOT_MAX - CONTAINER_OVERSHOOT_DECAY * span
+    )
+  );
+}
 function bboxArea(b) {
   return (b[1][0] - b[0][0]) * (b[1][1] - b[0][1]);
 }
@@ -50525,7 +51110,7 @@ function resolveMap(parsed, data) {
     const containerUnion = unionExtent(containerBoxes, points);
     if (containerUnion)
       extent3 = pad(
-        clampContainerToCluster(containerUnion, points),
+        clampContainerToCluster(containerUnion, points, usOriented),
         PAD_FRACTION
       );
   }
@@ -50609,17 +51194,21 @@ function mostCommonCountry(regions, poiCountries) {
   }
   return best;
 }
-function clampContainerToCluster(container, points) {
+function clampContainerToCluster(container, points, usOriented) {
   const poi = unionExtent([], points);
   if (!poi) return container;
   let [[west, south], [east, north]] = container;
   const [[pWest, pSouth], [pEast, pNorth]] = poi;
-  south = Math.max(south, pSouth - CONTAINER_OVERSHOOT_DEG);
-  north = Math.min(north, pNorth + CONTAINER_OVERSHOOT_DEG);
-  if (east <= 180 && pEast <= 180) {
-    west = Math.max(west, pWest - CONTAINER_OVERSHOOT_DEG);
-    east = Math.min(east, pEast + CONTAINER_OVERSHOOT_DEG);
-  }
+  const over = containerOvershoot(
+    Math.max(pEast - pWest, pNorth - pSouth),
+    usOriented
+  );
+  south = Math.max(south, pSouth - over);
+  north = Math.min(north, pNorth + over);
+  const wOver = pWest - over;
+  const eOver = pEast + over;
+  west = west >= -180 && west <= pWest ? Math.max(west, wOver) : wOver;
+  east = east <= 180 && east >= pEast ? Math.min(east, eOver) : eOver;
   return [
     [west, south],
     [east, north]
@@ -50637,7 +51226,7 @@ function firstError(diags) {
   const e = diags.find((d) => d.severity === "error");
   return e ? formatDgmoError(e) : null;
 }
-var WORLD_SPAN, MERCATOR_MAX_LAT, PAD_FRACTION, REGION_PAD_FRACTION, WORLD_LAT_SOUTH, WORLD_LAT_NORTH, POI_ZOOM_FLOOR_DEG, CONTAINER_OVERSHOOT_DEG, US_NATIONAL_LON_SPAN, CONUS_BBOX, US_SUBNATIONAL_AREA_FRACTION, REGION_ALIASES, US_STATE_POSTAL;
+var WORLD_SPAN, MERCATOR_MAX_LAT, PAD_FRACTION, REGION_PAD_FRACTION, WORLD_LAT_SOUTH, WORLD_LAT_NORTH, POI_ZOOM_FLOOR_DEG, CONTAINER_OVERSHOOT_MAX, CONTAINER_OVERSHOOT_MIN, CONTAINER_OVERSHOOT_DECAY, US_NATIONAL_LON_SPAN, CONUS_BBOX, US_SUBNATIONAL_AREA_FRACTION, REGION_ALIASES, US_STATE_POSTAL;
 var init_resolver2 = __esm({
   "src/map/resolver.ts"() {
     "use strict";
@@ -50650,7 +51239,9 @@ var init_resolver2 = __esm({
     WORLD_LAT_SOUTH = -58;
     WORLD_LAT_NORTH = 78;
     POI_ZOOM_FLOOR_DEG = 7;
-    CONTAINER_OVERSHOOT_DEG = 8;
+    CONTAINER_OVERSHOOT_MAX = 8;
+    CONTAINER_OVERSHOOT_MIN = 3;
+    CONTAINER_OVERSHOOT_DECAY = 0.3;
     US_NATIONAL_LON_SPAN = 48;
     CONUS_BBOX = [
       [-125, 25],
@@ -50816,12 +51407,12 @@ function tierBand(maxSpanDeg) {
 }
 function labelBudget(width, height, band) {
   const bandCap = {
-    world: 7,
-    continental: 6,
-    regional: 5,
-    local: 4
+    world: 10,
+    continental: 9,
+    regional: 7,
+    local: 6
   };
-  const area2 = Math.floor(Math.sqrt(Math.max(0, width * height)) / 150);
+  const area2 = Math.floor(Math.sqrt(Math.max(0, width * height)) / 105);
   return Math.max(0, Math.min(area2, bandCap[band]));
 }
 function waterEligible(tier, kind, band) {
@@ -50875,6 +51466,11 @@ function rectAround(cx, cy, lines, letterSpacing, font = FONT) {
   const h = (lines.length - 1) * lineHeight + font + 2 * PADY;
   return { x: cx - w / 2, y: cy - h / 2, w, h };
 }
+function rectDist2(px, py, x0, y0, x1, y1) {
+  const dx = Math.max(x0 - px, 0, px - x1);
+  const dy = Math.max(y0 - py, 0, py - y1);
+  return dx * dx + dy * dy;
+}
 function rectFits(r, width, height) {
   return r.x >= 0 && r.y >= 0 && r.x + r.w <= width && r.y + r.h <= height;
 }
@@ -50893,6 +51489,7 @@ function placeContextLabels(args) {
     palette,
     project,
     collides,
+    contentPoints,
     overLand
   } = args;
   void projection;
@@ -50963,8 +51560,17 @@ function placeContextLabels(args) {
     const [x0, y0, x1, y1] = c.bbox;
     const w = x1 - x0;
     const h = y1 - y0;
-    return { c, w, h, area: w * h };
-  }).filter((r) => Number.isFinite(r.area) && r.area > 0).sort((a, b) => b.area - a.area);
+    let dist = Infinity;
+    if (contentPoints?.length) {
+      for (const p of contentPoints) {
+        const d = rectDist2(p[0], p[1], x0, y0, x1, y1);
+        if (d < dist) dist = d;
+      }
+    }
+    return { c, w, h, area: w * h, dist };
+  }).filter((r) => Number.isFinite(r.area) && r.area > 0).sort(
+    (a, b) => contentPoints?.length ? a.dist - b.dist || b.area - a.area : b.area - a.area
+  );
   const canvasLinear = Math.sqrt(Math.max(1, width * height));
   let ci = 0;
   for (const r of ranked) {
@@ -50981,7 +51587,7 @@ function placeContextLabels(args) {
     );
     const fontSize = Math.round(FONT + t * (COUNTRY_FONT_MAX - FONT));
     const fade = Math.round(t * COUNTRY_FADE_MAX);
-    const color = fade > 0 ? mix(countryColor, palette.bg, fade) : countryColor;
+    const color = fade > 0 ? mix(countryColor, palette.bg, 100 - fade) : countryColor;
     const text = c.name;
     const tw = labelWidth(text, 0, fontSize);
     if (tw > w || fontSize + 2 * PADY > h) continue;
@@ -50994,6 +51600,9 @@ function placeContextLabels(args) {
       letterSpacing: 0,
       color,
       fontSize,
+      // Multi-position dodging: carry the ordered interior positions through to the
+      // commit loop. Invariant anchor === positions[0], so `cx/cy` is positions[0].
+      ...c.positions ? { positions: c.positions } : {},
       // Band 1 (orientation-value ranking): above MINOR water (band 2, 2000+) but
       // below MAJOR water — oceans + major seas (band 0, ≤~16). So a big country
       // (US, Canada, Russia) outranks a minor sea/bay (Sargasso, Bahía de
@@ -51008,39 +51617,53 @@ function placeContextLabels(args) {
   const countryCount = candidates.reduce((n, c) => n + (c.italic ? 0 : 1), 0);
   const waterCap = budget - Math.min(2, countryCount);
   let waterPlaced = 0;
-  for (const cand of candidates) {
-    if (placed.length >= budget) break;
-    if (cand.italic && waterPlaced >= waterCap) continue;
+  const gateAt = (cx, cy, cand) => {
     const rect = rectAround(
-      cand.cx,
-      cand.cy,
+      cx,
+      cy,
       cand.lines,
       cand.letterSpacing,
       cand.fontSize
     );
-    if (!rectFits(rect, width, height)) continue;
+    if (!rectFits(rect, width, height)) return null;
     if (cand.italic && overLand) {
       const inset = 2;
-      const top = cand.cy - (cand.lines.length - 1) / 2 * LINE_HEIGHT;
+      const top = cy - (cand.lines.length - 1) / 2 * LINE_HEIGHT;
       const touchesLand = cand.lines.some((line11, li) => {
         const lw = labelWidth(line11, cand.letterSpacing);
-        const x0 = cand.cx - lw / 2 + inset;
-        const x1 = cand.cx + lw / 2 - inset;
-        const xs = [x0, (x0 + cand.cx) / 2, cand.cx, (cand.cx + x1) / 2, x1];
+        const x0 = cx - lw / 2 + inset;
+        const x1 = cx + lw / 2 - inset;
+        const xs = [x0, (x0 + cx) / 2, cx, (cx + x1) / 2, x1];
         const base = top + li * LINE_HEIGHT;
         return [base, base - FONT * 0.4, base - FONT * 0.8].some(
           (y) => xs.some((x) => overLand(x, y))
         );
       });
-      if (touchesLand) continue;
+      if (touchesLand) return null;
     }
-    if (collides(rect)) continue;
-    if (placedRects.some((r) => overlapsPadded(rect, r, CONTEXT_PAD))) continue;
-    placedRects.push(rect);
+    if (collides(rect)) return null;
+    if (placedRects.some((r) => overlapsPadded(rect, r, CONTEXT_PAD)))
+      return null;
+    return rect;
+  };
+  for (const cand of candidates) {
+    if (placed.length >= budget) break;
+    if (cand.italic && waterPlaced >= waterCap) continue;
+    const positions = cand.positions ?? [[cand.cx, cand.cy]];
+    let chosen = null;
+    for (const [px, py] of positions) {
+      const rect = gateAt(px, py, cand);
+      if (rect) {
+        chosen = { x: px, y: py, rect };
+        break;
+      }
+    }
+    if (!chosen) continue;
+    placedRects.push(chosen.rect);
     if (cand.italic) waterPlaced++;
     placed.push({
-      x: cand.cx,
-      y: cand.cy,
+      x: chosen.x,
+      y: chosen.y,
       text: cand.text,
       anchor: "middle",
       color: cand.color,
@@ -51058,7 +51681,7 @@ function placeContextLabels(args) {
   }
   return placed;
 }
-var FONT, LINE_HEIGHT, PADX, PADY, WATER_LETTER_SPACING, CONTEXT_PAD, EDGE_CLAMP_MARGIN, EDGE_CLAMP_OVERSHOOT, COUNTRY_FONT_MAX, COUNTRY_SIZE_FRAC_MIN, COUNTRY_SIZE_FRAC_MAX, COUNTRY_FADE_MAX, KIND_ORDER;
+var FONT, LINE_HEIGHT, PADX, PADY, WATER_LETTER_SPACING, CONTEXT_PAD, EDGE_CLAMP_MARGIN, EDGE_CLAMP_OVERSHOOT, COUNTRY_FONT_MAX, COUNTRY_SIZE_FRAC_MIN, COUNTRY_SIZE_FRAC_MAX, COUNTRY_FADE_MAX, MAX_COUNTRY_POSITIONS, COUNTRY_POS_GRID, COUNTRY_POS_TOPN_MARGIN, KIND_ORDER;
 var init_context_labels = __esm({
   "src/map/context-labels.ts"() {
     "use strict";
@@ -51076,6 +51699,9 @@ var init_context_labels = __esm({
     COUNTRY_SIZE_FRAC_MIN = 0.06;
     COUNTRY_SIZE_FRAC_MAX = 0.32;
     COUNTRY_FADE_MAX = 45;
+    MAX_COUNTRY_POSITIONS = 4;
+    COUNTRY_POS_GRID = 5;
+    COUNTRY_POS_TOPN_MARGIN = 3;
     KIND_ORDER = {
       ocean: 0,
       sea: 1,
@@ -51158,6 +51784,84 @@ function decodeLayer(topo) {
   decodeCache.set(topo, out);
   return out;
 }
+function countryLabelPositions(args) {
+  const { geometry, bounds, project, width, height, curated } = args;
+  const w0 = bounds[0][0];
+  const s0 = bounds[0][1];
+  const e0 = bounds[1][0];
+  const n0 = bounds[1][1];
+  if (![w0, s0, e0, n0].every(Number.isFinite) || e0 <= w0 || n0 <= s0) {
+    return mkCurated(curated, project);
+  }
+  const N = COUNTRY_POS_GRID;
+  const onLand = [];
+  const kept = [];
+  for (let i = 0; i < N; i++) {
+    onLand[i] = [];
+    const lon = w0 + (i + 0.5) / N * (e0 - w0);
+    for (let j = 0; j < N; j++) {
+      const lat = s0 + (j + 0.5) / N * (n0 - s0);
+      const land = pointInGeometry(geometry, lon, lat);
+      onLand[i][j] = land;
+      if (!land) continue;
+      const p = project(lon, lat);
+      if (!p || !Number.isFinite(p[0]) || !Number.isFinite(p[1])) continue;
+      if (p[0] < 0 || p[0] > width || p[1] < 0 || p[1] > height) continue;
+      kept.push({ i, j, lon, lat, sx: p[0], sy: p[1] });
+    }
+  }
+  if (!kept.length) return mkCurated(curated, project);
+  const cx = kept.reduce((s, c) => s + c.sx, 0) / kept.length;
+  const cy = kept.reduce((s, c) => s + c.sy, 0) / kept.length;
+  const interiorness = (c) => {
+    let n = 0;
+    for (let di = -1; di <= 1; di++)
+      for (let dj = -1; dj <= 1; dj++) {
+        if (di === 0 && dj === 0) continue;
+        const ni = c.i + di;
+        const nj = c.j + dj;
+        if (ni >= 0 && ni < N && nj >= 0 && nj < N && onLand[ni][nj]) n++;
+      }
+    return n;
+  };
+  const dist2ToCentre = (c) => (c.sx - cx) ** 2 + (c.sy - cy) ** 2;
+  const pool = [...kept];
+  pool.sort((a, b) => {
+    const d = interiorness(b) - interiorness(a);
+    return d !== 0 ? d : dist2ToCentre(a) - dist2ToCentre(b);
+  });
+  const ordered = [pool.shift()];
+  while (ordered.length < MAX_COUNTRY_POSITIONS && pool.length) {
+    let bestIdx = 0;
+    let bestMin = -1;
+    for (let k = 0; k < pool.length; k++) {
+      const c = pool[k];
+      let minD = Infinity;
+      for (const o of ordered) {
+        const d = (c.sx - o.sx) ** 2 + (c.sy - o.sy) ** 2;
+        if (d < minD) minD = d;
+      }
+      if (minD > bestMin) {
+        bestMin = minD;
+        bestIdx = k;
+      }
+    }
+    ordered.push(pool.splice(bestIdx, 1)[0]);
+  }
+  const grid = ordered.map((c) => ({
+    lonLat: [c.lon, c.lat],
+    screen: [c.sx, c.sy]
+  }));
+  const curatedPos = curated ? mkCurated(curated, project) : [];
+  const out = [...curatedPos, ...grid].slice(0, MAX_COUNTRY_POSITIONS);
+  return out;
+}
+function mkCurated(curated, project) {
+  if (!curated) return [];
+  const p = project(curated[0], curated[1]);
+  if (!p || !Number.isFinite(p[0]) || !Number.isFinite(p[1])) return [];
+  return [{ lonLat: [curated[0], curated[1]], screen: [p[0], p[1]] }];
+}
 function projectionFor(family, extent3) {
   switch (family) {
     case "albers-usa":
@@ -51985,6 +52689,8 @@ function layoutMap(resolvedIn, data, size, opts) {
         if (p[1] < minY) minY = p[1];
         if (p[1] > maxY) maxY = p[1];
       }
+    r.bbox = [minX, minY, maxX, maxY];
+    r.rings = rings;
     return { fill: r.fill, rings, minX, minY, maxX, maxY };
   });
   const fillAt = (x, y) => {
@@ -53175,6 +53881,7 @@ function layoutMap(resolvedIn, data, size, opts) {
     for (const box of insets)
       obstacles.push({ x: box.x, y: box.y, w: box.w, h: box.h });
     const countryCandidates = [];
+    const rawCountries = [];
     for (const f of worldLayer.values()) {
       const iso = typeof f.id === "string" ? f.id : String(f.id ?? "");
       if (!iso || regionById.has(iso)) continue;
@@ -53191,11 +53898,59 @@ function layoutMap(resolvedIn, data, size, opts) {
       if (!Number.isFinite(x0) || !Number.isFinite(x1)) continue;
       const anchorLngLat = WORLD_LABEL_ANCHORS[iso];
       const a = anchorLngLat ? project(anchorLngLat[0], anchorLngLat[1]) : path.centroid(f);
-      countryCandidates.push({
+      rawCountries.push({
+        f,
+        iso,
         name: f.properties?.name ?? iso,
         bbox: [x0, y0, x1, y1],
         anchor: a && Number.isFinite(a[0]) ? [a[0], a[1]] : null,
-        curatedAnchor: !!anchorLngLat
+        curatedLngLat: anchorLngLat ?? null,
+        area: (x1 - x0) * (y1 - y0)
+      });
+    }
+    const cBand = tierBand(Math.max(dLonSpan, dLatSpan));
+    const cBudget = labelBudget(width, height, cBand);
+    const contentPoints = markers.map((m) => [m.cx, m.cy]);
+    const topN = cBudget + COUNTRY_POS_TOPN_MARGIN;
+    const rankOrder = rawCountries.map((r, idx) => {
+      let dist = Infinity;
+      const [x0, y0, x1, y1] = r.bbox;
+      for (const [px, py] of contentPoints) {
+        const dx = Math.max(x0 - px, 0, px - x1);
+        const dy = Math.max(y0 - py, 0, py - y1);
+        const d = dx * dx + dy * dy;
+        if (d < dist) dist = d;
+      }
+      return { idx, area: r.area, dist };
+    }).filter((r) => Number.isFinite(r.area) && r.area > 0).sort(
+      (a, b) => contentPoints.length ? a.dist - b.dist || b.area - a.area : b.area - a.area
+    ).slice(0, topN);
+    const genIdx = new Set(rankOrder.map((r) => r.idx));
+    for (let i = 0; i < rawCountries.length; i++) {
+      const r = rawCountries[i];
+      let anchor = r.anchor;
+      let positions;
+      if (genIdx.has(i) && anchor) {
+        const gb = (0, import_d3_geo2.geoBounds)(r.f);
+        const gen = countryLabelPositions({
+          geometry: r.f.geometry,
+          bounds: gb,
+          project,
+          width,
+          height,
+          curated: r.curatedLngLat
+        });
+        if (gen.length) {
+          positions = gen.map((p) => p.screen);
+          anchor = positions[0];
+        }
+      }
+      countryCandidates.push({
+        name: r.name,
+        bbox: r.bbox,
+        anchor,
+        curatedAnchor: !!r.curatedLngLat,
+        ...positions ? { positions } : {}
       });
     }
     const framedStateContainers = (resolved.poiFrameContainers ?? []).some(
@@ -53229,6 +53984,7 @@ function layoutMap(resolvedIn, data, size, opts) {
       palette,
       project,
       collides,
+      contentPoints,
       // Water labels must stay over open water — `fillAt` returns the ocean
       // backdrop colour off-land and a region fill on-land (lakes/states count
       // as land here, which is the safe side for an ocean name).
@@ -53482,7 +54238,7 @@ function ringToCoastPaths(ring, frame) {
 function coastlineOuterRings(regions, minExtent, frame) {
   const paths = [];
   for (const r of regions) {
-    const rings = parsePathRings(r.d);
+    const rings = r.rings ?? parsePathRings(r.d);
     for (let i = 0; i < rings.length; i++) {
       const ring = rings[i];
       if (ring.length < 3) continue;
@@ -53677,14 +54433,22 @@ function renderMap(container, resolved, data, palette, isDark, onClickItem, expo
       if (decoCluster !== void 0)
         gPatch.attr("data-cluster-deco", decoCluster);
       for (const r of layout.regions) {
-        let minX = Infinity, minY = Infinity, maxX = -Infinity, maxY = -Infinity;
-        for (const ring of parsePathRings(r.d))
-          for (const [px, py] of ring) {
-            if (px < minX) minX = px;
-            if (px > maxX) maxX = px;
-            if (py < minY) minY = py;
-            if (py > maxY) maxY = py;
-          }
+        let minX, minY, maxX, maxY;
+        if (r.bbox) {
+          [minX, minY, maxX, maxY] = r.bbox;
+        } else {
+          minX = Infinity;
+          minY = Infinity;
+          maxX = -Infinity;
+          maxY = -Infinity;
+          for (const ring of parsePathRings(r.d))
+            for (const [px, py] of ring) {
+              if (px < minX) minX = px;
+              if (px > maxX) maxX = px;
+              if (py < minY) minY = py;
+              if (py > maxY) maxY = py;
+            }
+        }
         const hit = blobRects.some(
           (b) => minX <= b.x1 && maxX >= b.x0 && minY <= b.y1 && maxY >= b.y0
         );
@@ -54912,7 +55676,7 @@ function renderRaci(container, parsed, palette, isDark, handlers, exportDims) {
   const tasksAll = [...allTasks(parsed)];
   if (tasksAll.length === 0 && parsed.phases.length === 0) return;
   const solid = parsed.options["solid-fill"] === "on";
-  const surfaceBg = isDark ? palette.surface : palette.bg;
+  const surfaceBg = themeBaseBg(palette, isDark);
   const roleCount = Math.max(1, parsed.roles.length);
   const idealWidth = roleCount * ROLE_COL_MAX + TASK_LABEL_MAX + 2 * H_MARGIN;
   const ctx = exportDims ? ScaleContext.identity() : ScaleContext.from(width, idealWidth);
@@ -55090,10 +55854,10 @@ function renderRaci(container, parsed, palette, isDark, handlers, exportDims) {
     const cx = roleX(i) + sColumnInset;
     const cw = roleColW - 2 * sColumnInset;
     const roleColor = parsed.roleColors[i] ?? autoAccent(i, palette);
-    const bodyFill = mix(roleColor, isDark ? palette.surface : palette.bg, 16);
+    const bodyFill = mix(roleColor, themeBaseBg(palette, isDark), 16);
     const headerFill = mix(
       roleColor,
-      isDark ? palette.surface : palette.bg,
+      themeBaseBg(palette, isDark),
       30
     );
     const colG = columnsG.append("g").attr("class", "raci-column").attr("data-role-id", roleId);
@@ -55682,15 +56446,15 @@ function propagateGroupTags(participantMeta, groups) {
     }
   }
 }
-function computeReceiverInheritance(participants, messages, groupKey, participantMeta) {
+function computeReceiverInheritance(participants, messages, groupKey2, participantMeta) {
   const inheritance = /* @__PURE__ */ new Map();
   for (const p of participants) {
     const meta = participantMeta.get(p.id);
-    if (meta?.[groupKey]) continue;
+    if (meta?.[groupKey2]) continue;
     const incomingValues = /* @__PURE__ */ new Set();
     for (const msg of messages) {
-      if (msg.to === p.id && msg.metadata?.[groupKey]) {
-        incomingValues.add(msg.metadata[groupKey]);
+      if (msg.to === p.id && msg.metadata?.[groupKey2]) {
+        incomingValues.add(msg.metadata[groupKey2]);
       }
     }
     if (incomingValues.size === 1) {
@@ -55716,7 +56480,7 @@ function resolveSequenceTags(parsed, activeTagGroup) {
     }
     return result;
   }
-  const groupKey = group.name.toLowerCase();
+  const groupKey2 = group.name.toLowerCase();
   const participantMeta = /* @__PURE__ */ new Map();
   for (const p of parsed.participants) {
     participantMeta.set(p.id, { ...p.metadata || {} });
@@ -55725,27 +56489,27 @@ function resolveSequenceTags(parsed, activeTagGroup) {
   const inherited = computeReceiverInheritance(
     parsed.participants,
     parsed.messages,
-    groupKey,
+    groupKey2,
     participantMeta
   );
   for (const [id, value] of inherited) {
     const meta = participantMeta.get(id);
-    meta[groupKey] = value;
+    meta[groupKey2] = value;
   }
   if (group.defaultValue) {
     for (const p of parsed.participants) {
       const meta = participantMeta.get(p.id);
-      if (!(groupKey in meta)) {
-        meta[groupKey] = group.defaultValue;
+      if (!(groupKey2 in meta)) {
+        meta[groupKey2] = group.defaultValue;
       }
     }
   }
   for (const p of parsed.participants) {
     const meta = participantMeta.get(p.id);
-    result.participants.set(p.id, meta[groupKey] || void 0);
+    result.participants.set(p.id, meta[groupKey2] || void 0);
   }
   for (const msg of parsed.messages) {
-    result.messages.set(msg.lineNumber, msg.metadata?.[groupKey] || void 0);
+    result.messages.set(msg.lineNumber, msg.metadata?.[groupKey2] || void 0);
   }
   return result;
 }
@@ -56820,7 +57584,7 @@ function renderSequenceDiagram(container, parsed, palette, isDark, _onNavigateTo
     const groupTagColor = getTagColor(groupTagValue || void 0);
     const fillColor = groupTagColor ? mix(
       groupTagColor,
-      isDark ? palette.surface : palette.bg,
+      themeBaseBg(palette, isDark),
       isDark ? 15 : 20
     ) : isDark ? palette.surface : palette.bg;
     const strokeColor = groupTagColor || palette.textMuted;
@@ -56874,7 +57638,7 @@ function renderSequenceDiagram(container, parsed, palette, isDark, _onNavigateTo
       participantG.append("title").text("Click to expand");
       const pFill = effectiveTagColor ? mix(
         effectiveTagColor,
-        isDark ? palette.surface : palette.bg,
+        themeBaseBg(palette, isDark),
         isDark ? 30 : 40
       ) : isDark ? mix(palette.overlay, palette.surface, 50) : mix(palette.bg, palette.surface, 50);
       const pStroke = effectiveTagColor || palette.border;
@@ -57081,7 +57845,7 @@ function renderSequenceDiagram(container, parsed, palette, isDark, _onNavigateTo
     const actTagValue = triggerMsg ? tagMap?.messages.get(triggerMsg.lineNumber) : void 0;
     const actTagColor = getTagColor(actTagValue);
     const actBaseColor = actTagColor || palette.primary;
-    svg.append("rect").attr("x", x).attr("y", y1).attr("width", sActivationWidth).attr("height", y2 - y1).attr("fill", isDark ? palette.surface : palette.bg);
+    svg.append("rect").attr("x", x).attr("y", y1).attr("width", sActivationWidth).attr("height", y2 - y1).attr("fill", themeBaseBg(palette, isDark));
     const actFill = shapeFill(palette, actBaseColor, isDark, { solid });
     const actRect = svg.append("rect").attr("x", x).attr("y", y1).attr("width", sActivationWidth).attr("height", y2 - y1).attr("fill", actFill).attr("stroke", actBaseColor).attr("stroke-width", 1).attr("stroke-opacity", 0.5).attr("data-participant-id", act.participantId).attr("data-msg-lines", coveredLines.join(",")).attr("data-line-number", coveredLines[0] ?? "").attr("class", "activation");
     if (tagKey && actTagValue) {
@@ -57883,6 +58647,8 @@ __export(advanced_exports, {
   CHART_TYPE_DESCRIPTIONS: () => CHART_TYPE_DESCRIPTIONS,
   ECHART_EXPORT_WIDTH: () => ECHART_EXPORT_WIDTH,
   INFRA_BEHAVIOR_KEYS: () => INFRA_BEHAVIOR_KEYS,
+  INVALID_COLOR_CODE: () => INVALID_COLOR_CODE,
+  INVALID_CSS_COLOR_HEX: () => INVALID_CSS_COLOR_HEX,
   LEGEND_GEAR_PILL_W: () => LEGEND_GEAR_PILL_W,
   LEGEND_HEIGHT: () => LEGEND_HEIGHT,
   RACI_ERROR_CODES: () => RACI_ERROR_CODES,
@@ -57944,6 +58710,7 @@ __export(advanced_exports, {
   extractInfraSymbols: () => extractSymbols4,
   extractPertSymbols: () => extractPertSymbols,
   findUnsafePipePositions: () => findUnsafePipePositions,
+  focusBoxesAndLines: () => focusBoxesAndLines,
   focusOrgTree: () => focusOrgTree,
   formatDateLabel: () => formatDateLabel,
   formatDgmoError: () => formatDgmoError,
@@ -57964,8 +58731,10 @@ __export(advanced_exports, {
   hslToHex: () => hslToHex,
   inferParticipantType: () => inferParticipantType,
   inferRoles: () => inferRoles,
+  invalidColorDiagnostic: () => invalidColorDiagnostic,
   isArchiveColumn: () => isArchiveColumn,
   isExtendedChartType: () => isExtendedChartType,
+  isInvalidColorToken: () => isInvalidColorToken,
   isLegacyMetadataLine: () => isLegacyMetadataLine,
   isRecognizedColorName: () => isRecognizedColorName,
   isSequenceBlock: () => isSequenceBlock,
@@ -58006,6 +58775,7 @@ __export(advanced_exports, {
   migrateContent: () => migrateContent,
   mix: () => mix,
   mulberry32: () => mulberry32,
+  nearestNamedColor: () => nearestNamedColor,
   nord: () => nord,
   nordPalette: () => nordPalette,
   normalizeName: () => normalizeName,
@@ -59048,7 +59818,7 @@ function setupTimeline(container, parsed, palette, isDark, exportDims, activeTag
   const textColor = palette.text;
   const mutedColor = palette.border;
   const bgColor = palette.bg;
-  const bg = isDark ? palette.surface : palette.bg;
+  const bg = themeBaseBg(palette, isDark);
   const colors = getSeriesColors(palette);
   const groupColorMap = /* @__PURE__ */ new Map();
   timelineGroups.forEach((grp, i) => {
@@ -59381,10 +60151,10 @@ function renderTimelineTagLegendOverlay(container, parsed, palette, isDark, setu
           }
         },
         onGroupRendered: (groupName, groupEl, isActive) => {
-          const groupKey = groupName.toLowerCase();
-          groupEl.attr("data-tag-group", groupKey);
+          const groupKey2 = groupName.toLowerCase();
+          groupEl.attr("data-tag-group", groupKey2);
           if (isActive && !viewMode) {
-            const isSwimActive = currentSwimlaneGroup?.toLowerCase() === groupKey;
+            const isSwimActive = currentSwimlaneGroup?.toLowerCase() === groupKey2;
             const pillWidth2 = measureLegendText(groupName, LG_PILL_FONT_SIZE) + LG_PILL_PAD;
             const pillXOff = LG_CAPSULE_PAD;
             const iconX = pillXOff + pillWidth2 + 5;
@@ -59395,9 +60165,9 @@ function renderTimelineTagLegendOverlay(container, parsed, palette, isDark, setu
               iconY,
               isSwimActive
             );
-            iconEl.attr("data-swimlane-toggle", groupKey).on("click", (event) => {
+            iconEl.attr("data-swimlane-toggle", groupKey2).on("click", (event) => {
               event.stopPropagation();
-              currentSwimlaneGroup = currentSwimlaneGroup === groupKey ? null : groupKey;
+              currentSwimlaneGroup = currentSwimlaneGroup === groupKey2 ? null : groupKey2;
               onTagStateChange?.(
                 currentActiveGroup,
                 currentSwimlaneGroup
@@ -59463,9 +60233,10 @@ function renderTimelineTagLegendOverlay(container, parsed, palette, isDark, setu
     drawLegend2();
   }
 }
-function renderTimelineHorizontalTimeSort(container, parsed, palette, isDark, setup, hovers, onClickItem, _exportDims, _swimlaneTagGroup, _activeTagGroup, _onTagStateChange, _viewMode) {
+function renderTimelineHorizontalTimeSort(container, parsed, palette, isDark, setup, hovers, onClickItem, exportDims, _swimlaneTagGroup, _activeTagGroup, _onTagStateChange, _viewMode) {
   const {
     width,
+    height,
     tooltip,
     solid,
     textColor,
@@ -59517,9 +60288,11 @@ function renderTimelineHorizontalTimeSort(container, parsed, palette, isDark, se
   const rowH = ctx.structural(28);
   const innerHeight = rowH * sorted.length;
   const usedHeight = margin.top + innerHeight + margin.bottom;
+  const fitToContainer = !exportDims && height > 0 && usedHeight > height;
+  const svgHeight = fitToContainer ? height : usedHeight;
   const xScale = d3Scale3.scaleLinear().domain([minDate - datePadding, maxDate + datePadding]).range([0, innerWidth]);
-  const svg = d3Selection3.select(container).append("svg").attr("width", width).attr("height", usedHeight).attr("viewBox", `0 0 ${width} ${usedHeight}`).attr("preserveAspectRatio", "xMidYMin meet").style("background", bgColor);
-  if (ctx.isBelowFloor) {
+  const svg = d3Selection3.select(container).append("svg").attr("width", width).attr("height", svgHeight).attr("viewBox", `0 0 ${width} ${usedHeight}`).attr("preserveAspectRatio", "xMidYMin meet").style("background", bgColor);
+  if (ctx.isBelowFloor && !fitToContainer) {
     svg.attr("width", "100%");
   }
   const g = svg.append("g").attr("transform", `translate(${margin.left},${margin.top})`);
@@ -61253,7 +62026,7 @@ function renderQuadrant(container, parsed, palette, isDark, onClickItem, exportD
     onClickItem
   );
   const chartG = svg.append("g").attr("transform", `translate(${margin.left}, ${margin.top})`);
-  const bg = isDark ? palette.surface : palette.bg;
+  const bg = themeBaseBg(palette, isDark);
   const getQuadrantColor = (label, defaultIdx) => {
     return label?.color ?? defaultColors[defaultIdx % defaultColors.length];
   };
@@ -61592,18 +62365,22 @@ async function renderForExport(content, theme, palette, viewState, options) {
     palette,
     viewState,
     options,
-    exportMode
+    exportMode,
+    isDark: theme === "dark"
   };
   const handler = detectedType !== null ? DIAGRAM_EXPORT_HANDLERS[detectedType] : void 0;
   return (handler ?? exportVisualization)(ctx);
 }
+function ctxTagOverride(ctx) {
+  return ctx.viewState?.tag ?? ctx.options?.tagGroup;
+}
 async function exportOrg(ctx) {
-  const { content, theme, palette, viewState, options, exportMode } = ctx;
+  const { content, theme, palette, viewState, exportMode } = ctx;
   const { parseOrg: parseOrg2 } = await Promise.resolve().then(() => (init_parser10(), parser_exports4));
   const { layoutOrg: layoutOrg2 } = await Promise.resolve().then(() => (init_layout(), layout_exports));
   const { collapseOrgTree: collapseOrgTree2 } = await Promise.resolve().then(() => (init_collapse(), collapse_exports));
   const { renderOrg: renderOrg2 } = await Promise.resolve().then(() => (init_renderer(), renderer_exports));
-  const isDark = theme === "dark";
+  const isDark = ctx.isDark;
   const effectivePalette = await resolveExportPalette(theme, palette);
   const orgParsed = parseOrg2(content, effectivePalette);
   if (orgParsed.error) return "";
@@ -61611,7 +62388,7 @@ async function exportOrg(ctx) {
   const activeTagGroup = resolveActiveTagGroup(
     orgParsed.tagGroups,
     orgParsed.options["active-tag"],
-    viewState?.tag ?? options?.tagGroup
+    ctxTagOverride(ctx)
   );
   const hiddenAttributes = viewState?.ha ? new Set(viewState.ha) : void 0;
   const { parsed: effectiveParsed, hiddenCounts } = collapsedNodes && collapsedNodes.size > 0 ? collapseOrgTree2(orgParsed, collapsedNodes) : { parsed: orgParsed, hiddenCounts: /* @__PURE__ */ new Map() };
@@ -61644,12 +62421,12 @@ async function exportOrg(ctx) {
   return finalizeSvgExport(container, theme, effectivePalette);
 }
 async function exportSitemap(ctx) {
-  const { content, theme, palette, viewState, options, exportMode } = ctx;
+  const { content, theme, palette, viewState, exportMode } = ctx;
   const { parseSitemap: parseSitemap2 } = await Promise.resolve().then(() => (init_parser11(), parser_exports5));
   const { layoutSitemap: layoutSitemap2 } = await Promise.resolve().then(() => (init_layout2(), layout_exports2));
   const { collapseSitemapTree: collapseSitemapTree2 } = await Promise.resolve().then(() => (init_collapse2(), collapse_exports2));
   const { renderSitemap: renderSitemap2 } = await Promise.resolve().then(() => (init_renderer2(), renderer_exports2));
-  const isDark = theme === "dark";
+  const isDark = ctx.isDark;
   const effectivePalette = await resolveExportPalette(theme, palette);
   const sitemapParsed = parseSitemap2(content, effectivePalette);
   if (sitemapParsed.error || sitemapParsed.roots.length === 0) return "";
@@ -61657,7 +62434,7 @@ async function exportSitemap(ctx) {
   const activeTagGroup = resolveActiveTagGroup(
     sitemapParsed.tagGroups,
     sitemapParsed.options["active-tag"],
-    viewState?.tag ?? options?.tagGroup
+    ctxTagOverride(ctx)
   );
   const hiddenAttributes = viewState?.ha ? new Set(viewState.ha) : void 0;
   const { parsed: effectiveParsed, hiddenCounts } = collapsedNodes && collapsedNodes.size > 0 ? collapseSitemapTree2(sitemapParsed, collapsedNodes) : { parsed: sitemapParsed, hiddenCounts: /* @__PURE__ */ new Map() };
@@ -61688,7 +62465,7 @@ async function exportSitemap(ctx) {
   return finalizeSvgExport(container, theme, effectivePalette);
 }
 async function exportKanban(ctx) {
-  const { content, theme, palette, viewState, options, exportMode } = ctx;
+  const { content, theme, palette, viewState, exportMode } = ctx;
   const { parseKanban: parseKanban2 } = await Promise.resolve().then(() => (init_parser13(), parser_exports7));
   const { renderKanban: renderKanban2 } = await Promise.resolve().then(() => (init_renderer3(), renderer_exports3));
   const effectivePalette = await resolveExportPalette(theme, palette);
@@ -61700,11 +62477,11 @@ async function exportKanban(ctx) {
   document.body.appendChild(container);
   const kanbanCollapsedLanes = viewState?.cl ? new Set(viewState.cl) : void 0;
   const kanbanCollapsedColumns = viewState?.cc ? new Set(viewState.cc) : void 0;
-  renderKanban2(container, kanbanParsed, effectivePalette, theme === "dark", {
+  renderKanban2(container, kanbanParsed, effectivePalette, ctx.isDark, {
     activeTagGroup: resolveActiveTagGroup(
       kanbanParsed.tagGroups,
       kanbanParsed.options["active-tag"],
-      viewState?.tag ?? options?.tagGroup
+      ctxTagOverride(ctx)
     ),
     currentSwimlaneGroup: viewState?.swim ?? null,
     ...kanbanCollapsedLanes !== void 0 && {
@@ -61737,7 +62514,7 @@ async function exportClass(ctx) {
     classParsed,
     classLayout,
     effectivePalette,
-    theme === "dark",
+    ctx.isDark,
     void 0,
     { width: exportWidth, height: exportHeight },
     void 0,
@@ -61746,7 +62523,7 @@ async function exportClass(ctx) {
   return finalizeSvgExport(container, theme, effectivePalette);
 }
 async function exportEr(ctx) {
-  const { content, theme, palette, viewState, options, exportMode } = ctx;
+  const { content, theme, palette, viewState, exportMode } = ctx;
   const { parseERDiagram: parseERDiagram2 } = await Promise.resolve().then(() => (init_parser9(), parser_exports3));
   const { layoutERDiagram: layoutERDiagram2 } = await Promise.resolve().then(() => (init_layout4(), layout_exports4));
   const { renderERDiagram: renderERDiagram2 } = await Promise.resolve().then(() => (init_renderer5(), renderer_exports5));
@@ -61764,13 +62541,13 @@ async function exportEr(ctx) {
     erParsed,
     erLayout,
     effectivePalette,
-    theme === "dark",
+    ctx.isDark,
     void 0,
     { width: exportWidth, height: exportHeight },
     resolveActiveTagGroup(
       erParsed.tagGroups,
       erParsed.options["active-tag"],
-      viewState?.tag ?? options?.tagGroup
+      ctxTagOverride(ctx)
     ),
     viewState?.sem,
     exportMode
@@ -61778,7 +62555,7 @@ async function exportEr(ctx) {
   return finalizeSvgExport(container, theme, effectivePalette);
 }
 async function exportBoxesAndLines(ctx) {
-  const { content, theme, palette, viewState, options, exportMode } = ctx;
+  const { content, theme, palette, viewState, exportMode } = ctx;
   const { parseBoxesAndLines: parseBoxesAndLines2 } = await Promise.resolve().then(() => (init_parser18(), parser_exports12));
   const effectivePalette = await resolveExportPalette(theme, palette);
   const blParsed = parseBoxesAndLines2(content, effectivePalette);
@@ -61798,13 +62575,13 @@ async function exportBoxesAndLines(ctx) {
   const exportWidth = blLayout.width + PADDING3 * 2;
   const exportHeight = blLayout.height + PADDING3 * 2 + titleOffset;
   const container = createExportContainer(exportWidth, exportHeight);
-  const blActiveTagGroup = viewState?.tag ?? options?.tagGroup;
+  const blActiveTagGroup = ctxTagOverride(ctx);
   renderBoxesAndLinesForExport2(
     container,
     blParsed,
     blLayout,
     effectivePalette,
-    theme === "dark",
+    ctx.isDark,
     {
       exportDims: { width: exportWidth, height: exportHeight },
       ...blActiveTagGroup !== void 0 && {
@@ -61819,12 +62596,12 @@ async function exportBoxesAndLines(ctx) {
   return finalizeSvgExport(container, theme, effectivePalette);
 }
 async function exportMindmap(ctx) {
-  const { content, theme, palette, viewState, options, exportMode } = ctx;
+  const { content, theme, palette, viewState, exportMode } = ctx;
   const { parseMindmap: parseMindmap2 } = await Promise.resolve().then(() => (init_parser19(), parser_exports13));
   const { layoutMindmap: layoutMindmap2 } = await Promise.resolve().then(() => (init_layout6(), layout_exports6));
   const { collapseMindmapTree: collapseMindmapTree2 } = await Promise.resolve().then(() => (init_collapse3(), collapse_exports3));
   const { renderMindmap: renderMindmap2 } = await Promise.resolve().then(() => (init_renderer7(), renderer_exports7));
-  const isDark = theme === "dark";
+  const isDark = ctx.isDark;
   const effectivePalette = await resolveExportPalette(theme, palette);
   const mmParsed = parseMindmap2(content, effectivePalette);
   if (mmParsed.error) return "";
@@ -61832,7 +62609,7 @@ async function exportMindmap(ctx) {
   const activeTagGroup = resolveActiveTagGroup(
     mmParsed.tagGroups,
     mmParsed.options["active-tag"],
-    viewState?.tag ?? options?.tagGroup
+    ctxTagOverride(ctx)
   );
   const hideDescriptions = mmParsed.options["no-descriptions"] === "true" || viewState?.hd === true;
   const { roots: effectiveRoots, hiddenCounts } = collapsedNodes && collapsedNodes.size > 0 ? collapseMindmapTree2(mmParsed.roots, collapsedNodes) : { roots: mmParsed.roots, hiddenCounts: /* @__PURE__ */ new Map() };
@@ -61882,7 +62659,7 @@ async function exportWireframe(ctx) {
     wireframeParsed,
     wireframeLayout,
     effectivePalette,
-    theme === "dark",
+    ctx.isDark,
     void 0,
     { width: exportWidth, height: exportHeight },
     theme
@@ -61890,7 +62667,7 @@ async function exportWireframe(ctx) {
   return finalizeSvgExport(container, theme, effectivePalette);
 }
 async function exportC4(ctx) {
-  const { content, theme, palette, viewState, options, exportMode } = ctx;
+  const { content, theme, palette, viewState, exportMode } = ctx;
   const { parseC4: parseC42 } = await Promise.resolve().then(() => (init_parser14(), parser_exports8));
   const {
     layoutC4Context: layoutC4Context2,
@@ -61902,9 +62679,9 @@ async function exportC4(ctx) {
   const effectivePalette = await resolveExportPalette(theme, palette);
   const c4Parsed = parseC42(content, effectivePalette);
   if (c4Parsed.error || c4Parsed.elements.length === 0) return "";
-  const c4Level = options?.c4Level ?? viewState?.c4l ?? "context";
-  const c4System = options?.c4System ?? viewState?.c4s;
-  const c4Container = options?.c4Container ?? viewState?.c4c;
+  const c4Level = ctx.options?.c4Level ?? viewState?.c4l ?? "context";
+  const c4System = ctx.options?.c4System ?? viewState?.c4s;
+  const c4Container = ctx.options?.c4Container ?? viewState?.c4c;
   const c4Layout = c4Level === "deployment" ? layoutC4Deployment2(c4Parsed) : c4Level === "components" && c4System && c4Container ? layoutC4Components2(c4Parsed, c4System, c4Container) : c4Level === "containers" && c4System ? layoutC4Containers2(c4Parsed, c4System) : layoutC4Context2(c4Parsed);
   if (c4Layout.nodes.length === 0) return "";
   const PADDING3 = 20;
@@ -61918,13 +62695,13 @@ async function exportC4(ctx) {
     c4Parsed,
     c4Layout,
     effectivePalette,
-    theme === "dark",
+    ctx.isDark,
     void 0,
     { width: exportWidth, height: exportHeight },
     resolveActiveTagGroup(
       c4Parsed.tagGroups,
       c4Parsed.options["active-tag"],
-      viewState?.tag ?? options?.tagGroup
+      ctxTagOverride(ctx)
     ),
     exportMode
   );
@@ -61945,14 +62722,14 @@ async function exportFlowchart(ctx) {
     fcParsed,
     layout,
     effectivePalette,
-    theme === "dark",
+    ctx.isDark,
     void 0,
     { width: EXPORT_WIDTH, height: EXPORT_HEIGHT }
   );
   return finalizeSvgExport(container, theme, effectivePalette);
 }
 async function exportInfra(ctx) {
-  const { content, theme, palette, viewState, options } = ctx;
+  const { content, theme, palette, viewState } = ctx;
   const { parseInfra: parseInfra2 } = await Promise.resolve().then(() => (init_parser15(), parser_exports9));
   const { computeInfra: computeInfra2 } = await Promise.resolve().then(() => (init_compute(), compute_exports));
   const { layoutInfra: layoutInfra2 } = await Promise.resolve().then(() => (init_layout10(), layout_exports10));
@@ -61965,7 +62742,7 @@ async function exportInfra(ctx) {
   const activeTagGroup = resolveActiveTagGroup(
     infraParsed.tagGroups,
     infraParsed.options["active-tag"],
-    viewState?.tag ?? options?.tagGroup
+    ctxTagOverride(ctx)
   );
   const showInfraTitle = !!infraParsed.title && infraParsed.options["no-title"] !== "on";
   const titleOffset = showInfraTitle ? 40 : 0;
@@ -61983,7 +62760,7 @@ async function exportInfra(ctx) {
     container,
     infraLayout,
     effectivePalette,
-    theme === "dark",
+    ctx.isDark,
     showInfraTitle ? infraParsed.title : null,
     showInfraTitle ? infraParsed.titleLineNumber : null,
     infraTagGroups,
@@ -62030,7 +62807,7 @@ async function exportPert(ctx) {
     pertResolved,
     pertLayout,
     effectivePalette,
-    theme === "dark",
+    ctx.isDark,
     {
       title: pertParsed.title,
       exportDims: { width: exportW, height: exportH },
@@ -62043,7 +62820,7 @@ async function exportPert(ctx) {
   return finalizeSvgExport(container, theme, effectivePalette);
 }
 async function exportGantt(ctx) {
-  const { content, theme, palette, viewState, options, exportMode } = ctx;
+  const { content, theme, palette, viewState, exportMode } = ctx;
   const { parseGantt: parseGantt2 } = await Promise.resolve().then(() => (init_parser16(), parser_exports10));
   const { calculateSchedule: calculateSchedule2 } = await Promise.resolve().then(() => (init_calculator(), calculator_exports));
   const { renderGantt: renderGantt2 } = await Promise.resolve().then(() => (init_renderer12(), renderer_exports12));
@@ -62061,7 +62838,7 @@ async function exportGantt(ctx) {
     container,
     resolved,
     effectivePalette,
-    theme === "dark",
+    ctx.isDark,
     {
       ...ganttCollapsedGroups !== void 0 && {
         collapsedGroups: ganttCollapsedGroups
@@ -62075,7 +62852,7 @@ async function exportGantt(ctx) {
       currentActiveGroup: resolveActiveTagGroup(
         resolved.tagGroups,
         resolved.options.activeTag ?? void 0,
-        viewState?.tag ?? options?.tagGroup
+        ctxTagOverride(ctx)
       ),
       exportMode
     },
@@ -62098,7 +62875,7 @@ async function exportState(ctx) {
     stateParsed,
     layout,
     effectivePalette,
-    theme === "dark",
+    ctx.isDark,
     void 0,
     { width: EXPORT_WIDTH, height: EXPORT_HEIGHT }
   );
@@ -62118,7 +62895,7 @@ async function exportTechRadar(ctx) {
     container,
     radarParsed,
     effectivePalette,
-    theme === "dark",
+    ctx.isDark,
     { width: RADAR_EXPORT_W, height: RADAR_EXPORT_H },
     viewState,
     exportMode
@@ -62135,13 +62912,13 @@ async function exportJourneyMap(ctx) {
   if (jmParsed.error || jmParsed.phases.length === 0 && jmParsed.steps.length === 0)
     return "";
   const jmLayout = layoutJourneyMap2(jmParsed, effectivePalette, {
-    isDark: theme === "dark"
+    isDark: ctx.isDark
   });
   const container = createExportContainer(
     jmLayout.totalWidth,
     jmLayout.totalHeight
   );
-  renderJourneyMap2(container, jmParsed, effectivePalette, theme === "dark", {
+  renderJourneyMap2(container, jmParsed, effectivePalette, ctx.isDark, {
     exportDims: { width: jmLayout.totalWidth, height: jmLayout.totalHeight },
     exportMode
   });
@@ -62159,7 +62936,7 @@ async function exportCycle(ctx) {
     container,
     cycleParsed,
     effectivePalette,
-    theme === "dark",
+    ctx.isDark,
     { width: EXPORT_WIDTH, height: EXPORT_HEIGHT },
     viewState,
     exportMode
@@ -62196,7 +62973,7 @@ async function exportMap(ctx) {
     mapResolved,
     mapData,
     effectivePalette,
-    theme === "dark",
+    ctx.isDark,
     dims
   );
   return finalizeSvgExport(container, theme, effectivePalette);
@@ -62213,7 +62990,7 @@ async function exportPyramid(ctx) {
     container,
     pyramidParsed,
     effectivePalette,
-    theme === "dark",
+    ctx.isDark,
     { width: EXPORT_WIDTH, height: EXPORT_HEIGHT }
   );
   return finalizeSvgExport(container, theme, effectivePalette);
@@ -62230,7 +63007,7 @@ async function exportRing(ctx) {
     container,
     ringParsed,
     effectivePalette,
-    theme === "dark",
+    ctx.isDark,
     { width: EXPORT_WIDTH, height: EXPORT_HEIGHT }
   );
   return finalizeSvgExport(container, theme, effectivePalette);
@@ -62247,7 +63024,7 @@ async function exportRaci(ctx) {
     container,
     raciParsed,
     effectivePalette,
-    theme === "dark",
+    ctx.isDark,
     { width: EXPORT_WIDTH, height: EXPORT_HEIGHT }
   );
   return finalizeSvgExport(container, theme, effectivePalette);
@@ -62270,7 +63047,7 @@ async function exportSlope(ctx) {
     container,
     parsed,
     effectivePalette,
-    theme === "dark",
+    ctx.isDark,
     void 0,
     dims
   );
@@ -62286,14 +63063,14 @@ async function exportArc(ctx) {
     container,
     parsed,
     effectivePalette,
-    theme === "dark",
+    ctx.isDark,
     void 0,
     dims
   );
   return finalizeSvgExport(container, theme, effectivePalette);
 }
 async function exportTimeline(ctx) {
-  const { content, theme, palette, viewState, options, exportMode } = ctx;
+  const { content, theme, palette, viewState, exportMode } = ctx;
   const parsed = parseTimeline(content, palette);
   if (parsed.error || parsed.timelineEvents.length === 0) return "";
   const effectivePalette = await resolveExportPalette(theme, palette);
@@ -62302,13 +63079,13 @@ async function exportTimeline(ctx) {
     container,
     parsed,
     effectivePalette,
-    theme === "dark",
+    ctx.isDark,
     void 0,
     dims,
     resolveActiveTagGroup(
       parsed.timelineTagGroups,
       parsed.timelineActiveTag,
-      viewState?.tag ?? options?.tagGroup
+      ctxTagOverride(ctx)
     ),
     viewState?.swim,
     void 0,
@@ -62327,7 +63104,7 @@ async function exportWordcloud(ctx) {
     container,
     parsed,
     effectivePalette,
-    theme === "dark",
+    ctx.isDark,
     dims
   );
   return finalizeSvgExport(container, theme, effectivePalette);
@@ -62342,7 +63119,7 @@ async function exportVenn(ctx) {
     container,
     parsed,
     effectivePalette,
-    theme === "dark",
+    ctx.isDark,
     void 0,
     dims
   );
@@ -62358,14 +63135,14 @@ async function exportQuadrant(ctx) {
     container,
     parsed,
     effectivePalette,
-    theme === "dark",
+    ctx.isDark,
     void 0,
     dims
   );
   return finalizeSvgExport(container, theme, effectivePalette);
 }
 async function exportVisualization(ctx) {
-  const { content, theme, palette, viewState, options } = ctx;
+  const { content, theme, palette, viewState } = ctx;
   const parsed = parseVisualization(content, palette);
   if (parsed.type !== "sequence") {
     if (parsed.error) {
@@ -62376,7 +63153,7 @@ async function exportVisualization(ctx) {
     }
   }
   const effectivePalette = await resolveExportPalette(theme, palette);
-  const isDark = theme === "dark";
+  const isDark = ctx.isDark;
   const container = createExportContainer(EXPORT_WIDTH, EXPORT_HEIGHT);
   const { parseSequenceDgmo: parseSequenceDgmo2 } = await Promise.resolve().then(() => (init_parser7(), parser_exports));
   const { renderSequenceDiagram: renderSequenceDiagram2 } = await Promise.resolve().then(() => (init_renderer20(), renderer_exports20));
@@ -62384,7 +63161,7 @@ async function exportVisualization(ctx) {
   if (seqParsed.error || seqParsed.participants.length === 0) return "";
   const collapsedSections = viewState?.cs ? new Set(viewState.cs) : void 0;
   const collapsedGroups = viewState?.cg ? new Set(viewState.cg.map(Number).filter((n) => Number.isFinite(n))) : void 0;
-  const seqActiveTagGroup = viewState?.tag ?? options?.tagGroup;
+  const seqActiveTagGroup = ctxTagOverride(ctx);
   renderSequenceDiagram2(
     container,
     seqParsed,
@@ -62649,6 +63426,162 @@ function collapseBoxesAndLines(parsed, collapsedGroups) {
   };
 }
 
+// src/boxes-and-lines/focus.ts
+var GROUP_PREFIX = "__group_";
+var groupKey = (label) => `${GROUP_PREFIX}${label}`;
+var isGroupKey = (k) => k.startsWith(GROUP_PREFIX);
+var groupLabelOf = (k) => k.slice(GROUP_PREFIX.length);
+function focusBoxesAndLines(parsed, target) {
+  const allValues = parsed.nodes.filter((n) => n.value !== void 0).map((n) => n.value);
+  const rampDomain = allValues.length > 0 ? { min: Math.min(...allValues), max: Math.max(...allValues) } : null;
+  const nodeLabelSet = new Set(parsed.nodes.map((n) => n.label));
+  const groupByLabel = /* @__PURE__ */ new Map();
+  for (const g of parsed.groups) groupByLabel.set(g.label, g);
+  const parentOf = /* @__PURE__ */ new Map();
+  for (const g of parsed.groups)
+    for (const child of g.children) parentOf.set(child, g.label);
+  const topAncestor = (label) => {
+    let p = parentOf.get(label);
+    if (p === void 0) return void 0;
+    for (; ; ) {
+      const up = parentOf.get(p);
+      if (up === void 0) return p;
+      p = up;
+    }
+  };
+  const descendantsOf = (groupLabel) => {
+    const nodes2 = /* @__PURE__ */ new Set();
+    const groups2 = /* @__PURE__ */ new Set();
+    const seen = /* @__PURE__ */ new Set([groupLabel]);
+    const stack = [groupLabel];
+    while (stack.length) {
+      const cur = stack.pop();
+      const g = groupByLabel.get(cur);
+      if (!g) continue;
+      for (const child of g.children) {
+        if (groupByLabel.has(child)) {
+          if (!seen.has(child)) {
+            seen.add(child);
+            groups2.add(child);
+            stack.push(child);
+          }
+        } else {
+          nodes2.add(child);
+        }
+      }
+    }
+    return { nodes: nodes2, groups: groups2 };
+  };
+  const focusNodeLabels = /* @__PURE__ */ new Set();
+  const focusGroupLabels = /* @__PURE__ */ new Set();
+  const focusEndpointSet = /* @__PURE__ */ new Set();
+  if (target.kind === "group") {
+    const gl = isGroupKey(target.id) ? groupLabelOf(target.id) : target.id;
+    if (groupByLabel.has(gl)) {
+      focusGroupLabels.add(gl);
+      focusEndpointSet.add(groupKey(gl));
+      const desc = descendantsOf(gl);
+      for (const n of desc.nodes) {
+        focusNodeLabels.add(n);
+        focusEndpointSet.add(n);
+      }
+      for (const sg of desc.groups) {
+        focusGroupLabels.add(sg);
+        focusEndpointSet.add(groupKey(sg));
+      }
+    }
+  } else {
+    if (nodeLabelSet.has(target.id)) {
+      focusNodeLabels.add(target.id);
+      focusEndpointSet.add(target.id);
+    }
+  }
+  const neighborIds = /* @__PURE__ */ new Set();
+  const collapsedNeighborGroupIds = /* @__PURE__ */ new Set();
+  const neighborBoxes = /* @__PURE__ */ new Set();
+  const keepGroupLabels = new Set(focusGroupLabels);
+  const keptEdges = [];
+  const selfLoops = [];
+  const keepGroupAndSubgroups = (gl) => {
+    keepGroupLabels.add(gl);
+    for (const sg of descendantsOf(gl).groups) keepGroupLabels.add(sg);
+  };
+  const classifyNeighbor = (key) => {
+    if (isGroupKey(key)) {
+      const gl = groupLabelOf(key);
+      if (!groupByLabel.has(gl)) return false;
+      if (focusGroupLabels.has(gl)) return true;
+      neighborIds.add(key);
+      collapsedNeighborGroupIds.add(gl);
+      keepGroupAndSubgroups(gl);
+      return true;
+    }
+    if (focusNodeLabels.has(key)) return true;
+    if (!nodeLabelSet.has(key)) return false;
+    const top = topAncestor(key);
+    if (top !== void 0 && !focusGroupLabels.has(top)) {
+      neighborIds.add(groupKey(top));
+      collapsedNeighborGroupIds.add(top);
+      keepGroupAndSubgroups(top);
+      return true;
+    }
+    neighborIds.add(key);
+    neighborBoxes.add(key);
+    return true;
+  };
+  for (const edge of parsed.edges) {
+    const inS = focusEndpointSet.has(edge.source);
+    const inT = focusEndpointSet.has(edge.target);
+    if (edge.source === edge.target) {
+      if (inS) selfLoops.push(edge);
+      continue;
+    }
+    if (inS && inT) {
+      keptEdges.push(edge);
+      continue;
+    }
+    if (!inS && !inT) continue;
+    const other = inS ? edge.target : edge.source;
+    if (classifyNeighbor(other)) keptEdges.push(edge);
+  }
+  const keepNodeLabels = /* @__PURE__ */ new Set([
+    ...focusNodeLabels,
+    ...neighborBoxes
+  ]);
+  const nodes = parsed.nodes.filter((n) => keepNodeLabels.has(n.label));
+  const groups = parsed.groups.filter((g) => keepGroupLabels.has(g.label));
+  const notes = parsed.notes?.filter((note) => keepNodeLabels.has(note.ref));
+  const filtered = {
+    ...parsed,
+    nodes,
+    edges: keptEdges,
+    groups,
+    ...notes !== void 0 && { notes }
+  };
+  delete filtered.nodePositions;
+  const collapsed = collapseBoxesAndLines(filtered, collapsedNeighborGroupIds);
+  let resultParsed = collapsed.parsed;
+  if (selfLoops.length > 0) {
+    const visible = new Set(resultParsed.nodes.map((n) => n.label));
+    const survivors = selfLoops.filter((e) => visible.has(e.source));
+    if (survivors.length > 0)
+      resultParsed = {
+        ...resultParsed,
+        edges: [...resultParsed.edges, ...survivors]
+      };
+  }
+  return {
+    parsed: resultParsed,
+    neighborIds,
+    collapsedNeighborGroupIds,
+    rampDomain,
+    collapseInfo: {
+      collapsedChildCounts: collapsed.collapsedChildCounts,
+      originalGroups: collapsed.originalGroups
+    }
+  };
+}
+
 // src/advanced.ts
 init_parser11();
 init_layout2();
@@ -64059,6 +64992,8 @@ function formatLineDiff(path, original, migrated) {
   CHART_TYPE_DESCRIPTIONS,
   ECHART_EXPORT_WIDTH,
   INFRA_BEHAVIOR_KEYS,
+  INVALID_COLOR_CODE,
+  INVALID_CSS_COLOR_HEX,
   LEGEND_GEAR_PILL_W,
   LEGEND_HEIGHT,
   RACI_ERROR_CODES,
@@ -64120,6 +65055,7 @@ function formatLineDiff(path, original, migrated) {
   extractInfraSymbols,
   extractPertSymbols,
   findUnsafePipePositions,
+  focusBoxesAndLines,
   focusOrgTree,
   formatDateLabel,
   formatDgmoError,
@@ -64140,8 +65076,10 @@ function formatLineDiff(path, original, migrated) {
   hslToHex,
   inferParticipantType,
   inferRoles,
+  invalidColorDiagnostic,
   isArchiveColumn,
   isExtendedChartType,
+  isInvalidColorToken,
   isLegacyMetadataLine,
   isRecognizedColorName,
   isSequenceBlock,
@@ -64182,6 +65120,7 @@ function formatLineDiff(path, original, migrated) {
   migrateContent,
   mix,
   mulberry32,
+  nearestNamedColor,
   nord,
   nordPalette,
   normalizeName,