@diagrammo/dgmo 0.15.1 → 0.16.0

package/dist/internal.js

@@ -138,114 +138,6 @@ var init_diagnostics = __esm({
   }
 });
 
-// src/colors.ts
-function isRecognizedColorName(name) {
-  return Object.prototype.hasOwnProperty.call(colorNames, name.toLowerCase());
-}
-function resolveColor(color, palette) {
-  if (!color) return null;
-  if (color.startsWith("#")) return null;
-  const lower = color.toLowerCase();
-  if (!isRecognizedColorName(lower)) return null;
-  if (palette) {
-    const named = palette.colors[lower];
-    if (named) return named;
-  }
-  return colorNames[lower];
-}
-function resolveColorWithDiagnostic(color, line12, diagnostics, palette) {
-  const resolved = resolveColor(color, palette);
-  if (resolved !== null) return resolved;
-  const hint = suggest(color, RECOGNIZED_COLOR_NAMES);
-  const suggestion = hint ? ` ${hint}` : "";
-  diagnostics.push(
-    makeDgmoError(
-      line12,
-      `Unknown color "${color}". Allowed: ${RECOGNIZED_COLOR_NAMES.join(", ")}.${suggestion}`,
-      "warning"
-    )
-  );
-  return void 0;
-}
-var nord, colorNames, RECOGNIZED_COLOR_NAMES, seriesColors;
-var init_colors = __esm({
-  "src/colors.ts"() {
-    "use strict";
-    init_diagnostics();
-    nord = {
-      // Polar Night (dark)
-      nord0: "#2e3440",
-      nord1: "#3b4252",
-      nord2: "#434c5e",
-      nord3: "#4c566a",
-      // Snow Storm (light)
-      nord4: "#d8dee9",
-      nord5: "#e5e9f0",
-      nord6: "#eceff4",
-      // Frost (accent blues)
-      nord7: "#8fbcbb",
-      nord8: "#88c0d0",
-      nord9: "#81a1c1",
-      nord10: "#5e81ac",
-      // Aurora (colors)
-      nord11: "#bf616a",
-      // red
-      nord12: "#d08770",
-      // orange
-      nord13: "#ebcb8b",
-      // yellow
-      nord14: "#a3be8c",
-      // green
-      nord15: "#b48ead"
-      // purple
-    };
-    colorNames = {
-      red: nord.nord11,
-      orange: nord.nord12,
-      yellow: nord.nord13,
-      green: nord.nord14,
-      blue: nord.nord10,
-      purple: nord.nord15,
-      teal: nord.nord7,
-      cyan: nord.nord8,
-      gray: nord.nord3,
-      black: nord.nord0,
-      white: nord.nord6
-    };
-    RECOGNIZED_COLOR_NAMES = Object.freeze([
-      "red",
-      "orange",
-      "yellow",
-      "green",
-      "blue",
-      "purple",
-      "teal",
-      "cyan",
-      "gray",
-      "black",
-      "white"
-    ]);
-    seriesColors = [
-      nord.nord10,
-      // blue
-      nord.nord14,
-      // green
-      nord.nord13,
-      // yellow
-      nord.nord12,
-      // orange
-      nord.nord15,
-      // purple
-      nord.nord11,
-      // red
-      nord.nord7,
-      // teal
-      nord.nord8
-      // light blue
-    ];
-  }
-});
-
 // src/utils/arrows.ts
 function validateLabelCharacters(label, lineNumber) {
   const out = [];
@@ -286,15 +178,6 @@ function parseInArrowLabel(rawLabel, lineNumber) {
   const diagnostics = validateLabelCharacters(trimmed, lineNumber);
   return { label: trimmed, diagnostics };
 }
-function matchColorParens(content) {
-  const m = content.match(/^\(([A-Za-z]+)\)$/);
-  if (!m) return null;
-  const candidate = m[1].toLowerCase();
-  if (RECOGNIZED_COLOR_NAMES.includes(candidate)) {
-    return candidate;
-  }
-  return null;
-}
 function parseArrow(line12) {
   if (BIDI_SYNC_RE.test(line12) || BIDI_ASYNC_RE.test(line12)) {
     return {
@@ -333,7 +216,6 @@ var init_arrows = __esm({
   "src/utils/arrows.ts"() {
     "use strict";
     init_diagnostics();
-    init_colors();
     ARROW_DIAGNOSTIC_CODES = {
       /** Active: label contains `->` or `~>` substring (TD-13). */
       ARROW_SUBSTRING_IN_LABEL: "E_ARROW_SUBSTRING_IN_LABEL",
@@ -695,6 +577,114 @@ var init_time_ticks = __esm({
   }
 });
 
+// src/colors.ts
+function isRecognizedColorName(name) {
+  return Object.prototype.hasOwnProperty.call(colorNames, name.toLowerCase());
+}
+function resolveColor(color, palette) {
+  if (!color) return null;
+  if (color.startsWith("#")) return null;
+  const lower = color.toLowerCase();
+  if (!isRecognizedColorName(lower)) return null;
+  if (palette) {
+    const named = palette.colors[lower];
+    if (named) return named;
+  }
+  return colorNames[lower];
+}
+function resolveColorWithDiagnostic(color, line12, diagnostics, palette) {
+  const resolved = resolveColor(color, palette);
+  if (resolved !== null) return resolved;
+  const hint = suggest(color, RECOGNIZED_COLOR_NAMES);
+  const suggestion = hint ? ` ${hint}` : "";
+  diagnostics.push(
+    makeDgmoError(
+      line12,
+      `Unknown color "${color}". Allowed: ${RECOGNIZED_COLOR_NAMES.join(", ")}.${suggestion}`,
+      "warning"
+    )
+  );
+  return void 0;
+}
+var nord, colorNames, RECOGNIZED_COLOR_NAMES, seriesColors;
+var init_colors = __esm({
+  "src/colors.ts"() {
+    "use strict";
+    init_diagnostics();
+    nord = {
+      // Polar Night (dark)
+      nord0: "#2e3440",
+      nord1: "#3b4252",
+      nord2: "#434c5e",
+      nord3: "#4c566a",
+      // Snow Storm (light)
+      nord4: "#d8dee9",
+      nord5: "#e5e9f0",
+      nord6: "#eceff4",
+      // Frost (accent blues)
+      nord7: "#8fbcbb",
+      nord8: "#88c0d0",
+      nord9: "#81a1c1",
+      nord10: "#5e81ac",
+      // Aurora (colors)
+      nord11: "#bf616a",
+      // red
+      nord12: "#d08770",
+      // orange
+      nord13: "#ebcb8b",
+      // yellow
+      nord14: "#a3be8c",
+      // green
+      nord15: "#b48ead"
+      // purple
+    };
+    colorNames = {
+      red: nord.nord11,
+      orange: nord.nord12,
+      yellow: nord.nord13,
+      green: nord.nord14,
+      blue: nord.nord10,
+      purple: nord.nord15,
+      teal: nord.nord7,
+      cyan: nord.nord8,
+      gray: nord.nord3,
+      black: nord.nord0,
+      white: nord.nord6
+    };
+    RECOGNIZED_COLOR_NAMES = Object.freeze([
+      "red",
+      "orange",
+      "yellow",
+      "green",
+      "blue",
+      "purple",
+      "teal",
+      "cyan",
+      "gray",
+      "black",
+      "white"
+    ]);
+    seriesColors = [
+      nord.nord10,
+      // blue
+      nord.nord14,
+      // green
+      nord.nord13,
+      // yellow
+      nord.nord12,
+      // orange
+      nord.nord15,
+      // purple
+      nord.nord11,
+      // red
+      nord.nord7,
+      // teal
+      nord.nord8
+      // light blue
+    ];
+  }
+});
+
 // src/palettes/registry.ts
 function isValidHex(value) {
   return /^#([0-9a-fA-F]{3}|[0-9a-fA-F]{6})$/.test(value);
@@ -1927,17 +1917,21 @@ function measureIndent(line12) {
   return indent;
 }
 function extractColor(label, palette, diagnostics, line12) {
-  const m = label.match(COLOR_SUFFIX_RE);
-  if (!m) return { label };
-  const colorName = m[1].trim();
+  const lastSpaceIdx = Math.max(
+    label.lastIndexOf(" "),
+    label.lastIndexOf("	")
+  );
+  if (lastSpaceIdx < 0) return { label };
+  const trailing = label.substring(lastSpaceIdx + 1);
+  if (!RECOGNIZED_COLOR_SET.has(trailing)) return { label };
   let color;
   if (diagnostics && line12 !== void 0) {
-    color = resolveColorWithDiagnostic(colorName, line12, diagnostics, palette);
+    color = resolveColorWithDiagnostic(trailing, line12, diagnostics, palette);
   } else {
-    color = resolveColor(colorName, palette) ?? void 0;
+    color = resolveColor(trailing, palette) ?? void 0;
   }
   return {
-    label: label.substring(0, m.index).trim(),
+    label: label.substring(0, lastSpaceIdx).trimEnd(),
     color
   };
 }
@@ -2070,14 +2064,18 @@ function parseSeriesNames(value, lines, lineIndex, palette, diagnostics) {
   }
   return { series, names, nameColors, nameLineNumbers, newIndex };
 }
-function inferArrowColor(label) {
-  const lower = label.toLowerCase();
-  if (lower === "yes" || lower === "success" || lower === "ok" || lower === "true")
-    return "green";
-  if (lower === "no" || lower === "fail" || lower === "error" || lower === "false")
-    return "red";
-  if (lower === "maybe" || lower === "warning") return "orange";
-  return void 0;
+function peelTrailingColorName(label) {
+  const lastSpaceIdx = Math.max(
+    label.lastIndexOf(" "),
+    label.lastIndexOf("	")
+  );
+  if (lastSpaceIdx < 0) return { label };
+  const trailing = label.substring(lastSpaceIdx + 1);
+  if (!RECOGNIZED_COLOR_SET.has(trailing)) return { label };
+  return {
+    label: label.substring(0, lastSpaceIdx).trimEnd(),
+    colorName: trailing
+  };
 }
 function parsePipeMetadata(segments, aliasMap = /* @__PURE__ */ new Map(), errorMultiplePipes) {
   if (segments.length > 2) {
@@ -2099,11 +2097,14 @@ function parsePipeMetadata(segments, aliasMap = /* @__PURE__ */ new Map(), error
   }
   return metadata;
 }
-var ALL_CHART_TYPES, PIPE_KEY_VALUE_PREFIX_RE, PIPE_LIKELY_STRUCTURED_TAIL_RE, COLOR_SUFFIX_RE, OPTION_NOCOLON_RE, GLOBAL_BOOLEANS, MULTIPLE_PIPE_ERROR;
+var RECOGNIZED_COLOR_SET, ALL_CHART_TYPES, PIPE_KEY_VALUE_PREFIX_RE, PIPE_LIKELY_STRUCTURED_TAIL_RE, OPTION_NOCOLON_RE, GLOBAL_BOOLEANS, MULTIPLE_PIPE_ERROR;
 var init_parsing = __esm({
   "src/utils/parsing.ts"() {
     "use strict";
     init_colors();
+    RECOGNIZED_COLOR_SET = new Set(
+      RECOGNIZED_COLOR_NAMES
+    );
     ALL_CHART_TYPES = /* @__PURE__ */ new Set([
       // data charts
       "bar",
@@ -2155,7 +2156,6 @@ var init_parsing = __esm({
     ]);
     PIPE_KEY_VALUE_PREFIX_RE = /^\s*[A-Za-z][A-Za-z0-9_-]*\s*:/;
     PIPE_LIKELY_STRUCTURED_TAIL_RE = /,\s*[A-Za-z][A-Za-z0-9_-]*\s*:/;
-    COLOR_SUFFIX_RE = /\(([^)]+)\)\s*$/;
     OPTION_NOCOLON_RE = /^([a-z][a-z0-9-]*)\s+(.+)$/i;
     GLOBAL_BOOLEANS = /* @__PURE__ */ new Set([
       "solid-fill",
@@ -2192,7 +2192,7 @@ function parseTagDeclaration(line12) {
   let restStartIdx = 1;
   let valueStart = tokens.length;
   for (let i = 1; i < tokens.length; i++) {
-    if (tokens[i].includes("(")) {
+    if (tokens[i].includes(",")) {
       valueStart = i;
       break;
     }
@@ -2224,13 +2224,29 @@ function parseTagDeclaration(line12) {
       restStartIdx = valueStart;
     }
   } else {
-    if (tokens[0][0] === '"' || tokens[0][0] === "'") {
-      if (tokens.length > 1 && isAliasToken(tokens[1]) && valueStart > 1) {
+    const isColorWord = (s) => RECOGNIZED_COLOR_NAMES.includes(s);
+    if (valueStart < tokens.length) {
+      const commaTokenIdx = valueStart;
+      const lastBeforeComma = tokens[commaTokenIdx].replace(/,$/, "");
+      const firstValueStart = isColorWord(lastBeforeComma) ? commaTokenIdx - 1 : commaTokenIdx;
+      const prefixEnd = firstValueStart;
+      const aliasCandidate = prefixEnd > 1 ? tokens[prefixEnd - 1] : void 0;
+      if (aliasCandidate && isAliasToken(aliasCandidate) && !isColorWord(aliasCandidate)) {
+        alias = aliasCandidate;
+        legacyForm = "bare-shorthand";
+        name = tokens.slice(0, prefixEnd - 1).map((t) => stripQuotes(t)).join(" ");
+        restStartIdx = prefixEnd;
+      } else {
+        name = tokens.slice(0, prefixEnd).map((t) => stripQuotes(t)).join(" ");
+        restStartIdx = prefixEnd;
+      }
+    } else if (tokens[0][0] === '"' || tokens[0][0] === "'") {
+      if (tokens.length > 1 && isAliasToken(tokens[1]) && !isColorWord(tokens[1])) {
         alias = tokens[1];
         legacyForm = "bare-shorthand";
         restStartIdx = 2;
       }
-    } else if (valueStart > 1 && isAliasToken(tokens[valueStart - 1])) {
+    } else if (valueStart > 1 && isAliasToken(tokens[valueStart - 1]) && !isColorWord(tokens[valueStart - 1])) {
       alias = tokens[valueStart - 1];
       legacyForm = "bare-shorthand";
       name = tokens.slice(0, valueStart - 1).map((t) => stripQuotes(t)).join(" ");
@@ -2245,10 +2261,13 @@ function parseTagDeclaration(line12) {
     inlineValues = valueStr.split(",").map((v) => v.trim()).filter(Boolean);
   }
   if (!inlineValues || inlineValues.length === 0) {
-    const colorMatch = name.match(/\(([^)]+)\)\s*$/);
-    if (colorMatch) {
-      colorHint = colorMatch[1];
-      name = name.substring(0, colorMatch.index).trim();
+    const lastSpaceIdx = name.lastIndexOf(" ");
+    if (lastSpaceIdx > 0) {
+      const trailing = name.substring(lastSpaceIdx + 1);
+      if (RECOGNIZED_COLOR_NAMES.includes(trailing)) {
+        colorHint = trailing;
+        name = name.substring(0, lastSpaceIdx).trimEnd();
+      }
     }
   }
   return {
@@ -2376,6 +2395,7 @@ var init_tag_groups = __esm({
     "use strict";
     init_parsing();
     init_diagnostics();
+    init_colors();
     TAG_BLOCK_NOCOLON_RE = /^tag\s+/i;
     VALID_TAG_IDENT_RE = /^[A-Za-z_][A-Za-z0-9_-]*$/;
   }
@@ -2649,7 +2669,7 @@ function buildControlsGroupLayout(config, state) {
 }
 function computeLegendLayout(config, state, containerWidth) {
   const { groups, controls: configControls, mode } = config;
-  const isExport = mode === "inline";
+  const isExport = mode === "export";
   const activeGroupName = state.activeGroup?.toLowerCase() ?? null;
   if (isExport && !activeGroupName) {
     return {
@@ -2939,7 +2959,10 @@ function renderLegendD3(container, config, state, palette, isDark, callbacks, co
   const width = containerWidth ?? parseFloat(container.attr("width") || "800");
   let currentState = { ...state };
   let currentLayout;
-  const legendG = container.append("g").attr("class", "dgmo-legend");
+  const legendG = container.append("g").attr("class", "dgmo-legend").attr("data-legend-title-relation", config.position.titleRelation).attr(
+    "data-legend-capsule-addon-width",
+    String(config.capsulePillAddonWidth ?? 0)
+  );
   function render2() {
     currentLayout = computeLegendLayout(config, currentState, width);
     legendG.selectAll("*").remove();
@@ -3798,7 +3821,7 @@ function parseSequenceDgmo(content) {
       if (groupColor) {
         pushWarning(
           lineNumber,
-          `(${groupColor}) color syntax removed from sequence diagrams \u2014 use 'tag:' groups for coloring`
+          `'(${groupColor})' parens-color syntax removed from sequence diagrams \u2014 use 'tag:' groups for coloring`
         );
       }
       contentStarted = true;
@@ -3878,7 +3901,7 @@ function parseSequenceDgmo(content) {
       if (!color) {
         pushError(
           lineNumber,
-          `Expected 'Value(color)' in tag group '${currentTagGroup.name}'`
+          `Expected 'Value color' in tag group '${currentTagGroup.name}'`
         );
         continue;
       }
@@ -3902,11 +3925,13 @@ function parseSequenceDgmo(content) {
         blockStack.pop();
       }
       const labelRaw = sectionMatch[1].trim();
-      const colorMatch = labelRaw.match(/^(.+?)\(([^)]+)\)$/);
+      const colorMatch = labelRaw.match(
+        /^(.+?)\((red|orange|yellow|green|blue|purple|teal|cyan|gray|black|white)\)$/
+      );
       if (colorMatch) {
         pushWarning(
           lineNumber,
-          `(${colorMatch[2].trim()}) color syntax removed from sequence diagrams \u2014 use 'tag:' groups for coloring`
+          `'(${colorMatch[2]})' parens-color syntax removed from sequence diagrams \u2014 use 'tag:' groups for coloring`
         );
       }
       contentStarted = true;
@@ -4061,7 +4086,7 @@ function parseSequenceDgmo(content) {
       const color = coloredMatch[2].trim();
       pushError(
         lineNumber,
-        `'${id}(${color})' syntax is no longer supported \u2014 use 'tag:' groups for coloring`
+        `'${id}(${color})' parens-color syntax is no longer supported \u2014 use 'tag:' groups for coloring`
       );
       contentStarted = true;
       const key = addParticipant(id, lineNumber, { metadata: colorMeta });
@@ -4440,7 +4465,7 @@ var init_parser = __esm({
     ]);
     IS_A_PATTERN = /^([^:]+?)\s+is\s+an?\s+(\w+)(?:\s+(.+))?$/i;
     POSITION_ONLY_PATTERN = /^([^:]+?)\s+position\s+(-?\d+)$/i;
-    COLORED_PARTICIPANT_PATTERN = /^(\S+?)\(([^)]+)\)\s*$/;
+    COLORED_PARTICIPANT_PATTERN = /^(\S+?)\((red|orange|yellow|green|blue|purple|teal|cyan|gray|black|white)\)\s*$/;
     GROUP_HEADING_PATTERN = /^\[([^\]|]+?)(?:\(([^)]+)\))?\]\s*(.*)$/;
     GROUP_HEADING_FALLBACK = /^\[([^\]]+)\]\s*(.*)$/;
     LEGACY_GROUP_PATTERN = /^##\s+(.+?)(?:\(([^)]+)\))?\s*$/;
@@ -4509,7 +4534,6 @@ function splitArrows(line12) {
     const arrowEnd = idx + 2;
     let arrowStart;
     let label;
-    let color;
     let openingStart = -1;
     for (let i = scanFloor; i < runStart; i++) {
       if (line12[i] !== "-") continue;
@@ -4522,21 +4546,13 @@ function splitArrows(line12) {
     if (openingStart !== -1) {
       let openingEnd = openingStart;
       while (openingEnd < runStart && line12[openingEnd] === "-") openingEnd++;
-      const arrowContent = line12.substring(openingEnd, runStart);
-      const colorMatch = arrowContent.match(/\(([^)]+)\)\s*$/);
-      if (colorMatch) {
-        color = colorMatch[1].trim();
-        const labelPart = arrowContent.substring(0, colorMatch.index).trim();
-        if (labelPart) label = labelPart;
-      } else {
-        const labelPart = arrowContent.trim();
-        if (labelPart) label = labelPart;
-      }
+      const labelPart = line12.substring(openingEnd, runStart).trim();
+      if (labelPart) label = labelPart;
       arrowStart = openingStart;
     } else {
       arrowStart = runStart;
     }
-    arrowPositions.push({ start: arrowStart, end: arrowEnd, label, color });
+    arrowPositions.push({ start: arrowStart, end: arrowEnd, label });
     searchFrom = arrowEnd;
     scanFloor = arrowEnd;
   }
@@ -4550,11 +4566,7 @@ function splitArrows(line12) {
     if (beforeText || i === 0) {
       segments.push(beforeText);
     }
-    let arrowToken = "->";
-    if (arrow.label && arrow.color)
-      arrowToken = `-${arrow.label}(${arrow.color})->`;
-    else if (arrow.label) arrowToken = `-${arrow.label}->`;
-    else if (arrow.color) arrowToken = `-(${arrow.color})->`;
+    const arrowToken = arrow.label ? `-${arrow.label}->` : "->";
     segments.push(arrowToken);
     lastIndex = arrow.end;
   }
@@ -4564,45 +4576,14 @@ function splitArrows(line12) {
   }
   return segments;
 }
-function parseArrowToken(token, palette, lineNumber, diagnostics) {
+function parseArrowToken(token, _palette, lineNumber, diagnostics) {
   if (token === "->") return {};
-  const bareParen = token.match(/^-(\([A-Za-z]+\))->$/);
-  if (bareParen) {
-    const colorName = matchColorParens(bareParen[1]);
-    if (colorName) {
-      return {
-        color: resolveColorWithDiagnostic(
-          colorName,
-          lineNumber,
-          diagnostics,
-          palette
-        )
-      };
-    }
-  }
-  const m = token.match(/^-(.+?)(?:\(([^)]+)\))?->$/);
+  const m = token.match(/^-(.+?)->$/);
   if (m) {
     const rawLabel = m[1] ?? "";
     const labelResult = parseInArrowLabel(rawLabel, lineNumber);
     diagnostics.push(...labelResult.diagnostics);
-    const label = labelResult.label;
-    let color = m[2] ? resolveColorWithDiagnostic(
-      m[2].trim(),
-      lineNumber,
-      diagnostics,
-      palette
-    ) : void 0;
-    if (label && !color) {
-      const inferred = inferArrowColor(label);
-      if (inferred)
-        color = resolveColorWithDiagnostic(
-          inferred,
-          lineNumber,
-          diagnostics,
-          palette
-        );
-    }
-    return { label, color };
+    return { label: labelResult.label };
   }
   return {};
 }
@@ -4668,13 +4649,12 @@ function parseFlowchart(content, palette) {
     result.nodes.push(node);
     return node;
   }
-  function addEdge(sourceId, targetId, lineNumber, label, color) {
+  function addEdge(sourceId, targetId, lineNumber, label) {
     const edge = {
       source: sourceId,
       target: targetId,
       lineNumber,
-      ...label && { label },
-      ...color && { color }
+      ...label && { label }
     };
     result.edges.push(edge);
   }
@@ -4740,13 +4720,7 @@ function parseFlowchart(content, palette) {
       if (pendingArrow !== null) {
         const sourceId = lastNodeId ?? implicitSourceId;
         if (sourceId) {
-          addEdge(
-            sourceId,
-            node.id,
-            lineNumber,
-            pendingArrow.label,
-            pendingArrow.color
-          );
+          addEdge(sourceId, node.id, lineNumber, pendingArrow.label);
         }
         pendingArrow = null;
       } else if (lastNodeId === null && implicitSourceId === null) {
@@ -4871,7 +4845,6 @@ var NODE_ID_RE;
 var init_flowchart_parser = __esm({
   "src/graph/flowchart-parser.ts"() {
     "use strict";
-    init_colors();
     init_diagnostics();
     init_arrows();
     init_parsing();
@@ -4899,7 +4872,6 @@ function splitArrows2(line12) {
     const arrowEnd = idx + 2;
     let arrowStart;
     let label;
-    let color;
     let openingStart = -1;
     for (let i = scanFloor; i < runStart; i++) {
       if (line12[i] !== "-") continue;
@@ -4912,21 +4884,13 @@ function splitArrows2(line12) {
     if (openingStart !== -1) {
       let openingEnd = openingStart;
       while (openingEnd < runStart && line12[openingEnd] === "-") openingEnd++;
-      const arrowContent = line12.substring(openingEnd, runStart);
-      const colorMatch = arrowContent.match(/\(([^)]+)\)\s*$/);
-      if (colorMatch) {
-        color = colorMatch[1].trim();
-        const labelPart = arrowContent.substring(0, colorMatch.index).trim();
-        if (labelPart) label = labelPart;
-      } else {
-        const labelPart = arrowContent.trim();
-        if (labelPart) label = labelPart;
-      }
+      const labelPart = line12.substring(openingEnd, runStart).trim();
+      if (labelPart) label = labelPart;
       arrowStart = openingStart;
     } else {
       arrowStart = runStart;
     }
-    arrowPositions.push({ start: arrowStart, end: arrowEnd, label, color });
+    arrowPositions.push({ start: arrowStart, end: arrowEnd, label });
     searchFrom = arrowEnd;
     scanFloor = arrowEnd;
   }
@@ -4936,11 +4900,7 @@ function splitArrows2(line12) {
     const arrow = arrowPositions[i];
     const beforeText = line12.substring(lastIndex, arrow.start).trim();
     if (beforeText || i === 0) segments.push(beforeText);
-    let arrowToken = "->";
-    if (arrow.label && arrow.color)
-      arrowToken = `-${arrow.label}(${arrow.color})->`;
-    else if (arrow.label) arrowToken = `-${arrow.label}->`;
-    else if (arrow.color) arrowToken = `-(${arrow.color})->`;
+    const arrowToken = arrow.label ? `-${arrow.label}->` : "->";
     segments.push(arrowToken);
     lastIndex = arrow.end;
   }
@@ -4948,35 +4908,14 @@ function splitArrows2(line12) {
   if (remaining) segments.push(remaining);
   return segments;
 }
-function parseArrowToken2(token, palette, lineNumber, diagnostics) {
+function parseArrowToken2(token, _palette, lineNumber, diagnostics) {
   if (token === "->") return {};
-  const bareParen = token.match(/^-(\([A-Za-z]+\))->$/);
-  if (bareParen) {
-    const colorName = matchColorParens(bareParen[1]);
-    if (colorName) {
-      return {
-        color: resolveColorWithDiagnostic(
-          colorName,
-          lineNumber,
-          diagnostics,
-          palette
-        )
-      };
-    }
-  }
-  const m = token.match(/^-(.+?)(?:\(([^)]+)\))?->$/);
+  const m = token.match(/^-(.+?)->$/);
   if (m) {
     const rawLabel = m[1] ?? "";
     const labelResult = parseInArrowLabel(rawLabel, lineNumber);
     diagnostics.push(...labelResult.diagnostics);
-    const label = labelResult.label;
-    const color = m[2] ? resolveColorWithDiagnostic(
-      m[2].trim(),
-      lineNumber,
-      diagnostics,
-      palette
-    ) : void 0;
-    return { label, color };
+    return { label: labelResult.label };
   }
   return {};
 }
@@ -5067,13 +5006,12 @@ function parseState(content, palette) {
     }
     return node;
   }
-  function addEdge(sourceId, targetId, lineNumber, label, color) {
+  function addEdge(sourceId, targetId, lineNumber, label) {
     result.edges.push({
       source: sourceId,
       target: targetId,
       lineNumber,
-      ...label && { label },
-      ...color && { color }
+      ...label && { label }
     });
   }
   for (let i = 0; i < lines.length; i++) {
@@ -5216,13 +5154,7 @@ function parseState(content, palette) {
       if (pendingArrow !== null) {
         const sourceId = lastNodeId ?? implicitSourceId;
         if (sourceId) {
-          addEdge(
-            sourceId,
-            node.id,
-            lineNumber,
-            pendingArrow.label,
-            pendingArrow.color
-          );
+          addEdge(sourceId, node.id, lineNumber, pendingArrow.label);
         }
         pendingArrow = null;
       }
@@ -5275,7 +5207,7 @@ var init_state_parser = __esm({
     init_name_normalize();
     PSEUDOSTATE_ID = "pseudostate:[*]";
     PSEUDOSTATE_LABEL = "[*]";
-    GROUP_BRACKET_RE = /^\[([^\]]+)\](?:\(([^)]+)\))?\s*$/;
+    GROUP_BRACKET_RE = /^\[([^\]]+)\](?:\s+(red|orange|yellow|green|blue|purple|teal|cyan|gray|black|white))?\s*$/;
   }
 });
 
@@ -5654,7 +5586,7 @@ var init_parser2 = __esm({
     init_arrows();
     init_parsing();
     init_name_normalize();
-    CLASS_DECL_RE = /^(?:(abstract|interface|enum)\s+)?(?:"([^"]+)"|([A-Z][^":]*?))(?:\s+extends\s+(?:"([^"]+)"|([A-Z][^":]*?)))?(?:\s+implements\s+(?:"([^"]+)"|([A-Z][^":]*?)))?(?:\s+\[(abstract|interface|enum)\])?(?:\s+\(([^)]+)\))?(?:\s+as\s+([A-Za-z][A-Za-z0-9_]{0,11}))?\s*$/;
+    CLASS_DECL_RE = /^(?:(abstract|interface|enum)\s+)?(?:"([^"]+)"|([A-Z][^":]*?))(?:\s+extends\s+(?:"([^"]+)"|([A-Z][^":]*?)))?(?:\s+implements\s+(?:"([^"]+)"|([A-Z][^":]*?)))?(?:\s+\[(abstract|interface|enum)\])?(?:\s+(red|orange|yellow|green|blue|purple|teal|cyan|gray|black|white))?(?:\s+as\s+([A-Za-z][A-Za-z0-9_]{0,11}))?\s*$/;
     INDENT_REL_ARROW_RE = /^(--\|>|\.\.\|>|\*--|o--|\.\.>|->)\s*(?:"([^"]+)"|([A-Za-z][^":]*?))(?:\s+:?\s*(.+))?$/;
     REL_ARROW_RE = /^(?:"([^"]+)"|([A-Z][^":]*?))\s*(--\|>|\.\.\|>|\*--|o--|\.\.>|->)\s*(?:"([^"]+)"|([A-Z][^":]*?))(?:\s+:?\s*(.+))?$/;
     VISIBILITY_RE = /^([+\-#])\s*/;
@@ -5861,7 +5793,7 @@ function parseERDiagram(content, palette) {
         result.diagnostics.push(
           makeDgmoError(
             lineNumber,
-            `Expected 'Value(color)' in tag group '${currentTagGroup.name}'`,
+            `Expected 'Value color' in tag group '${currentTagGroup.name}'`,
             "warning"
           )
         );
@@ -5973,7 +5905,7 @@ function parseERDiagram(content, palette) {
   if (result.tables.length === 0 && !result.error) {
     const diag = makeDgmoError(
       1,
-      'No tables found. Add table declarations like "users" or "orders (blue)".'
+      'No tables found. Add table declarations like "users" or "orders blue".'
     );
     result.diagnostics.push(diag);
     result.error = formatDgmoError(diag);
@@ -6059,15 +5991,19 @@ function extractSymbols3(docText) {
   for (const rawLine of docText.split("\n")) {
     const line12 = rawLine.trim();
     if (inMetadata && /^er(\s|$)/i.test(line12)) continue;
-    if (inMetadata && OPTION_NOCOLON_RE.test(line12)) continue;
-    inMetadata = false;
-    if (line12.length === 0) continue;
     if (/^\s/.test(rawLine)) continue;
+    if (line12.length === 0) continue;
     const m = TABLE_DECL_RE.exec(line12);
     if (m) {
       const name = (m[1] ?? m[2] ?? "").trim();
-      if (name) entities.push(name);
+      if (name) {
+        inMetadata = false;
+        entities.push(name);
+        continue;
+      }
     }
+    if (inMetadata && OPTION_NOCOLON_RE.test(line12)) continue;
+    inMetadata = false;
   }
   return {
     kind: "er",
@@ -6085,7 +6021,7 @@ var init_parser3 = __esm({
     init_name_normalize();
     init_parsing();
     init_tag_groups();
-    TABLE_DECL_RE = /^(?:"([^"]+)"|([a-zA-Z_][^|":(]*?))(?:\s*\(([^)]+)\))?(?:\s*\|(.+))?$/;
+    TABLE_DECL_RE = /^(?:"([^"]+)"|([a-zA-Z_][^|":(]*?))(?:\s+(red|orange|yellow|green|blue|purple|teal|cyan|gray|black|white))?(?:\s*\|(.+))?$/;
     INDENT_REL_RE = /^([1*?])-{1,2}(?:(.+?)-{1,2})?([1*?])\s+(?:"([^"]+)"|([a-zA-Z_][^":]*?))\s*$/;
     CONSTRAINT_MAP = {
       pk: "pk",
@@ -6165,18 +6101,22 @@ function parseChart(content, palette) {
         return fail(lineNumber, msg2);
       }
     }
