@diagrammo/dgmo 0.49.0 → 0.50.1

package/dist/{renderer-W5RMOURB.js → renderer-PSMMZCKH.js}

@@ -1,16 +1,16 @@
 import {
   renderBody,
   renderBodyForExport
-} from "./chunk-5XCM7UUW.js";
-import "./chunk-3NFJWFNP.js";
-import "./chunk-4UDKKGHH.js";
+} from "./chunk-J6K7RP6P.js";
+import "./chunk-HEVYAHLW.js";
+import "./chunk-BDXC7MDK.js";
 import "./chunk-7UEMZREK.js";
 import "./chunk-6KFWC4CO.js";
 import "./chunk-HQCHYB5F.js";
 import "./chunk-5LWQH6QV.js";
 import "./chunk-P6T66CCZ.js";
-import "./chunk-HBVD67XG.js";
-import "./chunk-ZNQX6QWH.js";
+import "./chunk-FJUNPCYI.js";
+import "./chunk-OTAL43EH.js";
 import "./chunk-TLVIHFRO.js";
 import "./chunk-CXK4DZH3.js";
 import "./chunk-5WRI5ZAA.js";
@@ -18,4 +18,4 @@ export {
   renderBody,
   renderBodyForExport
 };
-//# sourceMappingURL=renderer-W5RMOURB.js.map
+//# sourceMappingURL=renderer-PSMMZCKH.js.map

package/dist/{renderer-UZF3JROD.js → renderer-QAOBLRXV.js}

@@ -1,23 +1,23 @@
 import {
   renderMindmap,
   renderMindmapForExport
-} from "./chunk-N4J5KGWG.js";
-import "./chunk-YTN572Q2.js";
-import "./chunk-JTSMEYIZ.js";
+} from "./chunk-4MJ7M6YL.js";
+import "./chunk-7TV5Y53Y.js";
 import "./chunk-3HDBAXF5.js";
+import "./chunk-JTSMEYIZ.js";
 import "./chunk-3CIOJ5YJ.js";
 import "./chunk-YYVTBZZC.js";
-import "./chunk-4UDKKGHH.js";
+import "./chunk-HEVYAHLW.js";
 import "./chunk-7UEMZREK.js";
 import "./chunk-A4GOY3PE.js";
 import "./chunk-6KFWC4CO.js";
 import "./chunk-HQCHYB5F.js";
 import "./chunk-5LWQH6QV.js";
-import "./chunk-65RTDUZH.js";
+import "./chunk-SXRTRMEE.js";
 import "./chunk-IYULMRBE.js";
 import "./chunk-P6T66CCZ.js";
-import "./chunk-HBVD67XG.js";
-import "./chunk-ZNQX6QWH.js";
+import "./chunk-FJUNPCYI.js";
+import "./chunk-OTAL43EH.js";
 import "./chunk-TLVIHFRO.js";
 import "./chunk-CXK4DZH3.js";
 import "./chunk-5WRI5ZAA.js";
@@ -25,4 +25,4 @@ export {
   renderMindmap,
   renderMindmapForExport
 };
-//# sourceMappingURL=renderer-UZF3JROD.js.map
+//# sourceMappingURL=renderer-QAOBLRXV.js.map

package/dist/{renderer-ROV756WT.js → renderer-R2WNIC2C.js}

@@ -1,17 +1,17 @@
 import {
   renderTechRadar,
   renderTechRadarForExport
-} from "./chunk-3BIAFYD2.js";
+} from "./chunk-T4VOVZT5.js";
 import "./chunk-3HDBAXF5.js";
 import "./chunk-YYVTBZZC.js";
-import "./chunk-4UDKKGHH.js";
+import "./chunk-HEVYAHLW.js";
 import "./chunk-7UEMZREK.js";
 import "./chunk-6KFWC4CO.js";
 import "./chunk-HQCHYB5F.js";
 import "./chunk-5LWQH6QV.js";
 import "./chunk-P6T66CCZ.js";
-import "./chunk-HBVD67XG.js";
-import "./chunk-ZNQX6QWH.js";
+import "./chunk-FJUNPCYI.js";
+import "./chunk-OTAL43EH.js";
 import "./chunk-TLVIHFRO.js";
 import "./chunk-CXK4DZH3.js";
 import "./chunk-5WRI5ZAA.js";
@@ -19,4 +19,4 @@ export {
   renderTechRadar,
   renderTechRadarForExport
 };
-//# sourceMappingURL=renderer-ROV756WT.js.map
+//# sourceMappingURL=renderer-R2WNIC2C.js.map

package/dist/{renderer-VICQ4WNY.js → renderer-SBS3YWU5.js}

@@ -1,19 +1,19 @@
 import {
   renderCycle,
   renderCycleForExport
-} from "./chunk-AJ2PEY7J.js";
+} from "./chunk-JJUOHGX2.js";
 import "./chunk-3HDBAXF5.js";
 import "./chunk-BMR4CIEO.js";
 import "./chunk-YYVTBZZC.js";
