@diagrammo/dgmo 0.50.2 → 0.51.0

package/dist/{chunk-KQ57MHRO.js → chunk-KJGG2JKQ.js}

@@ -1,22 +1,22 @@
 import {
   parseGoal
-} from "./chunk-Q4V4XQWV.js";
+} from "./chunk-GTWKD3QT.js";
 import {
   parseCountdown
-} from "./chunk-BTUTZMPT.js";
+} from "./chunk-AFIEPDLX.js";
 import {
   parseClock
-} from "./chunk-3XPUDB7B.js";
+} from "./chunk-6NFYEQDX.js";
 import {
   parseBracket
-} from "./chunk-QXKWYZNR.js";
+} from "./chunk-XEQXCIBC.js";
 import {
   allTasks,
   parseRaci
-} from "./chunk-PGEGPSCZ.js";
+} from "./chunk-6MNGECP2.js";
 import {
   parseBody
-} from "./chunk-3UIKSPFB.js";
+} from "./chunk-6BQFET7X.js";
 import {
   EXTENDED_CHART_DOORS,
   parseChart,
@@ -25,109 +25,115 @@ import {
   parseHeatmap,
   parseSankey,
   parseScatter
-} from "./chunk-XEGTMVYY.js";
+} from "./chunk-QZPEGJOM.js";
 import {
   parseWireframe
-} from "./chunk-I2WKW7C7.js";
+} from "./chunk-GGHRAITI.js";
 import {
   parseTechRadar
-} from "./chunk-TSA237IM.js";
+} from "./chunk-PZDBOK2Q.js";
 import {
   parseCycle
-} from "./chunk-6IAA2QQ2.js";
+} from "./chunk-2EQMXBBQ.js";
 import {
   parseJourneyMap
-} from "./chunk-6HJBFVLO.js";
+} from "./chunk-4QZ43D7I.js";
 import {
   parsePyramid
-} from "./chunk-3P2DKJCG.js";
+} from "./chunk-Q62FEYK3.js";
 import {
   parseRing
-} from "./chunk-3LKM6FMW.js";
+} from "./chunk-AE7II3E3.js";
 import {
   parseTreemap
-} from "./chunk-XJLKLU4D.js";
+} from "./chunk-2ILHQOL3.js";
 import {
   parseBlock
-} from "./chunk-7L3R6I3U.js";
+} from "./chunk-ENRS56GC.js";
 import {
   parseInfra
-} from "./chunk-VUJGMJE6.js";
+} from "./chunk-MVN25IF6.js";
 import {
   parseGantt
-} from "./chunk-C2CVAM3U.js";
+} from "./chunk-5PZT4DQG.js";
 import {
   parseMap
-} from "./chunk-GKC3HILQ.js";
+} from "./chunk-I2QZFCS2.js";
 import {
   parseBoxesAndLines
-} from "./chunk-DSWVNQVS.js";
+} from "./chunk-BGP54HVR.js";
 import {
   parseSketch
-} from "./chunk-DZXYF2F5.js";
+} from "./chunk-6K2M4VSR.js";
 import {
   parseSwimlane
-} from "./chunk-OMNGQPEZ.js";
+} from "./chunk-E7Y3SYKW.js";
 import {
   parseFamily
-} from "./chunk-VBYSIOOY.js";
+} from "./chunk-5WPNFSXP.js";
 import {
   parseMindmap
-} from "./chunk-SXRTRMEE.js";
+} from "./chunk-2UJSV2VT.js";
 import {
   looksLikeERDiagram,
   parseERDiagram
-} from "./chunk-NU3XLTGP.js";
+} from "./chunk-332ZR4QU.js";
 import {
   looksLikeOrg,
   parseOrg
-} from "./chunk-OTQKUHRS.js";
+} from "./chunk-RBHWPDBB.js";
 import {
   looksLikeSitemap,
   parseSitemap
-} from "./chunk-SQLNBA64.js";
+} from "./chunk-KFNWFNAA.js";
 import {
   looksLikePert,
   parsePert
-} from "./chunk-EAMEADTV.js";
+} from "./chunk-5PDTIBLV.js";
 import {
   parseEventLine
-} from "./chunk-HTMN2Z6U.js";
+} from "./chunk-EDA6C7MV.js";
 import {
   parseTimelineEventLine
-} from "./chunk-I7F2A35O.js";
+} from "./chunk-TMACGPW5.js";
+import {
+  makeYearContext,
+  parseDateToken,
+  resolveTokenYear,
+  toInternal
+} from "./chunk-RBDIYLA5.js";
 import {
   parseVersionControl
-} from "./chunk-6BFZKBGD.js";
+} from "./chunk-JJXGQIRV.js";
 import {
   parseKanban
-} from "./chunk-3Y2DRD7S.js";
+} from "./chunk-IEDMFNU7.js";
 import {
   parseC4
-} from "./chunk-QROYX7TT.js";
+} from "./chunk-3LV2NCB6.js";
 import {
   looksLikeSequence,
   parseSequenceDgmo
-} from "./chunk-BH3UYK36.js";
+} from "./chunk-RLFVAKEO.js";
 import {
   matchTagBlockHeading,
   stripDefaultModifier,
   tagAttrKey,
   validateTagGroupNames,
   validateTagValues
-} from "./chunk-FJUNPCYI.js";
+} from "./chunk-467TVMQL.js";
 import {
   looksLikeFlowchart,
   parseFlowchart
-} from "./chunk-GBE54KY6.js";
+} from "./chunk-OZPBJM5Q.js";
 import {
   looksLikeState,
   parseState
-} from "./chunk-2C56LEML.js";
+} from "./chunk-5F5ELR3V.js";
 import {
   looksLikeClassDiagram,
   parseClassDiagram
-} from "./chunk-GL5UZ6NY.js";
+} from "./chunk-FC5I2KXV.js";
 import {
   TIMELINE_REGISTRY,
   collectIndentedValues,
@@ -138,7 +144,7 @@ import {
   peelTrailingColorName,
   splitNameAndMeta,
   withTagAliases
-} from "./chunk-OTAL43EH.js";
+} from "./chunk-LV4BETUU.js";
 import {
   resolveColorWithDiagnostic
 } from "./chunk-TLVIHFRO.js";