-    const eraMatch = trimmed.match(
-      /^era\s+(.+?)\s*->\s*(.+?)(?:\s*\(([^)]+)\))?\s*$/
-    );
+    const eraMatch = trimmed.match(/^era\s+(.+?)\s*->\s*(.+?)\s*$/);
     if (eraMatch) {
       const afterArrow = eraMatch[2].trim();
       const spaceIdx2 = afterArrow.indexOf(" ");
       if (spaceIdx2 >= 0) {
+        const lastSpaceIdx = afterArrow.lastIndexOf(" ");
+        const trailing = afterArrow.substring(lastSpaceIdx + 1);
+        const hasColor = RECOGNIZED_COLOR_NAMES.includes(
+          trailing
+        );
+        const labelPart = hasColor ? afterArrow.substring(0, lastSpaceIdx).trimEnd() : afterArrow;
         rawEras.push({
           start: eraMatch[1].trim(),
-          afterArrow,
-          color: eraMatch[3] ? resolveColorWithDiagnostic(
-            eraMatch[3].trim(),
+          afterArrow: labelPart,
+          color: hasColor ? resolveColorWithDiagnostic(
+            trailing,
             lineNumber,
             result.diagnostics,
             palette
@@ -6711,11 +6651,12 @@ function parseExtendedChart(content, palette) {
         return result;
       }
     }
-    const categoryMatch = trimmed.match(/^\[(.+?)\](?:\s*\(([^)]+)\))?\s*$/);
+    const categoryMatch = trimmed.match(/^\[(.+?)\](?:\s+(\S+))?\s*$/);
     if (categoryMatch) {
       const catName = categoryMatch[1].trim();
-      const catColor = categoryMatch[2] ? resolveColorWithDiagnostic(
-        categoryMatch[2].trim(),
+      const rawCatColor = categoryMatch[2]?.trim();
+      const catColor = rawCatColor ? resolveColorWithDiagnostic(
+        rawCatColor,
         lineNumber,
         result.diagnostics,
         palette
@@ -6730,7 +6671,7 @@ function parseExtendedChart(content, palette) {
       continue;
     }
     const arrowMatch = trimmed.match(
-      /^(.+?)\s*(->|--)\s*(.+?)\s+(-?[\d,_]+(?:\.[\d]+)?)\s*(?:\(([^)]+)\))?\s*$/
+      /^(.+?)\s*(->|--)\s*(.+?)\s+(-?[\d,_]+(?:\.[\d]+)?)(?:\s+(red|orange|yellow|green|blue|purple|teal|cyan|gray|black|white))?\s*$/
     );
     if (arrowMatch) {
       const [, rawSource, arrow, rawTarget, rawVal, rawLinkColor] = arrowMatch;
@@ -6775,9 +6716,12 @@ function parseExtendedChart(content, palette) {
         }
         if (sankeyStack.length > 0) {
           const valColorMatch = trimmed.match(
-            /(-?[\d,_]+(?:\.[\d]+)?)\s*\(([^)]+)\)\s*$/
+            /(-?[\d,_]+(?:\.[\d]+)?)\s+(red|orange|yellow|green|blue|purple|teal|cyan|gray|black|white)\s*$/
           );
-          const strippedLine = valColorMatch ? trimmed.replace(/\s*\([^)]+\)\s*$/, "") : trimmed;
+          const strippedLine = valColorMatch ? trimmed.replace(
+            /\s+(red|orange|yellow|green|blue|purple|teal|cyan|gray|black|white)\s*$/,
+            ""
+          ) : trimmed;
           const dataRow2 = parseDataRowValues(strippedLine);
           if (dataRow2 && dataRow2.values.length === 1) {
             const source = sankeyStack.at(-1).name;
@@ -9153,7 +9097,7 @@ function parseOrg(content, palette) {
         if (!color) {
           pushError(
             lineNumber,
-            `Expected 'Value(color)' in tag group '${currentTagGroup.name}'`
+            `Expected 'Value color' in tag group '${currentTagGroup.name}'`
           );
           continue;
         }
@@ -9444,7 +9388,7 @@ function parseKanban(content, palette) {
         if (!color) {
           warn(
             lineNumber,
-            `Expected 'Value(color)' in tag group '${currentTagGroup.name}'`
+            `Expected 'Value color' in tag group '${currentTagGroup.name}'`
           );
           continue;
         }
@@ -9487,8 +9431,9 @@ function parseKanban(content, palette) {
       currentCard = null;
       columnCounter++;
       const colName = columnMatch[1].trim();
-      const colColor = columnMatch[2] ? resolveColorWithDiagnostic(
-        columnMatch[2].trim(),
+      const rawTrailing = columnMatch[2]?.trim();
+      const colColor = rawTrailing ? resolveColorWithDiagnostic(
+        rawTrailing,
         lineNumber,
         result.diagnostics,
         palette
@@ -9643,7 +9588,7 @@ var init_parser5 = __esm({
     init_tag_groups();
     init_parsing();
     init_name_normalize();
-    COLUMN_RE = /^\[(.+?)\](?:\s*\(([^)]+)\))?(?:\s+as\s+([A-Za-z][A-Za-z0-9_]{0,11}))?\s*(?:\|\s*(.+))?$/;
+    COLUMN_RE = /^\[(.+?)\](?:\s+(\S+))?(?:\s+as\s+([A-Za-z][A-Za-z0-9_]{0,11}))?\s*(?:\|\s*(.+))?$/;
     LEGACY_COLUMN_RE = /^==\s+(.+?)\s*(?:\[wip:\s*(\d+)\])?\s*==$/;
     KNOWN_OPTIONS4 = /* @__PURE__ */ new Set(["hide", "active-tag"]);
     KNOWN_BOOLEANS3 = /* @__PURE__ */ new Set([
@@ -9826,7 +9771,7 @@ function parseC4(content, palette) {
         if (!color) {
           pushError(
             lineNumber,
-            `Expected 'Value(color)' in tag group '${currentTagGroup.name}'`
+            `Expected 'Value color' in tag group '${currentTagGroup.name}'`
           );
           continue;
         }
@@ -10422,7 +10367,7 @@ __export(parser_exports7, {
   looksLikeSitemap: () => looksLikeSitemap,
   parseSitemap: () => parseSitemap
 });
-function parseArrowLine(trimmed, palette, lineNumber, diagnostics) {
+function parseArrowLine(trimmed, _palette, _lineNumber, _diagnostics) {
   const bareMatch = trimmed.match(BARE_ARROW_RE);
   if (bareMatch) {
     const rawTarget = bareMatch[1].trim();
@@ -10435,27 +10380,10 @@ function parseArrowLine(trimmed, palette, lineNumber, diagnostics) {
   const arrowMatch = trimmed.match(ARROW_RE);
   if (arrowMatch) {
     const label = arrowMatch[1]?.trim() || void 0;
-    let color = arrowMatch[2] ? resolveColorWithDiagnostic(
-      arrowMatch[2].trim(),
-      lineNumber,
-      diagnostics,
-      palette
-    ) : void 0;
-    if (label && !color) {
-      const inferred = inferArrowColor(label);
-      if (inferred)
-        color = resolveColorWithDiagnostic(
-          inferred,
-          lineNumber,
-          diagnostics,
-          palette
-        );
-    }
-    const rawTarget = arrowMatch[3].trim();
+    const rawTarget = arrowMatch[2].trim();
     const groupMatch = rawTarget.match(/^\[(.+)\]$/);
     return {
       label,
-      color,
       target: groupMatch ? groupMatch[1].trim() : rawTarget,
       targetIsGroup: !!groupMatch
     };
@@ -10597,7 +10525,7 @@ function parseSitemap(content, palette) {
         if (!color) {
           pushError(
             lineNumber,
-            `Expected 'Value(color)' in tag group '${currentTagGroup.name}'`
+            `Expected 'Value color' in tag group '${currentTagGroup.name}'`
           );
           continue;
         }
@@ -10634,7 +10562,6 @@ function parseSitemap(content, palette) {
           targetLabel: arrowInfo.target,
           targetIsGroup: arrowInfo.targetIsGroup,
           label: arrowInfo.label,
-          color: arrowInfo.color,
           lineNumber
         });
       }
@@ -10732,7 +10659,6 @@ function parseSitemap(content, palette) {
         sourceId: arrow.sourceNode.id,
         targetId: aliasHit,
         label: arrow.label,
-        color: arrow.color,
         lineNumber: arrow.lineNumber
       });
       continue;
@@ -10752,7 +10678,6 @@ function parseSitemap(content, palette) {
         sourceId: arrow.sourceNode.id,
         targetId: targetContainer.id,
         label: arrow.label,
-        color: arrow.color,
         lineNumber: arrow.lineNumber
       });
     } else {
@@ -10769,7 +10694,6 @@ function parseSitemap(content, palette) {
         sourceId: arrow.sourceNode.id,
         targetId: targetNode.id,
         label: arrow.label,
-        color: arrow.color,
         lineNumber: arrow.lineNumber
       });
     }
@@ -10859,7 +10783,6 @@ var CONTAINER_RE3, METADATA_RE3, ARROW_RE, BARE_ARROW_RE;
 var init_parser7 = __esm({
   "src/sitemap/parser.ts"() {
     "use strict";
-    init_colors();
     init_diagnostics();
     init_name_normalize();
     init_tag_groups();
@@ -10867,7 +10790,7 @@ var init_parser7 = __esm({
     init_description_helpers();
     CONTAINER_RE3 = /^\[([^\]]+)\]\s*(?:\|\s*(.+))?$/;
     METADATA_RE3 = /^([^:]+):\s*(.+)$/;
-    ARROW_RE = /^-([^(>][^(>]*?)?\s*(?:\(([^)]+)\))?\s*->\s*(.+)$/;
+    ARROW_RE = /^-([^>][^>]*?)?\s*->\s*(.+)$/;
     BARE_ARROW_RE = /^->\s*(.+)$/;
   }
 });
@@ -11158,13 +11081,18 @@ function parseInfra(content) {
     }
     if (currentTagGroup && indent > 0) {
       const { text: cleanEntry, isDefault } = stripDefaultModifier(trimmed);
-      const tvMatch = cleanEntry.match(TAG_VALUE_RE);
-      if (tvMatch) {
-        const valueName = tvMatch[1].trim();
-        const rawColor = tvMatch[2]?.trim();
-        if (rawColor) {
-          resolveColorWithDiagnostic(rawColor, lineNumber, result.diagnostics);
-        }
+      const lastSpaceIdx = cleanEntry.lastIndexOf(" ");
+      let valueName = cleanEntry;
+      let rawColor;
+      if (lastSpaceIdx > 0) {
+        const trailing = cleanEntry.substring(lastSpaceIdx + 1);
+        if (isRecognizedColorName(trailing)) {
+          rawColor = trailing;
+          valueName = cleanEntry.substring(0, lastSpaceIdx).trimEnd();
+        }
+      }
+      const tvMatch = valueName.match(TAG_VALUE_RE);
+      if (tvMatch || /^\w+$/.test(valueName)) {
         currentTagGroup.values.push({
           name: valueName,
           color: rawColor
@@ -11576,9 +11504,9 @@ var init_parser8 = __esm({
     "use strict";
     init_diagnostics();
     init_description_helpers();
-    init_colors();
     init_arrows();
     init_parsing();
+    init_colors();
     init_name_normalize();
     init_tag_groups();
     init_types();
@@ -11588,7 +11516,7 @@ var init_parser8 = __esm({
     ASYNC_SIMPLE_CONNECTION_RE = /^~>\s*(.+?)\s*$/;
     DEPRECATED_FANOUT_RE = /\bx(\d+)\s*$/;
     GROUP_RE = /^\[([^\]]+)\]\s*(?:as\s+([A-Za-z][A-Za-z0-9_]{0,11})\s*)?(?:\|\s*(.+))?$/;
-    TAG_VALUE_RE = /^(\w[\w\s]*?)(?:\(([^)]+)\))?\s*$/;
+    TAG_VALUE_RE = /^(\w[\w\s]+?)\s*$/;
     COMPONENT_RE = /^(?:"([^"]+)"|([a-zA-Z_][^|":]*?))\s*(\|.*)?$/;
     PIPE_META_RE = /[|,]\s*(\w+)\s*:\s*([^|,]+)/g;
     PROPERTY_RE = /^([\w-]+)\s+(.+)$/;
@@ -13025,7 +12953,7 @@ function parsePert(content, parseOpts = {}) {
             if (!color) {
               warn(
                 lineNumber,
-                `Expected 'Value(color)' in tag group '${currentTagGroup.name}'`
+                `Expected 'Value color' in tag group '${currentTagGroup.name}'`
               );
               continue;
             }
@@ -13048,7 +12976,7 @@ function parsePert(content, parseOpts = {}) {
         if (!color) {
           warn(
             lineNumber,
-            `Expected 'Value(color)' in tag group '${currentTagGroup.name}'`
+            `Expected 'Value color' in tag group '${currentTagGroup.name}'`
           );
           continue;
         }
@@ -14597,7 +14525,7 @@ function parseMindmap(content, palette) {
         if (!color) {
           pushError(
             lineNumber,
-            `Expected 'Value(color)' in tag group '${currentTagGroup.name}'`
+            `Expected 'Value color' in tag group '${currentTagGroup.name}'`
           );
           continue;
         }
@@ -15183,7 +15111,7 @@ function parseWireframe(content) {
         } else {
           pushWarning(
             lineNumber,
-            `Expected 'Value(color)' in tag group '${currentTagGroup.name}'`
+            `Expected 'Value color' in tag group '${currentTagGroup.name}'`
           );
         }
         continue;
@@ -15800,6 +15728,13 @@ function parseCycle(content) {
         warn(lineNum, "Empty node label.");
         continue;
       }
+      if (!metadata["color"]) {
+        const { label: stripped, colorName: shortcutColor } = peelTrailingColorName(label);
+        if (shortcutColor) {
+          metadata["color"] = shortcutColor;
+          label = stripped;
+        }
+      }
       const color = metadata["color"];
       const spanStr = metadata["span"];
       let span = 1;
@@ -16029,8 +15964,12 @@ function parseJourneyMap(content, palette) {
               const key = part.substring(0, colonIdx).trim().toLowerCase();
               const value = part.substring(colonIdx + 1).trim();
               if (key === "color") {
-                const resolved = extractColor(`x(${value})`, palette);
-                personaColor = resolved.color;
+                personaColor = resolveColorWithDiagnostic(
+                  value,
+                  lineNumber,
+                  result.diagnostics,
+                  palette
+                ) ?? void 0;
               }
             }
           }
@@ -16088,7 +16027,7 @@ function parseJourneyMap(content, palette) {
         if (!color) {
           warn(
             lineNumber,
-            `Expected 'Value(color)' in tag group '${currentTagGroup.name}'`
+            `Expected 'Value color' in tag group '${currentTagGroup.name}'`
           );
           continue;
         }
@@ -16331,6 +16270,7 @@ var PHASE_RE, SCORE_RE, ANNOTATION_RE, KNOWN_OPTIONS9, KNOWN_BOOLEANS6;
 var init_parser16 = __esm({
   "src/journey-map/parser.ts"() {
     "use strict";
+    init_colors();
     init_diagnostics();
     init_tag_groups();
     init_parsing();
@@ -16429,6 +16369,13 @@ function parsePyramid(content) {
         warn(lineNum, "Empty layer label.");
         continue;
       }
+      if (!color) {
+        const { label: stripped, colorName: shortcutColor } = peelTrailingColorName(label);
+        if (shortcutColor) {
+          color = shortcutColor;
+          label = stripped;
+        }
+      }
       currentLayer = {
         label,
         lineNumber: lineNum,
@@ -16592,6 +16539,13 @@ function parseRing(content) {
         warn(lineNum, "Empty layer label.");
         continue;
       }
+      if (!color) {
+        const { label: stripped, colorName: shortcutColor } = peelTrailingColorName(label);
+        if (shortcutColor) {
+          color = shortcutColor;
+          label = stripped;
+        }
+      }
       currentLayer = {
         label,
         lineNumber: lineNum,
@@ -17086,7 +17040,7 @@ function parseRaci(content, palette) {
           if (next.length > 0 && next[0] !== " " && next[0] !== "	") break;
           const stripped = nextTrim.replace(/,\s*$/, "");
           const segments = stripped.split("|").map((s) => s.trim());
-          const roleLabel = segments[0] ?? "";
+          let roleLabel = segments[0] ?? "";
           let roleColor;
           if (segments.length > 1) {
             const meta = parsePipeMetadata(segments);
@@ -17099,6 +17053,18 @@ function parseRaci(content, palette) {
               );
             }
           }
+          if (!roleColor) {
+            const { label: stripLabel, colorName: shortcutColor } = peelTrailingColorName(roleLabel);
+            if (shortcutColor) {
+              roleColor = resolveColorWithDiagnostic(
+                shortcutColor,
+                j + 1,
+                result.diagnostics,
+                palette
+              );
+              roleLabel = stripLabel;
+            }
+          }
           if (roleLabel) getOrAddRole(roleLabel, j + 1, roleColor);
         }
         i = j - 1;
@@ -17157,8 +17123,10 @@ function parseRaci(content, palette) {
           continue;
         }
         let phaseColor;
-        if (phaseMatch[2]) {
-          const meta = parsePipeMetadata(["", phaseMatch[2]]);
+        const trailingToken = phaseMatch[2];
+        const pipeMeta = phaseMatch[3];
+        if (pipeMeta) {
+          const meta = parsePipeMetadata(["", pipeMeta]);
           if (meta["color"]) {
             phaseColor = resolveColorWithDiagnostic(
               meta["color"],
@@ -17168,6 +17136,17 @@ function parseRaci(content, palette) {
             );
           }
         }
+        if (!phaseColor && trailingToken) {
+          const { colorName } = peelTrailingColorName(`x ${trailingToken}`);
+          if (colorName) {
+            phaseColor = resolveColorWithDiagnostic(
+              colorName,
+              lineNumber,
+              result.diagnostics,
+              palette
+            );
+          }
+        }
         currentPhase = {
           id: normalizeName(display),
           displayName: display,
@@ -17398,7 +17377,7 @@ var init_parser19 = __esm({
       "no-title",
       ...Object.keys(VARIANT_LOCK_DIRECTIVES)
     ]);
-    PHASE_RE2 = /^\[(.+?)\]\s*(?:\|\s*(.+))?\s*$/;
+    PHASE_RE2 = /^\[(.+?)\](?:\s+(\S+))?(?:\s*\|\s*(.+))?\s*$/;
     ROLE_ASSIGNMENT_RE = /^([^:]+):\s*(.*)$/;
   }
 });
@@ -19115,7 +19094,7 @@ function containerFill(palette, isDark, nodeColor2) {
 function containerStroke(palette, nodeColor2) {
   return nodeColor2 ?? palette.textMuted;
 }
-function renderOrg(container, parsed, layout, palette, isDark, onClickItem, exportDims, activeTagGroup, hiddenAttributes, ancestorPath) {
+function renderOrg(container, parsed, layout, palette, isDark, onClickItem, exportDims, activeTagGroup, hiddenAttributes, ancestorPath, exportMode) {
   d3Selection.select(container).selectAll(":not([data-d3-tooltip])").remove();
   const width = exportDims?.width ?? container.clientWidth;
   const height = exportDims?.height ?? container.clientHeight;
@@ -19375,7 +19354,7 @@ function renderOrg(container, parsed, layout, palette, isDark, onClickItem, expo
             }
           ],
           position: { placement: "top-center", titleRelation: "below-title" },
-          mode: "fixed"
+          mode: exportMode ? "export" : "preview"
         };
         const singleState = { activeGroup: lg.name };
         const groupG = legendParentBase.append("g").attr("transform", `translate(${lg.x}, ${lg.y})`);
@@ -19395,7 +19374,7 @@ function renderOrg(container, parsed, layout, palette, isDark, onClickItem, expo
       const legendConfig = {
         groups,
         position: { placement: "top-center", titleRelation: "below-title" },
-        mode: "fixed",
+        mode: exportMode ? "export" : "preview",
         capsulePillAddonWidth: eyeAddonWidth
       };
       const legendState = { activeGroup: activeTagGroup ?? null };
@@ -19862,7 +19841,6 @@ function layoutSitemap(parsed, hiddenCounts, activeTagGroup, hiddenAttributes, e
       targetId: edge.targetId,
       points,
       label: edge.label,
-      color: edge.color,
       lineNumber: edge.lineNumber,
       deferred: deferredSet.has(i) || void 0
     });
@@ -20319,7 +20297,7 @@ function containerFill2(palette, isDark, nodeColor2) {
 function containerStroke2(palette, nodeColor2) {
   return nodeColor2 ?? palette.textMuted;
 }
-function renderSitemap(container, parsed, layout, palette, isDark, onClickItem, exportDims, activeTagGroup, hiddenAttributes) {
+function renderSitemap(container, parsed, layout, palette, isDark, onClickItem, exportDims, activeTagGroup, hiddenAttributes, exportMode) {
   d3Selection2.select(container).selectAll(":not([data-d3-tooltip])").remove();
   const width = exportDims?.width ?? container.clientWidth;
   const height = exportDims?.height ?? container.clientHeight;
@@ -20350,9 +20328,6 @@ function renderSitemap(container, parsed, layout, palette, isDark, onClickItem,
   const defs = svg.append("defs");
   defs.append("marker").attr("id", "sm-arrow").attr("viewBox", `0 0 ${ARROWHEAD_W} ${ARROWHEAD_H}`).attr("refX", ARROWHEAD_W).attr("refY", ARROWHEAD_H / 2).attr("markerWidth", ARROWHEAD_W).attr("markerHeight", ARROWHEAD_H).attr("orient", "auto").append("polygon").attr("points", `0,0 ${ARROWHEAD_W},${ARROWHEAD_H / 2} 0,${ARROWHEAD_H}`).attr("fill", palette.textMuted);
   const edgeColors = /* @__PURE__ */ new Set();
-  for (const edge of layout.edges) {
-    if (edge.color) edgeColors.add(edge.color);
-  }
   for (const color of edgeColors) {
     const id = `sm-arrow-${color.replace("#", "")}`;
     defs.append("marker").attr("id", id).attr("viewBox", `0 0 ${ARROWHEAD_W} ${ARROWHEAD_H}`).attr("refX", ARROWHEAD_W).attr("refY", ARROWHEAD_H / 2).attr("markerWidth", ARROWHEAD_W).attr("markerHeight", ARROWHEAD_H).attr("orient", "auto").append("polygon").attr("points", `0,0 ${ARROWHEAD_W},${ARROWHEAD_H / 2} 0,${ARROWHEAD_H}`).attr("fill", color);
@@ -20431,8 +20406,8 @@ function renderSitemap(container, parsed, layout, palette, isDark, onClickItem,
   for (const edge of layout.edges) {
     if (edge.points.length < 2) continue;
     const edgeG = contentG.append("g").attr("class", "sitemap-edge-group").attr("data-line-number", String(edge.lineNumber));
-    const edgeColor3 = edge.color ?? palette.textMuted;
-    const markerId = edge.color ? `sm-arrow-${edge.color.replace("#", "")}` : "sm-arrow";
+    const edgeColor3 = palette.textMuted;
+    const markerId = "sm-arrow";
     const gen = edge.deferred ? lineGeneratorLinear : lineGenerator;
     const pathD = gen(edge.points);
     if (pathD) {
@@ -20513,7 +20488,8 @@ function renderSitemap(container, parsed, layout, palette, isDark, onClickItem,
       isDark,
       activeTagGroup,
       void 0,
-      hiddenAttributes
+      hiddenAttributes,
+      exportMode
     );
   }
   if (fixedTitle) {
@@ -20538,11 +20514,12 @@ function renderSitemap(container, parsed, layout, palette, isDark, onClickItem,
       isDark,
       activeTagGroup,
       width,
-      hiddenAttributes
+      hiddenAttributes,
+      exportMode
     );
   }
 }
-function renderLegend(parent, legendGroups, palette, isDark, activeTagGroup, fixedWidth, hiddenAttributes) {
+function renderLegend(parent, legendGroups, palette, isDark, activeTagGroup, fixedWidth, hiddenAttributes, exportMode) {
   if (legendGroups.length === 0) return;
   const groups = legendGroups.map((g) => ({
     name: g.name,
@@ -20553,7 +20530,7 @@ function renderLegend(parent, legendGroups, palette, isDark, activeTagGroup, fix
   const legendConfig = {
     groups,
     position: { placement: "top-center", titleRelation: "below-title" },
-    mode: "fixed",
+    mode: exportMode ? "export" : "preview",
     capsulePillAddonWidth: eyeAddonWidth
   };
   const legendState = { activeGroup: activeTagGroup ?? null };
@@ -20938,7 +20915,7 @@ function renderKanban(container, parsed, palette, isDark, options) {
     const legendConfig = {
       groups: parsed.tagGroups,
       position: { placement: "top-center", titleRelation: "inline-with-title" },
-      mode: exportDims ? "inline" : "fixed"
+      mode: options?.exportMode ? "export" : "preview"
     };
     const legendState = { activeGroup: activeTagGroup ?? null };
     const legendG = svg.append("g").attr("class", "kanban-legend").attr("transform", `translate(${legendX},${legendY})`);
@@ -21096,7 +21073,8 @@ function renderKanbanForExport(content, theme, palette) {
   const layout = computeLayout(parsed, palette);
   const container = document.createElement("div");
   renderKanban(container, parsed, palette, isDark, {
-    exportDims: { width: layout.totalWidth, height: layout.totalHeight }
+    exportDims: { width: layout.totalWidth, height: layout.totalHeight },
+    exportMode: true
   });
   const svgEl = container.querySelector("svg");
   return svgEl?.outerHTML ?? "";
@@ -21635,7 +21613,7 @@ function markerIdForType(type) {
 function isSourceMarker(type) {
   return type === "composes" || type === "aggregates";
 }
-function renderClassDiagram(container, parsed, layout, palette, isDark, onClickItem, exportDims, legendActive) {
+function renderClassDiagram(container, parsed, layout, palette, isDark, onClickItem, exportDims, legendActive, exportMode) {
   d3Selection4.select(container).selectAll(":not([data-d3-tooltip])").remove();
   const width = exportDims?.width ?? container.clientWidth;
   const height = exportDims?.height ?? container.clientHeight;
@@ -21697,7 +21675,7 @@ function renderClassDiagram(container, parsed, layout, palette, isDark, onClickI
     const legendConfig = {
       groups: legendGroups,
       position: { placement: "top-center", titleRelation: "below-title" },
-      mode: "fixed"
+      mode: exportMode ? "export" : "preview"
     };
     const legendState = {
       activeGroup: isLegendExpanded ? LEGEND_GROUP_NAME : null
@@ -21837,10 +21815,22 @@ function renderClassDiagramForExport(content, theme, palette) {
   const exportWidth = layout.width + DIAGRAM_PADDING4 * 2;
   const exportHeight = layout.height + DIAGRAM_PADDING4 * 2 + (parsed.title ? 40 : 0) + legendReserve;
   return runInExportContainer(exportWidth, exportHeight, (container) => {
-    renderClassDiagram(container, parsed, layout, palette, isDark, void 0, {
-      width: exportWidth,
-      height: exportHeight
-    });
+    renderClassDiagram(
+      container,
+      parsed,
+      layout,
+      palette,
+      isDark,
+      void 0,
+      {
+        width: exportWidth,
+        height: exportHeight
+      },
+      true,
+      // legendActive for export
+      true
+      // exportMode
+    );
     return extractExportSvg(container, theme);
   });
 }
@@ -22316,7 +22306,7 @@ function drawCardinality(g, point, prevPoint, cardinality, color, useLabels) {
     g.append("line").attr("x1", bx + px * spread).attr("y1", by + py * spread).attr("x2", bx - px * spread).attr("y2", by - py * spread).attr("stroke", color).attr("stroke-width", sw);
   }
 }
-function renderERDiagram(container, parsed, layout, palette, isDark, onClickItem, exportDims, activeTagGroup, semanticColorsActive) {
+function renderERDiagram(container, parsed, layout, palette, isDark, onClickItem, exportDims, activeTagGroup, semanticColorsActive, exportMode) {
   d3Selection5.select(container).selectAll(":not([data-d3-tooltip])").remove();
   const useSemanticColors = parsed.tagGroups.length === 0 && layout.nodes.every((n) => !n.color);
   const LEGEND_FIXED_GAP4 = 8;
@@ -22472,7 +22462,7 @@ function renderERDiagram(container, parsed, layout, palette, isDark, onClickItem
     const legendConfig = {
       groups: parsed.tagGroups,
       position: { placement: "top-center", titleRelation: "below-title" },
-      mode: "fixed"
+      mode: exportMode ? "export" : "preview"
     };
     const legendState = { activeGroup: activeTagGroup ?? null };
     const legendG = svg.append("g").attr("class", "er-tag-legend").attr("transform", `translate(0,${legendY})`);
@@ -22508,7 +22498,7 @@ function renderERDiagram(container, parsed, layout, palette, isDark, onClickItem
       const legendConfig = {
         groups: semanticGroups,
         position: { placement: "top-center", titleRelation: "below-title" },
-        mode: "fixed"
+        mode: exportMode ? "export" : "preview"
       };
       const legendState = {
         activeGroup: semanticActive ? "Role" : null
@@ -22541,10 +22531,21 @@ function renderERDiagramForExport(content, theme, palette) {
   container.style.left = "-9999px";
   document.body.appendChild(container);
   try {
-    renderERDiagram(container, parsed, layout, palette, isDark, void 0, {
-      width: exportWidth,
-      height: exportHeight
-    });
+    renderERDiagram(
+      container,
+      parsed,
+      layout,
+      palette,
+      isDark,
+      void 0,
+      {
+        width: exportWidth,
+        height: exportHeight
+      },
+      void 0,
+      void 0,
+      true
+    );
     const svgEl = container.querySelector("svg");
     if (!svgEl) return "";
     if (theme === "transparent") {
@@ -22779,7 +22780,8 @@ function renderBoxesAndLines(container, parsed, layout, palette, isDark, options
     hideDescriptions,
     controlsExpanded,
     onToggleDescriptions,
-    onToggleControlsExpand
+    onToggleControlsExpand,
+    exportMode = false
   } = options ?? {};
   d3Selection6.select(container).selectAll(":not([data-d3-tooltip])").remove();
   const width = exportDims?.width ?? container.clientWidth;
@@ -23115,7 +23117,7 @@ function renderBoxesAndLines(container, parsed, layout, palette, isDark, options
     const legendConfig = {
       groups: parsed.tagGroups,
       position: { placement: "top-center", titleRelation: "below-title" },
-      mode: "fixed",
+      mode: exportMode ? "export" : "preview",
       controlsGroup
     };
     const legendState = {
@@ -23147,7 +23149,8 @@ function renderBoxesAndLinesForExport(container, parsed, layout, palette, isDark
   renderBoxesAndLines(container, parsed, layout, palette, isDark, {
     exportDims: options?.exportDims,
     activeTagGroup: options?.activeTagGroup,
-    hiddenTagValues: options?.hiddenTagValues
+    hiddenTagValues: options?.hiddenTagValues,
+    exportMode: options?.exportMode
   });
 }
 var DIAGRAM_PADDING6, NODE_FONT_SIZE, MIN_NODE_FONT_SIZE, EDGE_LABEL_FONT_SIZE4, EDGE_STROKE_WIDTH5, NODE_STROKE_WIDTH5, NODE_RX, COLLAPSE_BAR_HEIGHT3, ARROWHEAD_W2, ARROWHEAD_H2, DESC_FONT_SIZE, DESC_LINE_HEIGHT, MAX_DESC_LINES, CHAR_WIDTH_RATIO2, NODE_TEXT_PADDING, GROUP_RX, GROUP_LABEL_FONT_SIZE, GROUP_LABEL_ZONE, lineGeneratorLR, lineGeneratorTB;
@@ -24384,7 +24387,7 @@ function renderMindmap(container, parsed, layout, palette, isDark, onClickItem,
         };
       }),
       position: { placement: "top-center", titleRelation: "below-title" },
-      mode: "fixed",
+      mode: options?.exportMode ? "export" : "preview",
       controlsGroup: controlsToggles
     };
     const legendState = {
@@ -27187,7 +27190,7 @@ function drawPersonIcon(g, cx, cy, color) {
   g.append("line").attr("x1", cx).attr("y1", bodyBottomY).attr("x2", cx - PERSON_LEG_SPAN).attr("y2", legY).attr("stroke", color).attr("stroke-width", PERSON_SW);
   g.append("line").attr("x1", cx).attr("y1", bodyBottomY).attr("x2", cx + PERSON_LEG_SPAN).attr("y2", legY).attr("stroke", color).attr("stroke-width", PERSON_SW);
 }
-function renderC4Context(container, parsed, layout, palette, isDark, onClickItem, exportDims, activeTagGroup) {
+function renderC4Context(container, parsed, layout, palette, isDark, onClickItem, exportDims, activeTagGroup, exportMode) {
   d3Selection9.select(container).selectAll(":not([data-d3-tooltip])").remove();
   const width = exportDims?.width ?? container.clientWidth;
   const height = exportDims?.height ?? container.clientHeight;
@@ -27363,7 +27366,8 @@ function renderC4Context(container, parsed, layout, palette, isDark, onClickItem
       palette,
       isDark,
       activeTagGroup,
-      fixedLegend ? width : null
+      fixedLegend ? width : null,
+      exportMode
     );
   }
 }
@@ -27718,7 +27722,7 @@ function placeEdgeLabels(labels, edges, obstacleRects) {
     placedRects.push({ x: lbl.x, y: lbl.y, w: lbl.bgW, h: lbl.bgH });
   }
 }
-function renderLegend2(parent, layout, palette, isDark, activeTagGroup, fixedWidth) {
+function renderLegend2(parent, layout, palette, isDark, activeTagGroup, fixedWidth, exportMode) {
   const groups = layout.legend.map((g) => ({
     name: g.name,
     entries: g.entries.map((e) => ({ value: e.value, color: e.color }))
@@ -27726,7 +27730,7 @@ function renderLegend2(parent, layout, palette, isDark, activeTagGroup, fixedWid
   const legendConfig = {
     groups,
     position: { placement: "top-center", titleRelation: "below-title" },
-    mode: "fixed"
+    mode: exportMode ? "export" : "preview"
   };
   const legendState = { activeGroup: activeTagGroup ?? null };
   const containerWidth = fixedWidth ?? layout.width;
@@ -27741,7 +27745,7 @@ function renderLegend2(parent, layout, palette, isDark, activeTagGroup, fixedWid
   );
   parent.selectAll("[data-legend-group]").classed("c4-legend-group", true);
 }
-function renderC4Containers(container, parsed, layout, palette, isDark, onClickItem, exportDims, activeTagGroup) {
+function renderC4Containers(container, parsed, layout, palette, isDark, onClickItem, exportDims, activeTagGroup, exportMode) {
   d3Selection9.select(container).selectAll(":not([data-d3-tooltip])").remove();
   const width = exportDims?.width ?? container.clientWidth;
   const height = exportDims?.height ?? container.clientHeight;
@@ -27972,7 +27976,8 @@ function renderC4Containers(container, parsed, layout, palette, isDark, onClickI
       palette,
       isDark,
       activeTagGroup,
-      fixedLegend ? width : null
+      fixedLegend ? width : null,
+      exportMode
     );
   }
 }
@@ -28040,7 +28045,7 @@ function renderC4ComponentsForExport(content, systemName, containerName, theme,
     document.body.removeChild(el);
   }
 }
-function renderC4Deployment(container, parsed, layout, palette, isDark, onClickItem, exportDims, activeTagGroup) {
+function renderC4Deployment(container, parsed, layout, palette, isDark, onClickItem, exportDims, activeTagGroup, exportMode) {
   renderC4Containers(
     container,
     parsed,
@@ -28049,7 +28054,8 @@ function renderC4Deployment(container, parsed, layout, palette, isDark, onClickI
     isDark,
     onClickItem,
     exportDims,
-    activeTagGroup
+    activeTagGroup,
+    exportMode
   );
 }
 function renderC4DeploymentForExport(content, theme, palette) {
@@ -28230,7 +28236,6 @@ function layoutGraph(graph, options) {
       target: edge.target,
       points: edgeData?.points ?? [],
       label: edge.label,
-      color: edge.color,
       lineNumber: edge.lineNumber
     };
   });
@@ -28554,9 +28559,6 @@ function renderFlowchart(container, graph, layout, palette, isDark, onClickItem,
   const defs = svg.append("defs");
   defs.append("marker").attr("id", "fc-arrow").attr("viewBox", `0 0 ${ARROWHEAD_W3} ${ARROWHEAD_H3}`).attr("refX", ARROWHEAD_W3).attr("refY", ARROWHEAD_H3 / 2).attr("markerWidth", ARROWHEAD_W3).attr("markerHeight", ARROWHEAD_H3).attr("orient", "auto").append("polygon").attr("points", `0,0 ${ARROWHEAD_W3},${ARROWHEAD_H3 / 2} 0,${ARROWHEAD_H3}`).attr("fill", palette.textMuted);
   const edgeColors = /* @__PURE__ */ new Set();
-  for (const edge of layout.edges) {
-    if (edge.color) edgeColors.add(edge.color);
-  }
   for (const color of edgeColors) {
     const id = `fc-arrow-${color.replace("#", "")}`;
     defs.append("marker").attr("id", id).attr("viewBox", `0 0 ${ARROWHEAD_W3} ${ARROWHEAD_H3}`).attr("refX", ARROWHEAD_W3).attr("refY", ARROWHEAD_H3 / 2).attr("markerWidth", ARROWHEAD_W3).attr("markerHeight", ARROWHEAD_H3).attr("orient", "auto").append("polygon").attr("points", `0,0 ${ARROWHEAD_W3},${ARROWHEAD_H3 / 2} 0,${ARROWHEAD_H3}`).attr("fill", color);
@@ -28620,8 +28622,8 @@ function renderFlowchart(container, graph, layout, palette, isDark, onClickItem,
     const edge = layout.edges[ei];
     if (edge.points.length < 2) continue;
     const edgeG = contentG.append("g").attr("class", "fc-edge-group").attr("data-line-number", String(edge.lineNumber));
-    const edgeColor3 = edge.color ?? palette.textMuted;
-    const markerId = edge.color ? `fc-arrow-${edge.color.replace("#", "")}` : "fc-arrow";
+    const edgeColor3 = palette.textMuted;
+    const markerId = "fc-arrow";
     const pathD = lineGenerator5(edge.points);
     if (pathD) {
       edgeG.append("path").attr("d", pathD).attr("fill", "none").attr("stroke", edgeColor3).attr("stroke-width", EDGE_STROKE_WIDTH8).attr("marker-end", `url(#${markerId})`).attr("class", "fc-edge");
@@ -31245,7 +31247,7 @@ function computeInfraLegendGroups(nodes, tagGroups, palette, edges) {
   }
   return groups;
 }
-function renderLegend3(rootSvg, legendGroups, totalWidth, legendY, palette, isDark, activeGroup, playback) {
+function renderLegend3(rootSvg, legendGroups, totalWidth, legendY, palette, isDark, activeGroup, playback, exportMode = false) {
   if (legendGroups.length === 0 && !playback) return;
   const legendG = rootSvg.append("g").attr("transform", `translate(0, ${legendY})`);
   if (activeGroup) {
@@ -31261,7 +31263,7 @@ function renderLegend3(rootSvg, legendGroups, totalWidth, legendY, palette, isDa
   const legendConfig = {
     groups: allGroups,
     position: { placement: "top-center", titleRelation: "below-title" },
-    mode: "fixed",
+    mode: exportMode ? "export" : "preview",
     showEmptyGroups: true
   };
   const legendState = { activeGroup };
@@ -31449,7 +31451,8 @@ function renderInfra(container, layout, palette, isDark, title, titleLineNumber,
         palette,
         isDark,
         activeGroup ?? null,
-        playback ?? void 0
+        playback ?? void 0,
+        exportMode
       );
       legendSvg.selectAll(".infra-legend-group").style("pointer-events", "auto");
     } else {
@@ -31461,7 +31464,8 @@ function renderInfra(container, layout, palette, isDark, title, titleLineNumber,
         palette,
         isDark,
         activeGroup ?? null,
-        playback ?? void 0
+        playback ?? void 0,
+        exportMode
       );
     }
   }
@@ -33363,7 +33367,8 @@ function renderPert(container, resolved, layout, palette, isDark, options = {})
       x: 0,
       y: tagLegendY,
       width: exportWidth,
-      activeGroup: tagLegendActive
+      activeGroup: tagLegendActive,
+      exportMode: options.exportMode
     });
   }
   const root = svg.append("g").attr("transform", `translate(${offsetX}, ${offsetY})`);
@@ -33424,7 +33429,8 @@ function renderPertForExport(content, theme, palette, now) {
     renderPert(container, resolved, layout, palette, isDark, {
       title: hasTitle ? parsed.title : null,
       subtitle: resolved.projectSubtitle,
-      exportDims: { width: exportWidth, height: exportHeight }
+      exportDims: { width: exportWidth, height: exportHeight },
+      exportMode: true
     });
     const svgEl = container.querySelector("svg");
     if (!svgEl) return "";
@@ -34511,7 +34517,7 @@ function renderLegendBlock(svg, entries, args) {
 }
 function renderTagLegendRow(svg, resolved, palette, isDark, args) {
   if (resolved.tagGroups.length === 0) return;
-  const { x, y, width, activeGroup } = args;
+  const { x, y, width, activeGroup, exportMode } = args;
   const groups = resolved.tagGroups.map((g) => ({
     name: g.name,
     entries: g.entries.map((e) => ({ value: e.value, color: e.color }))
@@ -34522,7 +34528,7 @@ function renderTagLegendRow(svg, resolved, palette, isDark, args) {
     {
       groups,
       position: { placement: "top-center", titleRelation: "below-title" },
-      mode: "fixed"
+      mode: exportMode ? "export" : "preview"
     },
     { activeGroup },
     palette,
@@ -35962,7 +35968,8 @@ function renderGantt(container, resolved, palette, isDark, options, exportDims)
             ).attr("display", active ? null : "none");
           }
           drawLegend();
-        }
+        },
+        options?.exportMode ?? false
       );
     }
   }
@@ -36751,7 +36758,7 @@ function buildControlsToggles(hasCriticalPath, criticalPathActive, hasDependenci
   }
   return toggles;
 }
-function renderTagLegend(svg, chartG, tagGroups, activeGroupName, chartLeftMargin, chartInnerWidth, legendY, palette, isDark, hasCriticalPath, criticalPathActive, _optionLineNumbers, onToggle, onToggleControlsExpand, currentSwimlaneGroup, onSwimlaneChange, legendViewMode, resolvedTasks, controlsExpanded = false, hasDependencies = false, dependenciesActive = false, onControlsToggle) {
+function renderTagLegend(svg, chartG, tagGroups, activeGroupName, chartLeftMargin, chartInnerWidth, legendY, palette, isDark, hasCriticalPath, criticalPathActive, _optionLineNumbers, onToggle, onToggleControlsExpand, currentSwimlaneGroup, onSwimlaneChange, legendViewMode, resolvedTasks, controlsExpanded = false, hasDependencies = false, dependenciesActive = false, onControlsToggle, exportMode = false) {
   let visibleGroups;
   if (activeGroupName) {
     const activeGroup = tagGroups.filter(
@@ -36846,7 +36853,7 @@ function renderTagLegend(svg, chartG, tagGroups, activeGroupName, chartLeftMargi
         placement: "top-center",
         titleRelation: "below-title"
       },
-      mode: "fixed",
+      mode: exportMode ? "export" : "preview",
       capsulePillAddonWidth: iconReserve,
       controlsGroup: controlsToggles.length > 0 ? { toggles: controlsToggles } : void 0
     };
@@ -36953,7 +36960,7 @@ function renderTagLegend(svg, chartG, tagGroups, activeGroupName, chartLeftMargi
         placement: "top-center",
         titleRelation: "below-title"
       },
-      mode: "fixed",
+      mode: exportMode ? "export" : "preview",
       controlsGroup: { toggles: controlsToggles }
     };
     const tagGroupG = legendRow.append("g");
@@ -37836,9 +37843,6 @@ function renderState(container, graph, layout, palette, isDark, onClickItem, exp
   const defs = svg.append("defs");
   defs.append("marker").attr("id", "st-arrow").attr("viewBox", `0 0 ${ARROWHEAD_W5} ${ARROWHEAD_H5}`).attr("refX", ARROWHEAD_W5).attr("refY", ARROWHEAD_H5 / 2).attr("markerWidth", ARROWHEAD_W5).attr("markerHeight", ARROWHEAD_H5).attr("orient", "auto").append("polygon").attr("points", `0,0 ${ARROWHEAD_W5},${ARROWHEAD_H5 / 2} 0,${ARROWHEAD_H5}`).attr("fill", palette.textMuted);
   const edgeColors = /* @__PURE__ */ new Set();
-  for (const edge of layout.edges) {
-    if (edge.color) edgeColors.add(edge.color);
-  }
   for (const color of edgeColors) {
     const id = `st-arrow-${color.replace("#", "")}`;
     defs.append("marker").attr("id", id).attr("viewBox", `0 0 ${ARROWHEAD_W5} ${ARROWHEAD_H5}`).attr("refX", ARROWHEAD_W5).attr("refY", ARROWHEAD_H5 / 2).attr("markerWidth", ARROWHEAD_W5).attr("markerHeight", ARROWHEAD_H5).attr("orient", "auto").append("polygon").attr("points", `0,0 ${ARROWHEAD_W5},${ARROWHEAD_H5 / 2} 0,${ARROWHEAD_H5}`).attr("fill", color);
@@ -37933,8 +37937,8 @@ function renderState(container, graph, layout, palette, isDark, onClickItem, exp
   for (let ei = 0; ei < layout.edges.length; ei++) {
     const edge = layout.edges[ei];
     const edgeG = contentG.append("g").attr("class", "st-edge-group").attr("data-line-number", String(edge.lineNumber));
-    const edgeColor3 = edge.color ?? palette.textMuted;
-    const markerId = edge.color ? `st-arrow-${edge.color.replace("#", "")}` : "st-arrow";
+    const edgeColor3 = palette.textMuted;
+    const markerId = "st-arrow";
     if (edge.source === edge.target) {
       const node = nodePositionMap.get(edge.source);
       if (node) {
@@ -39023,7 +39027,7 @@ function renderTechRadar(container, parsed, palette, isDark, onClickItem, export
         }
       ],
       position: { placement: "top-center", titleRelation: "below-title" },
-      mode: "fixed",
+      mode: options?.exportMode ? "export" : "preview",
       controlsGroup: {
         toggles: [
           {
@@ -39626,7 +39630,7 @@ function getQuadrantLabelPosition(position, cx, cy, maxRadius) {
       };
   }
 }
-function renderTechRadarForExport(container, parsed, palette, isDark, exportDims, viewState) {
+function renderTechRadarForExport(container, parsed, palette, isDark, exportDims, viewState, exportMode) {
   renderTechRadar(
     container,
     parsed,
@@ -39634,7 +39638,8 @@ function renderTechRadarForExport(container, parsed, palette, isDark, exportDims
     isDark,
     void 0,
     exportDims,
-    viewState
+    viewState,
+    { exportMode }
   );
 }
 var BLIP_RADIUS2, BLIP_FONT_SIZE2, RING_LABEL_FONT_SIZE, QUADRANT_LABEL_FONT_SIZE, TITLE_FONT_SIZE3, LISTING_FONT_SIZE, LISTING_HEADER_FONT_SIZE, LISTING_TOP_MARGIN, LISTING_COL_GAP, LISTING_LINE_HEIGHT, LISTING_BLIP_R;
@@ -40014,7 +40019,7 @@ function renderJourneyMap(container, parsed, palette, isDark, options) {
         titleRelation: "inline-with-title"
       },
       titleWidth: 0,
-      mode: exportDims ? "inline" : "fixed"
+      mode: options?.exportMode ? "export" : "preview"
     };
     const legendState = { activeGroup: effectiveActiveGroup };
     const legendCallbacks = {
@@ -40727,7 +40732,8 @@ function renderJourneyMapForExport(content, theme, palette) {
   const layout = layoutJourneyMap(parsed, palette, { isDark });
   const container = document.createElement("div");
   renderJourneyMap(container, parsed, palette, isDark, {
-    exportDims: { width: layout.totalWidth, height: layout.totalHeight }
+    exportDims: { width: layout.totalWidth, height: layout.totalHeight },
+    exportMode: true
   });
   const svgEl = container.querySelector("svg");
   if (!svgEl) return "";
@@ -41492,7 +41498,7 @@ function renderCycle(container, parsed, palette, isDark, onClickItem, exportDims
     const legendConfig = {
       groups: [],
       position: { placement: "top-center", titleRelation: "below-title" },
-      mode: "fixed",
+      mode: renderOptions?.exportMode ? "export" : "preview",
       controlsGroup
     };
     const legendState = {
@@ -41676,7 +41682,7 @@ function renderCycle(container, parsed, palette, isDark, onClickItem, exportDims
     }
   }
 }
-function renderCycleForExport(container, parsed, palette, isDark, exportDims, viewState) {
+function renderCycleForExport(container, parsed, palette, isDark, exportDims, viewState, exportMode) {
   renderCycle(
     container,
     parsed,
@@ -41684,7 +41690,8 @@ function renderCycleForExport(container, parsed, palette, isDark, exportDims, vi
     isDark,
     void 0,
     exportDims,
-    viewState
+    viewState,
+    { exportMode }
   );
 }
 function resolveNodeColor5(color, palette, defaultColor) {
@@ -44608,7 +44615,7 @@ function renderSequenceDiagram(container, parsed, palette, isDark, _onNavigateTo
     const legendConfig = {
       groups: resolvedGroups,
       position: { placement: "top-center", titleRelation: "below-title" },
-      mode: "fixed"
+      mode: "preview"
     };
     const legendState = {
       activeGroup: activeTagGroup ?? null,
@@ -45013,7 +45020,9 @@ function parseVisualization(content, palette) {
     if (currentTimelineTagGroup && indent === 0) {
       currentTimelineTagGroup = null;
     }
-    const groupMatch = line12.match(/^\[(.+?)\](?:\s*\(([^)]+)\))?\s*$/);
+    const groupMatch = line12.match(
+      /^\[(.+?)\](?:\s+(red|orange|yellow|green|blue|purple|teal|cyan|gray|black|white))?\s*$/
+    );
     if (groupMatch) {
       if (result.type === "arc") {
         const name = groupMatch[1].trim();
@@ -45055,7 +45064,7 @@ function parseVisualization(content, palette) {
     }
     if (result.type === "arc") {
       const linkMatch = line12.match(
-        /^(.+?)\s*->\s*(.+?)(?:\(([^)]+)\))?\s*(?:\s+(-?[\d,_]+(?:\.[\d]+)?))?$/
+        /^(.+?)\s*->\s*(.+?)(?:\s+(red|orange|yellow|green|blue|purple|teal|cyan|gray|black|white))?(?:\s+(-?[\d,_]+(?:\.[\d]+)?))?$/
       );
       if (linkMatch) {
         const source = linkMatch[1].trim();
@@ -45094,7 +45103,7 @@ function parseVisualization(content, palette) {
       } else {
         if (line12.startsWith("//")) continue;
         const eraEntryMatch = line12.match(
-          /^(\d{4}(?:-\d{2})?(?:-\d{2}(?: \d{2}:\d{2})?)?)\s*(?:->|\u2013>)\s*(\d{4}(?:-\d{2})?(?:-\d{2}(?: \d{2}:\d{2})?)?)\s+(.+?)(?:\s*\(([^)]+)\))?\s*$/
+          /^(\d{4}(?:-\d{2})?(?:-\d{2}(?: \d{2}:\d{2})?)?)\s*(?:->|\u2013>)\s*(\d{4}(?:-\d{2})?(?:-\d{2}(?: \d{2}:\d{2})?)?)\s+(.+?)(?:\s+(red|orange|yellow|green|blue|purple|teal|cyan|gray|black|white))?\s*$/
         );
         if (eraEntryMatch) {
           const colorAnnotation = eraEntryMatch[4]?.trim() || null;
@@ -45122,7 +45131,7 @@ function parseVisualization(content, palette) {
       } else {
         if (line12.startsWith("//")) continue;
         const markerEntryMatch = line12.match(
-          /^(\d{4}(?:-\d{2})?(?:-\d{2}(?: \d{2}:\d{2})?)?)\s+(.+?)(?:\s*\(([^)]+)\))?\s*$/
+          /^(\d{4}(?:-\d{2})?(?:-\d{2}(?: \d{2}:\d{2})?)?)\s+(.+?)(?:\s+(red|orange|yellow|green|blue|purple|teal|cyan|gray|black|white))?\s*$/
         );
         if (markerEntryMatch) {
           const colorAnnotation = markerEntryMatch[3]?.trim() || null;
@@ -45155,7 +45164,7 @@ function parseVisualization(content, palette) {
         continue;
       }
       const eraMatch = line12.match(
-        /^era\s+(\d{4}(?:-\d{2})?(?:-\d{2}(?: \d{2}:\d{2})?)?)\s*(?:->|\u2013>)\s*(\d{4}(?:-\d{2})?(?:-\d{2}(?: \d{2}:\d{2})?)?)\s+(.+?)(?:\s*\(([^)]+)\))?\s*$/
+        /^era\s+(\d{4}(?:-\d{2})?(?:-\d{2}(?: \d{2}:\d{2})?)?)\s*(?:->|\u2013>)\s*(\d{4}(?:-\d{2})?(?:-\d{2}(?: \d{2}:\d{2})?)?)\s+(.+?)(?:\s+(red|orange|yellow|green|blue|purple|teal|cyan|gray|black|white))?\s*$/
       );
       if (eraMatch) {
         const colorAnnotation = eraMatch[4]?.trim() || null;
@@ -45174,7 +45183,7 @@ function parseVisualization(content, palette) {
         continue;
       }
       const markerMatch = line12.match(
-        /^marker\s+(\d{4}(?:-\d{2})?(?:-\d{2}(?: \d{2}:\d{2})?)?)\s+(.+?)(?:\s*\(([^)]+)\))?\s*$/
+        /^marker\s+(\d{4}(?:-\d{2})?(?:-\d{2}(?: \d{2}:\d{2})?)?)\s+(.+?)(?:\s+(red|orange|yellow|green|blue|purple|teal|cyan|gray|black|white))?\s*$/
       );
       if (markerMatch) {
         const colorAnnotation = markerMatch[3]?.trim() || null;
@@ -45295,13 +45304,11 @@ function parseVisualization(content, palette) {
         }
       }
       if (!/^(solid-fill|no-name|no-value|no-percent|no-title)$/i.test(line12)) {
-        const legacyAliasMatch = line12.match(
-          /^([^(:]+?)(?:\(([^)]+)\))?\s+alias\s+(\S+)\s*$/i
-        );
+        const legacyAliasMatch = line12.match(/^(.+?)\s+alias\s+(\S+)\s*$/i);
         if (legacyAliasMatch) {
-          const name = legacyAliasMatch[1].trim();
-          const colorName = legacyAliasMatch[2]?.trim() ?? null;
-          const aliasToken = legacyAliasMatch[3].trim();
+          const nameWithMaybeColor = legacyAliasMatch[1].trim();
+          const aliasToken = legacyAliasMatch[2].trim();
+          const { label: name, colorName } = peelTrailingColorName(nameWithMaybeColor);
           let color = null;
           if (colorName) {
             color = resolveColorWithDiagnostic(
@@ -45323,11 +45330,12 @@ function parseVisualization(content, palette) {
           continue;
         }
         const setDeclMatch = line12.match(
-          /^([^(:]+?)(?:\(([^)]+)\))?(?:\s+as\s+([A-Za-z][A-Za-z0-9_]{0,11}))?\s*$/i
+          /^(.+?)(?:\s+as\s+([A-Za-z][A-Za-z0-9_]{0,11}))?\s*$/i
         );
         if (setDeclMatch) {
-          const name = setDeclMatch[1].trim();
-          const colorName = setDeclMatch[2]?.trim() ?? null;
+          const nameWithMaybeColor = setDeclMatch[1].trim();
+          const alias = setDeclMatch[2]?.trim() ?? null;
+          const { label: name, colorName } = peelTrailingColorName(nameWithMaybeColor);
           let color = null;
           if (colorName) {
             color = resolveColorWithDiagnostic(
@@ -45337,7 +45345,6 @@ function parseVisualization(content, palette) {
               palette
             ) ?? null;
           }
-          const alias = setDeclMatch[3]?.trim() ?? null;
           result.vennSets.push({ name, alias, color, lineNumber });
           continue;
         }
@@ -45383,10 +45390,9 @@ function parseVisualization(content, palette) {
       if (quadrantMatch) {
         const position = quadrantMatch[1].toLowerCase();
         const labelPart = quadrantMatch[2].trim();
-        const labelColorMatch = labelPart.match(/^(.+?)\s*\(([^)]+)\)\s*$/);
-        const text = labelColorMatch ? labelColorMatch[1].trim() : labelPart;
-        const color = labelColorMatch ? resolveColorWithDiagnostic(
-          labelColorMatch[2].trim(),
+        const { label: text, colorName } = peelTrailingColorName(labelPart);
+        const color = colorName ? resolveColorWithDiagnostic(
+          colorName,
           lineNumber,
           result.diagnostics,
           palette
@@ -45576,10 +45582,9 @@ function parseVisualization(content, palette) {
           );
           continue;
         }
-        const colorMatch = joinedLabel.match(/^(.+?)\(([^)]+)\)\s*$/);
-        const labelPart = colorMatch ? colorMatch[1].trim() : joinedLabel;
-        const colorPart = colorMatch ? resolveColorWithDiagnostic(
-          colorMatch[2].trim(),
+        const { label: labelPart, colorName: colorWord } = peelTrailingColorName(joinedLabel);
+        const colorPart = colorWord ? resolveColorWithDiagnostic(
+          colorWord,
           lineNumber,
           result.diagnostics,
           palette
@@ -46868,7 +46873,7 @@ function makeTimelineHoverHelpers() {
     setTagAttrs
   };
 }
-function renderTimelineTagLegendOverlay(container, parsed, palette, isDark, setup, hovers, onClickItem, exportDims, swimlaneTagGroup, activeTagGroup, onTagStateChange, viewMode) {
+function renderTimelineTagLegendOverlay(container, parsed, palette, isDark, setup, hovers, onClickItem, exportDims, swimlaneTagGroup, activeTagGroup, onTagStateChange, viewMode, exportMode) {
   if (parsed.timelineTagGroups.length === 0) return;
   const { width, textColor, groupColorMap, solid } = setup;
   const { FADE_OPACITY: FADE_OPACITY3, fadeReset, fadeToTagValue } = hovers;
@@ -46939,7 +46944,7 @@ function renderTimelineTagLegendOverlay(container, parsed, palette, isDark, setu
       const centralConfig = {
         groups: centralGroups,
         position: { placement: "top-center", titleRelation: "below-title" },
-        mode: "fixed",
+        mode: exportMode ? "export" : "preview",
         capsulePillAddonWidth: iconAddon
       };
       const centralState = { activeGroup: centralActive };
@@ -47783,7 +47788,7 @@ function renderTimelineVertical(container, parsed, palette, isDark, setup, hover
     }
   }
 }
-function renderTimeline(container, parsed, palette, isDark, onClickItem, exportDims, activeTagGroup, swimlaneTagGroup, onTagStateChange, viewMode) {
+function renderTimeline(container, parsed, palette, isDark, onClickItem, exportDims, activeTagGroup, swimlaneTagGroup, onTagStateChange, viewMode, exportMode) {
   const setup = setupTimeline(
     container,
     parsed,
@@ -47858,7 +47863,8 @@ function renderTimeline(container, parsed, palette, isDark, onClickItem, exportD
     swimlaneTagGroup,
     activeTagGroup,
     onTagStateChange,
-    viewMode
+    viewMode,
+    exportMode
   );
 }
 function getRotateFn(mode) {
@@ -49002,6 +49008,7 @@ function finalizeSvgExport(container, theme, palette) {
   return svgHtml;
 }
 async function renderForExport(content, theme, palette, viewState, options) {
+  const exportMode = options?.exportMode ?? false;
   const { parseDgmoChartType: parseDgmoChartType2 } = await Promise.resolve().then(() => (init_dgmo_router(), dgmo_router_exports));
   const detectedType = parseDgmoChartType2(content);
   if (detectedType === "org") {
@@ -49043,7 +49050,9 @@ async function renderForExport(content, theme, palette, viewState, options) {
       void 0,
       { width: exportWidth, height: exportHeight },
       activeTagGroup,
-      hiddenAttributes
+      hiddenAttributes,
+      void 0,
+      exportMode
     );
     return finalizeSvgExport(container2, theme, effectivePalette2);
   }
@@ -49085,7 +49094,8 @@ async function renderForExport(content, theme, palette, viewState, options) {
       void 0,
       { width: exportWidth, height: exportHeight },
       activeTagGroup,
-      hiddenAttributes
+      hiddenAttributes,
+      exportMode
     );
     return finalizeSvgExport(container2, theme, effectivePalette2);
   }
@@ -49108,7 +49118,8 @@ async function renderForExport(content, theme, palette, viewState, options) {
       currentSwimlaneGroup: viewState?.swim ?? null,
       collapsedLanes: viewState?.cl ? new Set(viewState.cl) : void 0,
       collapsedColumns: viewState?.cc ? new Set(viewState.cc) : void 0,
-      compactMeta: viewState?.cm
+      compactMeta: viewState?.cm,
+      exportMode
     });
     return finalizeSvgExport(container2, theme, effectivePalette2);
   }
@@ -49132,7 +49143,9 @@ async function renderForExport(content, theme, palette, viewState, options) {
       effectivePalette2,
       theme === "dark",
       void 0,
-      { width: exportWidth, height: exportHeight }
+      { width: exportWidth, height: exportHeight },
+      void 0,
+      exportMode
     );
     return finalizeSvgExport(container2, theme, effectivePalette2);
   }
@@ -49162,7 +49175,8 @@ async function renderForExport(content, theme, palette, viewState, options) {
         erParsed.options["active-tag"],
         viewState?.tag ?? options?.tagGroup
       ),
-      viewState?.sem
+      viewState?.sem,
+      exportMode
     );
     return finalizeSvgExport(container2, theme, effectivePalette2);
   }
@@ -49195,7 +49209,8 @@ async function renderForExport(content, theme, palette, viewState, options) {
       {
         exportDims: { width: exportWidth, height: exportHeight },
         activeTagGroup: viewState?.tag ?? options?.tagGroup,
-        hiddenTagValues: blHiddenTagValues
+        hiddenTagValues: blHiddenTagValues,
+        exportMode
       }
     );
     return finalizeSvgExport(container2, theme, effectivePalette2);
@@ -49241,7 +49256,7 @@ async function renderForExport(content, theme, palette, viewState, options) {
       void 0,
       hideDescriptions,
       colorByDepth ? null : activeTagGroup,
-      colorByDepth ? { colorByDepth: true } : void 0
+      colorByDepth ? { colorByDepth: true, exportMode } : { exportMode }
     );
     return finalizeSvgExport(container2, theme, effectivePalette2);
   }
@@ -49304,7 +49319,8 @@ async function renderForExport(content, theme, palette, viewState, options) {
         c4Parsed.tagGroups,
         c4Parsed.options["active-tag"],
         viewState?.tag ?? options?.tagGroup
-      )
+      ),
+      exportMode
     );
     return finalizeSvgExport(container2, theme, effectivePalette2);
   }
@@ -49440,7 +49456,8 @@ async function renderForExport(content, theme, palette, viewState, options) {
           resolved.tagGroups,
           resolved.options.activeTag ?? void 0,
           viewState?.tag ?? options?.tagGroup
-        )
+        ),
+        exportMode
       },
       { width: EXPORT_W, height: EXPORT_H }
     );
@@ -49481,7 +49498,8 @@ async function renderForExport(content, theme, palette, viewState, options) {
       effectivePalette2,
       theme === "dark",
       { width: RADAR_EXPORT_W, height: RADAR_EXPORT_H },
-      viewState
+      viewState,
+      exportMode
     );
     return finalizeSvgExport(container2, theme, effectivePalette2);
   }
@@ -49501,7 +49519,8 @@ async function renderForExport(content, theme, palette, viewState, options) {
       jmLayout.totalHeight
     );
     renderJourneyMap2(container2, jmParsed, effectivePalette2, theme === "dark", {
-      exportDims: { width: jmLayout.totalWidth, height: jmLayout.totalHeight }
+      exportDims: { width: jmLayout.totalWidth, height: jmLayout.totalHeight },
+      exportMode
     });
     return finalizeSvgExport(container2, theme, effectivePalette2);
   }
@@ -49518,7 +49537,8 @@ async function renderForExport(content, theme, palette, viewState, options) {
       effectivePalette2,
       theme === "dark",
       { width: EXPORT_WIDTH, height: EXPORT_HEIGHT },
-      viewState
+      viewState,
+      exportMode
     );
     return finalizeSvgExport(container2, theme, effectivePalette2);
   }
@@ -49637,7 +49657,10 @@ async function renderForExport(content, theme, palette, viewState, options) {
         void 0,
         viewState?.tag ?? options?.tagGroup
       ),
-      viewState?.swim
+      viewState?.swim,
+      void 0,
+      void 0,
+      exportMode
     );
   } else if (parsed.type === "venn") {
     renderVenn(container, parsed, effectivePalette, isDark, void 0, dims);
@@ -51358,7 +51381,11 @@ init_parser8();
 init_parser2();
 init_parser10();
 init_parsing();
+init_colors();
 init_chart_types();
+var RECOGNIZED_COLOR_SET2 = new Set(
+  RECOGNIZED_COLOR_NAMES
+);
 var extractorRegistry = /* @__PURE__ */ new Map();
 function registerExtractor(kind, fn) {
   extractorRegistry.set(kind, fn);
@@ -52127,8 +52154,8 @@ function extractTagDeclarations(docText) {
     }
     if (currentAlias !== null && raw.length > 0 && (raw[0] === " " || raw[0] === "	")) {
       if (trimmed && !trimmed.startsWith("//")) {
-        const colorIdx = trimmed.indexOf("(");
-        const value = colorIdx > 0 ? trimmed.substring(0, colorIdx).trim() : trimmed;
+        const lastSpaceIdx = trimmed.lastIndexOf(" ");
+        const value = lastSpaceIdx > 0 && RECOGNIZED_COLOR_SET2.has(trimmed.substring(lastSpaceIdx + 1)) ? trimmed.substring(0, lastSpaceIdx).trim() : trimmed;
         if (value) currentValues.push(value);
       }
       continue;
@@ -52679,7 +52706,6 @@ export {
   looksLikeSitemap,
   looksLikeState,
   makeDgmoError,
-  matchColorParens,
   matchesContiguously,
   measurePertAnalysisBlock,
   mix,