-import "./chunk-4UDKKGHH.js";
+import "./chunk-HEVYAHLW.js";
 import "./chunk-7UEMZREK.js";
 import "./chunk-A4GOY3PE.js";
 import "./chunk-6KFWC4CO.js";
 import "./chunk-HQCHYB5F.js";
 import "./chunk-5LWQH6QV.js";
 import "./chunk-P6T66CCZ.js";
-import "./chunk-HBVD67XG.js";
-import "./chunk-ZNQX6QWH.js";
+import "./chunk-FJUNPCYI.js";
+import "./chunk-OTAL43EH.js";
 import "./chunk-TLVIHFRO.js";
 import "./chunk-CXK4DZH3.js";
 import "./chunk-5WRI5ZAA.js";
@@ -21,4 +21,4 @@ export {
   renderCycle,
   renderCycleForExport
 };
-//# sourceMappingURL=renderer-VICQ4WNY.js.map
+//# sourceMappingURL=renderer-SBS3YWU5.js.map

package/dist/{renderer-6L3NBEY5.js → renderer-UYMQQCJK.js}

@@ -1,19 +1,19 @@
 import {
   renderMap,
   renderMapForExport
-} from "./chunk-T7IKPCMI.js";
-import "./chunk-YM2BSPYW.js";
+} from "./chunk-3LH5CLP4.js";
+import "./chunk-LE4MYMLI.js";
 import "./chunk-I5IGB56C.js";
+import "./chunk-HEVYAHLW.js";
 import "./chunk-HGN652MU.js";
-import "./chunk-4UDKKGHH.js";
 import "./chunk-7UEMZREK.js";
 import "./chunk-A4GOY3PE.js";
 import "./chunk-6KFWC4CO.js";
 import "./chunk-HQCHYB5F.js";
 import "./chunk-5LWQH6QV.js";
 import "./chunk-P6T66CCZ.js";
-import "./chunk-HBVD67XG.js";
-import "./chunk-ZNQX6QWH.js";
+import "./chunk-FJUNPCYI.js";
+import "./chunk-OTAL43EH.js";
 import "./chunk-TLVIHFRO.js";
 import "./chunk-CXK4DZH3.js";
 import "./chunk-5WRI5ZAA.js";
@@ -21,4 +21,4 @@ export {
   renderMap,
   renderMapForExport
 };
-//# sourceMappingURL=renderer-6L3NBEY5.js.map
+//# sourceMappingURL=renderer-UYMQQCJK.js.map

package/dist/{renderer-radial-MHO2VDXN.js → renderer-radial-F7X5F2VU.js}

@@ -1,16 +1,16 @@
 import {
   renderTreemapRadial,
   renderTreemapRadialForExport
-} from "./chunk-XKTN7CZF.js";
-import "./chunk-UVCXZEGU.js";
-import "./chunk-4UDKKGHH.js";
+} from "./chunk-MCZ5LBZD.js";
+import "./chunk-PFHVU7UA.js";
+import "./chunk-HEVYAHLW.js";
 import "./chunk-7UEMZREK.js";
 import "./chunk-6KFWC4CO.js";
 import "./chunk-HQCHYB5F.js";
 import "./chunk-5LWQH6QV.js";
 import "./chunk-P6T66CCZ.js";
-import "./chunk-HBVD67XG.js";
-import "./chunk-ZNQX6QWH.js";
+import "./chunk-FJUNPCYI.js";
+import "./chunk-OTAL43EH.js";
 import "./chunk-TLVIHFRO.js";
 import "./chunk-CXK4DZH3.js";
 import "./chunk-5WRI5ZAA.js";
@@ -18,4 +18,4 @@ export {
   renderTreemapRadial,
   renderTreemapRadialForExport
 };
-//# sourceMappingURL=renderer-radial-MHO2VDXN.js.map
+//# sourceMappingURL=renderer-radial-F7X5F2VU.js.map

package/dist/{state-parser-RX3GXOIB.js → state-parser-3REXRK3R.js}

@@ -1,13 +1,13 @@
 import {
   looksLikeState,
   parseState
-} from "./chunk-5FGDJIJX.js";
+} from "./chunk-2C56LEML.js";
 import "./chunk-NXMESY4J.js";
-import "./chunk-K6HNAY5V.js";
+import "./chunk-SCHXJTZL.js";
 import "./chunk-FMDSF3OV.js";
 import "./chunk-FFUN5D66.js";
 import "./chunk-NOTA6TEI.js";
-import "./chunk-ZNQX6QWH.js";
+import "./chunk-OTAL43EH.js";
 import "./chunk-TLVIHFRO.js";
 import "./chunk-CXK4DZH3.js";
 import "./chunk-5WRI5ZAA.js";
@@ -15,4 +15,4 @@ export {
   looksLikeState,
   parseState
 };
-//# sourceMappingURL=state-parser-RX3GXOIB.js.map
+//# sourceMappingURL=state-parser-3REXRK3R.js.map

package/dist/{state-renderer-AJUKGNWU.js → state-renderer-XYLNRWXR.js}

@@ -1,7 +1,7 @@
 import {
   renderState,
   renderStateForExport
-} from "./chunk-BGJV5ATD.js";
+} from "./chunk-ONA5KPV3.js";
 import "./chunk-PDKUANDZ.js";
 import "./chunk-SCQ5VPUF.js";
 import "./chunk-LP7EC4MI.js";