@@ -212,6 +218,67 @@ function parseVisualizationFull(content, palette) {
     return fail(0, "Empty content");
   }
   const lines = content.split("\n");
+  let tlDateOrder = "mdy";
+  let tlNoCurrentYear = false;
+  let tlDirectiveYear = null;
+  for (const raw of lines) {
+    const t = raw.trim().toLowerCase();
+    if (t === "no-current-year") tlNoCurrentYear = true;
+    else if (t === "date-order dmy") tlDateOrder = "dmy";
+    else if (t === "date-order mdy") tlDateOrder = "mdy";
+    else {
+      const ym = t.match(/^year\s+(\d{1,4})$/);
+      if (ym) tlDirectiveYear = parseInt(ym[1], 10);
+    }
+  }
+  let tlPrescan = null;
+  for (const raw of lines) {
+    const t = raw.trim();
+    if (!t) continue;
+    const p = parseDateToken(t, { dateOrder: tlDateOrder });
+    if (p?.token.year != null) {
+      tlPrescan = p.token.sign * p.token.year;
+      break;
+    }
+  }
+  const tlYearCtx = makeYearContext({
+    order: tlDateOrder,
+    directiveYear: tlDirectiveYear,
+    prescanYear: tlPrescan,
+    noCurrentYear: tlNoCurrentYear
+  });
+  const tlDateCtx = {
+    order: tlDateOrder,
+    resolve: (tok) => resolveTokenYear(tok, tlYearCtx)
+  };
+  const isTlDateDirective = (t) => t === "no-current-year" || t === "date-order dmy" || t === "date-order mdy" || /^year\s+\d{1,4}$/.test(t);
+  const tlBaseYear = tlDirectiveYear ?? tlPrescan;
+  const tlCurrentYear = (/* @__PURE__ */ new Date()).getFullYear();
+  const tlResolveYear = (tok) => {
+    if (tok.year != null) return toInternal(tok, tok.year);
+    if (tlBaseYear == null && tlNoCurrentYear) return null;
+    return toInternal(tok, tlBaseYear ?? tlCurrentYear);
+  };
+  const TL_TRAILING_COLOR = /\s+(red|orange|yellow|green|blue|purple|teal|cyan|gray|black|white)\s*$/;
+  const splitTrailingColor = (s) => {
+    const m = s.match(TL_TRAILING_COLOR);
+    return m ? { label: s.slice(0, m.index).trim(), color: m[1].toLowerCase() } : { label: s.trim(), color: null };
+  };
+  const tlLeadingDate = (s) => {
+    const res = parseDateToken(s, { dateOrder: tlDateOrder });
+    if (!res || res.consumed === 0 || res.token.invalidTime) return null;
+    const iso = tlResolveYear(res.token);
+    return iso == null ? null : { iso, rest: s.slice(res.consumed) };
+  };
+  const tlLeadingRange = (s) => {
+    const a = tlLeadingDate(s);
+    if (!a) return null;
+    const arrow = a.rest.match(/^\s*(?:->|–>)\s*/);
+    if (!arrow) return null;
+    const b = tlLeadingDate(a.rest.slice(arrow[0].length));
+    if (!b) return null;
+    return { start: a.iso, end: b.iso, rest: b.rest };
+  };
   const freeformLines = [];
   let currentArcGroup = null;
   let currentTimelineGroup = null;
