@diagrammo/dgmo 0.53.0 → 0.54.0

package/dist/element.mjs

@@ -429,6 +429,408 @@ var init_colors = __esm({
   }
 });
 
+// src/directives-registry.ts
+function tokensWhere(pred) {
+  const out = /* @__PURE__ */ new Set();
+  for (const e of DIRECTIVES_REGISTRY) if (pred(e)) out.add(e.token);
+  return out;
+}
+var DIRECTIVES_REGISTRY, ALL_REGISTRY_TOKENS, INFRA_TOP_LEVEL_OPTION_SET, INFRA_BEHAVIOR_KEY_SET, INFRA_EDGE_ONLY_KEY_SET, GANTT_OPTION_SET, GANTT_BOOLEAN_SET, MAP_DIRECTIVE_KEY_SET, REGISTRY_DIRECTIVE_TOKENS, REGISTRY_CONTROL_TOKENS, REGISTRY_STATUS_TOKENS, REGISTRY_MODIFIER_TOKENS, REGISTRY_COLON_KEY_TOKENS, REGISTRY_NON_HIGHLIGHT_TOKENS;
+var init_directives_registry = __esm({
+  "src/directives-registry.ts"() {
+    "use strict";
+    DIRECTIVES_REGISTRY = [
+      // ── Universal date handling (§ BL-121) ───────────────────
+      // Accepted in every date-bearing chart (gantt, pert, countdown, timeline,
+      // event-line). Handled inline by each parser's prescan — no parser-Set
+      // membership here — so they only contribute highlighting (DIRECTIVE_KEYWORDS).
+      { token: "year", category: "directive" },
+      { token: "date-order", category: "directive" },
+      { token: "no-current-year", category: "directive" },
+      // ── Infra ────────────────────────────────────────────────
+      // Top-level SLO options that are ALSO accepted as node colon-properties
+      // (dual membership). Highlight bare (kept in DIRECTIVE_KEYWORDS) — their
+      // rarer colon form stays keyword, an accepted minor false-positive.
+      {
+        token: "slo-availability",
+        category: "directive",
+        infra: ["top-level", "behavior"]
+      },
+      {
+        token: "slo-p90-latency-ms",
+        category: "directive",
+        infra: ["top-level", "behavior"]
+      },
+      {
+        token: "slo-warning-margin",
+        category: "directive",
+        infra: ["top-level", "behavior"]
+      },
+      // Top-level-only options (space-separated, bare).
+      { token: "default-latency-ms", category: "directive", infra: ["top-level"] },
+      { token: "default-uptime", category: "directive", infra: ["top-level"] },
+      { token: "default-rps", category: "directive", infra: ["top-level"] },
+      // `active-tag` is shared with gantt + map (see below).
+      // Node behavior colon-keys — highlight as propertyName.
+      { token: "latency-ms", colonKey: true, infra: ["behavior"] },
+      { token: "uptime", colonKey: true, infra: ["behavior"] },
+      { token: "instances", colonKey: true, infra: ["behavior"] },
+      { token: "max-rps", colonKey: true, infra: ["behavior"] },
+      { token: "cache-hit", colonKey: true, infra: ["behavior"] },
+      { token: "firewall-block", colonKey: true, infra: ["behavior"] },
+      { token: "ratelimit-rps", colonKey: true, infra: ["behavior"] },
+      { token: "buffer", colonKey: true, infra: ["behavior"] },
+      { token: "drain-rate", colonKey: true, infra: ["behavior"] },
+      { token: "retention-hours", colonKey: true, infra: ["behavior"] },
+      { token: "partitions", colonKey: true, infra: ["behavior"] },
+      { token: "concurrency", colonKey: true, infra: ["behavior"] },
+      { token: "duration-ms", colonKey: true, infra: ["behavior"] },
+      { token: "cold-start-ms", colonKey: true, infra: ["behavior"] },
+      { token: "cb-error-threshold", colonKey: true, infra: ["behavior"] },
+      { token: "cb-latency-threshold-ms", colonKey: true, infra: ["behavior"] },
+      // Edge-only colon-key.
+      { token: "rps", colonKey: true, infra: ["edge"] },
+      // ── Gantt ────────────────────────────────────────────────
+      { token: "start", category: "directive", gantt: ["option"] },
+      {
+        token: "today-marker",
+        category: "directive",
+        gantt: ["option", "boolean"]
+      },
+      {
+        token: "critical-path",
+        category: "directive",
+        gantt: ["option", "boolean"]
+      },
+      { token: "sprint-length", category: "directive", gantt: ["option"] },
+      { token: "sprint-number", category: "directive", gantt: ["option"] },
+      { token: "sprint-start", category: "directive", gantt: ["option"] },
+      { token: "fill-tint", category: "directive", gantt: ["boolean"] },
+      { token: "fill-solid", category: "directive", gantt: ["boolean"] },
+      { token: "fill-outline", category: "directive", gantt: ["boolean"] },
+      // `chart` is a wireframe element keyword (CONTROL); gantt also accepts it as
+      // an option. Highlight family is control.
+      { token: "chart", category: "control", gantt: ["option"] },
+      // `dependencies` is ON by default → almost never written bare (authors write
+      // `no-dependencies`, which DOES highlight). Bare word collides with prose and
+      // the specializer is context-free, so it stays plain. Present for parser
+      // Set derivation only.
+      { token: "dependencies", noHighlight: true, gantt: ["option", "boolean"] },
+      // ── Map ──────────────────────────────────────────────────
+      // Per-element value→channel ramps (decision #20): the directive names the
+      // visual channel — `region-heat` (colour), `poi-size` (marker area),
+      // `flow-width` (stroke). The per-element key mirrors it (`heat:`/`size:`/`width:`).
+      { token: "region-heat", category: "directive", map: true },
+      { token: "poi-size", category: "directive", map: true },
+      { token: "flow-width", category: "directive", map: true },
+      { token: "locale", category: "directive", map: true },
+      { token: "caption", category: "directive", map: true },
+      { token: "no-coastline", category: "directive", map: true },
+      { token: "no-relief", category: "directive", map: true },
+      { token: "no-context-labels", category: "directive", map: true },
+      { token: "no-region-labels", category: "directive", map: true },
+      { token: "no-region-heat-value", category: "directive", map: true },
+      { token: "no-poi-labels", category: "directive", map: true },
+      { token: "no-colorize", category: "directive", map: true },
+      { token: "no-cities", category: "directive", map: true },
+      { token: "no-cluster-pois", category: "directive", map: true },
+      // ── Clock channel (BL-122): live local-time cards on POIs flagged `clock` ──
+      // Activation is the per-POI `clock` flag (peeled in the map parser, not a
+      // directive). `hours 9-17` / `days mon-fri` are the global availability
+      // window (reused verbatim from the clock chart type).
+      { token: "hours", category: "directive", map: true },
+      { token: "days", category: "directive", map: true },
+      // ── Shared across types ──────────────────────────────────
+      // `active-tag`: infra top-level option + gantt option + map directive.
+      // Treemap also accepts it (§24C.6, decision #48) — validated inline in its
+      // parser, so no chart-scoped Set is derived for it; highlighting comes from
+      // the global directive category here.
+      {
+        token: "active-tag",
+        category: "directive",
+        infra: ["top-level"],
+        gantt: ["option"],
+        map: true
+      },
+      // `title`: gantt option. (The data-chart `title` directive was removed in
+      // decision #48 — it now raises E_TITLE_DIRECTIVE; the token stays here for
+      // gantt.)
+      { token: "title", category: "directive", gantt: ["option"] },
+      // `sort`: gantt option (also general, hand-listed).
+      { token: "sort", category: "directive", gantt: ["option"] },
+      // `lane-by <group>`: swimlane axis (view-state). NB not `swimlane` — that's a
+      // chart type. Kanban reads it via its own KNOWN_OPTIONS; gantt via the switch.
+      { token: "lane-by", category: "directive", gantt: ["option"] },
+      // `no-title`: gantt boolean + map directive (also general, hand-listed).
+      { token: "no-title", category: "directive", gantt: ["boolean"], map: true },
+      // `no-legend`: universal (decision #48) — every chart that renders a legend
+      // accepts it, and charts without one take it as a harmless no-op. Parsed for
+      // most types via GLOBAL_BOOLEANS in utils/parsing; gantt derives its boolean
+      // Set from here, and map from `map: true`.
+      { token: "no-legend", category: "directive", gantt: ["boolean"], map: true },
+      // ══════════════════════════════════════════════════════════
+      // Highlight-only vocab (no extractable parser Set).
+      // ══════════════════════════════════════════════════════════
+      // These chart types validate their directives with inline checks rather than
+      // a literal Set, so there is no parser literal to delete — the registry is
+      // simply their single declaration site for highlighting. Grouped by chart
+      // type. Categories route to the specializer-read sets in keywords.ts.
+      // ── Gantt (extras beyond the option/boolean Sets) ────────
+      { token: "era", category: "directive" },
+      { token: "marker", category: "directive" },
+      { token: "holiday", category: "directive" },
+      // `workweek` is also the canonical weekday-window directive on clock and map
+      // clock-cards (decision #48; `days` stays as the legacy alias).
+      { token: "workweek", category: "directive", map: true },
+      { token: "no-dependencies", category: "directive" },
+      // ── Tech-radar ───────────────────────────────────────────
+      { token: "rings", category: "directive" },
+      // Blip listing is default-on everywhere (decision #48): `no-blip-legend`
+      // suppresses it; `show-blip-legend` stays as the parse-accepted legacy no-op.
+      { token: "no-blip-legend", category: "directive" },
+      { token: "show-blip-legend", category: "directive" },
+      { token: "trend", category: "directive" },
+      // ── Tags / shared directives ─────────────────────────────
+      { token: "tags", category: "directive" },
+      { token: "import", category: "directive" },
+      { token: "hide", category: "directive" },
+      { token: "direction", category: "directive" },
+      // ── Clock ────────────────────────────────────────────────
+      // The board's flat directives — highlight-only (the parser validates them
+      // inline, no extractable Set). `no-title` + `direction` are already listed
+      // above (shared). Values (analog is a bare flag; color-by's
+      // place|work|daylight|time|none) highlight as plain tokens.
+      { token: "analog", category: "directive" },
+      { token: "hours", category: "directive" },
+      { token: "days", category: "directive" },
+      { token: "no-sun", category: "directive" },
+      { token: "time-24", category: "directive" },
+      { token: "color-by", category: "directive" },
+      // ── Boxes-and-lines ──────────────────────────────────────
+      // `heat <Label> [low] [high]` is the value→colour ramp directive, but `heat`
+      // is NOT registered as a directive keyword: it is dual-use with the `heat:`
+      // metadata key (decision #20), and a token in DIRECTIVE_KEYWORDS would block the
+      // ATTRIBUTE_KEYS colon-gate from reclassifying `heat:` as a propertyName. So
+      // `heat` lives only in the reserved-key registry + ATTRIBUTE_KEYS and highlights
+      // as a property in both positions — exactly the treemap `heat` precedent.
+      // Box values render by default since decision #48; `show-values` stays as
+      // the parse-accepted legacy no-op (suppress with the shared `no-value`).
+      { token: "show-values", category: "directive" },
+      // Treemap's legacy plural spelling of the same suppression (decision #48
+      // made the shared singular `no-value` canonical). Registered so a legacy
+      // document still highlights it as a directive rather than plain text.
+      { token: "no-values", category: "directive" },
+      // ── Swimlane ─────────────────────────────────────────────
+      { token: "lane", category: "directive" },
+      // ── ER ───────────────────────────────────────────────────
+      { token: "notation", category: "directive" },
+      // ── Class ────────────────────────────────────────────────
+      { token: "extends", category: "directive" },
+      { token: "implements", category: "directive" },
+      { token: "abstract", category: "directive" },
+      { token: "interface", category: "directive" },
+      { token: "enum", category: "directive" },
+      // ── C4 ───────────────────────────────────────────────────
+      { token: "containers", category: "directive" },
+      { token: "components", category: "directive" },
+      { token: "deployment", category: "directive" },
+      { token: "technology", category: "directive" },
+      // ── Infra (directives beyond the option/behavior Sets) ───
+      { token: "sub-node-label", category: "directive" },
+      { token: "show-sub-node-count", category: "directive" },
+      { token: "animate", category: "directive" },
+      // ── Sequence ─────────────────────────────────────────────
+      { token: "activations", category: "directive" },
+      { token: "no-activations", category: "directive" },
+      // ── Map element leaders (not in DIRECTIVE_SET) ───────────
+      { token: "poi", category: "directive" },
+      { token: "route", category: "directive" },
+      // ── Data charts ──────────────────────────────────────────
+      { token: "stacked", category: "directive" },
+      { token: "no-name", category: "directive" },
+      { token: "no-value", category: "directive" },
+      { token: "no-percent", category: "directive" },
+      { token: "series", category: "directive" },
+      { token: "orientation", category: "directive" },
+      { token: "x-label", category: "directive" },
+      { token: "y-label", category: "directive" },
+      { token: "size-label", category: "directive" },
+      { token: "columns", category: "directive" },
+      { token: "rows", category: "directive" },
+      { token: "labels", category: "directive" },
+      { token: "rotate", category: "directive" },
+      { token: "scale", category: "directive" },
+      { token: "values", category: "directive" },
+      { token: "orientation-horizontal", category: "directive" },
+      // ── Slope ────────────────────────────────────────────────
+      { token: "period", category: "directive" },
+      // ── Quadrant ─────────────────────────────────────────────
+      { token: "x-axis", category: "directive" },
+      { token: "y-axis", category: "directive" },
+      { token: "top-right", category: "directive" },
+      { token: "top-left", category: "directive" },
+      { token: "bottom-right", category: "directive" },
+      { token: "bottom-left", category: "directive" },
+      // ── Layout (cross-chart) ─────────────────────────────────
+      { token: "direction-tb", category: "directive" },
+      { token: "direction-lr", category: "directive" },
+      { token: "orientation-vertical", category: "directive" },
+      // ── Pyramid ──────────────────────────────────────────────
+      { token: "inverted", category: "directive" },
+      // ── Color / notes (cross-chart) ──────────────────────────
+      { token: "color", category: "directive" },
+      { token: "no-notes", category: "directive" },
+      // ── Emphasis family (§1.11, decision #49) ────────────────
+      // `highlight <Name>…` / `dim <Name>…` — the figure/ground axis, orthogonal
+      // to color (§1.5) and to the chart-wide `fill-*` family (§1.9). Both are
+      // chart-level directives taking a name list, validated inline by each
+      // adopting parser (no extractable Set), so the registry is their single
+      // declaration site for highlighting.
+      //
+      // `highlight` shipped on `family` long before this entry existed and was
+      // never registered — it had completions but highlighted as plain text. Both
+      // tokens are registered together so the whole family lights up at once.
+      //
+      // Supported on `sankey` and `family` today; every further chart type is a
+      // separate decision. Registering them globally is correct regardless: the
+      // Lezer specializer is context-free (it cannot know the chart type), and the
+      // same is already true of every other chart-scoped token here.
+      { token: "highlight", category: "directive" },
+      { token: "dim", category: "directive" },
+      // ── RACI ─────────────────────────────────────────────────
+      { token: "roles", category: "directive" },
+      // ── Cycle ────────────────────────────────────────────────
+      { token: "direction-counterclockwise", category: "directive" },
+      { token: "circle-nodes", category: "directive" },
+      // ── Journey-map ──────────────────────────────────────────
+      { token: "persona", category: "directive" },
+      // ── Function ─────────────────────────────────────────────
+      { token: "x", category: "directive" },
+      { token: "shade", category: "directive" },
+      // ── Wordcloud ────────────────────────────────────────────
+      { token: "max", category: "directive" },
+      { token: "size", category: "directive" },
+      // ── Arc ──────────────────────────────────────────────────
+      { token: "order", category: "directive" },
+      // ── PERT ─────────────────────────────────────────────────
+      { token: "time-unit", category: "directive" },
+      { token: "default-confidence", category: "directive" },
+      { token: "node-detail", category: "directive" },
+      { token: "trials", category: "directive" },
+      { token: "seed", category: "directive" },
+      { token: "scrubber-trials", category: "directive" },
+      // `start-date` is also gantt's canonical project-start option (decision #48;
+      // bare `start` above stays as the legacy alias).
+      { token: "start-date", category: "directive", gantt: ["option"] },
+      { token: "end-date", category: "directive" },
+      // ── Goal ─────────────────────────────────────────────────
+      // Mode flags, value-key leaders, and opt-outs. `now`/`target` collide with
+      // label prose ("start now", "on target"), but the arrow-label demotion pass
+      // (see highlight-api LABEL_WORD_NODES) treats any keyword-bearing label as
+      // text and demotes them, so they highlight only as line leaders.
+      { token: "thermometer", category: "directive" },
+      { token: "gauge", category: "directive" },
+      { token: "now", category: "directive" },
+      { token: "target", category: "directive" },
+      { token: "no-note", category: "directive" },
+      { token: "no-auto-color", category: "directive" },
+      // ── Control-flow + wireframe element keywords (CONTROL) ──
+      { token: "if", category: "control" },
+      { token: "else", category: "control" },
+      { token: "loop", category: "control" },
+      { token: "parallel", category: "control" },
+      { token: "note", category: "control" },
+      { token: "nav", category: "control" },
+      { token: "tabs", category: "control" },
+      { token: "table", category: "control" },
+      { token: "image", category: "control" },
+      { token: "modal", category: "control" },
+      { token: "skeleton", category: "control" },
+      { token: "alert", category: "control" },
+      { token: "progress", category: "control" },
+      { token: "mobile", category: "control" },
+      // ── Kanban status keywords (STATUS) ──────────────────────
+      { token: "na", category: "status" },
+      { token: "todo", category: "status" },
+      { token: "wip", category: "status" },
+      { token: "done", category: "status" },
+      { token: "blocked", category: "status" },
+      { token: "in-progress", category: "status" },
+      { token: "backlog", category: "status" },
+      { token: "ready", category: "status" },
+      // ── Modifiers + ER column types/modifiers (MODIFIER) ─────
+      // `collapsed` is the bare trailing group-line flag made canonical by
+      // decision #48 (`[Fulfillment] collapsed`). It is deliberately a bare
+      // MODIFIER rather than a colon key: the legacy `collapsed: true` form still
+      // parses and still highlights (as `modifier` instead of `propertyName`),
+      // whereas leaving it colon-only left the canonical bare form as plain text.
+      { token: "collapsed", category: "modifier" },
+      { token: "as", category: "modifier" },
+      { token: "alias", category: "modifier" },
+      { token: "aka", category: "modifier" },
+      { token: "position", category: "modifier" },
+      { token: "default", category: "modifier" },
+      { token: "pk", category: "modifier" },
+      { token: "fk", category: "modifier" },
+      { token: "nullable", category: "modifier" },
+      { token: "unique", category: "modifier" },
+      { token: "int", category: "modifier" },
+      { token: "varchar", category: "modifier" },
+      { token: "text", category: "modifier" },
+      { token: "boolean", category: "modifier" },
+      { token: "date", category: "modifier" },
+      { token: "timestamp", category: "modifier" },
+      { token: "float", category: "modifier" },
+      { token: "decimal", category: "modifier" },
+      // ── Bracket ──────────────────────────────────────────────
+      // `beats` / `vs` are the infix match keywords; the rest are line directives.
+      // (`seed` and `no-legend` already appear above — shared, not re-listed.)
+      { token: "beats", category: "control" },
+      { token: "vs", category: "control" },
+      { token: "rounds", category: "directive" },
+      { token: "accent", category: "directive" },
+      { token: "no-round", category: "modifier" },
+      { token: "no-rounds", category: "modifier" },
+      { token: "single-elim", category: "modifier" },
+      { token: "double-elim", category: "modifier" },
+      { token: "seeded", category: "modifier" }
+    ];
+    ALL_REGISTRY_TOKENS = tokensWhere(() => true);
+    INFRA_TOP_LEVEL_OPTION_SET = tokensWhere(
+      (e) => !!e.infra?.includes("top-level")
+    );
+    INFRA_BEHAVIOR_KEY_SET = tokensWhere(
+      (e) => !!e.infra?.includes("behavior")
+    );
+    INFRA_EDGE_ONLY_KEY_SET = tokensWhere(
+      (e) => !!e.infra?.includes("edge")
+    );
+    GANTT_OPTION_SET = tokensWhere(
+      (e) => !!e.gantt?.includes("option")
+    );
+    GANTT_BOOLEAN_SET = tokensWhere(
+      (e) => !!e.gantt?.includes("boolean")
+    );
+    MAP_DIRECTIVE_KEY_SET = tokensWhere((e) => e.map === true);
+    REGISTRY_DIRECTIVE_TOKENS = tokensWhere(
+      (e) => e.category === "directive" && !e.colonKey && !e.noHighlight
+    );
+    REGISTRY_CONTROL_TOKENS = tokensWhere(
+      (e) => e.category === "control" && !e.colonKey && !e.noHighlight
+    );
+    REGISTRY_STATUS_TOKENS = tokensWhere(
+      (e) => e.category === "status" && !e.colonKey && !e.noHighlight
+    );
+    REGISTRY_MODIFIER_TOKENS = tokensWhere(
+      (e) => e.category === "modifier" && !e.colonKey && !e.noHighlight
+    );
+    REGISTRY_COLON_KEY_TOKENS = tokensWhere((e) => !!e.colonKey);
+    REGISTRY_NON_HIGHLIGHT_TOKENS = tokensWhere(
+      (e) => !!e.noHighlight
+    );
+  }
+});
+
 // src/utils/reserved-key-registry.ts
 function staticRegistry(keys) {
   return { keys: new Set(keys), tagAliases: /* @__PURE__ */ new Set() };
@@ -683,6 +1085,19 @@ function parseFirstLine(line11) {
     title: trimmed.substring(spaceIdx + 1).trim() || void 0
   };
 }