@@ -10,20 +10,20 @@ import "./chunk-6EK55ART.js";
 import "./chunk-BCYVE3N5.js";
 import "./chunk-5DH3KYFH.js";
 import "./chunk-3HDBAXF5.js";
-import "./chunk-3CIOJ5YJ.js";
 import "./chunk-BMR4CIEO.js";
+import "./chunk-3CIOJ5YJ.js";
 import "./chunk-YYVTBZZC.js";
 import "./chunk-A4GOY3PE.js";
 import "./chunk-6KFWC4CO.js";
 import "./chunk-5LWQH6QV.js";
 import "./chunk-P6T66CCZ.js";
-import "./chunk-5FGDJIJX.js";
+import "./chunk-2C56LEML.js";
 import "./chunk-NXMESY4J.js";
-import "./chunk-K6HNAY5V.js";
+import "./chunk-SCHXJTZL.js";
 import "./chunk-FMDSF3OV.js";
 import "./chunk-FFUN5D66.js";
 import "./chunk-NOTA6TEI.js";
-import "./chunk-ZNQX6QWH.js";
+import "./chunk-OTAL43EH.js";
 import "./chunk-TLVIHFRO.js";
 import "./chunk-CXK4DZH3.js";
 import "./chunk-5WRI5ZAA.js";
@@ -31,4 +31,4 @@ export {
   renderState,
   renderStateForExport
 };
-//# sourceMappingURL=state-renderer-AJUKGNWU.js.map
+//# sourceMappingURL=state-renderer-XYLNRWXR.js.map

package/docs/ai-integration.md

@@ -61,7 +61,7 @@ To teach Claude about DGMO in a specific project without the global skill, paste
 <!-- DGMO-AI-CORE:START -->
 ## DGMO AI Core
 
-_Generated from `language-reference.md` — the anti-patterns and 46-type index below are identical across every DGMO AI surface._
+_Generated from `language-reference.md` — the anti-patterns and 50-type index below are identical across every DGMO AI surface._
 
 ### Disambiguation — where DGMO diverges from LLM priors
 
@@ -131,6 +131,7 @@ Valid markup is the floor, not the goal. A good diagram reads at a glance. Apply
 | `mindmap` | radial hierarchy of ideas from a central topic |
 | `org` | reporting hierarchy |
 | `family` | family tree / genealogy: unions (couples), children, remarriage, adoption, GEDCOM-style metadata |
+| `bracket` | single-elimination tournament bracket: winners auto-advance; seed the field for a day-0 skeleton or list results casually; two sides mirror to a championship |
 | `kanban` | task-board columns |
 | `gantt` | project scheduling with task dependencies and milestones |
 | `pert` | project network with three-point estimates and critical path |
@@ -149,6 +150,9 @@ Valid markup is the floor, not the goal. A good diagram reads at a glance. Apply
 | `treemap` | nested rectangles sized by value (budgets, disk usage, portfolios) |
 | `block` | author-controlled grid of nested, collapsible blocks (system / architecture layouts) |
 | `sketch` | GUI-first free-placement canvas: uniform shapes on a snap grid, arrows, tags (markup is app-generated) |
+| `goal` | single progress-toward-a-target value (`now` vs `target`) as a progress bar, thermometer, or gauge — KPIs, fundraising, quotas |
+| `countdown` | live "N days until X" that ticks every second and is accurate on every load — trip dates, launches, deadlines; the only dynamic chart type |
+| `clock` | live world-clock board: current time for people/places across time zones, ticking every second, with optional working-hours status and sundown line |
 | `map` | geographic concept map: regions, points, routes |
 | `wireframe` | low-fidelity UI layout with panels and controls |
 | `bar` | categorical comparisons (multi-series via `stack` / `group`) |
@@ -172,7 +176,7 @@ Valid markup is the floor, not the goal. A good diagram reads at a glance. Apply
 
 ### Common examples (curated, parse-clean)
 
-_The most common types, inline so you can generate them without a fetch. For the other 38, get the per-type section (see below)._
+_The most common types, inline so you can generate them without a fetch. For the other 42, get the per-type section (see below)._
 
 #### journey-map
 

package/docs/language-reference.md

@@ -117,6 +117,7 @@ Valid markup is the floor, not the goal. A good diagram reads at a glance. Apply
 | `mindmap` | radial hierarchy of ideas from a central topic |
 | `org` | reporting hierarchy |
 | `family` | family tree / genealogy: unions (couples), children, remarriage, adoption, GEDCOM-style metadata |
+| `bracket` | single-elimination tournament bracket: winners auto-advance; seed the field for a day-0 skeleton or list results casually; two sides mirror to a championship |
 | `kanban` | task-board columns |
 | `gantt` | project scheduling with task dependencies and milestones |
 | `pert` | project network with three-point estimates and critical path |
@@ -135,6 +136,9 @@ Valid markup is the floor, not the goal. A good diagram reads at a glance. Apply
 | `treemap` | nested rectangles sized by value (budgets, disk usage, portfolios) |
 | `block` | author-controlled grid of nested, collapsible blocks (system / architecture layouts) |
 | `sketch` | GUI-first free-placement canvas: uniform shapes on a snap grid, arrows, tags (markup is app-generated) |
