@1agh/maude 0.29.0 → 0.30.0

package/apps/studio/use-annotation-selection.tsx

@@ -10,7 +10,15 @@
  * selection resets (the strokes themselves persist via `.annotations.svg`).
  */
 
-import { createContext, type ReactNode, useCallback, useContext, useMemo, useState } from 'react';
+import {
+  createContext,
+  type ReactNode,
+  useCallback,
+  useContext,
+  useMemo,
+  useRef,
+  useState,
+} from 'react';
 
 export interface AnnotationSelectionValue {
   selectedIds: string[];
@@ -57,10 +65,14 @@ export function AnnotationSelectionProvider({ children }: { children: ReactNode
 
   // Read live from state at call time so multi-step flows in the same tick
   // (e.g. a router callback that adds then asks `contains`) see the staged
-  // result instead of a stale closure capture.
-  const containsRef = { current: selectedIds };
+  // result instead of a stale closure capture. MUST be a real useRef — the
+  // pre-FigJam-v3 code created a fresh `{ current }` object literal every
+  // render, so the stable useCallback closure kept reading the FIRST render's
+  // (empty) selection forever: `contains()` always returned false, which
+  // silently broke hull/multi-drag and click-keeps-selection (user-gate
+  // finding, 2026-06-11).
+  const containsRef = useRef<string[]>(selectedIds);
   containsRef.current = selectedIds;
-  // biome-ignore lint/correctness/useExhaustiveDependencies: ref read intentionally
   const contains = useCallback((id: string) => containsRef.current.includes(id), []);
 
   const value = useMemo<AnnotationSelectionValue>(

package/apps/studio/use-canvas-activity.tsx

@@ -132,7 +132,7 @@ function readActivitySeed(): ActivityMap {
   const out: ActivityMap = {};
   for (const file of Object.keys(seed)) {
     const e = seed[file];
-    if (!e || e.status !== 'active') continue; // only resurrect active overlays
+    if (e?.status !== 'active') continue; // only resurrect active overlays
     out[file] = {
       status: 'active',
       artboardIds: Array.isArray(e.artboardIds) ? e.artboardIds : null,
@@ -199,7 +199,7 @@ export function CanvasActivityProvider({
           setMap((prev) => {
             const entry = prev[detail.file];
             // Only remove if it's still the same idle entry (not re-activated).
-            if (!entry || entry.status !== 'idle' || entry.ts !== ts) return prev;
+            if (entry?.status !== 'idle' || entry.ts !== ts) return prev;
             const { [detail.file]: _drop, ...rest } = prev;
             return rest;
           });

package/apps/studio/use-collab.tsx

@@ -39,26 +39,31 @@ const MESSAGE_AWARENESS = 1;
 // Color hash — stable per peer identity.
 
 /**
- * djb2 string hash → 0xRRGGBB color in a curated palette. Determinism per
+ * djb2 string hash → OKLCH color in a curated palette. Determinism per
  * input name is the load-bearing property: every peer hashing "Alice" must
- * land on the SAME color. 12 hues spread evenly around the wheel; saturation
- * + lightness fixed so all colors stay readable on light + dark surfaces.
+ * land on the SAME color.
+ *
+ * DS contract (colors-presence specimen): the AI agent rides
+ * `--presence-agent` (violet-magenta, hue 322) — "a hue no human state uses,
+ * so attribution on a shared canvas is unambiguous". Human hues therefore
+ * EXCLUDE the agent band (~292–352) AND the accent indigo band (~245–290,
+ * reserved for selection/active). L/C match the DS presence tokens
+ * (oklch ≈0.74 0.16) so every cursor reads at the same weight on both themes.
  */
 const COLOR_PALETTE = [
-  '#e91e63', // pink
-  '#f44336', // red
-  '#ff9800', // orange
-  '#ffc107', // amber
-  '#cddc39', // lime
-  '#4caf50', // green
-  '#009688', // teal
-  '#00bcd4', // cyan
-  '#03a9f4', // light blue
-  '#3f51b5', // indigo
-  '#673ab7', // deep purple
-  '#9c27b0', // purple
+  'oklch(0.70 0.17 12)', // rose
+  'oklch(0.72 0.16 40)', // coral
+  'oklch(0.78 0.15 78)', // amber  (presence-away hue)
+  'oklch(0.76 0.16 108)', // lime
+  'oklch(0.74 0.16 145)', // green  (presence-online hue)
+  'oklch(0.75 0.14 172)', // teal
+  'oklch(0.73 0.13 200)', // cyan
+  'oklch(0.72 0.13 238)', // blue   (status-info hue)
 ] as const;
 
+/** The AI agent's exclusive cursor/avatar hue — `--presence-agent`. */
+export const AGENT_COLOR = 'oklch(0.700 0.190 322)';
+
 export function colorForName(name: string): string {
   // COLOR_PALETTE is a non-empty const tuple; the explicit `?? '#000'`
   // fallback is unreachable but satisfies `noUncheckedIndexedAccess`.

package/apps/studio/use-selection-set.tsx

@@ -61,6 +61,15 @@ export interface Selection {
   dom_path?: string[];
   bounds?: { x: number; y: number; w: number; h: number } | null;
   html?: string;
+  /** Phase 12.2 — authored inline-style values (knob pre-fill) + resolved computed (placeholder hint). */
+  authored?: Record<string, string>;
+  computed?: Record<string, string>;
+  /** Phase 12.3 — authored inline-style props OUTSIDE the curated knob set, so the
+   *  panel can surface a custom CSS property the user added (e.g. `letter-spacing`). */
+  customStyles?: Record<string, string>;
+  /** Phase 12.3 — custom HTML attributes on the element (data-, aria-, role, title…),
+   *  so the panel reflects a custom attribute the user added via the escape hatch. */
+  attrs?: Record<string, string>;
 }
 
 interface SelectionSetValue {

package/apps/studio/use-tool-mode.tsx

@@ -58,6 +58,8 @@ export const DEFAULT_TOOLS: readonly ToolDescriptor[] = Object.freeze([
   // buttons; the primitive is chosen from the palette popover.
   { id: 'shape', label: 'Shape', shortcut: 'R', cursor: TOOL_CURSORS.shape },
   { id: 'sticky', label: 'Sticky', shortcut: 'N', cursor: TOOL_CURSORS.sticky },
+  // FigJam v3 — labelled organizing container.
+  { id: 'section', label: 'Section', shortcut: '⇧S', cursor: TOOL_CURSORS.shape },
   { id: 'arrow', label: 'Arrow', shortcut: 'A', cursor: TOOL_CURSORS.arrow },
   { id: 'text', label: 'Text', shortcut: 'T', cursor: TOOL_CURSORS.text },
   { id: 'eraser', label: 'Eraser', shortcut: 'E', cursor: TOOL_CURSORS.eraser },
@@ -114,7 +116,9 @@ export function ToolProvider({
   const clearSticky = useCallback(() => {
     setSticky({ tool: null, locked: false });
   }, []);
-  const [shapeKind, setShapeKind] = useState<ShapeKind>('square');
+  // FigJam v3 — soft default: a fresh Shape tool draws ROUNDED squares (the
+  // FigJam look); sharp squares stay one popover click away.
+  const [shapeKind, setShapeKind] = useState<ShapeKind>('rounded');
 
   // Cursor sync — applied inside the canvas (this hook runs in the canvas
   // context). The active tool's cursor is set on <body> AND forced across the

package/apps/studio/whats-new.json

@@ -1,6 +1,124 @@
 {
   "$schema": "./whats-new.schema.json",
   "entries": [
+    {
+      "id": "in-canvas-token-editor",
+      "version": "0.30.0",
+      "date": "2026-06-12",
+      "kind": "feature",
+      "title": "A real token editor, right in the canvas",
+      "summary": "The Inspector's CSS tab grew into a Figma-style design-token editor. Numeric fields carry a property glyph and scrub left/right to change; spacing fields take Webflow-style modifiers. Any value can bind to a design-system Variable through a searchable popover that shows where the token is defined — and it resolves the right system in multi-DS projects. One unified colour picker now drives every colour field, fill and border alike, with Custom and Variables tabs. Values you've set stand out while untouched rows recede, so the diff is scannable at a glance.",
+      "surface": "design-ui",
+      "tour": [
+        {
+          "target": "[data-tour='inspector-tabs']",
+          "inspector": true,
+          "tab": "css",
+          "title": "Inspect · Layers · CSS",
+          "body": "Here's the Inspector — opened to its CSS tab. It reads and writes your maude design system itself, not a generic :root. Three tabs: Inspect, Layers, CSS.",
+          "placement": "left"
+        },
+        {
+          "target": "[data-tour='css-panel']",
+          "inspector": true,
+          "tab": "css",
+          "requireSelection": true,
+          "title": "Your real element, live",
+          "body": "Hold ⌘ and click any element in the canvas. The CSS panel fills with its real, editable properties — and every change writes back to the source on blur, no AI round-trip.",
+          "placement": "left"
+        },
+        {
+          "target": ".st-cp-row",
+          "inspector": true,
+          "tab": "css",
+          "requireSelection": true,
+          "title": "Figma-style property rows",
+          "body": "Each row leads with a property glyph. Drag a numeric field left or right to scrub the value, or just type it; spacing fields accept Webflow-style modifiers.",
+          "placement": "left"
+        },
+        {
+          "target": ".st-cp-tokbtn",
+          "inspector": true,
+          "tab": "css",
+          "requireSelection": true,
+          "title": "Bind to a design token",
+          "body": "Click a field's token chip for the Variables popover — Custom for a literal, Variables for the design system's tokens. Search the list; each Variable shows its provenance. One unified colour picker drives every colour field, fill and border alike.",
+          "placement": "left"
+        },
+        {
+          "target": ".st-cp-sechd-row",
+          "inspector": true,
+          "tab": "css",
+          "requireSelection": true,
+          "title": "Scannable, resettable",
+          "body": "Values you've set stand out; untouched rows recede so the difference from the default reads at a glance. The leading dot on each row carries both its status and its reset.",
+          "placement": "left"
+        }
+      ]
+    },
+    {
+      "id": "in-canvas-direct-edit",
+      "version": "0.30.0",
+      "date": "2026-06-12",
+      "kind": "feature",
+      "title": "Edit the canvas directly — text & layers",
+      "summary": "Double-click any text to retype it in place — the new copy is written straight back to the source, no AI round-trip. The Layers tab is a browsable tree with type icons: click a layer to select it in the canvas, hover to highlight, and toggle any layer's visibility from its row. Together with the CSS token editor, small tweaks no longer need a command.",
+      "surface": "design-ui",
+      "tour": [
+        {
+          "target": "[data-tour='inspector-tabs']",
+          "inspector": true,
+          "tab": "layers",
+          "requireSelection": true,
+          "title": "Browsable layers",
+          "body": "⌘-click an element, then this Layers tab shows the artboard's elements as a tree with type icons — click a row to select it in the canvas, hover to highlight.",
+          "placement": "left"
+        },
+        {
+          "target": ".st-layer-eye",
+          "inspector": true,
+          "tab": "layers",
+          "requireSelection": true,
+          "title": "Toggle visibility",
+          "body": "The eye on each layer row hides or shows that element while you work — handy for seeing what sits underneath. Double-click any text in the canvas to retype it in place too.",
+          "placement": "left"
+        }
+      ]
+    },
+    {
+      "id": "studio-chrome-polished-end-to-end",
+      "version": "0.30.0",
+      "date": "2026-06-12",
+      "kind": "feature",
+      "title": "Studio chrome, polished end to end",
+      "summary": "The whole browser feels hand-finished now. Drag the file and inspector panels to resize them (or nudge with the arrow keys — your widths are remembered), watch a calm skeleton while a canvas compiles, and press ? for a full keyboard-shortcuts cheat sheet. Collaborator cursors and Claude's own cursor now match the design system, annotations snap to the dot grid as you drag, and focus rings, tooltips and scrollbars are consistent throughout. The View menu's Layers and Zoom are wired up, and a shortcut clash is gone — the inspector is ⌘⇧I, so I stays free for the canvas highlighter.",
+      "surface": "design-ui"
+    },
+    {
+      "id": "hub-sync-cold-start-safety",
+      "version": "0.30.0",
+      "date": "2026-06-12",
+      "kind": "feature",
+      "title": "Hub sync that can't eat your work",
+      "summary": "Boot two machines or checkouts linked to the same hub in any order — your local canvas work is safe. When both sides changed the same canvas, Maude keeps a copy of each, takes the newer one, and tells you exactly how to bring back the other; a clean catch-up just updates quietly. The sync status is honest now too: you can see which canvases are synced, pending, or rejected, and why.",
+      "surface": "design-ui"
+    },
+    {
+      "id": "canvas-annotations-figjam-v3",
+      "version": "0.30.0",
+      "date": "2026-06-12",
+      "kind": "feature",
+      "title": "Annotations grew up: diagram on the canvas",
+      "summary": "Marquee-select strokes and just drag them, group with ⌘G, copy/paste, align and reorder. Shapes rotate (hover near a corner), resize from edges with size-matching guides, hold text (double-click any shape), and switch kind — square, circle, diamond, triangle — right from the toolbar. Arrows snap to shapes and re-route as you move things, and the new Section tool (⇧S) frames a region that moves with its content. AI tools can read the board and draw on it too.",
+      "surface": "design-ui",
+      "tour": [
+        {
+          "target": ".dc-tool-palette",
+          "title": "New tools in the palette",
+          "body": "Section (⇧S) frames a region; the Shape tool's primitives can all hold text now — select a shape and press Enter to type."
+        }
+      ]
+    },
     {
       "id": "studio-full-functionality",
       "version": "0.29.0",
@@ -11,14 +129,17 @@
       "surface": "design-ui",
       "tour": [
         {
-          "target": ".st-mb-right",
+          "target": "[data-tour='status']",
           "title": "Live status, finally",
-          "body": "Zoom, artboard count, presence and hub-sync now reflect the real state — no more static placeholders."
+          "body": "Zoom, artboard count, presence and hub-sync now reflect the real state — no more static placeholders.",
+          "placement": "bottom"
         },
         {
-          "target": ".st-rpanel",
+          "target": "[data-tour='inspector']",
+          "inspector": true,
           "title": "Inspector",
-          "body": "⌘-click an element in the canvas, then press I — pos, size, ancestry and markup, read-only (live CSS knobs land in Phase 12)."
+          "body": "Opened from View → Inspector (I). ⌘-click an element to read its position, size, ancestry and markup — and now edit its CSS against your tokens, live.",
+          "placement": "left"
         }
       ]
     },
@@ -41,14 +162,16 @@
       "surface": "design-ui",
       "tour": [
         {
-          "target": ".st-menubar .st-brand",
+          "target": "[data-tour='brand']",
           "title": "Built in maude",
-          "body": "The studio chrome now dogfoods the maude DS — one cohesive material across the menubar, sidebar, canvas and status bar."
+          "body": "The studio chrome now dogfoods the maude DS — one cohesive material across the menubar, sidebar, canvas and status bar.",
+          "placement": "bottom"
         },
         {
-          "target": ".st-menubar .st-whatsnew",
+          "target": "[data-tour='menus']",
           "title": "Press ⌘K",
-          "body": "A new command palette jumps you to the design-system view, comments, theme toggle, reload, and help — no mouse needed."
+          "body": "A command palette jumps you to the design-system view, comments, theme toggle, reload, and help — no mouse needed.",
+          "placement": "bottom"
         }
       ]
     },
@@ -62,9 +185,11 @@
       "surface": "design-ui",
       "tour": [
         {
-          "target": ".dc-tool-palette button[aria-label^='Highlighter']",
+          "target": "[data-tour='viewport']",
+          "canvas": true,
           "title": "New: Highlighter",
-          "body": "A translucent marker pen (I) — overlapping strokes darken with multiply blend. Pick hue and nib width from the chrome below."
+          "body": "Open a canvas and press P to enter annotate mode, then pick the Highlighter from the toolbar — a translucent marker whose overlapping strokes darken with multiply blend. Sticky notes, shapes and text all take Cmd+B/I/U too.",
+          "placement": "auto"
         }
       ]
     },

package/apps/studio/whats-new.schema.json

@@ -59,11 +59,27 @@
       "properties": {
         "target": {
           "type": "string",
-          "description": "CSS selector or [data-tour=\"<key>\"] anchor to spotlight."
+          "description": "CSS selector or [data-tour=\"<key>\"] anchor to spotlight. Prefer the stable [data-tour] anchors over styling classes (which churn on redesigns)."
         },
         "title": { "type": "string", "minLength": 1 },
         "body": { "type": "string", "minLength": 1 },
-        "placement": { "enum": ["top", "bottom", "left", "right", "auto"] }
+        "placement": { "enum": ["top", "bottom", "left", "right", "auto"] },
+        "canvas": {
+          "type": "boolean",
+          "description": "Setup: ensure a canvas is open before the step (the tour opens the first one if none)."
+        },
+        "inspector": {
+          "type": "boolean",
+          "description": "Setup: open the right-hand Inspector panel before the step."
+        },
+        "tab": {
+          "enum": ["inspect", "layers", "css"],
+          "description": "Setup: switch the Inspector to this tab before the step."
+        },
+        "requireSelection": {
+          "type": "boolean",
+          "description": "The target only exists once an element is ⌘-clicked in the (cross-origin) canvas. The card shows a '⌘-click to continue' hint and the spotlight snaps onto the real row when a selection lands."
+        }
       }
     }
   }

package/cli/commands/design-link.test.mjs

@@ -282,6 +282,90 @@ test('status reports zero-syncable when _sync.json is notSyncable (DDR-060 / 9.1
   cleanup();
 });
 
+// --------------------------------------------------- DDR-102 status surfaces
+
+test('DDR-102: status renders docs counts, rejected slugs, and the conflict recovery hint', async () => {
+  await runCli(['design', 'link', URL, '--token', 'mau_test']);
+  writeFileSync(
+    join(workspace, '.design/_sync.json'),
+    JSON.stringify({
+      state: 'online',
+      queuedOps: 0,
+      lastSyncAt: 1760000000000,
+      offlineSince: null,
+      flash: null,
+      updatedAt: Date.now(),
+      url: URL,
+      canvases: 83,
+      docs: { synced: 81, pending: 0, rejected: 2 },
+      rejectedSlugs: ['system-tokens', 'system-type'],
+      conflicts: [
+        {
+          slug: 'ui-maskot',
+          kind: 'cold-start-diverged',
+          winner: 'local',
+          snapshots: {
+            local: '2026-06-11T10:00:00.000Z',
+            hub: '2026-06-11T10:00:00.001Z',
+          },
+          at: 1760000001000,
+        },
+      ],
+    }),
+    'utf8'
+  );
+
+  const human = await runCli(['design', 'status']);
+  assert.equal(human.status, 0, human.stderr);
+  assert.match(human.stdout, /docs: 81 synced · 0 pending · 2 rejected/);
+  assert.match(human.stdout, /not syncing:\s+system-tokens, system-type/);
+  assert.match(human.stdout, /ui-maskot — diverged, kept local \(newest-wins\)/);
+  assert.match(human.stdout, /local@2026-06-11T10:00:00\.000Z/);
+  assert.match(human.stdout, /hub@2026-06-11T10:00:00\.001Z/);
+  assert.match(human.stdout, /\/design:rollback ui-maskot/);
+
+  // --json passes the new fields through verbatim.
+  const json = await runCli(['design', 'status', '--json']);
+  const payload = JSON.parse(json.stdout);
+  assert.equal(payload.sync.docs.rejected, 2);
+  assert.equal(payload.sync.conflicts[0].winner, 'local');
+  cleanup();
+});
+
+test('DDR-102: status renders an OLD-shape _sync.json (no docs/rejectedSlugs) unchanged', async () => {
+  await runCli(['design', 'link', URL, '--token', 'mau_test']);
+  writeFileSync(
+    join(workspace, '.design/_sync.json'),
+    JSON.stringify({
+      state: 'online',
+      queuedOps: 0,
+      lastSyncAt: null,
+      offlineSince: null,
+      flash: null,
+      updatedAt: Date.now(),
+      url: URL,
+      canvases: 5,
+      conflicts: [],
+    }),
+    'utf8'
+  );
+  const human = await runCli(['design', 'status']);
+  assert.equal(human.status, 0, human.stderr);
+  assert.match(human.stdout, /sync agent:\s+online/);
+  assert.doesNotMatch(human.stdout, /docs:/);
+  assert.doesNotMatch(human.stdout, /not syncing:/);
+  cleanup();
+});
+
+test('DDR-102: re-linking the same hub prints the token-replacement notice', async () => {
+  await runCli(['design', 'link', URL, '--token', 'mau_first']);
+  const second = await runCli(['design', 'link', URL, '--token', 'mau_second']);
+  assert.equal(second.status, 0, second.stderr);
+  assert.match(second.stdout, /replacing the stored token for/);
+  assert.match(second.stdout, /EVERY project linked to this hub on this machine/);
+  cleanup();
+});
+
 // --------------------------------------------------- DDR-054 F2/F4 trust gate
 
 const REMOTE_URL = 'http://hub.invalid:9999'; // .invalid never resolves (RFC 6761)

package/cli/commands/design.mjs

@@ -42,6 +42,7 @@ const BIN_VERBS = new Set([
   'svg-optimize',
   'to-lottie',
   'read-annotations',
+  'annotate',
 ]);
 
 // Bin verbs that boot the dev-server (directly, or by shelling into server-up.sh).
@@ -134,7 +135,7 @@ Lifecycle:
 Dev-tooling (dispatch to the dev-server bash helpers — DDR-062):
   screenshot · server-up · prep · slug · bootstrap-check · runtime-health
   smoke · canvas-edit · handoff · asset-sweep · visual-sanity
-  draw-build · draw-proof · svg-optimize · to-lottie · read-annotations
+  draw-build · draw-proof · svg-optimize · to-lottie · read-annotations · annotate
         Invoke the bundled helper of the same name. maude resolves it from its
         own package root and sets CLAUDE_PLUGIN_ROOT for the child; stdout,
         stderr, and exit code pass straight through (so command-substitution

package/cli/commands/design.test.mjs

@@ -165,7 +165,11 @@ test('`maude studio` aliases `maude design serve` (identical boot resolution)',
         encoding: 'utf8',
         timeout: 30000,
       });
-      return { status: r.status, firstErr: (r.stderr || '').split('\n').find(Boolean) ?? '' };
+      // Each invocation mkdtemp's its own root, and the diagnostic embeds that
+      // path — mask it so we compare the path-independent signature (the test's
+      // actual intent: same exit code + same error shape from both entrypoints).
+      const firstErr = ((r.stderr || '').split('\n').find(Boolean) ?? '').replaceAll(cwd, '<root>');
+      return { status: r.status, firstErr };
     } finally {
       rmSync(cwd, { recursive: true, force: true });
     }

package/cli/lib/design-link.mjs

@@ -108,6 +108,16 @@ export async function runLink({ args, cwd = process.cwd(), forceAdopt = false })
     process.exit(1);
   }
 
+  // DDR-102 incident learning (same-machine token overwrite): hubs.json is
+  // keyed per hub URL only, so a second `link --token` silently replaced the
+  // first machine-wide — both dev servers then authenticated as the same
+  // label and shared one hub rate bucket. Make the overwrite explicit.
+  if (getHub(normUrl)) {
+    process.stdout.write(
+      `[design link] note: replacing the stored token for ${normUrl} (the token is per-machine — this applies to EVERY project linked to this hub on this machine).\n`
+    );
+  }
+
   // Write hub side: token (+ adopt attestation) in ~/.config/maude/hubs.json.
   const hubRecord = addHub(normUrl, token, adopt ? { adoptedAt: Date.now() } : {});
 
@@ -262,16 +272,56 @@ export async function runStatus({ args, cwd = process.cwd() }) {
   }
 
   const uptimeS = Math.round((probe.uptimeMs ?? 0) / 1000);
+  // DDR-102 — per-doc rollup (old payloads without `docs` render unchanged).
+  const docsLine = sync?.docs
+    ? `, docs: ${sync.docs.synced} synced · ${sync.docs.pending} pending · ${sync.docs.rejected} rejected`
+    : '';
   const syncLine = sync?.notSyncable
     ? `linked but 0 syncable canvases — ${sync.reason}`
     : sync
       ? `${sync.state}${sync.sharedDoc ? ' [shared-doc]' : ''}${sync.queuedOps ? ` — ${sync.queuedOps} edit(s) queued` : ''}${
           sync.lastSyncAt ? `, last sync ${new Date(sync.lastSyncAt).toISOString()}` : ''
-        }${sync.conflicts?.length ? `, ${sync.conflicts.length} conflict notice(s)` : ''}`
+        }${docsLine}${sync.conflicts?.length ? `, ${sync.conflicts.length} conflict notice(s)` : ''}`
       : 'idle (start `maude design serve` in linked mode)';
   process.stdout.write(
     `Maude design — linked mode\n  hub URL:      ${url}\n  linked at:    ${new Date(cfg.linkedHub.linkedAt).toISOString()}\n  adopt mode:   ${cfg.linkedHub.adopt ? 'yes (push-on-first-sync)' : 'no (hub-wins)'}\n  TSX sync:     ${cfg.linkedHub.syncTsx === false ? 'off (opted out — linkedHub.syncTsx: false)' : 'on (default — DDR-079)'}\n  token stored: ${hubRecord ? 'yes (~/.config/maude/hubs.json)' : "NO — re-run 'maude design link'"}\n  hub status:   ${probe.ok ? `up — v${probe.version}, ${uptimeS}s uptime, ${probe.tokenCount} token(s), ${probe.authMode}` : `UNREACHABLE — ${probe.error}`}\n  sync agent:   ${syncLine}\n`
   );
+  // DDR-102 — auth-rejected canvases (per-slug honesty).
+  if (Array.isArray(sync?.rejectedSlugs) && sync.rejectedSlugs.length > 0) {
+    const total = sync.docs?.rejected ?? sync.rejectedSlugs.length;
+    const more =
+      total > sync.rejectedSlugs.length ? ` (+${total - sync.rejectedSlugs.length} more)` : '';
+    process.stdout.write(
+      `  not syncing:  ${sync.rejectedSlugs.join(', ')}${more} — hub rejected auth; the serve log names the reason (scope / invalid token / rate limit).\n`
+    );
+  }
+  // DDR-102 — conflict log with winner + snapshot refs + the recovery story.
+  if (Array.isArray(sync?.conflicts) && sync.conflicts.length > 0) {
+    process.stdout.write('  conflicts:\n');
+    for (const c of sync.conflicts.slice(-10)) {
+      const at = c.at ? new Date(c.at).toISOString() : '?';
+      if (c.kind === 'cold-start-diverged') {
+        const snaps = c.snapshots
+          ? ` snapshots: ${[
+              c.snapshots.local ? `local@${c.snapshots.local}` : null,
+              c.snapshots.hub ? `hub@${c.snapshots.hub}` : null,
+            ]
+              .filter(Boolean)
+              .join(' ')}`
+          : '';
+        process.stdout.write(
+          `    ${at}  ${c.slug} — diverged, kept ${c.winner ?? 'hub'} (newest-wins);${snaps}\n      recover the other version: /design:rollback ${c.slug}\n`
+        );
+        if (c.snapshotFailed) {
+          process.stdout.write(
+            `      ⚠ the _history snapshot FAILED — local was KEPT instead of overwritten (DDR-102 fail-closed); check disk space / _history write perms.\n`
+          );
+        }
+      } else {
+        process.stdout.write(`    ${at}  ${c.slug} — ${c.kind}\n`);
+      }
+    }
+  }
   // DDR-079 migration advisory: a config with no explicit `syncTsx` rides the
   // default, which FLIPPED from off→on in maude 0.27. Surface it so an upgrader
   // who relied on the old "TSX never syncs" behavior isn't surprised that every

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@1agh/maude",
-  "version": "0.29.0",
+  "version": "0.30.0",
   "description": "Marketplace of Claude Code plugins by Michal Dovrtěl: `design` (canvas-first design iteration) + `flow` (generic agentic workflow loop with .ai second brain). Ships the `maude` CLI (with `mdcc` legacy alias) to scaffold workspace, run the design dev server, and manage configs.",
   "type": "module",
   "engines": {
@@ -41,13 +41,13 @@
     "prepublishOnly": "bash scripts/check-version-parity.sh && bash apps/studio/bin/check-runtime-bundles.sh"
   },
   "optionalDependencies": {
-    "@1agh/maude-darwin-arm64": "0.29.0",
-    "@1agh/maude-darwin-x64": "0.29.0",
-    "@1agh/maude-linux-arm64": "0.29.0",
-    "@1agh/maude-linux-arm64-musl": "0.29.0",
-    "@1agh/maude-linux-x64": "0.29.0",
-    "@1agh/maude-linux-x64-musl": "0.29.0",
-    "@1agh/maude-win32-x64": "0.29.0"
+    "@1agh/maude-darwin-arm64": "0.30.0",
+    "@1agh/maude-darwin-x64": "0.30.0",
+    "@1agh/maude-linux-arm64": "0.30.0",
+    "@1agh/maude-linux-arm64-musl": "0.30.0",
+    "@1agh/maude-linux-x64": "0.30.0",
+    "@1agh/maude-linux-x64-musl": "0.30.0",
+    "@1agh/maude-win32-x64": "0.30.0"
   },
   "files": [
     "cli",

package/plugins/design/templates/_shell.html

@@ -177,14 +177,27 @@
       // ai-activity via postMessage when embedded; the own-WS path (standalone /
       // same-origin inspector socket) is handled in connectHmr below.
       let agentEditing = false;
+      // SECURITY (ethical-hacker A1) — the CSS-panel optimistic-reload-skip
+      // timestamp lives HERE, in the shell-script closure, NOT a window global:
+      // the canvas module shares this realm, so a window global would let
+      // untrusted canvas JS pin it and suppress reloads to desync view/source.
+      // It's set ONLY from the parent-gated message below (a canvas self-post
+      // can't reach it), and the HMR echo-guard reads this local, not window.*.
+      let lastCssOptimisticAt = 0;
       window.addEventListener('message', (e) => {
         // DDR-078 security follow-up: only the trusted embedding parent relays
-        // ai-activity. Reject canvas self-posts (which could flip the HMR gate)
-        // and any non-parent source. Standalone gets it via its own WS below.
+        // ai-activity / apply-style. Reject canvas self-posts (which could flip
+        // the HMR gate) and any non-parent source. Standalone gets it via its WS.
         if (e.source !== window.parent || window.parent === window) return;
         const m = e && e.data;
-        if (!m || typeof m !== 'object' || m.dgn !== 'ai-activity') return;
-        if (myFileKey && m.file === myFileKey) agentEditing = !!m.entry;
+        if (!m || typeof m !== 'object') return;
+        if (m.dgn === 'ai-activity') {
+          if (myFileKey && m.file === myFileKey) agentEditing = !!m.entry;
+        } else if (m.dgn === 'apply-style') {
+          // The panel just optimistically applied an edit → skip the redundant
+          // follow-up module reload (set here, parent-verified).
+          lastCssOptimisticAt = Date.now();
+        }
       });
 
       // Soft reload — re-import the canvas module (cache-busted) and swap it in
@@ -320,6 +333,17 @@
             } else if (msg.mode === 'module' || msg.mode === 'hard') {
               // Only reload when the change touches *this* canvas (or `_lib`).
               if (msg.mode === 'hard' || !msg.file || (canvasRel && msg.file === canvasRel)) {
+                // Phase 12.3 — CSS-panel echo guard. The panel applies each
+                // edit optimistically to the live DOM (dgn:'apply-style'), so a
+                // `module` reload for THIS canvas's own edit is redundant churn:
+                // it remounts the canvas, drops the selection halo, and flickers
+                // the iframe. Skip it within a short window of a self-applied
+                // optimistic style. `hard` (_lib rebuild) is global — never
+                // skipped. Mirrors the meta echo-guard below.
+                if (msg.mode === 'module') {
+                  // read the parent-verified local (NOT a canvas-writable global)
+                  if (Date.now() - lastCssOptimisticAt < 1500) return;
+                }
                 // Phase 13.1 / DDR-077 — when an agent is live-editing, soft-
                 // reload (hold last good on a broken intermediate). Manual edits
                 // (or no runtime yet) keep the plain, immediate hard reload.