+function detectBadChartTypeDeclaration(line11, knownOptionKeys) {
+  const trimmed = line11.trim();
+  if (!trimmed || trimmed.includes(":")) return null;
+  const spaceIdx = trimmed.indexOf(" ");
+  const token = spaceIdx === -1 ? trimmed : trimmed.substring(0, spaceIdx);
+  if (!CHART_TYPE_TOKEN_RE.test(token)) return null;
+  const lower = token.toLowerCase();
+  if (knownOptionKeys.has(lower) || ALL_REGISTRY_TOKENS.has(lower)) return null;
+  if (spaceIdx === -1) return /\d/.test(token) ? null : token;
+  const rest = trimmed.substring(spaceIdx + 1).trim();
+  if (!rest || !TITLE_LIKE_RE.test(rest)) return null;
+  return token;
+}
 function normalizeNumericToken(token) {
   if (!token.includes(",") && !token.includes("_")) return null;
   if (token.includes(",") && token.includes("_")) return null;
@@ -1028,12 +1443,13 @@ function warnUnknownMetaKeys(meta, registry, warn, nameToScan) {
     }
   }
 }
-var RECOGNIZED_COLOR_SET, ALL_CHART_TYPES, OPTION_NOCOLON_RE, GLOBAL_BOOLEANS, FILL_FAMILY_TOKENS, RESERVED_KEY_RE, AS_ALIAS_RE, POTENTIAL_META_RE;
+var RECOGNIZED_COLOR_SET, ALL_CHART_TYPES, OPTION_NOCOLON_RE, GLOBAL_BOOLEANS, FILL_FAMILY_TOKENS, CHART_TYPE_TOKEN_RE, TITLE_LIKE_RE, RESERVED_KEY_RE, AS_ALIAS_RE, POTENTIAL_META_RE;
 var init_parsing = __esm({
   "src/utils/parsing.ts"() {
     "use strict";
     init_colors();
     init_diagnostics();
+    init_directives_registry();
     init_reserved_key_registry();
     RECOGNIZED_COLOR_SET = new Set(
       RECOGNIZED_COLOR_NAMES
@@ -1107,6 +1523,8 @@ var init_parsing = __esm({
       "fill-solid",
       "fill-outline"
     ]);
+    CHART_TYPE_TOKEN_RE = /^[A-Za-z][A-Za-z0-9-]*$/;
+    TITLE_LIKE_RE = /^[A-Za-z][A-Za-z\s'&,.\-—–]*$/;
     RESERVED_KEY_RE = /^[A-Za-z][A-Za-z0-9_-]*$/;
     AS_ALIAS_RE = /\s+as\s+([A-Za-z][A-Za-z0-9_]{0,11})$/;
     POTENTIAL_META_RE = /\b([\w-]+)\s*:/;
@@ -4943,13 +5361,21 @@ __export(legend_constants_exports, {
   LEGEND_PILL_PAD: () => LEGEND_PILL_PAD,
   LEGEND_TOGGLE_DOT_R: () => LEGEND_TOGGLE_DOT_R,
   LEGEND_TOGGLE_OFF_OPACITY: () => LEGEND_TOGGLE_OFF_OPACITY,
+  legendChromeColors: () => legendChromeColors,
   measureLegendText: () => measureLegendText,
   truncateLegendText: () => truncateLegendText
 });
+function legendChromeColors(palette, isDark) {
+  return {
+    groupBg: isDark ? mix(palette.surface, palette.bg, 50) : mix(palette.surface, palette.textMuted, 98),
+    pillBorder: mix(palette.textMuted, palette.bg, 50)
+  };
+}
 var LEGEND_HEIGHT, LEGEND_PILL_PAD, LEGEND_PILL_FONT_SIZE, LEGEND_CAPSULE_PAD, LEGEND_DOT_R, LEGEND_ENTRY_FONT_SIZE, LEGEND_ENTRY_DOT_GAP, LEGEND_ENTRY_TRAIL, LEGEND_GROUP_GAP, LEGEND_EYE_SIZE, LEGEND_EYE_GAP, LEGEND_ICON_W, LEGEND_MAX_ENTRY_ROWS, measureLegendText, truncateLegendText, EYE_OPEN_PATH, EYE_CLOSED_PATH, CONTROLS_ICON_PATH, LEGEND_TOGGLE_DOT_R, LEGEND_TOGGLE_OFF_OPACITY, LEGEND_GEAR_PILL_W;
 var init_legend_constants = __esm({
   "src/utils/legend-constants.ts"() {
     "use strict";
+    init_color_utils();
     init_text_measure();
     LEGEND_HEIGHT = 28;
     LEGEND_PILL_PAD = 16;
@@ -5528,8 +5954,7 @@ function renderLegendD3(container, config, state, palette, isDark, callbacks, co
     } else {
       legendG.attr("data-legend-active", null);
     }
-    const groupBg = isDark ? mix(palette.surface, palette.bg, 50) : mix(palette.surface, palette.bg, 30);
-    const pillBorder = mix(palette.textMuted, palette.bg, 50);
+    const { groupBg, pillBorder } = legendChromeColors(palette, isDark);
     if (currentLayout.activeCapsule) {
       renderCapsule(
         legendG,
@@ -6032,7 +6457,7 @@ function renderTimelineGroupLegend(g, groups, groupColorMap, textColor, palette,
   const PAD_X = 10;
   const FONT_SIZE = 11;
   const GAP = 8;
-  const pillBg = isDark ? mix(palette.surface, palette.bg, 50) : mix(palette.surface, palette.bg, 30);
+  const pillBg = legendChromeColors(palette, isDark).groupBg;
   let legendX = 0;
   for (const grp of groups) {
     const color = groupColorMap.get(grp.name) ?? textColor;
@@ -8967,6 +9392,30 @@ A
 
 Orphan
   latency-ms: 20
+`
+      },
+      INFRA_SPLIT_SUM: {
+        // src/infra/parser.ts — makeDgmoError(..., 'warning', 'W_INFRA_SPLIT_SUM')
+        code: "W_INFRA_SPLIT_SUM",
+        severity: "warning",
+        chartType: "infra",
+        title: "Infra splits do not sum to 100%",
+        message: (p) => `Sync splits from '${String(p.label ?? "")}' sum to ${String(
+          p.sum ?? ""
+        )}%, not 100% \u2014 the traffic leaving a node must add up to the traffic entering it, so the computed downstream RPS will be wrong. Async ('~>') edges are derived streams and are excluded from this sum.`,
+        hint: "Adjust the split percentages so the sync edges from this node total 100%, or drop them and let dgmo split evenly.",
+        example: `infra
+
+edge
+  rps: 1000
+  -> LB
+
+LB
+  -> A split: 50%
+  -> B split: 30%
+
+A
+B
 `
       },
       FLOWCHART_NODE_SUFFIX: {
@@ -14247,9 +14696,13 @@ function parseChart(content, palette) {
           return fail(lineNumber, msg2);
         }
       }
-      if (!trimmed.includes(" ") && !trimmed.includes(":") && !/\d/.test(trimmed)) {
-        let msg2 = `Unsupported chart type: ${trimmed}. Supported types: ${[...VALID_TYPES].join(", ")}.`;
-        const hint2 = suggest(trimmed.toLowerCase(), [...VALID_TYPES]);
+      const badType = detectBadChartTypeDeclaration(
+        trimmed,
+        KNOWN_FIRST_TOKENS
+      );
+      if (badType) {
+        let msg2 = `Unsupported chart type: ${badType}. Supported types: ${[...VALID_TYPES].join(", ")}.`;
+        const hint2 = suggest(badType.toLowerCase(), [...VALID_TYPES]);
         if (hint2) msg2 += ` ${hint2}`;
         return fail(lineNumber, msg2);
       }
@@ -14435,6 +14888,14 @@ function parseChart(content, palette) {
       ...multiValue && { expectedValues: seriesCount }
     });
     if (dataValues) {
+      if (multiValue) {
+        const surplus = surplusValueDiagnostic(
+          dataValues,
+          seriesCount,
+          lineNumber
+        );
+        if (surplus) result.diagnostics.push(surplus);
+      }
       const { label: rawLabel, color: pointColor } = extractColor(
         dataValues.label,
         palette,
@@ -14526,34 +14987,74 @@ function parseChart(content, palette) {
   return result;
 }
 function parseDataRowValues(line11, options) {
+  const quoted = line11.match(/^(["'])(.*?)\1\s+(\S.*)$/);
+  if (quoted) {
+    const label2 = quoted[2].trim();
+    if (!label2) return null;
+    const valueTokens = quoted[3].trim().split(/\s+/);
+    const numeric2 = trailingNumerics(valueTokens, 0);
+    if (numeric2.length !== valueTokens.length) return null;
+    const limit = options?.multiValue ? options.expectedValues ?? Infinity : 1;
+    return {
+      label: label2,
+      values: numeric2.slice(0, limit),
+      bareLabel: label2,
+      trailingNumericCount: numeric2.length,
+      quotedLabel: true
+    };
+  }
   const tokens = line11.split(/\s+/);
   if (tokens.length < 2) return null;
+  const numeric = trailingNumerics(tokens, 1);
+  if (numeric.length === 0) return null;
+  const bareLabel = tokens.slice(0, tokens.length - numeric.length).join(" ");
   if (options?.multiValue) {
     const limit = options.expectedValues ?? Infinity;
-    const values = [];
-    let idx = tokens.length - 1;
-    while (idx >= 1 && values.length < limit) {
-      const tok = tokens[idx];
-      const normTok = normalizeNumericToken(tok) ?? tok;
-      const num2 = parseFloat(normTok);
-      if (isNaN(num2) || !isFinite(Number(normTok))) break;
-      values.unshift(num2);
-      idx--;
-    }
-    if (values.length === 0) return null;
-    const label2 = tokens.slice(0, idx + 1).join(" ");
+    const take = Math.min(numeric.length, limit);
+    const values = numeric.slice(numeric.length - take);
+    const label2 = tokens.slice(0, tokens.length - take).join(" ");
     if (!label2) return null;
-    return { label: label2, values };
+    return {
+      label: label2,
+      values,
+      bareLabel,
+      trailingNumericCount: numeric.length,
+      quotedLabel: false
+    };
   }
-  const lastToken = tokens[tokens.length - 1];
-  const normalizedLast = normalizeNumericToken(lastToken) ?? lastToken;
-  const num = parseFloat(normalizedLast);
-  if (isNaN(num) || !isFinite(Number(normalizedLast))) return null;
   const label = tokens.slice(0, -1).join(" ");
   if (!label) return null;
-  return { label, values: [num] };
+  return {
+    label,
+    // numeric.length >= 1 by the guard above.
+    values: [numeric[numeric.length - 1]],
+    bareLabel,
+    trailingNumericCount: numeric.length,
+    quotedLabel: false
+  };
 }
-var VALID_TYPES, KNOWN_OPTIONS3, DEFAULT_HOLE, KNOWN_BOOLEANS2;
+function surplusValueDiagnostic(row, expectedValues, lineNumber) {
+  if (row.quotedLabel || row.trailingNumericCount <= expectedValues)
+    return null;
+  const expectation = expectedValues === 1 ? "but only 1 value is expected" : `but ${expectedValues} series defined`;
+  return makeDgmoError(
+    lineNumber,
+    `Data point "${row.bareLabel}" has ${row.trailingNumericCount} value(s), ${expectation}. If the label ends in a number, quote it: "${row.label}" ${row.values.join(" ")}`,
+    "warning"
+  );
+}
+function trailingNumerics(tokens, minIndex) {
+  const values = [];
+  for (let idx = tokens.length - 1; idx >= minIndex; idx--) {
+    const tok = tokens[idx];
+    const normTok = normalizeNumericToken(tok) ?? tok;
+    const num = parseFloat(normTok);
+    if (isNaN(num) || !isFinite(Number(normTok))) break;
+    values.unshift(num);
+  }
+  return values;
+}
+var VALID_TYPES, KNOWN_OPTIONS3, DEFAULT_HOLE, KNOWN_BOOLEANS2, KNOWN_FIRST_TOKENS;
 var init_chart = __esm({
   "src/chart.ts"() {
     "use strict";
@@ -14595,6 +15096,67 @@ var init_chart = __esm({
       "fill",
       "hole"
     ]);
+    KNOWN_FIRST_TOKENS = /* @__PURE__ */ new Set([
+      ...KNOWN_OPTIONS3,
+      ...KNOWN_BOOLEANS2,
+      ...GLOBAL_BOOLEANS
+    ]);
+  }
+});
+
+// src/utils/emphasis.ts
+function isEmphasisToken(token) {
+  return EMPHASIS_TOKENS.includes(token.toLowerCase());
+}
+function parseEmphasisDirective(line11, lineNumber) {
+  const m = line11.trim().match(/^(highlight|dim)\s+(.+)$/i);
+  if (!m) return null;
+  const kind = m[1].toLowerCase();
+  const raw = m[2].trim();
+  if (!raw) return null;
+  const hasComma = raw.includes(",");
+  const names = (hasComma ? raw.split(",") : [raw]).map((n) => n.trim()).filter(Boolean);
+  if (names.length === 0) return null;
+  return { kind, names, ambiguous: !hasComma, raw, lineNumber };
+}
+function resolveEmphasis(directive, elementNames, expandHighlight) {
+  if (!directive) return EMPTY;
+  const norm = (s) => s.trim().toLowerCase().replace(/\s+/g, " ");
+  const byNorm = /* @__PURE__ */ new Map();
+  for (const name of elementNames) byNorm.set(norm(name), name);
+  const match = (listed) => {
+    const hit2 = /* @__PURE__ */ new Set();
+    const unknown2 = [];
+    for (const name of listed) {
+      const found = byNorm.get(norm(name));
+      if (found === void 0) unknown2.push(name);
+      else hit2.add(found);
+    }
+    return { hit: hit2, unknown: unknown2 };
+  };
+  let { hit, unknown } = match(directive.names);
+  if (directive.ambiguous && hit.size === 0) {
+    const tokens = directive.raw.split(/\s+/).filter(Boolean);
+    if (tokens.length > 1) {
+      const retry = match(tokens);
+      if (retry.hit.size > 0) ({ hit, unknown } = retry);
+    }
+  }
+  if (hit.size === 0) return { dimmed: /* @__PURE__ */ new Set(), unknown };
+  if (directive.kind === "dim") return { dimmed: hit, unknown };
+  const lit = expandHighlight ? new Set(expandHighlight(hit)) : hit;
+  const dimmed = /* @__PURE__ */ new Set();
+  for (const name of byNorm.values()) if (!lit.has(name)) dimmed.add(name);
+  return { dimmed, unknown };
+}
+var EMPHASIS_DIM_OPACITY, EMPHASIS_DIM_TEXT_OPACITY, EMPHASIS_TOKENS, EMPTY;
+var init_emphasis = __esm({
+  "src/utils/emphasis.ts"() {
+    "use strict";
+    EMPHASIS_DIM_OPACITY = 0.28;
+    EMPHASIS_DIM_TEXT_OPACITY = 0.5;
+    EMPHASIS_TOKENS = Object.freeze(["highlight", "dim"]);
+    EMPTY = { dimmed: /* @__PURE__ */ new Set(), unknown: [] };
   }
 });
 
@@ -14713,10 +15275,14 @@ function parseExtendedChartFull(content, palette) {
           return result;
         }
       }
-      if (!trimmed.includes(" ") && !trimmed.includes(":") && !/\d/.test(trimmed)) {
+      const badType = detectBadChartTypeDeclaration(
+        trimmed,
+        KNOWN_EXTENDED_FIRST_TOKENS
+      );
+      if (badType) {
         const validTypes = [...VALID_EXTENDED_TYPES];
-        let msg = `Unsupported chart type: ${trimmed}. Supported types: ${validTypes.join(", ")}.`;
-        const hint = suggest(trimmed.toLowerCase(), validTypes);
+        let msg = `Unsupported chart type: ${badType}. Supported types: ${validTypes.join(", ")}.`;
+        const hint = suggest(badType.toLowerCase(), validTypes);
         if (hint) msg += ` ${hint}`;
         const diag = makeDgmoError(lineNumber, msg);
         result.diagnostics.push(diag);
@@ -14744,7 +15310,7 @@ function parseExtendedChartFull(content, palette) {
       continue;
     }
     const arrowMatch = trimmed.match(
-      /^(.+?)\s*(->|--)\s*(.+?)\s+(-?[\d_]+(?:\.[\d]+)?)(?:\s+(red|orange|yellow|green|blue|purple|teal|cyan|gray|black|white))?\s*$/
+      /^(.+?)\s*(->|--)\s*(.+?)\s+(-?[\d,_]+(?:\.[\d]+)?)(?:\s+([A-Za-z][A-Za-z0-9_-]*))?\s*$/
     );
     if (arrowMatch) {
       const [, rawSource, arrow, rawTarget, rawVal, rawLinkColor] = arrowMatch;
@@ -14793,12 +15359,9 @@ function parseExtendedChartFull(content, palette) {
         }
         if (sankeyStack.length > 0) {
           const valColorMatch = trimmed.match(
-            /(-?[\d_]+(?:\.[\d]+)?)\s+(red|orange|yellow|green|blue|purple|teal|cyan|gray|black|white)\s*$/
+            /(-?[\d,_]+(?:\.[\d]+)?)\s+([A-Za-z][A-Za-z0-9_-]*)\s*$/
           );
-          const strippedLine = valColorMatch ? trimmed.replace(
-            /\s+(red|orange|yellow|green|blue|purple|teal|cyan|gray|black|white)\s*$/,
-            ""
-          ) : trimmed;
+          const strippedLine = valColorMatch ? trimmed.replace(/\s+[A-Za-z][A-Za-z0-9_-]*\s*$/, "") : trimmed;
           const dataRow2 = parseDataRowValues(strippedLine);
           if (dataRow2?.values.length === 1) {
             const source = sankeyStack.at(-1).name;
@@ -14839,8 +15402,9 @@ function parseExtendedChartFull(content, palette) {
       const isBareKeywordOption = spaceIdx2 < 0 && /^(fill-tint|fill-solid|fill-outline|no-name|no-value|no-percent|shade|no-title)$/i.test(
         trimmed
       );
-      const isLayoutDirective = spaceIdx2 >= 0 && trimmed.substring(0, spaceIdx2).toLowerCase() === "layout";
-      if (!hasNumericSuffix && !isBareKeywordOption && !isLayoutDirective) {
+      const leadToken = spaceIdx2 >= 0 ? trimmed.substring(0, spaceIdx2).toLowerCase() : "";
+      const isValuedDirective = spaceIdx2 >= 0 && (leadToken === "layout" || isEmphasisToken(leadToken));
+      if (!hasNumericSuffix && !isBareKeywordOption && !isValuedDirective) {
         while (sankeyStack.length && sankeyStack.at(-1).indent >= indent) {
           sankeyStack.pop();
         }
@@ -14879,6 +15443,11 @@ function parseExtendedChartFull(content, palette) {
         }
         continue;
       }
+      if (isEmphasisToken(firstToken)) {
+        const directive = parseEmphasisDirective(trimmed, lineNumber);
+        if (directive) result.emphasis = directive;
+        continue;
+      }
       if (firstToken === "title") {
         result.diagnostics.push(emit(TITLE_DIRECTIVE_DX, lineNumber));
         continue;
@@ -15176,7 +15745,7 @@ function getExtendedChartLegendGroups(parsed, colors) {
   }
   return [];
 }
-var VALID_EXTENDED_TYPES, KNOWN_EXTENDED_OPTIONS, EXTENDED_CHART_DOORS;
+var VALID_EXTENDED_TYPES, KNOWN_EXTENDED_OPTIONS, KNOWN_EXTENDED_FIRST_TOKENS, EXTENDED_CHART_DOORS;
 var init_data_chart_parser = __esm({
   "src/data-chart-parser.ts"() {
     "use strict";
@@ -15184,6 +15753,7 @@ var init_data_chart_parser = __esm({
     init_colors();
     init_parsing();
     init_chart();
+    init_emphasis();
     VALID_EXTENDED_TYPES = /* @__PURE__ */ new Set([
       "sankey",
       "chord",
@@ -15205,7 +15775,13 @@ var init_data_chart_parser = __esm({
       "no-percent",
       "columns",
       "rows",
-      "x"
+      "x",
+      "highlight",
+      "dim"
+    ]);
+    KNOWN_EXTENDED_FIRST_TOKENS = /* @__PURE__ */ new Set([
+      ...KNOWN_EXTENDED_OPTIONS,
+      ...GLOBAL_BOOLEANS
     ]);
     EXTENDED_CHART_DOORS = /* @__PURE__ */ new Set([
       parseSankey,
@@ -16865,6 +17441,13 @@ function parseC4(content, palette) {
       const optMatch = trimmed.match(OPTION_NOCOLON_RE);
       if (optMatch) {
         const key = optMatch[1].trim().toLowerCase();
+        if (key === "layout") {
+          pushError(
+            lineNumber,
+            `'layout' is not a valid C4 option \u2014 C4 diagrams have a single layered layout with no algorithm to select. Use the 'direction-tb' (default) or 'direction-lr' booleans to change orientation (\xA77.7).`
+          );
+          continue;
+        }
         if (KNOWN_C4_OPTIONS.has(key)) {
           options[key] = optMatch[2].trim();
           continue;
@@ -17463,7 +18046,7 @@ var init_parser16 = __esm({
       "cloud",
       "external"
     ]);
-    KNOWN_C4_OPTIONS = /* @__PURE__ */ new Set(["layout", "active-tag"]);
+    KNOWN_C4_OPTIONS = /* @__PURE__ */ new Set(["active-tag"]);
     KNOWN_C4_BOOLEANS = /* @__PURE__ */ new Set([
       "direction-tb",
       "direction-lr",
@@ -17494,390 +18077,6 @@ var init_parser16 = __esm({
   }
 });
 
-// src/directives-registry.ts
-function tokensWhere(pred) {
-  const out = /* @__PURE__ */ new Set();
-  for (const e of DIRECTIVES_REGISTRY) if (pred(e)) out.add(e.token);
-  return out;
-}
-var DIRECTIVES_REGISTRY, INFRA_TOP_LEVEL_OPTION_SET, INFRA_BEHAVIOR_KEY_SET, INFRA_EDGE_ONLY_KEY_SET, GANTT_OPTION_SET, GANTT_BOOLEAN_SET, MAP_DIRECTIVE_KEY_SET, REGISTRY_DIRECTIVE_TOKENS, REGISTRY_CONTROL_TOKENS, REGISTRY_STATUS_TOKENS, REGISTRY_MODIFIER_TOKENS, REGISTRY_COLON_KEY_TOKENS, REGISTRY_NON_HIGHLIGHT_TOKENS;
-var init_directives_registry = __esm({
-  "src/directives-registry.ts"() {
-    "use strict";
-    DIRECTIVES_REGISTRY = [
-      // ── Universal date handling (§ BL-121) ───────────────────
-      // Accepted in every date-bearing chart (gantt, pert, countdown, timeline,
-      // event-line). Handled inline by each parser's prescan — no parser-Set
-      // membership here — so they only contribute highlighting (DIRECTIVE_KEYWORDS).
-      { token: "year", category: "directive" },
-      { token: "date-order", category: "directive" },
-      { token: "no-current-year", category: "directive" },
-      // ── Infra ────────────────────────────────────────────────
-      // Top-level SLO options that are ALSO accepted as node colon-properties
-      // (dual membership). Highlight bare (kept in DIRECTIVE_KEYWORDS) — their
-      // rarer colon form stays keyword, an accepted minor false-positive.
-      {
-        token: "slo-availability",
-        category: "directive",
-        infra: ["top-level", "behavior"]
-      },
-      {
-        token: "slo-p90-latency-ms",
-        category: "directive",
-        infra: ["top-level", "behavior"]
-      },
-      {
-        token: "slo-warning-margin",
-        category: "directive",
-        infra: ["top-level", "behavior"]
-      },
-      // Top-level-only options (space-separated, bare).
-      { token: "default-latency-ms", category: "directive", infra: ["top-level"] },
-      { token: "default-uptime", category: "directive", infra: ["top-level"] },
-      { token: "default-rps", category: "directive", infra: ["top-level"] },
-      // `active-tag` is shared with gantt + map (see below).
-      // Node behavior colon-keys — highlight as propertyName.
-      { token: "latency-ms", colonKey: true, infra: ["behavior"] },
-      { token: "uptime", colonKey: true, infra: ["behavior"] },
-      { token: "instances", colonKey: true, infra: ["behavior"] },
-      { token: "max-rps", colonKey: true, infra: ["behavior"] },
-      { token: "cache-hit", colonKey: true, infra: ["behavior"] },
-      { token: "firewall-block", colonKey: true, infra: ["behavior"] },
-      { token: "ratelimit-rps", colonKey: true, infra: ["behavior"] },
-      { token: "buffer", colonKey: true, infra: ["behavior"] },
-      { token: "drain-rate", colonKey: true, infra: ["behavior"] },
-      { token: "retention-hours", colonKey: true, infra: ["behavior"] },
-      { token: "partitions", colonKey: true, infra: ["behavior"] },
-      { token: "concurrency", colonKey: true, infra: ["behavior"] },
-      { token: "duration-ms", colonKey: true, infra: ["behavior"] },
-      { token: "cold-start-ms", colonKey: true, infra: ["behavior"] },
-      { token: "cb-error-threshold", colonKey: true, infra: ["behavior"] },
-      { token: "cb-latency-threshold-ms", colonKey: true, infra: ["behavior"] },
-      // Edge-only colon-key.
-      { token: "rps", colonKey: true, infra: ["edge"] },
-      // ── Gantt ────────────────────────────────────────────────
-      { token: "start", category: "directive", gantt: ["option"] },
-      {
-        token: "today-marker",
-        category: "directive",
-        gantt: ["option", "boolean"]
-      },
-      {
-        token: "critical-path",
-        category: "directive",
-        gantt: ["option", "boolean"]
-      },
-      { token: "sprint-length", category: "directive", gantt: ["option"] },
-      { token: "sprint-number", category: "directive", gantt: ["option"] },
-      { token: "sprint-start", category: "directive", gantt: ["option"] },
-      { token: "fill-tint", category: "directive", gantt: ["boolean"] },
-      { token: "fill-solid", category: "directive", gantt: ["boolean"] },
-      { token: "fill-outline", category: "directive", gantt: ["boolean"] },
-      // `chart` is a wireframe element keyword (CONTROL); gantt also accepts it as
-      // an option. Highlight family is control.
-      { token: "chart", category: "control", gantt: ["option"] },
-      // `dependencies` is ON by default → almost never written bare (authors write
-      // `no-dependencies`, which DOES highlight). Bare word collides with prose and
-      // the specializer is context-free, so it stays plain. Present for parser
-      // Set derivation only.
-      { token: "dependencies", noHighlight: true, gantt: ["option", "boolean"] },
-      // ── Map ──────────────────────────────────────────────────
-      // Per-element value→channel ramps (decision #20): the directive names the
-      // visual channel — `region-heat` (colour), `poi-size` (marker area),
-      // `flow-width` (stroke). The per-element key mirrors it (`heat:`/`size:`/`width:`).
-      { token: "region-heat", category: "directive", map: true },
-      { token: "poi-size", category: "directive", map: true },
-      { token: "flow-width", category: "directive", map: true },
-      { token: "locale", category: "directive", map: true },
-      { token: "caption", category: "directive", map: true },
-      { token: "no-coastline", category: "directive", map: true },
-      { token: "no-relief", category: "directive", map: true },
-      { token: "no-context-labels", category: "directive", map: true },
-      { token: "no-region-labels", category: "directive", map: true },
-      { token: "no-region-heat-value", category: "directive", map: true },
-      { token: "no-poi-labels", category: "directive", map: true },
-      { token: "no-colorize", category: "directive", map: true },
-      { token: "no-cities", category: "directive", map: true },
-      { token: "no-cluster-pois", category: "directive", map: true },
-      // ── Clock channel (BL-122): live local-time cards on POIs flagged `clock` ──
-      // Activation is the per-POI `clock` flag (peeled in the map parser, not a
-      // directive). `hours 9-17` / `days mon-fri` are the global availability
-      // window (reused verbatim from the clock chart type).
-      { token: "hours", category: "directive", map: true },
-      { token: "days", category: "directive", map: true },
-      // ── Shared across types ──────────────────────────────────
-      // `active-tag`: infra top-level option + gantt option + map directive.
-      // Treemap also accepts it (§24C.6, decision #48) — validated inline in its
-      // parser, so no chart-scoped Set is derived for it; highlighting comes from
-      // the global directive category here.
-      {
-        token: "active-tag",
-        category: "directive",
-        infra: ["top-level"],
-        gantt: ["option"],
-        map: true
-      },
-      // `title`: gantt option. (The data-chart `title` directive was removed in
-      // decision #48 — it now raises E_TITLE_DIRECTIVE; the token stays here for
-      // gantt.)
-      { token: "title", category: "directive", gantt: ["option"] },
-      // `sort`: gantt option (also general, hand-listed).
-      { token: "sort", category: "directive", gantt: ["option"] },
-      // `lane-by <group>`: swimlane axis (view-state). NB not `swimlane` — that's a
-      // chart type. Kanban reads it via its own KNOWN_OPTIONS; gantt via the switch.
-      { token: "lane-by", category: "directive", gantt: ["option"] },
-      // `no-title`: gantt boolean + map directive (also general, hand-listed).
-      { token: "no-title", category: "directive", gantt: ["boolean"], map: true },
-      // `no-legend`: universal (decision #48) — every chart that renders a legend
-      // accepts it, and charts without one take it as a harmless no-op. Parsed for
-      // most types via GLOBAL_BOOLEANS in utils/parsing; gantt derives its boolean
-      // Set from here, and map from `map: true`.
-      { token: "no-legend", category: "directive", gantt: ["boolean"], map: true },
-      // ══════════════════════════════════════════════════════════
-      // Highlight-only vocab (no extractable parser Set).
-      // ══════════════════════════════════════════════════════════
-      // These chart types validate their directives with inline checks rather than
-      // a literal Set, so there is no parser literal to delete — the registry is
-      // simply their single declaration site for highlighting. Grouped by chart
-      // type. Categories route to the specializer-read sets in keywords.ts.
-      // ── Gantt (extras beyond the option/boolean Sets) ────────
-      { token: "era", category: "directive" },
-      { token: "marker", category: "directive" },
-      { token: "holiday", category: "directive" },
-      // `workweek` is also the canonical weekday-window directive on clock and map
-      // clock-cards (decision #48; `days` stays as the legacy alias).
-      { token: "workweek", category: "directive", map: true },
-      { token: "no-dependencies", category: "directive" },
-      // ── Tech-radar ───────────────────────────────────────────
-      { token: "rings", category: "directive" },
-      // Blip listing is default-on everywhere (decision #48): `no-blip-legend`
-      // suppresses it; `show-blip-legend` stays as the parse-accepted legacy no-op.
-      { token: "no-blip-legend", category: "directive" },
-      { token: "show-blip-legend", category: "directive" },
-      { token: "trend", category: "directive" },
-      // ── Tags / shared directives ─────────────────────────────
-      { token: "tags", category: "directive" },
-      { token: "import", category: "directive" },
-      { token: "hide", category: "directive" },
-      { token: "direction", category: "directive" },
-      // ── Clock ────────────────────────────────────────────────
-      // The board's flat directives — highlight-only (the parser validates them
-      // inline, no extractable Set). `no-title` + `direction` are already listed
-      // above (shared). Values (analog is a bare flag; color-by's
-      // place|work|daylight|time|none) highlight as plain tokens.
-      { token: "analog", category: "directive" },
-      { token: "hours", category: "directive" },
-      { token: "days", category: "directive" },
-      { token: "no-sun", category: "directive" },
-      { token: "time-24", category: "directive" },
-      { token: "color-by", category: "directive" },
-      // ── Boxes-and-lines ──────────────────────────────────────
-      // `heat <Label> [low] [high]` is the value→colour ramp directive, but `heat`
-      // is NOT registered as a directive keyword: it is dual-use with the `heat:`
-      // metadata key (decision #20), and a token in DIRECTIVE_KEYWORDS would block the
-      // ATTRIBUTE_KEYS colon-gate from reclassifying `heat:` as a propertyName. So
-      // `heat` lives only in the reserved-key registry + ATTRIBUTE_KEYS and highlights
-      // as a property in both positions — exactly the treemap `heat` precedent.
-      // Box values render by default since decision #48; `show-values` stays as
-      // the parse-accepted legacy no-op (suppress with the shared `no-value`).
-      { token: "show-values", category: "directive" },
-      // Treemap's legacy plural spelling of the same suppression (decision #48
-      // made the shared singular `no-value` canonical). Registered so a legacy
-      // document still highlights it as a directive rather than plain text.
-      { token: "no-values", category: "directive" },
-      // ── Swimlane ─────────────────────────────────────────────
-      { token: "lane", category: "directive" },
-      // ── ER ───────────────────────────────────────────────────
-      { token: "notation", category: "directive" },
-      // ── Class ────────────────────────────────────────────────
-      { token: "extends", category: "directive" },
-      { token: "implements", category: "directive" },
-      { token: "abstract", category: "directive" },
-      { token: "interface", category: "directive" },
-      { token: "enum", category: "directive" },
-      // ── C4 ───────────────────────────────────────────────────
-      { token: "containers", category: "directive" },
-      { token: "components", category: "directive" },
-      { token: "deployment", category: "directive" },
-      { token: "technology", category: "directive" },
-      // ── Infra (directives beyond the option/behavior Sets) ───
-      { token: "sub-node-label", category: "directive" },
-      { token: "show-sub-node-count", category: "directive" },
-      { token: "animate", category: "directive" },
-      // ── Sequence ─────────────────────────────────────────────
-      { token: "activations", category: "directive" },
-      { token: "no-activations", category: "directive" },
-      // ── Map element leaders (not in DIRECTIVE_SET) ───────────
-      { token: "poi", category: "directive" },
-      { token: "route", category: "directive" },
-      // ── Data charts ──────────────────────────────────────────
-      { token: "stacked", category: "directive" },
-      { token: "no-name", category: "directive" },
-      { token: "no-value", category: "directive" },
-      { token: "no-percent", category: "directive" },
-      { token: "series", category: "directive" },
-      { token: "orientation", category: "directive" },
-      { token: "x-label", category: "directive" },
-      { token: "y-label", category: "directive" },
-      { token: "size-label", category: "directive" },
-      { token: "columns", category: "directive" },
-      { token: "rows", category: "directive" },
-      { token: "labels", category: "directive" },
-      { token: "rotate", category: "directive" },
-      { token: "scale", category: "directive" },
-      { token: "values", category: "directive" },
-      { token: "orientation-horizontal", category: "directive" },
-      // ── Slope ────────────────────────────────────────────────
-      { token: "period", category: "directive" },
-      // ── Quadrant ─────────────────────────────────────────────
-      { token: "x-axis", category: "directive" },
-      { token: "y-axis", category: "directive" },
-      { token: "top-right", category: "directive" },
-      { token: "top-left", category: "directive" },
-      { token: "bottom-right", category: "directive" },
-      { token: "bottom-left", category: "directive" },
-      // ── Layout (cross-chart) ─────────────────────────────────
-      { token: "direction-tb", category: "directive" },
-      { token: "direction-lr", category: "directive" },
-      { token: "orientation-vertical", category: "directive" },
-      // ── Pyramid ──────────────────────────────────────────────
-      { token: "inverted", category: "directive" },
-      // ── Color / notes (cross-chart) ──────────────────────────
-      { token: "color", category: "directive" },
-      { token: "no-notes", category: "directive" },
-      // ── RACI ─────────────────────────────────────────────────
-      { token: "roles", category: "directive" },
-      // ── Cycle ────────────────────────────────────────────────
-      { token: "direction-counterclockwise", category: "directive" },
-      { token: "circle-nodes", category: "directive" },
-      // ── Journey-map ──────────────────────────────────────────
-      { token: "persona", category: "directive" },
-      // ── Function ─────────────────────────────────────────────
-      { token: "x", category: "directive" },
-      { token: "shade", category: "directive" },
-      // ── Wordcloud ────────────────────────────────────────────
-      { token: "max", category: "directive" },
-      { token: "size", category: "directive" },
-      // ── Arc ──────────────────────────────────────────────────
-      { token: "order", category: "directive" },
-      // ── PERT ─────────────────────────────────────────────────
-      { token: "time-unit", category: "directive" },
-      { token: "default-confidence", category: "directive" },
-      { token: "node-detail", category: "directive" },
-      { token: "trials", category: "directive" },
-      { token: "seed", category: "directive" },
-      { token: "scrubber-trials", category: "directive" },
-      // `start-date` is also gantt's canonical project-start option (decision #48;
-      // bare `start` above stays as the legacy alias).
-      { token: "start-date", category: "directive", gantt: ["option"] },
-      { token: "end-date", category: "directive" },
-      // ── Goal ─────────────────────────────────────────────────
-      // Mode flags, value-key leaders, and opt-outs. `now`/`target` collide with
-      // label prose ("start now", "on target"), but the arrow-label demotion pass
-      // (see highlight-api LABEL_WORD_NODES) treats any keyword-bearing label as
-      // text and demotes them, so they highlight only as line leaders.
-      { token: "thermometer", category: "directive" },
-      { token: "gauge", category: "directive" },
-      { token: "now", category: "directive" },
-      { token: "target", category: "directive" },
-      { token: "no-note", category: "directive" },
-      { token: "no-auto-color", category: "directive" },
-      // ── Control-flow + wireframe element keywords (CONTROL) ──
-      { token: "if", category: "control" },
-      { token: "else", category: "control" },
-      { token: "loop", category: "control" },
-      { token: "parallel", category: "control" },
-      { token: "note", category: "control" },
-      { token: "nav", category: "control" },
-      { token: "tabs", category: "control" },
-      { token: "table", category: "control" },
-      { token: "image", category: "control" },
-      { token: "modal", category: "control" },
-      { token: "skeleton", category: "control" },
-      { token: "alert", category: "control" },
-      { token: "progress", category: "control" },
-      { token: "mobile", category: "control" },
-      // ── Kanban status keywords (STATUS) ──────────────────────
-      { token: "na", category: "status" },
-      { token: "todo", category: "status" },
-      { token: "wip", category: "status" },
-      { token: "done", category: "status" },
-      { token: "blocked", category: "status" },
-      { token: "in-progress", category: "status" },
-      { token: "backlog", category: "status" },
-      { token: "ready", category: "status" },
-      // ── Modifiers + ER column types/modifiers (MODIFIER) ─────
-      // `collapsed` is the bare trailing group-line flag made canonical by
-      // decision #48 (`[Fulfillment] collapsed`). It is deliberately a bare
-      // MODIFIER rather than a colon key: the legacy `collapsed: true` form still
-      // parses and still highlights (as `modifier` instead of `propertyName`),
-      // whereas leaving it colon-only left the canonical bare form as plain text.
-      { token: "collapsed", category: "modifier" },
-      { token: "as", category: "modifier" },
-      { token: "alias", category: "modifier" },
-      { token: "aka", category: "modifier" },
-      { token: "position", category: "modifier" },
-      { token: "default", category: "modifier" },
-      { token: "pk", category: "modifier" },
-      { token: "fk", category: "modifier" },
-      { token: "nullable", category: "modifier" },
-      { token: "unique", category: "modifier" },
-      { token: "int", category: "modifier" },
-      { token: "varchar", category: "modifier" },
-      { token: "text", category: "modifier" },
-      { token: "boolean", category: "modifier" },
-      { token: "date", category: "modifier" },
-      { token: "timestamp", category: "modifier" },
-      { token: "float", category: "modifier" },
-      { token: "decimal", category: "modifier" },
-      // ── Bracket ──────────────────────────────────────────────
-      // `beats` / `vs` are the infix match keywords; the rest are line directives.
-      // (`seed` and `no-legend` already appear above — shared, not re-listed.)
-      { token: "beats", category: "control" },
-      { token: "vs", category: "control" },
-      { token: "rounds", category: "directive" },
-      { token: "accent", category: "directive" },
-      { token: "no-round", category: "modifier" },
-      { token: "no-rounds", category: "modifier" },
-      { token: "single-elim", category: "modifier" },
-      { token: "double-elim", category: "modifier" },
-      { token: "seeded", category: "modifier" }
-    ];
-    INFRA_TOP_LEVEL_OPTION_SET = tokensWhere(
-      (e) => !!e.infra?.includes("top-level")
-    );
-    INFRA_BEHAVIOR_KEY_SET = tokensWhere(
-      (e) => !!e.infra?.includes("behavior")
-    );
-    INFRA_EDGE_ONLY_KEY_SET = tokensWhere(
-      (e) => !!e.infra?.includes("edge")
-    );
-    GANTT_OPTION_SET = tokensWhere(
-      (e) => !!e.gantt?.includes("option")
-    );
-    GANTT_BOOLEAN_SET = tokensWhere(
-      (e) => !!e.gantt?.includes("boolean")
-    );
-    MAP_DIRECTIVE_KEY_SET = tokensWhere((e) => e.map === true);
-    REGISTRY_DIRECTIVE_TOKENS = tokensWhere(
-      (e) => e.category === "directive" && !e.colonKey && !e.noHighlight
-    );
-    REGISTRY_CONTROL_TOKENS = tokensWhere(
-      (e) => e.category === "control" && !e.colonKey && !e.noHighlight
-    );
-    REGISTRY_STATUS_TOKENS = tokensWhere(
-      (e) => e.category === "status" && !e.colonKey && !e.noHighlight
-    );
-    REGISTRY_MODIFIER_TOKENS = tokensWhere(
-      (e) => e.category === "modifier" && !e.colonKey && !e.noHighlight
-    );
-    REGISTRY_COLON_KEY_TOKENS = tokensWhere((e) => !!e.colonKey);
-    REGISTRY_NON_HIGHLIGHT_TOKENS = tokensWhere(
-      (e) => !!e.noHighlight
-    );
-  }
-});
-
 // src/infra/types.ts
 var INFRA_BEHAVIOR_KEYS, EDGE_ONLY_KEYS;
 var init_types2 = __esm({
@@ -18632,8 +18831,35 @@ function parseInfra(content) {
   }
   validateTagGroupNames(result.tagGroups, warn, setError);
   checkReachability(result);
+  checkSplitSums(result);
   return result;
 }
+function checkSplitSums(result) {
+  const outbound = /* @__PURE__ */ new Map();
+  for (const edge of result.edges) {
+    if (edge.async) continue;
+    const list = outbound.get(edge.sourceId) ?? [];
+    list.push(edge);
+    outbound.set(edge.sourceId, list);
+  }
+  for (const [sourceId, edges] of outbound) {
+    if (edges.length <= 1) continue;
+    const declared = edges.filter((e) => e.split !== null);
+    if (declared.length === 0) continue;
+    const sum = declared.reduce((s, e) => s + (e.split ?? 0), 0);
+    const allDeclared = declared.length === edges.length;
+    if (allDeclared ? Math.abs(sum - 100) > 0.01 : sum > 100) {
+      const label = result.nodes.find((n) => n.id === sourceId)?.label ?? sourceId;
+      result.diagnostics.push(
+        // In-bounds: declared.length > 0 here.
+        emit(GRAPH_DX.INFRA_SPLIT_SUM, declared[0].lineNumber, {
+          label,
+          sum: String(Number(sum.toFixed(2)))
+        })
+      );
+    }
+  }
+}
 function checkReachability(result) {
   if (result.nodes.length === 0) return;
   const entries = result.nodes.filter((n) => n.isEdge);
@@ -25926,6 +26152,21 @@ var init_diagnostics9 = __esm({
         hint: "Add a trailing number (e.g. `Lonely 40`) so the leaf gets a size.",
         example: "treemap T\nA\n  Lonely"
       },
+      LEAF_VALUE_UNPARSEABLE: {
+        code: "W_TREEMAP_LEAF_VALUE_UNPARSEABLE",
+        severity: "warning",
+        chartType: "treemap",
+        title: "Leaf value could not be read as a number",
+        message: (p) => {
+          const token = p.token ?? "1,24,000";
+          return `Leaf "${p.label ?? "Cluster"}" \u2014 could not read "${token}" as a number, so it renders with zero size. Remove the grouping separators: ${token.replace(
+            /[,_]/g,
+            ""
+          )}`;
+        },
+        hint: "Grouping separators must split the digits into even groups \u2014 `1,240,000` or `1_240_000`. Anything else must be written plainly, e.g. `1240000`.",
+        example: "treemap T\nA\n  Cluster 1,24,000"
+      },
       BRANCH_VALUE_IGNORED: {
         code: "W_TREEMAP_BRANCH_VALUE_IGNORED",
         severity: "warning",
@@ -25985,6 +26226,7 @@ function parseTreemap(content, palette) {
   const lines = content.split("\n");
   let contentStarted = false;
   let nodeCounter = 0;
+  const badValueTokens = /* @__PURE__ */ new Map();
   let currentTagGroup = null;
   const aliasMap = /* @__PURE__ */ new Map();
   const indentStack = [];
@@ -26079,7 +26321,8 @@ function parseTreemap(content, palette) {
       lineNumber,
       ++nodeCounter,
       aliasMap,
-      result.diagnostics
+      result.diagnostics,
+      badValueTokens
     );
     if (node.heat !== void 0) result.hasHeat = true;
     attachNode4(node, indent, indentStack, result);
@@ -26106,8 +26349,12 @@ function parseTreemap(content, palette) {
         delete node.value;
       }
     } else if (node.value === void 0) {
+      const bad = badValueTokens.get(n);
       result.diagnostics.push(
-        emit(TREEMAP_DX.LEAF_NO_VALUE, node.lineNumber, {
+        bad !== void 0 ? emit(TREEMAP_DX.LEAF_VALUE_UNPARSEABLE, node.lineNumber, {
+          label: node.label,
+          token: bad
+        }) : emit(TREEMAP_DX.LEAF_NO_VALUE, node.lineNumber, {
           label: node.label
         })
       );
@@ -26214,7 +26461,7 @@ function resolveDefaultColorMode(result, pushWarning) {
   if (result.tagGroups.length > 0) return "tag";
   return "branch";
 }
-function parseNodeLine3(trimmed, lineNumber, counter, aliasMap, diagnostics) {
+function parseNodeLine3(trimmed, lineNumber, counter, aliasMap, diagnostics, badValueTokens) {
   const registry = withTagAliases(TREEMAP_REGISTRY, new Set(aliasMap.keys()));
   const split = splitNameAndMeta(
     trimmed,
@@ -26233,13 +26480,15 @@ function parseNodeLine3(trimmed, lineNumber, counter, aliasMap, diagnostics) {
   const metadata = { ...split.meta };
   let heat;
   if ("heat" in metadata) {
-    const h = parseFloat(metadata["heat"].replace(/_/g, ""));
+    const rawHeat = metadata["heat"];
+    const h = parseFloat(normalizeNumericToken(rawHeat) ?? rawHeat);
     if (Number.isFinite(h)) heat = h;
     delete metadata["heat"];
   }
   const rawName = split.name;
   let label;
   let value;
+  let badValueToken;
   if (isFullyQuoted(rawName)) {
     label = stripQuotes(rawName);
   } else {
@@ -26247,11 +26496,16 @@ function parseNodeLine3(trimmed, lineNumber, counter, aliasMap, diagnostics) {
     if (vm) {
       const labelPart = vm[1].trim();
       const token = vm[2];
-      const cleaned = token.replace(/_/g, "");
-      const parsed = parseFloat(cleaned);
+      const normalized = normalizeNumericToken(token);
+      const hasSeparators = /[,_]/.test(token);
+      const parsed = hasSeparators && normalized === null ? NaN : parseFloat(normalized ?? token);
+      const peeled = isFullyQuoted(labelPart) ? stripQuotes(labelPart) : labelPart;
       if (Number.isFinite(parsed)) {
         value = parsed;
-        label = isFullyQuoted(labelPart) ? stripQuotes(labelPart) : labelPart;
+        label = peeled;
+      } else if (hasSeparators) {
+        label = peeled;
+        badValueToken = token;
       } else {
         label = rawName;
       }
@@ -26259,7 +26513,7 @@ function parseNodeLine3(trimmed, lineNumber, counter, aliasMap, diagnostics) {
       label = rawName;
     }
   }
-  return {
+  const node = {
     id: `treemap-node-${counter}`,
     label,
     ...value !== void 0 && { value },
@@ -26268,6 +26522,8 @@ function parseNodeLine3(trimmed, lineNumber, counter, aliasMap, diagnostics) {
     children: [],
     lineNumber
   };
+  if (badValueToken !== void 0) badValueTokens.set(node, badValueToken);
+  return node;
 }
 function attachNode4(node, indent, indentStack, result) {
   while (indentStack.length > 0) {
@@ -26292,7 +26548,7 @@ var init_parser31 = __esm({
     init_tag_groups();
     init_parsing();
     init_reserved_key_registry();
-    VALUE_TOKEN_RE = /^(.+?)\s+(-?\d[\d_.]*)$/;
+    VALUE_TOKEN_RE = /^(.+?)\s+(-?\d[\d_,.]*)$/;
   }
 });
 
@@ -26637,8 +26893,9 @@ __export(parser_exports27, {
   parseGoal: () => parseGoal
 });
 function parseGoalNumber(token) {
-  if (token.includes(",")) return null;
-  const n = parseFloat(token.replace(/_/g, ""));
+  const normalized = normalizeNumericToken(token);
+  if (normalized === null && /[,_]/.test(token)) return null;
+  const n = parseFloat(normalized ?? token);
   return Number.isFinite(n) ? n : null;
 }
 function parseGoal(content, palette) {
@@ -33243,8 +33500,7 @@ function renderLegendSvg(groups, options) {
   if (!layout.activeCapsule && layout.pills.length === 0) {
     return { svg: "", height: 0, width: 0 };
   }
-  const groupBg = isDark ? mix(palette.surface, palette.bg, 50) : mix(palette.surface, palette.bg, 30);
-  const pillBorder = mix(palette.textMuted, palette.bg, 50);
+  const { groupBg, pillBorder } = legendChromeColors(palette, isDark);
   const parts = [];
   let bottom = 0;
   let left = Infinity;
@@ -33278,7 +33534,6 @@ var init_legend_svg = __esm({
     init_tag_groups();
     init_legend_constants();
     init_legend_layout();
-    init_color_utils();
     init_fonts();
   }
 });
@@ -34403,6 +34658,25 @@ function renderSankey(svg, chart, width, height, colors, bgColor, textColor, top
   if (links.length === 0) return;
   const solid = chart.fillMode === "solid";
   const names = Array.from(new Set(links.flatMap((l) => [l.source, l.target])));
+  const walk = (seeds, up) => {
+    const seen = new Set(seeds);
+    for (let pass = 0; pass < names.length; pass++) {
+      let grew = false;
+      for (const l of links) {
+        const from = up ? l.target : l.source;
+        const to = up ? l.source : l.target;
+        if (seen.has(from) && !seen.has(to)) {
+          seen.add(to);
+          grew = true;
+        }
+      }
+      if (!grew) break;
+    }
+    return seen;
+  };
+  const flowClosure = (seeds) => /* @__PURE__ */ new Set([...walk(seeds, true), ...walk(seeds, false)]);
+  const { dimmed } = resolveEmphasis(chart.emphasis, names, flowClosure);
+  const linkDimmed = (l) => dimmed.has(l.source) || dimmed.has(l.target);
   const node = /* @__PURE__ */ new Map();
   names.forEach(
     (name, i) => node.set(name, {
@@ -34500,7 +34774,10 @@ function renderSankey(svg, chart, width, height, colors, bgColor, textColor, top
     const ribbon = svg.append("path").attr(
       "d",
       `M${sx},${sy} C${cx0},${sy} ${cx0},${ty} ${tx},${ty} L${tx},${ty + th} C${cx0},${ty + th} ${cx0},${sy + th} ${sx},${sy + th} Z`
-    ).attr("fill", color).attr("fill-opacity", 0.6);
+    ).attr("fill", color).attr(
+      "fill-opacity",
+      linkDimmed(l) ? RIBBON_FILL_OPACITY * EMPHASIS_DIM_OPACITY : RIBBON_FILL_OPACITY
+    );
     tagDatum(ribbon, {
       line: l.lineNumber,
       // U+241F (symbol-for-unit-separator) — collision-proof AND XML-legal;
@@ -34515,7 +34792,9 @@ function renderSankey(svg, chart, width, height, colors, bgColor, textColor, top
     const nodeLine = links.find(
       (l) => l.source === n.name || l.target === n.name
     )?.lineNumber;
+    const nodeDim = dimmed.has(n.name);
     const nr = svg.append("rect").attr("x", n.x).attr("y", n.y).attr("width", NODE_W).attr("height", Math.max(1, n.h)).attr("fill", solid ? n.raw : mix(n.raw, bgColor, 75)).attr("stroke", n.raw).attr("stroke-width", 1);
+    if (nodeDim) nr.attr("opacity", EMPHASIS_DIM_OPACITY);
     tagDatum(nr, {
       ...nodeLine !== void 0 && { line: nodeLine },
       key: `node:${n.name}`,
@@ -34524,10 +34803,11 @@ function renderSankey(svg, chart, width, height, colors, bgColor, textColor, top
       color: n.raw
     });
     const lastLayer = n.rank === maxRank;
-    svg.append("text").attr("x", lastLayer ? n.x - 6 : n.x + NODE_W + 6).attr("y", n.y + n.h / 2 + 4).attr("text-anchor", lastLayer ? "end" : "start").attr("fill", textColor).attr("font-size", 13).attr("font-family", FONT_FAMILY).text(n.name);
+    const label = svg.append("text").attr("x", lastLayer ? n.x - 6 : n.x + NODE_W + 6).attr("y", n.y + n.h / 2 + 4).attr("text-anchor", lastLayer ? "end" : "start").attr("fill", textColor).attr("font-size", 13).attr("font-family", FONT_FAMILY).text(n.name);
+    if (nodeDim) label.attr("opacity", EMPHASIS_DIM_TEXT_OPACITY);
   }
 }
-var NODE_W, NODE_GAP;
+var NODE_W, NODE_GAP, RIBBON_FILL_OPACITY;
 var init_sankey = __esm({
   "src/charts-d3/sankey.ts"() {
     "use strict";
@@ -34535,8 +34815,10 @@ var init_sankey = __esm({
     init_color_utils();
     init_text_measure();
     init_shared();
+    init_emphasis();
     NODE_W = 20;
     NODE_GAP = 14;
+    RIBBON_FILL_OPACITY = 0.6;
   }
 });
 
@@ -34694,7 +34976,7 @@ function renderFunction(svg, chart, width, height, colors, textColor, mutedColor
   }
   const gen = d3line2().defined((p) => isFinite(p[1]) && p[1] >= yLo - 1 && p[1] <= yHi + 1).x((p) => x(p[0])).y((p) => y(p[1]));
   for (const c of curves) {
-    const path = svg.append("path").attr("d", gen(c.pts) ?? "").attr("fill", "none").attr("stroke", c.color).attr("stroke-width", 2.5).attr("stroke-linejoin", "round");
+    const path = svg.append("path").attr("d", gen(c.pts) ?? "").attr("fill", "none").attr("stroke", c.color).attr("stroke-width", 1.75).attr("stroke-linejoin", "round").attr("data-series-name", c.name);
     tagDatum(path, { line: c.line, key: c.name, name: c.name, color: c.color });
   }
   drawXAxisTitle(
@@ -35521,8 +35803,21 @@ function renderEventLine(container, parsed, palette, isDark, onClickItem, export
         "fill",
         parsed.options.fillMode ? p.color : mix(p.color, themeBaseBg(palette, isDark), SHELF_TINT)
       );
-      const edgeY = titleNearTop ? shelfTop : shelfTop + shelfH - SHELF_EDGE;
-      cardG.append("rect").attr("x", 0).attr("y", edgeY).attr("width", CARD_W).attr("height", SHELF_EDGE).attr("clip-path", `url(#${clipId})`).attr("fill", p.color).attr("fill-opacity", p.future ? 0.4 : 1);
+      if (SHELF_EDGE_STYLE !== "none" && !parsed.options.fillMode) {
+        const lip = SHELF_EDGE_STYLE === "left" ? {
+          // vertical lip on the spine-relative leading edge
+          x: 0,
+          y: shelfTop,
+          width: SHELF_LIP,
+          height: shelfH
+        } : {
+          x: 0,
+          y: titleNearTop ? shelfTop : shelfTop + shelfH - SHELF_LIP,
+          width: CARD_W,
+          height: SHELF_LIP
+        };
+        cardG.append("rect").attr("x", lip.x).attr("y", lip.y).attr("width", lip.width).attr("height", lip.height).attr("clip-path", `url(#${clipId})`).attr("fill", p.color).attr("fill-opacity", p.future ? 0.4 : 1);
+      }
       const shelfText = parsed.options.fillMode ? contrastText(p.color, palette.textOnFillLight, palette.textOnFillDark) : p.color;
       const titleMid = headBandTop + p.headerH / 2;
       const titleTop = titleMid - (p.titleLines.length - 1) * TITLE_LINE_H / 2;
@@ -35959,7 +36254,7 @@ function renderBody(cardG, lines, bodyColor, palette, startBaseline = CARD_BODY_
     y += DESC_LINE_H;
   }
 }
-var CARD_W, H_MARGIN, TITLE_AREA, LEGEND_BAND, LEADER_ABOVE, LEADER_BELOW, DESC_FONT, DESC_LINE_H, CARD_PAD, CARD_BODY_TOP, TITLE_LINE_H, TITLE_MAX_W, DOT_R, MIN_SPACING, LANE_GAP, NEUTRAL_TAG, CARD_INSET, FAN_GAP, DATE_SUBTITLE_H, DATE_SUBTITLE_FONT, SHELF_TINT, SHELF_EDGE, ERA_BLOCK, ERA_BRACKET_CAP, ERA_BRACKET_PAD, ERA_SEAM_GAP, BREAK_HALF_H, BREAK_AMP, BREAK_GAP, ERA_LEG, ERA_LABEL_FONT, HL, DIM, ERA_HL, COLLAPSED, OFF, HIDDEN_ATTR, HOVER_CSS, DIMMABLE_SEL, PIN_ATTR;
+var CARD_W, H_MARGIN, TITLE_AREA, LEGEND_BAND, LEADER_ABOVE, LEADER_BELOW, DESC_FONT, DESC_LINE_H, CARD_PAD, CARD_BODY_TOP, TITLE_LINE_H, TITLE_MAX_W, DOT_R, MIN_SPACING, LANE_GAP, NEUTRAL_TAG, CARD_INSET, FAN_GAP, DATE_SUBTITLE_H, DATE_SUBTITLE_FONT, SHELF_TINT, SHELF_EDGE, SHELF_EDGE_STYLE, SHELF_LIP, ERA_BLOCK, ERA_BRACKET_CAP, ERA_BRACKET_PAD, ERA_SEAM_GAP, BREAK_HALF_H, BREAK_AMP, BREAK_GAP, ERA_LEG, ERA_LABEL_FONT, HL, DIM, ERA_HL, COLLAPSED, OFF, HIDDEN_ATTR, HOVER_CSS, DIMMABLE_SEL, PIN_ATTR;
 var init_renderer2 = __esm({
   "src/event-line/renderer.ts"() {
     "use strict";
@@ -35997,6 +36292,8 @@ var init_renderer2 = __esm({
     DATE_SUBTITLE_FONT = 10;
     SHELF_TINT = 13;
     SHELF_EDGE = 4;
+    SHELF_EDGE_STYLE = "spine";
+    SHELF_LIP = 2;
     ERA_BLOCK = 30;
     ERA_BRACKET_CAP = 8;
     ERA_BRACKET_PAD = 14;
@@ -36103,7 +36400,7 @@ function renderFigureBody(fig, view, parts, partColor, emphKey, form, palette, i
         out += `<path${dataLine} d="${d}" fill="${color}" fill-opacity="0.5" stroke="${color}" stroke-width="1.5"/>`;
       }
     } else {
-      const lightFill = mix(color, palette.bg, 70);
+      const lightFill = mix(color, themeBaseBg(palette, isDark), 25);
       for (const d of paths) {
         out += `<path${dataLine} d="${d}" fill="${lightFill}" stroke="${color}" stroke-width="1.5"/>`;
       }
@@ -45818,6 +46115,8 @@ async function layoutBoxesAndLinesSearch(parsed, collapseInfo, opts) {
   const YIELD_EVERY_MS = 30;
   const searchStart = performance.now();
   let lastYield = searchStart;
+  const budgetMs = opts?.budgetMs ?? DEFAULT_SEARCH_BUDGET_MS;
+  const overBudget = () => budgetMs > 0 && performance.now() - searchStart > budgetMs;
   const collapsedGroupLabels = /* @__PURE__ */ new Set();
   if (collapseInfo) {
     const missing = /* @__PURE__ */ new Set();
@@ -46116,6 +46415,7 @@ async function layoutBoxesAndLinesSearch(parsed, collapseInfo, opts) {
     } catch {
     }
     await step("Optimizing layout");
+    if (pool.length && overBudget()) break;
   }
   if (!pool.length)
     return place({ ranker: "network-simplex", nodesep: 50, ranksep: 60 });
@@ -46170,6 +46470,7 @@ async function layoutBoxesAndLinesSearch(parsed, collapseInfo, opts) {
         cfgOf.set(lay, cfg);
       } catch {
       }
+      if (overBudget()) break;
     }
     const extraKey = /* @__PURE__ */ new Map();
     for (const lay of extra)
@@ -46206,7 +46507,7 @@ async function layoutBoxesAndLinesSearch(parsed, collapseInfo, opts) {
   opts?.onTopConfigs?.(topConfigs);
   return best;
 }
-var DEFAULT_LAMBDA, ESCALATE_THRESHOLD, ESCALATE_MAX_N, ESCALATE_SEEDS, ESCALATE_REFINE, splineGen, PATH_TOKEN_RE, FLAT_CACHE, GROUP_LABEL_ZONE3;
+var DEFAULT_LAMBDA, ESCALATE_THRESHOLD, ESCALATE_MAX_N, ESCALATE_SEEDS, ESCALATE_REFINE, DEFAULT_SEARCH_BUDGET_MS, splineGen, PATH_TOKEN_RE, FLAT_CACHE, GROUP_LABEL_ZONE3;
 var init_layout_search = __esm({
   "src/boxes-and-lines/layout-search.ts"() {
     "use strict";
@@ -46219,6 +46520,7 @@ var init_layout_search = __esm({
     ESCALATE_MAX_N = 45;
     ESCALATE_SEEDS = 18;
     ESCALATE_REFINE = 10;
+    DEFAULT_SEARCH_BUDGET_MS = 5e3;
     splineGen = d3line3().x((d) => d.x).y((d) => d.y).curve(curveBasis5);
     PATH_TOKEN_RE = /[MLQC]|-?\d*\.?\d+(?:e-?\d+)?/gi;
     FLAT_CACHE = /* @__PURE__ */ new WeakMap();
@@ -48053,12 +48355,13 @@ var init_renderer13 = __esm({
     init_legend_constants();
     init_text_measure();
     init_visual_conventions();
+    init_emphasis();
     init_card_model();
     KEY_X2 = 10;
     KEY_VALUE_GAP2 = 6;
     BAR_DOT_R = 3.5;
     TITLE_RESERVE = 40;
-    DIM_OPACITY = 0.28;
+    DIM_OPACITY = EMPHASIS_DIM_OPACITY;
     ROMAN = [
       [10, "X"],
       [9, "IX"],
@@ -53899,6 +54202,19 @@ function collapseGroups(parsed, collapsedIds, defaultLatencyMs = 0, defaultUptim
 }
 function resolveSplits(outbound, diagnostics) {
   if (outbound.length === 0) return [];
+  const async = outbound.filter((e) => e.async);
+  if (async.length > 0) {
+    const sync = outbound.filter((e) => !e.async);
+    const asyncResolved = async.map((e) => ({
+      edge: e,
+      split: e.split ?? 100
+    }));
+    const syncResolved = resolveSplits(sync, diagnostics);
+    const byEdge = /* @__PURE__ */ new Map();
+    for (const r of [...asyncResolved, ...syncResolved])
+      byEdge.set(r.edge, r.split);
+    return outbound.filter((e) => byEdge.has(e)).map((e) => ({ edge: e, split: byEdge.get(e) }));
+  }
   if (outbound.length === 1) {
     return [{ edge: outbound[0], split: 100 }];
   }
@@ -54006,8 +54322,9 @@ function computeInfra(parsed, params = {}) {
   const computedLatency = /* @__PURE__ */ new Map();
   const computedUptime = /* @__PURE__ */ new Map();
   const localAvailability = /* @__PURE__ */ new Map();
+  const defaultRps = parseFloat(parsed.options["default-rps"] ?? "") || 0;
   const edgeNode = effectiveParsed.nodes.find((n) => n.isEdge);
-  const baseRps = params.rps ?? (edgeNode ? getNumProp(edgeNode, "rps", 0) : 0);
+  const baseRps = params.rps ?? (edgeNode ? getNumProp(edgeNode, "rps", defaultRps) : 0);
   if (edgeNode) {
     computedRps.set(edgeNode.id, baseRps);
     computedLatency.set(edgeNode.id, 0);
@@ -54052,13 +54369,14 @@ function computeInfra(parsed, params = {}) {
         } else {
           targetIds = [edge.targetId];
         }
+        const edgeDownstreamLatency = edge.async ? 0 : downstreamLatency;
         for (const targetId of targetIds) {
           const perTarget = fanoutedRps / targetIds.length;
           const existing = computedRps.get(targetId) ?? 0;
           computedRps.set(targetId, existing + perTarget);
           const prevLatency = computedLatency.get(targetId) ?? 0;
-          if (downstreamLatency > prevLatency) {
-            computedLatency.set(targetId, downstreamLatency);
+          if (edgeDownstreamLatency > prevLatency) {
+            computedLatency.set(targetId, edgeDownstreamLatency);
           }
           const prevUptime = computedUptime.get(targetId) ?? 1;
           if (cumulativeUptime < prevUptime) {
@@ -54142,7 +54460,8 @@ function computeInfra(parsed, params = {}) {
     const coldStartMs = isServerless(node) ? getNumProp(node, "cold-start-ms", 0) : 0;
     const coldLatency = nodeLatency + coldStartMs;
     const outbound = outboundMap.get(nodeId3) ?? [];
-    if (outbound.length === 0) {
+    const syncOutbound = outbound.filter((e) => !e.async);
+    if (syncOutbound.length === 0) {
       const rps = computedRps.get(nodeId3) ?? 0;
       let result;
       if (rps <= 0) {
@@ -54175,7 +54494,7 @@ function computeInfra(parsed, params = {}) {
       nodeLeafCache.set(nodeId3, result);
       return result;
     }
-    const resolved = resolveSplits(outbound, []);
+    const resolved = resolveSplits(outbound, []).filter((r) => !r.edge.async);
     const paths = [];
     for (const { edge, split } of resolved) {
       const fanout = edge.fanout != null && edge.fanout >= 1 ? edge.fanout : 1;
@@ -54391,17 +54710,7 @@ function computeInfra(parsed, params = {}) {
       const edgeKey = `${edge.sourceId}->${edge.targetId}`;
       const rps = computedEdgeRps.get(edgeKey) ?? 0;
       const outbound = outboundMap.get(edge.sourceId) ?? [];
-      let resolvedSplit = edge.split ?? 100;
-      if (outbound.length > 1 && edge.split === null) {
-        const declared = outbound.filter((e) => e.split !== null);
-        if (declared.length === 0) {
-          resolvedSplit = 100 / outbound.length;
-        } else {
-          const declaredSum = declared.reduce((s, e) => s + (e.split ?? 0), 0);
-          const undeclared = outbound.filter((e) => e.split === null);
-          resolvedSplit = undeclared.length > 0 ? (100 - declaredSum) / undeclared.length : 0;
-        }
-      }
+      const resolvedSplit = resolveSplits(outbound, []).find((r) => r.edge === edge)?.split ?? edge.split ?? 100;
       return {
         sourceId: edge.sourceId,
         targetId: edge.targetId,
@@ -66782,7 +67091,7 @@ var init_renderer22 = __esm({
     init_text_measure();
     NODE_FONT_SIZE8 = 13;
     DESC_FONT_SIZE7 = 11;
-    EDGE_LABEL_FONT_SIZE14 = 11;
+    EDGE_LABEL_FONT_SIZE14 = 13;
     DESC_LINE_HEIGHT8 = 15;
     TITLE_AREA_HEIGHT = 50;
   }
@@ -85096,7 +85405,7 @@ var CSS = AUTO_BASE_CSS + "\n" + BLOCK_CSS + "\n" + darkScopedBlockCss(BLOCK_CSS
 
 // src/auto/shared.ts
 init_safe_href();
-var VERSION = "0.53.0";
+var VERSION = "0.54.0";
 var ARIA_LABEL_MAX = 200;
 var COPIED_INTERACTION_MS = 1500;
 var LOG_PREFIX = "[dgmo]";