+| `goal` | single progress-toward-a-target value (`now` vs `target`) as a progress bar, thermometer, or gauge — KPIs, fundraising, quotas |
+| `countdown` | live "N days until X" that ticks every second and is accurate on every load — trip dates, launches, deadlines; the only dynamic chart type |
+| `clock` | live world-clock board: current time for people/places across time zones, ticking every second, with optional working-hours status and sundown line |
 | `map` | geographic concept map: regions, points, routes |
 | `wireframe` | low-fidelity UI layout with panels and controls |
 | `bar` | categorical comparisons (multi-series via `stack` / `group`) |
@@ -1718,7 +1722,7 @@ See spec §13A for full date-anchoring semantics, S-curve axes, and diagnostic c
 <!-- TYPE:family -->
 
 <!-- TIPS start -->
-**Styling tips:** Declare a person once with full metadata (`Anne b: 1665, sex: f`), then reference the bare name in union lines — don't repeat metadata. Model couples with the union line `A + B m: <year>` and indent children beneath it; reuse a name in a new union line for remarriage. The **legend** is the guaranteed sex channel (blue/purple sit close in hue and desaturate under the 25% tint) — where color-vision matters, add a `tag` group for the distinction you care about.
+**Styling tips:** Two line shapes carry the whole tree: a **person line** (`Anne b: 1665, sex: f`) and a **union line** (`Anne + Jack m: 1701`), with children indented under the union. Declare each person **standalone** with their full metadata — per-side metadata on a union line is unsupported and re-stating a name just re-references the same person. Set `sex:` so cards color (m→blue, f→purple), but **treat the legend as the real sex channel**: blue and purple separate weakly under the 25% tint, so where color-vision matters distinguish with a `tag` group (labeled legend entries) instead. Reuse a name in a second union for remarriage (one card, two bars); a lone person with indented children is a single parent; a bare trailing `adopted` token marks an adopted child.
 <!-- TIPS end -->
 
 ### Declaration
@@ -1766,38 +1770,31 @@ Henry Turner + Carina Smyth m: 1751
 **Styling tips:** Give each lane a color and let nodes inherit it — reach for a `tag` group only when you need a *second* dimension (e.g. risk) that deliberately breaks lane color. Echo the gateway/terminal delimiters (`<Review>`, `(Paid) success`) even though bare names also resolve — it keeps the source self-documenting. Put every edge label *inside* the arrow (`-invalid->`), never as a trailing word.
 <!-- TIPS end -->
 
-Swimlane diagrams model a cross-functional process: actors/systems are **lanes**, the process flows along the flow axis (`direction LR` default, `TB` transposes), and optional `[Phase]` columns group steps into stages. Nodes are tasks (bare), exclusive gateways (`<X>`), parallel gateways (`<+ X>`), terminals (`(X)`), and subprocesses (`[[X]]`). Edges go last as a flow block; a back-edge to an earlier node draws a routed loop.
+Swimlane diagrams model a cross-functional process: actors/systems are **lanes**, the process flows along the flow axis (`direction LR` default, `TB` transposes), and optional `[Phase]` columns group steps into stages. Nodes are tasks (bare), exclusive gateways (`<X>`), parallel gateways (`<+ X>`), terminals (`(X)`), and subprocesses (`[[X]]`). A `lane` block **owns its edges** — nodes and their outgoing `->` edges are written inline, no separate flow block. A back-edge to an earlier node draws a routed loop.
 
 ```
 swimlane Weekly Publishing
 direction LR
 
 lane Writer gray
+  Draft Post -> Review
+  Revise -> Review
 lane Editor blue
-lane Social green
-
-Writer
-  Draft Post
-  Revise
-Editor
   <Review>
-  Schedule
-  Publish
-Social
+    -changes-> Revise
+    -ok-> Schedule
+  Schedule -> Publish
+  Publish -> Promote
+lane Social green
   Promote
-
-Draft Post -> <Review>
-<Review>
-  -changes-> Revise -> <Review>
-  -ok-> Schedule -> Publish -> Promote
 ```
 
 ### Structure
 
