@diagrammo/dgmo 0.50.2 → 0.52.0

package/dist/{chunk-QROYX7TT.js → chunk-BPY242XU.js}

@@ -11,7 +11,7 @@ import {
   stripDefaultModifier,
   tagAttrKey,
   validateTagGroupNames
-} from "./chunk-FJUNPCYI.js";
+} from "./chunk-HHKO6SKY.js";
 import {
   parseInArrowLabel
 } from "./chunk-FFUN5D66.js";
@@ -27,7 +27,7 @@ import {
   splitNameAndMeta,
   warnUnknownMetaKeys,
   withTagAliases
-} from "./chunk-OTAL43EH.js";
+} from "./chunk-BRENJ2BQ.js";
 import {
   formatDgmoError,
   makeDgmoError,
@@ -65,7 +65,9 @@ var VALID_SHAPES = /* @__PURE__ */ new Set([
 var KNOWN_C4_OPTIONS = /* @__PURE__ */ new Set(["layout", "active-tag"]);
 var KNOWN_C4_BOOLEANS = /* @__PURE__ */ new Set([
   "direction-tb",
-  "solid-fill",
+  "fill-tint",
+  "fill-solid",
+  "fill-outline",
   "no-title"
 ]);
 var ALL_CHART_TYPES = [
@@ -804,4 +806,4 @@ function validateDeploymentRefs(result, knownNames, pushWarning) {
 export {
   parseC4
 };
-//# sourceMappingURL=chunk-QROYX7TT.js.map
+//# sourceMappingURL=chunk-BPY242XU.js.map

package/dist/{chunk-OTAL43EH.js → chunk-BRENJ2BQ.js}

@@ -40,7 +40,13 @@ var MAP_REGISTRY = staticRegistry([
   "size",
   "width",
   "label",
-  "style"
+  "style",
+  // `clock` (BL-122): the time-card control. Bare (`poi Denver clock`) → a card
+  // with the zone auto-derived from the place; valued (`clock: Europe/Oslo`) →
+  // that IANA id or fixed offset (`clock: UTC+9`) as the zone, for bare-coord
+  // pins or to override a city. Reserved so the valued form peels off the POI
+  // name cleanly; the BARE flag is peeled separately in handlePoi (no colon).
+  "clock"
   // `surface:` was removed in the 2026-06-02 defaults-on review — it is no longer
   // a recognized metadata key (the route/edge surface feature was cut; §24B.7).
   // A stray `surface: water` is no longer captured as a reserved key.
@@ -262,10 +268,34 @@ function extractColor(label, palette, diagnostics, line) {
 }
 var OPTION_NOCOLON_RE = /^([a-z][a-z0-9-]*)\s+(.+)$/i;
 var GLOBAL_BOOLEANS = /* @__PURE__ */ new Set([
-  "solid-fill",
+  "fill-tint",
+  "fill-solid",
+  "fill-outline",
   "no-title",
   "no-notes"
 ]);
+var FILL_FAMILY_TOKENS = /* @__PURE__ */ new Set([
+  "fill-tint",
+  "fill-solid",
+  "fill-outline"
+]);
+function fillModeFromToken(token) {
+  switch (token.trim().toLowerCase()) {
+    case "fill-solid":
+      return "solid";
+    case "fill-outline":
+      return "outline";
+    case "fill-tint":
+      return "tint";
+    default:
+      return null;
+  }
+}
+function fillModeFromOptions(options) {
+  if (options["fill-solid"] === "on") return "solid";
+  if (options["fill-outline"] === "on") return "outline";
+  return void 0;
+}
 function recognizeGlobalBoolean(token) {
   const t = token.trim().toLowerCase();
   return GLOBAL_BOOLEANS.has(t) ? t : null;
@@ -273,6 +303,9 @@ function recognizeGlobalBoolean(token) {
 function tryParseSharedOption(line, options) {
   const key = recognizeGlobalBoolean(line);
   if (key) {
+    if (FILL_FAMILY_TOKENS.has(key)) {
+      for (const t of FILL_FAMILY_TOKENS) delete options[t];
+    }
     options[key] = "on";
     return true;
   }
@@ -662,6 +695,9 @@ export {
   measureIndent,
   extractColor,
   OPTION_NOCOLON_RE,
+  FILL_FAMILY_TOKENS,
+  fillModeFromToken,
+  fillModeFromOptions,
   tryParseSharedOption,
   parseFirstLine,
   normalizeNumericToken,
@@ -675,4 +711,4 @@ export {
   splitNameAndMeta,
   warnUnknownMetaKeys
 };
-//# sourceMappingURL=chunk-OTAL43EH.js.map
+//# sourceMappingURL=chunk-BRENJ2BQ.js.map

package/dist/{chunk-FA6K3FWM.js → chunk-CCNDLW7Z.js}

@@ -3,10 +3,10 @@ import {
 } from "./chunk-3HDBAXF5.js";
 import {
   renderIntegratedLegend
-} from "./chunk-HEVYAHLW.js";
+} from "./chunk-AUIM2NVH.js";
 import {
   getMaxLegendReservedHeight
-} from "./chunk-7UEMZREK.js";
+} from "./chunk-YAA6IID3.js";
 import {
   TITLE_FONT_SIZE,
   TITLE_FONT_WEIGHT,
@@ -17,20 +17,21 @@ import {
 } from "./chunk-6KFWC4CO.js";
 import {
   LEGEND_GROUP_GAP
-} from "./chunk-HQCHYB5F.js";
+} from "./chunk-QOOUC2J5.js";
 import {
   measureText
-} from "./chunk-5LWQH6QV.js";
+} from "./chunk-WCT3NYCV.js";
 import {
+  contrastText,
   getSeriesColors,
   mix,
   shapeFill,
   themeBaseBg
-} from "./chunk-P6T66CCZ.js";
+} from "./chunk-WBM7ZNDI.js";
 import {
   resolveTagColor,
   tagAttrKey
-} from "./chunk-FJUNPCYI.js";
+} from "./chunk-HHKO6SKY.js";
 import {
   resolveColor
 } from "./chunk-TLVIHFRO.js";
@@ -628,7 +629,7 @@ function clip(s, maxW, fs) {
   }
   return lo <= 0 ? "" : s.slice(0, lo) + "\u2026";
 }
-function paintForAccent(palette, isDark, accent) {
+function paintForAccent(palette, isDark, accent, fillMode) {
   const base = themeBaseBg(palette, isDark);
   return {
     accent,
@@ -639,12 +640,14 @@ function paintForAccent(palette, isDark, accent) {
     hair: mix(palette.text, base, 34),
     wire: mix(palette.text, base, 30),
     track: mix(palette.border, base, 55),
-    tint: shapeFill(palette, accent, isDark)
+    // §1.9 fill family rides through shapeFill: solid ⇒ raw accent,
+    // outline ⇒ theme base bg (accent stays on the stroke), absent ⇒ 25% tint.
+    tint: shapeFill(palette, accent, isDark, { mode: fillMode })
   };
 }
-function paintFor(palette, isDark, sideColor) {
+function paintFor(palette, isDark, sideColor, fillMode) {
   const accent = sideColor && resolveColor(sideColor, palette) || sideColor || getSeriesColors(palette)[0];
-  return paintForAccent(palette, isDark, accent);
+  return paintForAccent(palette, isDark, accent, fillMode);
 }
 function resolveBracketLegend(parsed, palette) {
   const activeTag = parsed.activeTag;
@@ -740,7 +743,8 @@ function renderBracket(container, parsed, palette, isDark, exportDims) {
     });
   }
   const baseAccent = parsed.accentColor ?? resolveColor("blue", palette) ?? getSeriesColors(palette)[0];
-  const basePaint = paintForAccent(palette, isDark, baseAccent);
+  const fillMode = parsed.fillMode;
+  const basePaint = paintForAccent(palette, isDark, baseAccent, fillMode);
   const sideColorByLabel = /* @__PURE__ */ new Map();
   for (const s of parsed.sides) sideColorByLabel.set(s.label, s.color);
   const sideBarH = layout.sideLabels.length ? 30 : 0;
@@ -753,11 +757,20 @@ function renderBracket(container, parsed, palette, isDark, exportDims) {
     );
     const top = covered ? bandTop : 2;
     const c = resolveColor(col.color, palette) ?? col.color;
-    root.append("rect").attr("x", col.x - BOX_W / 2 - 10).attr("y", top).attr("width", BOX_W + 20).attr("height", Math.max(0, layout.height - top)).attr("rx", 10).attr("fill", mix(c, palette.bg, isDark ? 12 : 8));
+    root.append("rect").attr("x", col.x - BOX_W / 2 - 10).attr("y", top).attr("width", BOX_W + 20).attr("height", Math.max(0, layout.height - top)).attr("rx", 10).attr(
+      "fill",
+      fillMode === "outline" ? themeBaseBg(palette, isDark) : mix(c, palette.bg, isDark ? 12 : 8)
+    ).call((sel) => {
+      if (fillMode === "outline")
+        sel.attr("stroke", mix(c, palette.bg, 35)).attr("stroke-width", 1);
+    });
   }
   for (const s of layout.sideLabels) {
     const c = s.color ? resolveColor(s.color, palette) ?? s.color : basePaint.accent;
-    root.append("rect").attr("x", s.x0 - 8).attr("y", 2).attr("width", s.x1 - s.x0 + 16).attr("height", 24).attr("rx", 8).attr("fill", mix(c, palette.bg, isDark ? 20 : 14)).attr("stroke", mix(c, palette.bg, 55)).attr("stroke-width", 1);
+    root.append("rect").attr("x", s.x0 - 8).attr("y", 2).attr("width", s.x1 - s.x0 + 16).attr("height", 24).attr("rx", 8).attr(
+      "fill",
+      fillMode === "outline" ? themeBaseBg(palette, isDark) : mix(c, palette.bg, isDark ? 20 : 14)
+    ).attr("stroke", fillMode === "outline" ? c : mix(c, palette.bg, 55)).attr("stroke-width", 1);
     root.append("text").attr("x", (s.x0 + s.x1) / 2).attr("y", 18).attr("text-anchor", "middle").attr("font-size", 13).attr("font-weight", 800).attr("letter-spacing", 0.3).attr("fill", c).text(clip(s.label, s.x1 - s.x0, 13));
   }
   for (const col of layout.columns) {
@@ -772,7 +785,7 @@ function renderBracket(container, parsed, palette, isDark, exportDims) {
     drawConnector(root, m, m.botFrom, m.y + HALF_SPAN2, basePaint);
   }
   for (const m of layout.matches) {
-    const sidePaint = m.side && sideColorByLabel.get(m.side) ? paintFor(palette, isDark, sideColorByLabel.get(m.side)) : basePaint;
+    const sidePaint = m.side && sideColorByLabel.get(m.side) ? paintFor(palette, isDark, sideColorByLabel.get(m.side), fillMode) : basePaint;
     const topSeed = seedByName.get(m.top ?? "") ?? null;
     const botSeed = seedByName.get(m.bot ?? "") ?? null;
     let homeName = m.home;
@@ -810,7 +823,8 @@ function renderBracket(container, parsed, palette, isDark, exportDims) {
       palette,
       isDark,
       m,
-      activeKey
+      activeKey,
+      fillMode
     );
     drawBox(
       root,
@@ -822,7 +836,8 @@ function renderBracket(container, parsed, palette, isDark, exportDims) {
       palette,
       isDark,
       m,
-      activeKey
+      activeKey,
+      fillMode
     );
     if (isUpset) drawUpset(root, m, sidePaint);
     if (m.commentary.length) drawCommentary(root, m, palette);
@@ -841,10 +856,10 @@ function drawConnector(g, m, from, toCy, paint) {
   const d = from.yA !== from.yB ? `M ${childEdge} ${from.yA} H ${midX} M ${childEdge} ${from.yB} H ${midX} M ${midX} ${vLo} V ${vHi} M ${midX} ${toCy} H ${parentEdge}` : `M ${childEdge} ${from.y} H ${midX} V ${toCy} H ${parentEdge}`;
   g.append("path").attr("d", d).attr("fill", "none").attr("stroke", paint.wire).attr("stroke-width", 1.5);
 }
-function drawBox(g, cx, cy, name, info, sidePaint, palette, isDark, m, activeKey) {
+function drawBox(g, cx, cy, name, info, sidePaint, palette, isDark, m, activeKey, fillMode) {
   const x = cx - BOX_W / 2;
   const y = cy - BOX_H / 2;
-  const paint = info.tagColor ? paintForAccent(palette, isDark, info.tagColor) : sidePaint;
+  const paint = info.tagColor ? paintForAccent(palette, isDark, info.tagColor, fillMode) : sidePaint;
   const cell = g.append("g").attr("class", "dgmo-bracket-box");
   if (m.lineNumber !== null) cell.attr("data-line-number", m.lineNumber);
   if (activeKey && info.tagValue)
@@ -878,22 +893,29 @@ function drawBox(g, cx, cy, name, info, sidePaint, palette, isDark, m, activeKey
   } else if (info.pending) {
     stroke = mix(paint.accent, paint.hair, 50);
   }
+  const onSolid = fillMode === "solid" && (info.isChampion || info.isWinner) ? contrastText(
+    paint.tint,
+    palette.textOnFillLight,
+    palette.textOnFillDark
+  ) : null;
+  if (onSolid) textColor = onSolid;
+  const gutterColor = onSolid ?? paint.muted;
   const rect = cell.append("rect").attr("x", x).attr("y", y).attr("width", BOX_W).attr("height", BOX_H).attr("rx", 6).attr("fill", fill).attr("stroke", stroke).attr("stroke-width", sw);
   if (dash) rect.attr("stroke-dasharray", dash);
   let leftPad = 11;
   if (info.seed !== null) {
-    cell.append("text").attr("x", x + 9).attr("y", cy + 4).attr("text-anchor", "start").attr("font-size", 10).attr("font-weight", 700).attr("fill", paint.muted).text(info.seed);
+    cell.append("text").attr("x", x + 9).attr("y", cy + 4).attr("text-anchor", "start").attr("font-size", 10).attr("font-weight", 700).attr("fill", gutterColor).text(info.seed);
     leftPad = 9 + Math.max(12, measureText(String(info.seed), 10)) + 6;
   }
   let rightPad = 11;
   if (info.score) rightPad += 20;
   if (info.isHome) {
-    drawHome(cell, x + BOX_W - rightPad - 6, cy, paint.muted);
+    drawHome(cell, x + BOX_W - rightPad - 6, cy, gutterColor);
     rightPad += 16;
   }
   cell.append("text").attr("x", x + leftPad).attr("y", cy + 4).attr("text-anchor", "start").attr("font-size", 12.5).attr("font-weight", weight).attr("fill", textColor).text(clip(isTBD ? "TBD" : name, BOX_W - leftPad - rightPad, 12.5));
   if (info.score) {
-    cell.append("text").attr("x", x + BOX_W - 11).attr("y", cy + 4).attr("text-anchor", "end").attr("font-size", 12).attr("font-weight", info.isWinner ? 700 : 500).attr("fill", info.isWinner ? textColor : paint.muted).text(info.score);
+    cell.append("text").attr("x", x + BOX_W - 11).attr("y", cy + 4).attr("text-anchor", "end").attr("font-size", 12).attr("font-weight", info.isWinner ? 700 : 500).attr("fill", info.isWinner ? textColor : gutterColor).text(info.score);
   }
 }
 function drawHome(cell, hx, cy, color) {
@@ -937,4 +959,4 @@ export {
   renderBracket,
   renderBracketForExport
 };
-//# sourceMappingURL=chunk-FA6K3FWM.js.map
+//# sourceMappingURL=chunk-CCNDLW7Z.js.map

package/dist/{chunk-2KGXHFYK.js → chunk-CIRFIL4M.js}

@@ -3,10 +3,10 @@ import {
   layoutJourneyMap,
   scoreToColor,
   scoreToCurveY
-} from "./chunk-F7BFXWNQ.js";
+} from "./chunk-YIBAWQGJ.js";
 import {
   wrapNoteBody
-} from "./chunk-BCYVE3N5.js";
+} from "./chunk-TYS6CSS5.js";
 import {
   NOTE_BULLET_INDENT
 } from "./chunk-5DH3KYFH.js";
@@ -21,7 +21,7 @@ import {
 } from "./chunk-YYVTBZZC.js";
 import {
   renderIntegratedLegend
-} from "./chunk-HEVYAHLW.js";
+} from "./chunk-AUIM2NVH.js";
 import {
   FONT_FAMILY
 } from "./chunk-6KFWC4CO.js";
@@ -29,19 +29,23 @@ import {
   measureText,
   truncateText,
   wrapTextToWidth
-} from "./chunk-5LWQH6QV.js";
+} from "./chunk-WCT3NYCV.js";
 import {
   parseJourneyMap
-} from "./chunk-6HJBFVLO.js";
+} from "./chunk-XD6ZYURY.js";
 import {
   contrastText,
   mix,
-  shapeFill
-} from "./chunk-P6T66CCZ.js";
+  shapeFill,
+  themeBaseBg
+} from "./chunk-WBM7ZNDI.js";
 import {
   resolveActiveTagGroup,
   tagAttrKey
-} from "./chunk-FJUNPCYI.js";
+} from "./chunk-HHKO6SKY.js";
+import {
+  fillModeFromOptions
+} from "./chunk-BRENJ2BQ.js";
 
 // src/journey-map/renderer.ts
 import * as d3 from "d3-selection";
@@ -76,7 +80,7 @@ function renderJourneyMap(container, parsed, palette, isDark, options) {
   const onActiveTagGroupChange = options?.onActiveTagGroupChange;
   const collapsedPhases = options?.collapsedPhases ?? /* @__PURE__ */ new Set();
   const onPhaseToggle = options?.onPhaseToggle;
-  const solid = parsed.options["solid-fill"] === "on";
+  const fillMode = fillModeFromOptions(parsed.options);
   const layout = layoutJourneyMap(parsed, palette, {
     collapsedPhases,
     ...exportDims !== void 0 && { exportDims },
@@ -131,7 +135,9 @@ function renderJourneyMap(container, parsed, palette, isDark, options) {
     const textX = panelX + CARD_PADDING_X;
     const clipId = "persona-clip";
     defs.append("clipPath").attr("id", clipId).append("rect").attr("x", panelX).attr("y", panelY).attr("width", panelWidth).attr("height", panelHeight).attr("rx", CARD_RADIUS);
-    const personaFill = shapeFill(palette, personaColor, isDark, { solid });
+    const personaFill = shapeFill(palette, personaColor, isDark, {
+      mode: fillMode
+    });
     const onPersonaText = contrastText(
       personaFill,
       palette.textOnFillLight,
@@ -139,12 +145,21 @@ function renderJourneyMap(container, parsed, palette, isDark, options) {
     );
     personaG.append("rect").attr("x", panelX).attr("y", panelY).attr("width", panelWidth).attr("height", panelHeight).attr("rx", CARD_RADIUS).attr("fill", personaFill);
     if (descLines.length > 0) {
-      personaG.append("line").attr("x1", panelX + 1).attr("x2", panelX + panelWidth - silhouetteZone).attr("y1", panelY + titleRowH).attr("y2", panelY + titleRowH).attr("stroke", solid ? onPersonaText : personaColor).attr("stroke-opacity", 0.3).attr("stroke-width", 1);
+      personaG.append("line").attr("x1", panelX + 1).attr("x2", panelX + panelWidth - silhouetteZone).attr("y1", panelY + titleRowH).attr("y2", panelY + titleRowH).attr("stroke", fillMode === "solid" ? onPersonaText : personaColor).attr("stroke-opacity", 0.3).attr("stroke-width", 1);
     }
     const silX = panelX + panelWidth - 32;
     const silY = panelY + panelHeight / 2 - 6;
     const silClip = personaG.append("g").attr("clip-path", `url(#${clipId})`);
-    renderPersonaSilhouette(silClip, silX, silY, personaColor, palette, 1.2);
+    renderPersonaSilhouette(
+      silClip,
+      silX,
+      silY,
+      personaColor,
+      palette,
+      isDark,
+      1.2,
+      fillMode
+    );
     personaG.append("rect").attr("x", panelX).attr("y", panelY).attr("width", panelWidth).attr("height", panelHeight).attr("rx", CARD_RADIUS).attr("fill", "none").attr("stroke", personaColor).attr("stroke-width", CARD_STROKE_WIDTH);
     personaG.append("text").attr("x", textX).attr("y", panelY + CARD_PADDING_Y + FONT_SIZE_STEP).attr("font-size", FONT_SIZE_STEP).attr("font-weight", "500").attr("fill", onPersonaText).text(parsed.persona.name);
     for (let li = 0; li < descLines.length; li++) {
@@ -280,7 +295,9 @@ function renderJourneyMap(container, parsed, palette, isDark, options) {
         pt.y,
         pt.score,
         palette,
-        isDark
+        isDark,
+        void 0,
+        fillMode
       );
       addEmotionLabel(faceG, pt, palette);
       if (step) {
@@ -313,7 +330,9 @@ function renderJourneyMap(container, parsed, palette, isDark, options) {
       pt.y,
       pt.score,
       palette,
-      isDark
+      isDark,
+      void 0,
+      fillMode
     );
     addEmotionLabel(faceG, pt, palette);
     if (step) {
@@ -398,7 +417,7 @@ function renderJourneyMap(container, parsed, palette, isDark, options) {
             palette,
             stepColor ?? palette.primary,
             isDark,
-            { solid }
+            { mode: fillMode }
           );
           const rowStroke = stepColor ?? palette.textMuted;
           itemG.append("rect").attr("x", listX).attr("y", itemY).attr("width", cardW).attr("height", COLLAPSED_CARD_H).attr("rx", CARD_RADIUS).attr("fill", rowFill).attr("stroke", rowStroke).attr("stroke-width", CARD_STROKE_WIDTH);
@@ -412,7 +431,8 @@ function renderJourneyMap(container, parsed, palette, isDark, options) {
               step.score,
               palette,
               isDark,
-              COLLAPSED_FACE_R
+              COLLAPSED_FACE_R,
+              fillMode
             );
             faceG.attr("data-line-number", step.lineNumber);
             faceG.attr("data-score", step.score);
@@ -441,7 +461,7 @@ function renderJourneyMap(container, parsed, palette, isDark, options) {
             effectiveActiveGroup,
             parsed.tagGroups,
             onNavigateToLine,
-            solid
+            fillMode
           );
         }
       }
@@ -456,7 +476,7 @@ function renderJourneyMap(container, parsed, palette, isDark, options) {
         effectiveActiveGroup,
         parsed.tagGroups,
         onNavigateToLine,
-        solid
+        fillMode
       );
     }
   }
@@ -530,7 +550,7 @@ function renderJourneyMap(container, parsed, palette, isDark, options) {
       );
       const by = Math.max(PADDING, fcy - FACE_HOVER_R - THOUGHT_GAP - bh);
       const scoreColor = scoreToColor(score, palette);
-      const tintedBg = mix(scoreColor, palette.surface, 20);
+      const tintedBg = fillMode === "outline" ? themeBaseBg(palette, isDark) : mix(scoreColor, palette.surface, 20);
       const g = overlayG.append("g").attr("class", "journey-thought-hover");
       g.append("rect").attr("x", bx).attr("y", by).attr("width", bw).attr("height", bh).attr("rx", CARD_RADIUS).attr("fill", tintedBg).attr("stroke", scoreColor).attr("stroke-width", CARD_STROKE_WIDTH);
       g.append("line").attr("x1", fcx).attr("y1", by + bh).attr("x2", fcx).attr("y2", fcy - FACE_HOVER_R - 1).attr("stroke", scoreColor).attr("stroke-width", CARD_STROKE_WIDTH);
@@ -624,7 +644,7 @@ function resolveStepColor(step, scoreColor, activeGroup, tagGroups, _palette) {
   );
   return entry?.color;
 }
-function renderStepCard(parent, sl, palette, isDark, activeGroup, tagGroups, onNavigateToLine, solid) {
+function renderStepCard(parent, sl, palette, isDark, activeGroup, tagGroups, onNavigateToLine, fillMode) {
   const stepG = parent.append("g").attr("class", "journey-step").attr("data-line-number", sl.step.lineNumber);
   if (sl.step.score !== void 0) {
     stepG.attr("data-score", sl.step.score);
@@ -645,7 +665,7 @@ function renderStepCard(parent, sl, palette, isDark, activeGroup, tagGroups, onN
     palette,
     resolvedColor ?? palette.primary,
     isDark,
-    { ...solid !== void 0 && { solid } }
+    { mode: fillMode }
   );
   const cardStroke = resolvedColor ?? palette.textMuted;
   const onCardText = contrastText(
@@ -663,7 +683,7 @@ function renderStepCard(parent, sl, palette, isDark, activeGroup, tagGroups, onN
   const cardAnnotations = sl.step.annotations;
   const hasContent = sl.step.description || cardAnnotations.length > 0;
   if (hasContent) {
-    stepG.append("line").attr("x1", cx).attr("y1", cy + titleBlockH).attr("x2", cx + sl.width).attr("y2", cy + titleBlockH).attr("stroke", solid ? onCardText : cardStroke).attr("stroke-opacity", 0.3).attr("stroke-width", 1);
+    stepG.append("line").attr("x1", cx).attr("y1", cy + titleBlockH).attr("x2", cx + sl.width).attr("y2", cy + titleBlockH).attr("stroke", fillMode === "solid" ? onCardText : cardStroke).attr("stroke-opacity", 0.3).attr("stroke-width", 1);
   }
   let metaY = cy + titleBlockH + CARD_META_LINE_HEIGHT;
   if (sl.step.description) {
@@ -685,7 +705,7 @@ function renderStepCard(parent, sl, palette, isDark, activeGroup, tagGroups, onN
     const annoColor = annotationColor(anno.type, palette);
     const iconPaths = annotationIconPaths(anno.type);
     const annoLines = wrapText(anno.text, annoTextW, FONT_SIZE_META);
-    const iconColor = solid ? onCardText : annoColor;
+    const iconColor = fillMode === "solid" ? onCardText : annoColor;
     renderAnnotationIcon(
       stepG,
       cx + CARD_PADDING_X,
@@ -710,7 +730,7 @@ function renderStepCard(parent, sl, palette, isDark, activeGroup, tagGroups, onN
     const TAG_GAP = 6;
     const stripY = cy - TAG_STRIP_HEIGHT - TAG_GAP;
     const stripFill = shapeFill(palette, stripColor, isDark, {
-      ...solid !== void 0 && { solid }
+      mode: fillMode
     });
     stepG.append("rect").attr("x", cx).attr("y", stripY).attr("width", sl.width).attr("height", TAG_STRIP_HEIGHT).attr("rx", CARD_RADIUS).attr("fill", stripFill).attr("stroke", stripColor).attr("stroke-width", CARD_STROKE_WIDTH);
     const stripTextColor = contrastText(
@@ -727,8 +747,8 @@ function renderStepCard(parent, sl, palette, isDark, activeGroup, tagGroups, onN
     });
   }
 }
-function renderPersonaSilhouette(parent, cx, cy, color, palette, scale = 1) {
-  const fill = mix(color, palette.bg, 70);
+function renderPersonaSilhouette(parent, cx, cy, color, palette, isDark, scale = 1, fillMode) {
+  const fill = fillMode === "outline" ? themeBaseBg(palette, isDark) : mix(color, palette.bg, 70);
   const stroke = color;
   const s = scale;
   parent.append("path").attr(
@@ -740,12 +760,12 @@ function renderPersonaSilhouette(parent, cx, cy, color, palette, scale = 1) {
     `M ${cx} ${cy - 12 * s} C ${cx + 10 * s} ${cy - 12 * s}, ${cx + 9 * s} ${cy + 2 * s}, ${cx + 6 * s} ${cy + 6 * s} Q ${cx} ${cy + 9 * s}, ${cx - 6 * s} ${cy + 6 * s} C ${cx - 9 * s} ${cy + 2 * s}, ${cx - 10 * s} ${cy - 12 * s}, ${cx} ${cy - 12 * s} Z`
   ).attr("fill", fill).attr("stroke", stroke).attr("stroke-width", 1.2);
 }
-function renderScoreFace(parent, cx, cy, score, palette, isDark, radius) {
+function renderScoreFace(parent, cx, cy, score, palette, isDark, radius, fillMode) {
   const r = radius ?? FACE_RADIUS;
   const color = scoreToColor(score, palette);
   const g = parent.append("g").attr("class", "journey-face").attr("data-cx", cx).attr("data-cy", cy);
   const iconG = g.append("g").attr("class", "journey-face-icon");
-  const faceFill = shapeFill(palette, color, isDark);
+  const faceFill = fillMode === "outline" ? shapeFill(palette, color, isDark, { mode: "outline" }) : shapeFill(palette, color, isDark);
   iconG.append("circle").attr("cx", cx).attr("cy", cy).attr("r", r + 1).attr("fill", palette.bg);
   iconG.append("circle").attr("cx", cx).attr("cy", cy).attr("r", r).attr("fill", faceFill).attr("stroke", color).attr("stroke-width", 2);
   const eyeColor = color;
@@ -848,4 +868,4 @@ export {
   renderJourneyMap,
   renderJourneyMapForExport
 };
-//# sourceMappingURL=chunk-2KGXHFYK.js.map
+//# sourceMappingURL=chunk-CIRFIL4M.js.map