@@ -253,6 +320,9 @@ function parseVisualizationFull(content, palette) {
       }
     }
     if (result.type === "timeline" && indent === 0) {
+      if (isTlDateDirective(line.toLowerCase())) {
+        continue;
+      }
       const tagBlockMatch = matchTagBlockHeading(line);
       if (tagBlockMatch) {
         const newGroup = {
@@ -449,18 +519,15 @@ function parseVisualizationFull(content, palette) {
         inTimelineEraBlock = false;
       } else {
         if (line.startsWith("//")) continue;
-        const eraEntryMatch = line.match(
-          /^(\d{4}(?:-\d{2})?(?:-\d{2}(?: \d{2}:\d{2})?)?)\s*(?:->|\u2013>)\s*(\d{4}(?:-\d{2})?(?:-\d{2}(?: \d{2}:\d{2})?)?)\s+(.+?)(?:\s+(red|orange|yellow|green|blue|purple|teal|cyan|gray|black|white))?\s*$/
-        );
-        if (eraEntryMatch) {
-          const colorAnnotation = eraEntryMatch[4]?.trim() || null;
+        const eraRange = tlLeadingRange(line);
+        const eraParsed = eraRange && splitTrailingColor(eraRange.rest);
+        if (eraRange && eraParsed && eraParsed.label) {
           result.timelineEras.push({
-            // Capture groups 1-3 guaranteed by the regex match.
-            startDate: eraEntryMatch[1],
-            endDate: eraEntryMatch[2],
-            label: eraEntryMatch[3].trim(),
-            color: colorAnnotation ? resolveColorWithDiagnostic(
-              colorAnnotation,
+            startDate: eraRange.start,
+            endDate: eraRange.end,
+            label: eraParsed.label,
+            color: eraParsed.color ? resolveColorWithDiagnostic(
+              eraParsed.color,
               lineNumber,
               result.diagnostics,
               palette
@@ -481,17 +548,14 @@ function parseVisualizationFull(content, palette) {
         inTimelineMarkerBlock = false;
       } else {
         if (line.startsWith("//")) continue;
-        const markerEntryMatch = line.match(
-          /^(\d{4}(?:-\d{2})?(?:-\d{2}(?: \d{2}:\d{2})?)?)\s+(.+?)(?:\s+(red|orange|yellow|green|blue|purple|teal|cyan|gray|black|white))?\s*$/
-        );
-        if (markerEntryMatch) {
-          const colorAnnotation = markerEntryMatch[3]?.trim() || null;
+        const markerLd = tlLeadingDate(line);
+        const markerParsed = markerLd && splitTrailingColor(markerLd.rest);
+        if (markerLd && markerParsed && markerParsed.label) {
           result.timelineMarkers.push({
-            // Capture groups 1-2 guaranteed by the regex match.
-            date: markerEntryMatch[1],
-            label: markerEntryMatch[2].trim(),
-            color: colorAnnotation ? resolveColorWithDiagnostic(
-              colorAnnotation,
+            date: markerLd.iso,
+            label: markerParsed.label,
+            color: markerParsed.color ? resolveColorWithDiagnostic(
+              markerParsed.color,
               lineNumber,
               result.diagnostics,
               palette
@@ -518,18 +582,16 @@ function parseVisualizationFull(content, palette) {
         timelineMarkerBlockIndent = indent;
         continue;
       }
-      const eraMatch = line.match(
-        /^era\s+(\d{4}(?:-\d{2})?(?:-\d{2}(?: \d{2}:\d{2})?)?)\s*(?:->|\u2013>)\s*(\d{4}(?:-\d{2})?(?:-\d{2}(?: \d{2}:\d{2})?)?)\s+(.+?)(?:\s+(red|orange|yellow|green|blue|purple|teal|cyan|gray|black|white))?\s*$/
-      );
-      if (eraMatch) {
-        const colorAnnotation = eraMatch[4]?.trim() || null;
+      const eraInline = line.match(/^era\s+(.+)$/i);
+      const eraInlineRange = eraInline && tlLeadingRange(eraInline[1]);
+      const eraInlineParsed = eraInlineRange && splitTrailingColor(eraInlineRange.rest);
+      if (eraInlineRange && eraInlineParsed && eraInlineParsed.label) {
         result.timelineEras.push({
-          // Capture groups 1-3 guaranteed by the regex match.
-          startDate: eraMatch[1],
-          endDate: eraMatch[2],
-          label: eraMatch[3].trim(),
-          color: colorAnnotation ? resolveColorWithDiagnostic(
-            colorAnnotation,
+          startDate: eraInlineRange.start,
+          endDate: eraInlineRange.end,
+          label: eraInlineParsed.label,
+          color: eraInlineParsed.color ? resolveColorWithDiagnostic(
+            eraInlineParsed.color,
             lineNumber,
             result.diagnostics,
             palette
@@ -538,17 +600,15 @@ function parseVisualizationFull(content, palette) {
         });
         continue;
       }
-      const markerMatch = line.match(
-        /^marker\s+(\d{4}(?:-\d{2})?(?:-\d{2}(?: \d{2}:\d{2})?)?)\s+(.+?)(?:\s+(red|orange|yellow|green|blue|purple|teal|cyan|gray|black|white))?\s*$/
-      );
-      if (markerMatch) {
-        const colorAnnotation = markerMatch[3]?.trim() || null;
+      const markerInline = line.match(/^marker\s+(.+)$/i);
+      const markerInlineLd = markerInline && tlLeadingDate(markerInline[1]);
+      const markerInlineParsed = markerInlineLd && splitTrailingColor(markerInlineLd.rest);
+      if (markerInlineLd && markerInlineParsed && markerInlineParsed.label) {
         result.timelineMarkers.push({
-          // Capture groups 1-2 guaranteed by the regex match.
-          date: markerMatch[1],
-          label: markerMatch[2].trim(),
-          color: colorAnnotation ? resolveColorWithDiagnostic(
-            colorAnnotation,
+          date: markerInlineLd.iso,
+          label: markerInlineParsed.label,
+          color: markerInlineParsed.color ? resolveColorWithDiagnostic(
+            markerInlineParsed.color,
             lineNumber,
             result.diagnostics,
             palette
@@ -604,7 +664,8 @@ function parseVisualizationFull(content, palette) {
         currentTimelineGroup,
         currentTimelineGroupMeta,
         timelineAliasMap,
-        tlRegistry
+        tlRegistry,
+        tlDateCtx
       );
       if (eventResult) {
         result.diagnostics.push(...eventResult.diagnostics);
@@ -2162,4 +2223,4 @@ export {
   knownChartTypeIds,
   parseDgmo
 };
-//# sourceMappingURL=chunk-KQ57MHRO.js.map
+//# sourceMappingURL=chunk-KJGG2JKQ.js.map

package/dist/{chunk-OTAL43EH.js → chunk-LV4BETUU.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.
@@ -675,4 +681,4 @@ export {
   splitNameAndMeta,
   warnUnknownMetaKeys
 };
-//# sourceMappingURL=chunk-OTAL43EH.js.map
+//# sourceMappingURL=chunk-LV4BETUU.js.map

package/dist/{chunk-VUJGMJE6.js → chunk-MVN25IF6.js}

@@ -2,7 +2,7 @@ import {
   INFRA_BEHAVIOR_KEY_SET,
   INFRA_EDGE_ONLY_KEY_SET,
   INFRA_TOP_LEVEL_OPTION_SET
-} from "./chunk-U2HGPLZS.js";
+} from "./chunk-6H7O2OPM.js";
 import {
   tryStripDescriptionKeyword
 } from "./chunk-IYULMRBE.js";
@@ -11,7 +11,7 @@ import {
   stripDefaultModifier,
   tagAttrKey,
   validateTagGroupNames
-} from "./chunk-FJUNPCYI.js";
+} from "./chunk-467TVMQL.js";
 import {
   GRAPH_DX
 } from "./chunk-I46X5VUA.js";
@@ -30,7 +30,7 @@ import {
   tryParseSharedOption,
   warnUnknownMetaKeys,
   withTagAliases
-} from "./chunk-OTAL43EH.js";
+} from "./chunk-LV4BETUU.js";
 import {
   isRecognizedColorName
 } from "./chunk-TLVIHFRO.js";
@@ -890,4 +890,4 @@ export {
   parseInfra,
   extractSymbols
 };
-//# sourceMappingURL=chunk-VUJGMJE6.js.map
+//# sourceMappingURL=chunk-MVN25IF6.js.map

package/dist/{chunk-CLD2OKV7.js → chunk-MX2EY5Y7.js}

@@ -1,6 +1,6 @@
 import {
   acyclicOrient
-} from "./chunk-C4GQDB5L.js";
+} from "./chunk-WRNFDFPU.js";
 
 // src/swimlane/layout.ts
 var MARGIN = 30;
@@ -419,4 +419,4 @@ function layoutSwimlane(parsed) {
 export {
   layoutSwimlane
 };
-//# sourceMappingURL=chunk-CLD2OKV7.js.map
+//# sourceMappingURL=chunk-MX2EY5Y7.js.map

package/dist/{chunk-T5SHNNGP.js → chunk-ND76YJCN.js}

@@ -8,14 +8,17 @@ import {
 import {
   DAY_MS,
   applyOrdinalTemplate,
+  dayStart,
   formatCompound,
   formatCount,
   formatDateShort,
   formatFooter,
   formatHuman,
   formatWordsDetail,
-  ordinalFor
-} from "./chunk-YNRDWYZP.js";
+  ordinalFor,
+  sameDay,
+  splitClockSeconds
+} from "./chunk-OQKP2X3D.js";
 import {
   FONT_FAMILY
 } from "./chunk-6KFWC4CO.js";
@@ -33,23 +36,24 @@ import * as d3Selection from "d3-selection";
 function bakedHero(parsed, now) {
   const resolved = parsed.resolvedMs;
   if (resolved === null) return "\u2014";
+  const tz = parsed.tz;
   const remaining = resolved - now;
   if (!parsed.rule && remaining <= 0) {
     if (parsed.expired !== null) return parsed.expired;
     const elapsed = -remaining;
     if (elapsed <= 0) return "Now!";
     if (parsed.units === "compound" || parsed.units === "human")
-      return `${formatCompound(resolved, now)} ago`;
+      return `${formatCompound(resolved, now, 2, tz)} ago`;
     const bu = parsed.units === "full" || parsed.units === "clock" ? "days" : parsed.units;
     return `${formatCount(elapsed, { units: bu, round: parsed.round, fields: parsed.fields })} ago`;
   }
-  if (parsed.rule && sameLocalDay(resolved, now))
+  if (parsed.rule && sameDay(resolved, now, tz))
     return parsed.onDay ?? "Today!";
   if (parsed.units === "human") {
-    const [hn, ht] = parsed.hasTime ? [now, resolved] : [DAY_START(now), DAY_START(resolved)];
-    return formatHuman(hn, ht).big;
+    const [hn, ht] = parsed.hasTime ? [now, resolved] : [dayStart(now, tz), dayStart(resolved, tz)];
+    return formatHuman(hn, ht, tz).big;
   }
-  if (parsed.units === "compound") return formatCompound(now, resolved);
+  if (parsed.units === "compound") return formatCompound(now, resolved, 2, tz);
   const bakeUnits = parsed.units === "full" || parsed.units === "clock" ? "days" : parsed.units;
   return formatCount(Math.max(0, remaining), {
     units: bakeUnits,
@@ -57,11 +61,6 @@ function bakedHero(parsed, now) {
     fields: parsed.fields
   });
 }
-function sameLocalDay(a, b) {
-  const x = new Date(a);
-  const y = new Date(b);
-  return x.getFullYear() === y.getFullYear() && x.getMonth() === y.getMonth() && x.getDate() === y.getDate();
-}
 function stampRecur(sel, parsed) {
   const r = parsed.rule;
   if (!r) return;
@@ -78,6 +77,7 @@ function stampRecur(sel, parsed) {
   if (r.intervalUnit !== void 0)
     sel.attr("data-dgmo-recur-interval-unit", r.intervalUnit);
   if (r.anchorMs !== void 0) sel.attr("data-dgmo-recur-anchor", r.anchorMs);
+  if (r.tz !== void 0) sel.attr("data-dgmo-recur-tz", r.tz);
 }
 var MON_ABBR = [
   "Jan",
@@ -150,7 +150,7 @@ function aLine(svg, x1, y1, x2, y2, stroke, sw, opacity) {
   const l = svg.append("line").attr("x1", x1).attr("y1", y1).attr("x2", x2).attr("y2", y2).attr("stroke", stroke).attr("stroke-width", sw);
   if (opacity != null) l.attr("opacity", opacity);
 }
-var REPEAT_ICON_PATH = "m17 2 4 4-4 4 M3 11v-1a4 4 0 0 1 4-4h14 m7 22-4-4 4-4 M21 13v1a4 4 0 0 1-4 4H3";
+var REPEAT_ICON_PATH = "m17 2 4 4-4 4 M3 11v-1a4 4 0 0 1 4-4h14 M7 22l-4-4 4-4 M21 13v1a4 4 0 0 1-4 4H3";
 function recurGlyph(svg, cx, cy, r, color) {
   const side = r * 2.4;
   const scale = side / 24;
@@ -162,7 +162,7 @@ function recurGlyph(svg, cx, cy, r, color) {
 }
 function haloRect(svg, x, y, w, h, rx, C) {
   aRect(svg, x - 1, y - 1, w + 2, h + 2, rx + 1, "none", C.bg, 2);
-  aRect(svg, x - 3, y - 3, w + 6, h + 6, rx + 3, "none", C.event, 2);
+  svg.append("rect").attr("class", "dgmo-countdown-target-ring").attr("x", x - 3).attr("y", y - 3).attr("width", w + 6).attr("height", h + 6).attr("rx", rx + 3).attr("fill", "none").attr("stroke", C.event).attr("stroke-width", 2);
 }
 function pickBand(nowMs, resolvedMs, hasTime) {
   const days = dayDelta(nowMs, resolvedMs);
@@ -826,6 +826,13 @@ function vizClock(svg, g, nowMs, targetMs, C) {
 function pad2(n) {
   return n < 10 ? "0" + n : String(n);
 }
+function paintClock(sel, str, secSize, secFill) {
+  const { lead, sec } = splitClockSeconds(str);
+  sel.attr("font-variant-numeric", "tabular-nums").attr("data-dgmo-cd-clock", "").attr("data-dgmo-cd-sec-size", secSize).attr("data-dgmo-cd-sec-fill", secFill).text(null);
+  sel.append("tspan").attr("data-cd-lead", "").text(lead);
+  if (sec !== null)
+    sel.append("tspan").attr("data-cd-sec", "").attr("font-size", secSize).attr("fill", secFill).attr("font-weight", 700).text(sec);
+}
 function drawBand(svg, kind, g, nowMs, resolvedMs, C) {
   switch (kind) {
     case "years":
@@ -874,6 +881,18 @@ function renderCountdown(container, parsed, palette, isDark, exportDims) {
   const banked = resolveColor("green", palette) ?? muted;
   const faint = mix(palette.text, themeBaseBg(palette, isDark), 72);
   const svg = d3Selection.select(container).append("svg").attr("width", width).attr("preserveAspectRatio", "xMidYMid meet").attr("xmlns", "http://www.w3.org/2000/svg").attr("role", "img").attr("aria-label", `${parsed.title ?? "Countdown"}: ${hero}`).style("font-family", FONT_FAMILY);
+  svg.append("style").text(`
+    @keyframes dgmo-countdown-flash {
+      0%, 100% { opacity: 1; stroke-width: 2; }
+      50% { opacity: 0.45; stroke-width: 3; }
+    }
+    .dgmo-countdown-target-ring {
+      animation: dgmo-countdown-flash 1.8s ease-in-out infinite;
+    }
+    @media (prefers-reduced-motion: reduce) {
+      .dgmo-countdown-target-ring { animation: none; }
+    }
+  `);
   const bgRect = svg.append("rect").attr("width", width).attr("fill", palette.bg);
   const estWidth = (t, fs) => t.length * fs * 0.58;
   const fitFont = (t, base, maxW, min) => {
@@ -893,10 +912,12 @@ function renderCountdown(container, parsed, palette, isDark, exportDims) {
     fields: parsed.fields
   }) : hero;
   const heroMaxW = contentW * 0.44;
-  const heroFont = fitFont(heroSizeStr, 96, heroMaxW, 26);
-  const heroW = Math.min(heroMaxW, estWidth(heroSizeStr, heroFont));
+  const sizeStr = estWidth(hero, 1) > estWidth(heroSizeStr, 1) ? hero : heroSizeStr;
   const gapMid = Math.max(28, Math.round(width * 0.03));
-  const leftW = Math.max(contentW * 0.42, contentW - heroW - gapMid);
+  const stacked = estWidth(sizeStr, 26) > heroMaxW;
+  const heroFont = fitFont(sizeStr, 96, stacked ? contentW : heroMaxW, 26);
+  const heroW = stacked ? contentW : Math.min(heroMaxW, estWidth(sizeStr, heroFont));
+  const leftW = stacked ? contentW : Math.max(contentW * 0.42, contentW - heroW - gapMid);
   const titleBase = 40;
   let titleFont = 0;
   let titleLines = [];
@@ -908,7 +929,7 @@ function renderCountdown(container, parsed, palette, isDark, exportDims) {
   }
   const eyebrowText = ordinal !== null ? applyOrdinalTemplate(parsed.sinceLabel ?? `Nth ${label}`, ordinal) : null;
   const eyebrowFont = 16;
-  const footerText = resolved !== null ? formatFooter(resolved, parsed.hasTime) : null;
+  const footerText = resolved !== null ? formatFooter(resolved, parsed.hasTime, parsed.tz) : null;
   const footerFont = 17;
   const noteFont = 19;
   const asofFont = 13;
@@ -926,7 +947,7 @@ function renderCountdown(container, parsed, palette, isDark, exportDims) {
     });
     y += Math.round(titleFont * 0.45);
     const heroLeft = width - padX - heroW;
-    const ruleRight = Math.max(leftX + 40, heroLeft - 20);
+    const ruleRight = stacked ? width - padX : Math.max(leftX + 40, heroLeft - 20);
     svg.append("line").attr("x1", leftX).attr("x2", ruleRight).attr("y1", y).attr("y2", y).attr("stroke", mix(palette.text, palette.bg, 14)).attr("stroke-width", 1.25);
     y += Math.round(titleFont * 0.5);
   }
@@ -974,8 +995,12 @@ function renderCountdown(container, parsed, palette, isDark, exportDims) {
     units: "clock",
     round: parsed.round,
     fields: parsed.fields
-  }) : formatHuman(DAY_START(now), DAY_START(resolved)).sub || null : null;
-  const heroCapTop = padY + 0.28 * titleFont;
+  }) : formatHuman(
+    dayStart(now, parsed.tz),
+    dayStart(resolved, parsed.tz),
+    parsed.tz
+  ).sub || null : null;
+  const heroCapTop = stacked ? leftBottom + Math.round(heroFont * 0.2) : padY + 0.28 * titleFont;
   const heroBaseline = heroCapTop + 0.72 * heroFont;
   const heroBlockBottom = heroBaseline + (subText ? heroFont * 0.28 + detailFont : 0);
   const contentBottom = Math.max(leftBottom, heroBlockBottom);
@@ -990,6 +1015,7 @@ function renderCountdown(container, parsed, palette, isDark, exportDims) {
   );
   svg.attr("height", bannerH).attr("viewBox", `0 0 ${width} ${bannerH}`);
   bgRect.attr("height", bannerH);
+  const bandC = bandColors(palette, accent, muted, faint);
   if (hasBand && resolved !== null) {
     drawBand(
       svg,
@@ -997,10 +1023,11 @@ function renderCountdown(container, parsed, palette, isDark, exportDims) {
       { left: leftX, top: bandTop, contentW: width - 2 * padX, height: BAND_H },
       now,
       resolved,
-      bandColors(palette, accent, muted, faint)
+      bandC
     );
   }
-  const value = svg.append("text").attr("class", "countdown-value").attr("x", width - padX).attr("y", heroBaseline).attr("text-anchor", "end").attr("dominant-baseline", "alphabetic").attr("fill", accent).attr("font-family", FONT_FAMILY).attr("font-size", heroFont).attr("font-weight", 800).attr("data-dgmo-countdown-units", parsed.units).attr("data-dgmo-countdown-round", parsed.round).attr("data-dgmo-countdown-fields", parsed.fields.join(",")).attr("data-dgmo-countdown-expired", parsed.expired).attr("aria-label", `${parsed.title ?? "Countdown"}: ${hero}`).text(hero);
+  const value = svg.append("text").attr("class", "countdown-value").attr("x", stacked ? leftX : width - padX).attr("y", heroBaseline).attr("text-anchor", stacked ? "start" : "end").attr("dominant-baseline", "alphabetic").attr("fill", accent).attr("font-family", FONT_FAMILY).attr("font-size", heroFont).attr("font-weight", 800).attr("data-dgmo-countdown-units", parsed.units).attr("data-dgmo-countdown-round", parsed.round).attr("data-dgmo-countdown-fields", parsed.fields.join(",")).attr("data-dgmo-countdown-expired", parsed.expired).attr("aria-label", `${parsed.title ?? "Countdown"}: ${hero}`);
+  paintClock(value, hero, Math.round(heroFont * 0.55), bandC.now);
   if (parsed.rule && resolved !== null) {
     value.attr("data-dgmo-countdown", new Date(resolved).toISOString());
   } else if (parsed.target) {
@@ -1009,6 +1036,7 @@ function renderCountdown(container, parsed, palette, isDark, exportDims) {
   if (parsed.title) value.attr("data-dgmo-countdown-title", parsed.title);
   if (parsed.onDay) value.attr("data-dgmo-countdown-onday", parsed.onDay);
   if (parsed.hasTime) value.attr("data-dgmo-countdown-hastime", "1");
+  if (parsed.tz) value.attr("data-dgmo-countdown-tz", parsed.tz);
   if (parsed.since !== null) {
     value.attr("data-dgmo-countdown-since", parsed.since);
     value.attr(
@@ -1018,7 +1046,13 @@ function renderCountdown(container, parsed, palette, isDark, exportDims) {
   }
   stampRecur(value, parsed);
   if (subText) {
-    svg.append("text").attr("x", width - padX).attr("y", heroBaseline + heroFont * 0.28 + detailFont).attr("text-anchor", "end").attr("dominant-baseline", "alphabetic").attr("fill", muted).attr("font-family", FONT_FAMILY).attr("font-size", detailFont).attr("font-weight", 500).attr("data-dgmo-countdown-detail", "").text(subText);
+    const detailSel = svg.append("text").attr("x", stacked ? leftX : width - padX).attr("y", heroBaseline + heroFont * 0.28 + detailFont).attr("text-anchor", stacked ? "start" : "end").attr("dominant-baseline", "alphabetic").attr("fill", muted).attr("font-family", FONT_FAMILY).attr("font-size", detailFont).attr("font-weight", 500).attr("data-dgmo-countdown-detail", "");
+    paintClock(
+      detailSel,
+      subText,
+      Math.round(detailFont * 0.66),
+      bandC.now
+    );
   }
 }
 function renderCountdownForExport(container, parsed, palette, isDark, exportDims) {
@@ -1029,4 +1063,4 @@ export {
   renderCountdown,
   renderCountdownForExport
 };
-//# sourceMappingURL=chunk-T5SHNNGP.js.map
+//# sourceMappingURL=chunk-ND76YJCN.js.map