-- `lane <Name> [color]` declares a row (occupant-neutral; person, system, or org) in order. The trailing color (§1.5) tints the band and is the default node fill.
-- A bare line matching a declared lane opens that lane's context; indented lines beneath it are nodes.
-- `[Phase]` opens a phase column (3-deep: phase ▸ lane ▸ node). With no `[Phase]`, the diagram is 2-deep (lane ▸ node). A node's phase membership can only push it right, never left of its column.
-- Node names are globally unique; the flow block references a node by name.
+- `lane <Name> [color]` declares a row (occupant-neutral; person, system, or org) **and opens its block** — the indented lines beneath are its nodes and their inline edges. The trailing color (§1.5) tints the band and is the default node fill. Lane order is first-appearance; re-opening a lane resumes it.
+- A node is owned by the lane where it is a **line-head** (bare node or arrow source); elsewhere the name is a reference. References may point forward. Names are **lane-scoped** — resolve own-lane-first → global-unique → ambiguous; qualify a shared name `Lane.Node`.
+- An unresolved target auto-creates only if **delimited** (`(…)`/`<…>`/`[[…]]`, taking the edge's lane/phase); an unresolved **bare task** is `E_SWIMLANE_UNKNOWN_NODE` (typo protection).
+- `[Phase]` opens a phase column (3-deep: phase ▸ `lane` block ▸ nodes). With no `[Phase]`, the diagram is 2-deep (lane ▸ nodes). A node's phase membership can only push it right, never left of its column.
 
 ### Node tokens
 
@@ -2526,7 +2523,7 @@ Group a run of events into a labeled section with a `[Name]` bracket, then **ind
 <!-- TYPE:body -->
 
 <!-- TIPS start -->
-**Styling tips:** a body diagram is a human figure you annotate by muscle name — for workout splits, PT/rehab, and anatomy teaching. Name the muscles you care about, color them by intensity/severity with a tag group, and add a short note beneath each for the exercise or finding. Keep to the muscles that matter; the rest stay a neutral gray so the highlighted ones read at a glance.
+**Styling tips:** Reach for `body` when the drawing IS the human figure — colour muscle groups over a skin layer to show which parts a workout targets, where an injury sits, or how the musculature is organised. Choose the figure with `male`/`female` and `front`/`back`; each named muscle group takes a tag so the legend carries the meaning. Best for fitness, medical, exercise, and educational diagrams — not for generic part-to-whole (that's `pie`/`treemap`).
 <!-- TIPS end -->
 
 **Figures:** male and female, front and back — four figures. `skin` form renders any figure as a plain silhouette (with head + hair) instead of the segmented muscle map. `skeletal` is reserved.
@@ -3630,7 +3627,7 @@ In the desktop app a block diagram is interactive: click a container header to c
 <!-- TYPE:sketch -->
 
 <!-- TIPS start -->
-**Styling tips:** Sketch is a **GUI-authored format** — the desktop/web canvas editor generates this markup, and hand-writing it is the exception. If you generate it anyway: keep it SMALL (sketches read best under ~15 shapes), use integer `at:` coordinates on the half-slot lattice with shapes at least 2 half-slots apart on one axis — or simply **omit `at:` everywhere** and let flow placement arrange rows (the safest generator path). Alias any shape an edge references (`as con`). Never write `size:`, colors, fonts, or a `shape:` outside the closed 7-kind set. In sketch, `~` dashed means **secondary emphasis, NOT async** — don't carry infra's async reading over. Categorize with a tag group (named palette colors only) instead of reaching for more shape kinds — kind-of-thing is meaning, and meaning lives in tags. Malformed coordinates never break a render (overlaps auto-resolve with a warning), but tidy input diffs better.
+**Styling tips:** Sketch is a GUI-authored format — the desktop and web canvas editors generate this markup, so hand-writing it is the exception. If you generate it anyway: keep it SMALL (sketches read best under ~15 shapes), and either omit `at:` everywhere (shapes flow into rows) or use integer half-slot coordinates with shapes at least 2 half-slots apart on one axis. Alias any shape an edge references (`as con`). Never write `size:`, colors, fonts, or a `shape:` outside the closed set (database, queue, cloud, person, document, note). In sketch, `~` dashed means secondary emphasis, NOT async. Categorize with a tag group instead of reaching for more shape kinds — kind-of-thing is meaning, and meaning lives in tags. Reach for `sketch` when the drawing itself is the content; reach for `boxes-and-lines` when topology should auto-lay-out.
 <!-- TIPS end -->
 
 A **GUI-first constrained canvas**: uniformly-sized shapes placed freely on a snap grid, arrows between them, meaning through tags. The renderer owns all styling — authors own placement, connection, naming, and tags. Every shape has ONE universal footprint (no resizing); text always fits (shrink → smart-wrap → `…`). Pick `sketch` when the spatial arrangement is yours to decide; pick `boxes-and-lines` when topology should auto-lay-out.
@@ -3702,6 +3699,240 @@ In the desktop and web app a sketch opens in the **canvas editor** (the code pan
 
 ---
 
+## 24E. Goal
+
+<!-- TYPE:goal -->
+
+<!-- TIPS start -->
+**Styling tips:** A single progress-toward-a-target reading — one `now` against one `target`, answering "how close am I?". Reach for it for a KPI tile, a fundraising thermometer, a quarterly quota, or a completion percentage; there is no time axis, series, or milestones (use `line` for a trend, `countdown` for a live deadline). Put the **unit in the title** (`Marathon Fund ($)`, `Grog Barrel Fill (L)`) — there is no format/currency directive. `now` and `target` are **space-separated `key value`** directives, no colon (`now 6400` / `target 10000`); the percent is `now / target` and values auto-compact (`6.4k`, `1.2M`). Pick the face for the story with a bare flag on its own line: the default progress **bar** for a plain KPI, `thermometer` for fundraising/fill-the-tank framings, `gauge` for a speedometer/quota dial — all three read the same value pair. The fill is **auto traffic-light** by completion (`< 50%` red, `50–80%` orange, `≥ 80%` green; over-target stays green) so the color already reads the number's health — leave it unless you have reason to override with a trailing color on the title line (`goal Marathon Fund ($) green`) or `no-auto-color` (flat palette color). Over-target clamps the fill at 100% while the `%` label stays truthful (`120%`). Add a `note` — inline (`note Still waiting on three crews`) or a block header on its own line with an indented body — to caption the number with context (who's still owed, what's left); it takes simple markdown (`**bold**`, `*italic*`, `` `code` ``) and `- ` bullets. `solid-fill` for a bolder fill; `no-percent` / `no-value` / `no-title` / `no-note` to drop labels.
+<!-- TIPS end -->
+
+A single progress-toward-a-target value: one `now` measured against one `target`, drawn in one of three static faces. No time axis, no series, no milestones — just "how close am I?". The face is a bare-flag mode directive under the title (like treemap's `radial`); all three faces consume the same value pair.
+
+### Declaration
+
+```
+goal [Title with unit]
+
+[thermometer | gauge]     // omit for the default progress bar
+now <number>
+target <number>
+```
+
+### Example
+
+```
+goal Doubloons Recovered ($)
+
+thermometer
+
+now 6400
+target 10000
+```
+
+### Directives
+
+| Directive              | Effect                                                        |
+| ---------------------- | ------------------------------------------------------------- |
+| `thermometer` / `gauge`| Select the render face (bare flag; omit for the progress bar). |
+| `now <number>`         | Current value (required; may exceed the target).              |
+| `target <number>`      | Goal value (required; must be > 0).                           |
+| `no-percent`           | Hide the `%` label.                                           |
+| `no-value`             | Hide the raw `now / target` label.                            |
+| `solid-fill`           | Full-saturation fill instead of the default 25% tint.         |
+| `no-title`             | Hide the banner title.                                        |
+| `no-note`              | Suppress the `note` block even if one is authored.           |
+| `no-auto-color`        | Disable the traffic-light bands; use the flat palette color.  |
+| `note <text>` / `note` + indented body | Free-text caption beside/below the face (§ note block). |
+
+### Note block
+
+An optional caption. Inline (`note Still waiting on three crews`) or a block header on its own line followed by an **indented body**:
+
+```
+goal Grog Barrel Fill (L)
+thermometer
+now 34
+target 50
+note
+  **Great job, crew!** Still waiting on tallies from:
+  - Seattle — first mate says "soon"
+  - Columbus — *almost there!*
+```
+
+The body supports inline `**bold**` / `*italic*` / `` `code` ``, `- `/`* ` bullets, and blank-line gaps. It renders in the left column for `thermometer`/`gauge` and under the bar for the default face. `no-note` hides it even when authored.
+
+### Values & color
+
+Values accept `_` separators (`10_000`) but not thousands commas; the unit lives in the title. Color precedence: (1) an explicit trailing color token on the title line (`goal Marathon Fund ($) green`, §1.5) always wins; (2) otherwise the **auto traffic-light** band by completion — `< 50%` red, `50–80%` orange, `≥ 80%` green (over-target stays green), which needs a `target`; (3) `no-auto-color` disables the bands and falls back to the palette series color. The fill is a 25% tint of the resolved color; `solid-fill` opts into full saturation.
+
+### Semantics
+
+Percent is `now / target`. Over-target clamps the fill at 100% while the `%` label shows the true value (e.g. `120%`); the gauge needle pins at max. A negative `now` clamps the fill to 0% but keeps the label truthful. A missing or ≤ 0 `target` emits an error-severity diagnostic and the chart falls back to a 0% shell; a missing `now` is treated as 0 with a warning.
+
+---
+
+## 24E. Countdown
+
+<!-- TYPE:countdown -->
+
+<!-- TIPS start -->
+**Styling tips:** The only dynamic chart — it ticks every second and is accurate on every load, so use it for a live "N days until X" widget, not a static report. Keep the title to the event (`Trip to Japan`); the target date renders as a caption automatically. `target` is a space-separated `key value` directive (no colon): a bare date (`2026-08-21`) counts to the viewer's local midnight, a datetime or offset is honored. Default `units days` reads best for weeks/months out; use `units full` for a launch-day `Nd HH:MM:SS` clock. Set `expired` to the celebration text (`🚀 Shipped!`); after the target passes every live surface shows it and the tick stops. On images (PNG export, `.svg` via `<img>`, GitHub camo) it can't tick and shows the whole-day count baked at export time — the correct fallback.
+<!-- TIPS end -->
+
+The only *dynamic* dgmo chart: a single "N days until X" recomputed against the viewer's clock on every load and ticking every second on any live surface. Distinct from `goal` (static) — a countdown has no `now`/`target` pair, just one future instant. The renderer bakes a whole-day fallback number (the no-JS floor); a tiny page-level ticker overwrites it live and, in `units full`, upgrades it to `Nd HH:MM:SS`.
+
+### Declaration
+
+```
+countdown [Title]
+
+target <ISO date | datetime | now>
+units <days | full>       // default days
+expired <text>            // default "Now!"
+```
+
+### Example
+
+```
+countdown Trip to Japan
+
+target 2026-08-21
+```
+
+### Directives
+
+| Directive               | Effect                                                                 |
+| ----------------------- | ---------------------------------------------------------------------- |
+| `target <iso>`          | The future instant (required). `2026-08-21`, `2026-08-21T18:00`, or with a tz offset. The literal `now` resolves at render (→ immediately expired; for testing). |
+| `units <days\|full>`    | `days` (default) shows whole days (ceil); `full` ticks `Nd HH:MM:SS` on live surfaces. |
+| `expired <text>`        | Shown once the target passes; the tick stops. Default `"Now!"`.        |
+
+### Values & color
+
+A bare `YYYY-MM-DD` counts to the viewer's **local midnight**; a datetime with no offset is viewer-local; an explicit offset is honored. The trailing-token color rule (§1.5) applies to the title line (`countdown Trip to Japan blue`) and tints the figure.
+
+### Semantics
+
+Days mode uses `ceil` — a target later *today* reads "1 day", not "0". Full mode floors the days and shows `HH:MM:SS` for the remainder. Once the target passes, the `expired` text replaces the number and that node stops ticking (no negative counts). Live surfaces recompute from the absolute target on every load/route-change/note-open, so there is **no persisted state** and no drift; image surfaces (PNG, `.svg`-as-image, GitHub camo) show the whole-day count baked at export time.
+
+---
+
+## 24Eb. Clock
+
+<!-- TYPE:clock -->
+
+<!-- TIPS start -->
+**Styling tips:** A live world clock — one panel per person or place, each showing the CURRENT time in its zone and ticking every second, accurate the instant the page loads. Reach for it to answer "what time is it for the crew right now": a distributed team's local times, a single collaborator's clock, or the overlap window for scheduling a call. The first line declares the type and a title (`Crew standups`). Each entry is one line, `<place> <IANA/Zone> [as <label>]`: a human-readable place, then a real IANA zone (`Europe/London`, `America/New_York`, `America/Los_Angeles`, `Asia/Tokyo`) — never a bare offset like `GMT+1`, which doesn't track daylight saving. Use `as <label>` to name the person or role behind a zone (`New York America/New_York as Dani (NY)`); the label becomes the caption. The single-clock case is common and encouraged — one title, one entry (`clock Dani` / `New York America/New_York`). Global directives are flat, no colon: `analog` for analog dials (digital is the default face), `time-24` for a 24-hour readout (12h am/pm is the default), and optional context bands `hours 9-17` + `days mon-fri` (the window accepts `HH:MM` and am/pm, e.g. `hours 8:30-17:15`) to shade each zone's working window so out-of-hours people read at a glance. `no-sun` hides the sunrise/sundown indicator (on by default). Add `hours`/`days` only when the point is scheduling overlap; drop them for a plain "current time" widget. Zones are **colorized by default** (`color-by`, default `place` — a distinct palette accent per place); reach for a semantic mode when color should *mean* something: `color-by time` or `color-by daylight` make an at-a-glance world board read as day-vs-night (order the zones west→east so the daylight sweeps across), and `color-by work` turns a standup/team board green/amber/grey by availability — it needs `hours` set. A hand-set per-zone color (`London Europe/London as UK team purple`) is a **defined** shade that always wins over the dimension, so you can pin one zone and let the rest follow. `color-by none` goes neutral. On image surfaces (PNG, `.svg` via `<img>`, GitHub camo) it can't tick and bakes the time at export — the correct graceful fallback.
+<!-- TIPS end -->
+
+The second *dynamic* dgmo chart (with `countdown`): a live board of world clocks recomputed against the viewer's clock every second. Flat syntax — the first line is `clock <Title>`; every other non-blank line is either a board-level directive (its first token is an option keyword) or a place row. Order-independent; no colons anywhere.
+
+### Declaration
+
+```
+clock [Title]
+
+analog                      // analog dials; digital is the default face
+hours <start>-<end>         // optional working window (24h, HH:MM or am/pm)
+days <mon-fri | mon,wed,fri> // optional working days (default mon-fri)
+no-sun                      // hide the sundown/sunrise line (on by default)
+time-24                     // 24-hour readout (12h am/pm is the default)
+no-title                    // suppress the board title
+direction lr                // lay the panels out in a row
+color-by <place|work|daylight|time|none> // zone coloring; default place
+
+<place tokens…> <IANA/Zone> [as <label…>]
+```
+
+### Example
+
+```
+clock Crew standups
+hours 9-17
+days mon-fri
+
+London        Europe/London        as UK team
+New York      America/New_York     as Dani (NY)
+Los Angeles   America/Los_Angeles  as West coast
+```
+
+### Directives
+
+| Directive              | Effect                                                                 |
+| ---------------------- | ---------------------------------------------------------------------- |
+| `analog`               | Analog dials for the WHOLE board. Digital is the default face. |
+| `hours <start>-<end>`  | Working window (e.g. `9-17`, `8:30-17:15`, or am/pm); drives the status chip, evaluated in each row's own zone. |
+| `days <range\|list>`   | Working days: `mon-fri` or `mon,wed,fri`. Default Mon–Fri. No effect without `hours`. |
+| `no-sun`               | Hide the sundown/sunrise line (on by default when the zone's city coordinates are known). |
+| `time-24`              | 24-hour readout (12-hour am/pm is the default).                        |
+| `no-title`             | Suppress the board title.                                              |
+| `direction lr`         | Lay the panels out in a row (columns) instead of stacked.             |
+| `color-by <place\|work\|daylight\|time\|none>` | Which dimension colors the zones. Default `place`; `color-by none` goes neutral. `place` = identity accent per place; `work` = green/amber/grey by the `hours` window; `daylight` = warm sun-up / cool sun-down; `time` = local-hour dawn→night ramp (order zones west→east). A hand-set (**defined**) per-zone trailing color always wins over the dimension. |
+
+### Entry grammar
+
+Each place row is `<place tokens…> <IANA/Zone> [as <label…>]`. The zone is the token containing `/` (a full IANA name like `America/New_York`); text before it is the place, and `as <label>` sets the display alias (default = place). A row that is just a zone (`Asia/Tokyo`) uses the zone's city as the place.
+
+### Semantics
+
+Each row's time comes from `Intl.DateTimeFormat` with that row's zone, so DST is always correct. The renderer bakes the time, hands, offset, status, and sundown line at render (the no-JS floor); a tiny page-level ticker recomputes them from the baked zone/coords every second — no persisted state, no drift. Image surfaces (PNG, `.svg`-as-image, GitHub camo) show the time baked at export.
+
+---
+
+## 24F. Bracket
+
+<!-- TYPE:bracket -->
+
+<!-- TIPS start -->
+**Styling tips:** A single-elimination tournament bracket: winners auto-advance rightward toward a championship. Reach for it for playoff trees, knockout draws, and seeded fields. Two ways to author: seed the field for a **day-0 skeleton** (`seed 1 Team A`, `seed 2 Team B` …) and let matches fill in, or list results casually as `A beats B` / `A vs B` lines and let winners flow forward. Name the columns with `rounds` (comma-separated, e.g. `rounds Quarterfinals, Semifinals, Final`) or an indented `rounds` block with per-round colors. The two sides mirror inward to the final. Color a competitor's box outline with a `tag` group; `accent` overrides the winner highlight (default blue). `single-elim` is the default; opt-outs are `no-round` (hide column labels) and `no-legend`.
+<!-- TIPS end -->
+
+A single-elimination tournament bracket. Winners auto-advance up a tree that builds itself from the results — a one-sided ladder for a simple pool, or two `[Side]` columns that mirror inward and meet at a championship (MLB / NBA / NCAA-style). Any `seed` line switches on **seeded mode** (day-0 skeleton); otherwise the bracket is **casual** (structure inferred from `beats` / `vs` lines).
+
+### Declaration
+
+```
+bracket [Title]
+rounds [Col1, Col2, ...]         // optional column names, entry round → inner
+
+[Side] [color]                   // optional — two sides mirror to a center final
+  seed N [Competitor]            // seeded mode: declare the field (day-0 skeleton)
+  [Winner] beats [Loser] [score] // decided match — WINNER on the left, score cosmetic
+  [A] vs [B]                     // pending match — no winner yet
+```
+
+### Example
+
+```
+bracket Grog Cup
+
+Black Pearl beats Sea Serpent 5-3
+Salty Dog beats Kraken 4-2
+Black Pearl beats Salty Dog 6-5
+```
+
+### Directives
+
+| Directive                      | Effect                                                                       |
+| ------------------------------ | ---------------------------------------------------------------------------- |
+| `rounds A, B, C`               | Name the columns entry-round → inner (or an indented block with per-round `Name color`); absent → generic `Round N` / `Final`. |
+| `seed N [Name] [k: v]`         | Declare a seeded entrant → seeded mode + day-0 skeleton (top seeds get byes); trailing `k: v` tags the team. |
+| `tag Group [as g]`             | Tag group (block/kanban idiom) — a competitor's tag value colors its box outline; a legend renders. |
+| `[Side] [color]`               | A bracket column (kanban idiom); two sides mirror to a center championship.   |
+| `[Winner] beats [Loser] [score] [@ Home]` | A decided match — the left name advances; score is cosmetic; `@ Home` marks the host. Indent prose under it for commentary. |
+| `[A] vs [B]`                   | A pending, undecided match (both boxes drawn, no winner emphasis).            |
+| `accent <color>`               | Winner accent color override (default blue). Tags/sides still win per-box.    |
+| `no-round`                     | Suppress the round/column labels.                                            |
+| `no-legend`                    | Hide the tag legend (outlines still colored).                               |
+| `single-elim` / `double-elim` / `seeded` | Format flags. `double-elim` reserved — not yet supported; `seeded` forces seeded mode. |
+
+### Semantics
+
+The winner is always the left operand of `beats`, regardless of the score; a score that shows the winner lower emits a warning but keeps the declared winner. Reusing a name advances that competitor (same string = same entrant); a competitor whose first appearance is a later round simply never played round 1 (a bye). In seeded mode the field builds the standard single-elim skeleton (recursive 1-vs-N seeding: `3v6` / `4v5` for a six-team side, top seeds bye), every slot renders on day 0, and `beats` lines overwrite the `TBD` slots as games are played. Duplicate competitor names error (names are identifiers); `double-elim` parses but emits a "not yet supported" diagnostic.
+
+---
+
 ## 24A. RACI Matrices (RACI / RASCI / DACI)
 
 <!-- TYPE:raci -->