feat(diagram-engine): design tokens + role/group composition, engine-wide theming

Paper-summary posters previously required hand-written XML: every engine
box rendered identically (white, 11px), so anything whose meaning lives
in visual hierarchy came out flat. This makes presentation a first-class,
generalised part of the declaration - not a poster feature.

Structure/presentation separation, the same split HTML and CSS settled on:

- ROLE says what a node IS: banner, heading, body, callout, good, bad,
  metric, muted. Maps to a type scale and an emphasis (filled / tinted /
  outlined / ghost), never to a colour.
- GROUP says which semantic zone a node belongs to. Each distinct group
  name gets one hue ramp (tint / base / dark), assigned in document
  order. Promoted from a draw_graph-only field to BoxNode and GroupNode,
  round-tripped via dai_group.
- themedStyle(role, hue, kind) composes the two by rule - there is no
  per-combination table to extend, so a new diagram kind gets full
  theming by tagging nodes. The model never sees a hex value.

A heading container plus a group yields the tinted section panel with a
dark title; a grouped body box takes its zone's tint; verdict roles stay
green/red regardless of zone; the banner is the page's one dark field.

Also fixed, found while building the acceptance poster:

- autoBoxSize only counted explicit newlines, so a long single-line label
  wrapped to six lines in draw.io but got a one-line-tall box, and the
  text overflowed the cell.
- Marker stamping appended without replacing, so every render of a
  recovered style grew it by one duplicate dai_* token per key -
  unnoticed because draw.io resolves duplicates last-wins. dai_* keys
  are now replaced in place; mxGraph keys still append, because
  last-wins is load-bearing for container=1 normalisation.
- Banner/heading/metric roles stretch across their container's cross
  axis, the way a masthead spans its page.
- Prompt: a poster's banner IS its title (no set_title alongside), and
  sections get their colour by naming groups.

537 unit tests, 250-flowchart corpus still zero crossing arrows, 5 e2e
tests in a real browser. Verified visually: the Transformer-paper poster
renders with a navy masthead, three hue-coded section panels, metric,
verdict and callout boxes - all engine-computed geometry.

lib/diagram-engine/types.ts

@@ -9,8 +9,10 @@
  */
 
 import type { Direction } from "./markers"
+import type { Role } from "./theme"
 
 export type { Direction } from "./markers"
+export type { Role } from "./theme"
 
 /**
  * Which cell of a swimlane pool a node sits in.
@@ -67,6 +69,10 @@ export interface BoxNode {
     fill?: string
     stroke?: string
     bold?: boolean
+    /** What this node IS in the information hierarchy; the theme decides how that looks. */
+    role?: Role
+    /** Semantic zone name; every node sharing a group gets the same hue ramp. */
+    group?: string
     /** Flowchart outline. Absent means a plain rectangle. */
     shape?: BoxShape
     style?: string
@@ -99,6 +105,10 @@ export interface GroupNode {
     children: DiagramNode[]
     fill?: string
     stroke?: string
+    /** Section role; a themed panel for its children. */
+    role?: Role
+    /** Semantic zone name; the panel takes this hue's tint. */
+    group?: string
     style?: string
     pinned?: boolean
     rect?: Rect