@marver-design/marver 0.7.0 → 0.8.1

package/src/client/shell/icons.tsx

@@ -40,16 +40,20 @@ export const MonitorIcon = icon(<path d="M208,40H48A24,24,0,0,0,24,64V176a24,24,
 export const TvIcon = icon(<path d="M216,64H147.31l34.35-34.34a8,8,0,1,0-11.32-11.32L128,60.69,85.66,18.34A8,8,0,0,0,74.34,29.66L108.69,64H40A16,16,0,0,0,24,80V200a16,16,0,0,0,16,16H216a16,16,0,0,0,16-16V80A16,16,0,0,0,216,64Zm0,136H40V80H216V200Z" />)
 export const SignpostIcon = icon(<path d="M246,106.65,212.33,69.3A16,16,0,0,0,200.44,64H136V32a8,8,0,0,0-16,0V64H40A16,16,0,0,0,24,80v64a16,16,0,0,0,16,16h80v64a8,8,0,0,0,16,0V160h64.44a16,16,0,0,0,11.89-5.3L246,117.35A8,8,0,0,0,246,106.65ZM200.44,144H40V80H200.44l28.8,32Z" />)
 export const ParallelogramDuoIcon = icon(<><path d="M239.29,59.28l-64.8,144a8,8,0,0,1-7.3,4.72H24a8,8,0,0,1-7.3-11.28l64.8-144A8,8,0,0,1,88.81,48H232A8,8,0,0,1,239.29,59.28Z" opacity=".1" /><path d="M245.43,47.31A15.94,15.94,0,0,0,232,40H88.81a16,16,0,0,0-14.59,9.43l-64.8,144A16,16,0,0,0,24,216H167.19a16,16,0,0,0,14.59-9.43l64.8-144A16,16,0,0,0,245.43,47.31ZM167.19,200H24L88.81,56H232Z" /></>)
+/** The marver mark, SOLID fill (for the Marver avatar - a filled white parallelogram on accent). */
+export const ParallelogramFillIcon = icon(<path d="M245.43,47.31A15.94,15.94,0,0,0,232,40H88.81a16,16,0,0,0-14.59,9.43l-64.8,144A16,16,0,0,0,24,216H167.19a16,16,0,0,0,14.59-9.43l64.8-144A16,16,0,0,0,245.43,47.31Z" />)
 /** Sidebar trigger, custom in Phosphor 256-space: outer frame + panel pill -
  *  pill filled while the sidebar is open, hollow while collapsed. */
 export const PanelFilledIcon = icon(<><rect x="32" y="48" width="192" height="160" rx="32" fill="none" stroke="currentColor" strokeWidth="16" /><rect x="72" y="88" width="48" height="80" rx="24" /></>)
 
 /** Plain UI frame - the rectangle every non-content sidebar row leads with. */
 export const FrameRectIcon = icon(<rect x="40" y="52" width="176" height="152" rx="20" fill="none" stroke="currentColor" strokeWidth="16" />)
+export const UserIcon = icon(<path d="M230.92,212c-15.23-26.33-38.7-45.21-66.09-54.16a72,72,0,1,0-73.66,0C63.78,166.78,40.31,185.66,25.08,212a8,8,0,1,0,13.85,8c18.84-32.56,52.14-52,89.07-52s70.23,19.44,89.07,52a8,8,0,1,0,13.85-8ZM72,96a56,56,0,1,1,56,56A56.06,56.06,0,0,1,72,96Z" />)
+export const PencilSimpleIcon = icon(<path d="M227.31,73.37,182.63,28.68a16,16,0,0,0-22.63,0L36.69,152A15.86,15.86,0,0,0,32,163.31V208a16,16,0,0,0,16,16H92.69A15.86,15.86,0,0,0,104,219.31L227.31,96a16,16,0,0,0,0-22.63ZM92.69,208H48V163.31l88-88L180.69,120ZM192,108.68,147.31,64l24-24L216,84.68Z" />)
 export const LinkIcon = icon(<path d="M137.54,186.36a8,8,0,0,1,0,11.31l-9.94,10A56,56,0,0,1,48.38,128.4L72.5,104.28A56,56,0,0,1,149.31,102a8,8,0,1,1-10.64,12,40,40,0,0,0-54.85,1.63L59.7,139.72a40,40,0,0,0,56.58,56.58l9.94-9.94A8,8,0,0,1,137.54,186.36Zm70.08-138a56.08,56.08,0,0,0-79.22,0l-9.94,9.95a8,8,0,0,0,11.32,11.31l9.94-9.94a40,40,0,0,1,56.58,56.58L172.18,140.4a40,40,0,0,1-54.85,1.6,8,8,0,1,0-10.64,12,56,56,0,0,0,76.81-2.26l24.12-24.12A56.08,56.08,0,0,0,207.62,48.38Z" />)
 export const LaserIcon = icon(<><circle cx="128" cy="128" r="56" fill="none" stroke="currentColor" strokeWidth="16" /><path d="M128 24 V56 M128 200 V232 M24 128 H56 M200 128 H232" fill="none" stroke="currentColor" strokeWidth="16" strokeLinecap="round" /><circle cx="128" cy="128" r="12" /></>)
 
-/* Content-frame intent glyphs (SPEC-026), custom in the same 256-space. */
+/* Content-frame intent glyphs, custom in the same 256-space. */
 export const DiagramShapeIcon = icon(<><rect x="28" y="36" width="88" height="64" rx="14" fill="none" stroke="currentColor" strokeWidth="16" /><rect x="140" y="156" width="88" height="64" rx="14" fill="none" stroke="currentColor" strokeWidth="16" /><path d="M116 68 H184 V156" fill="none" stroke="currentColor" strokeWidth="16" strokeLinecap="round" strokeLinejoin="round" /></>)
 export const SpecDocIcon = icon(<><path d="M44 48 H180 M44 96 H212 M44 144 H212 M44 192 H140" fill="none" stroke="currentColor" strokeWidth="16" strokeLinecap="round" /></>)
 export const MoodboardIcon = icon(<><rect x="32" y="48" width="192" height="160" rx="20" fill="none" stroke="currentColor" strokeWidth="16" /><circle cx="96" cy="104" r="18" /><path d="M56 192 L112 128 L150 168 L178 140 L200 164 V192 Z" /></>)

package/src/client/shell/keys.ts

@@ -0,0 +1,39 @@
+/**
+ * Node-key identity for comments. Board nodes the file does not key yet used to
+ * get a RANDOM key per load - and comments anchor to node keys, so every comment
+ * created on a never-saved board orphaned on the next mount: dev board switches
+ * and reloads, and every single visit on a published canvas (which can never
+ * save keys back). Deriving the key from board + frame + occurrence makes the
+ * same board file yield the same keys in every session and for every viewer.
+ * Keys stored in the file still win; this only names the unnamed.
+ */
+
+/** 64 bits from two independent 32-bit passes (djb2-xor with different seeds):
+ *  a single 32-bit hash has practical collisions, and a collision here would
+ *  make key assignment depend on which OTHER nodes happen to be present. */
+const h32 = (s: string, seed: number): number => {
+  let h = seed
+  for (let i = 0; i < s.length; i++) h = (((h << 5) + h) ^ s.charCodeAt(i)) >>> 0
+  return h >>> 0
+}
+
+export function stableNodeKey(board: string, frame: string, salt: number): string {
+  const s = `${board}|${frame}|${salt}`
+  return 'n_' + h32(s, 5381).toString(36) + h32(s, 52711).toString(36)
+}
+
+/**
+ * The ONE answer to "which node renders this thread": the stored anchor when that
+ * node still exists AND still shows the thread's frame, else the first node showing
+ * the frame (adoption - a stale key from a past session, a board rewrite, a deleted
+ * copy must degrade to the frame, never to invisible), else null (frame not on this
+ * board). Every consumer - pin layer, reveal, the hosting checks - must agree, or
+ * a card renders on one node while another claims the hosting behavior.
+ */
+export function threadHostKey(
+  t: { nodeKey?: string; frame?: string },
+  nodes: readonly { key: string; frame: string }[],
+): string | null {
+  if (t.nodeKey && nodes.some((n) => n.key === t.nodeKey && n.frame === t.frame)) return t.nodeKey
+  return nodes.find((n) => n.frame === t.frame)?.key ?? null
+}

package/src/client/shell/mentions.ts

@@ -0,0 +1,18 @@
+/**
+ * @marver mention parsing - pure, so the rendering is unit-testable without
+ * pulling the whole comment UI (and its virtual:sh-config) into the test.
+ */
+
+/** Split a comment body into plain text and @marver mention segments (case-insensitive, word-bounded). */
+export function parseMentions(body: string): { text: string; mention: boolean }[] {
+  const out: { text: string; mention: boolean }[] = []
+  let last = 0
+  for (const m of body.matchAll(/@marver\b/gi)) {
+    const i = m.index ?? 0
+    if (i > last) out.push({ text: body.slice(last, i), mention: false })
+    out.push({ text: m[0], mention: true })
+    last = i + m[0].length
+  }
+  if (last < body.length) out.push({ text: body.slice(last), mention: false })
+  return out.length ? out : [{ text: body, mention: false }]
+}

package/src/client/shell/perf.ts

@@ -1,7 +1,7 @@
 /**
  * B0.4: canvas performance instrumentation. Zero cost unless explicitly enabled.
  *
- * Enabled in dev, or in ANY build (incl. packed/published - the SPEC-M4 gate is dev AND
+ * Enabled in dev, or in ANY build (incl. packed/published - the gate is dev AND
  * publish) via `?mvperf` in the URL or `localStorage.mvPerf==='1'`. So publish-side gate
  * measurement is possible without shipping an always-on probe.
  *

package/src/client/shell/store.ts

@@ -1,6 +1,7 @@
 import { create } from 'zustand'
 import { ROUTE } from '../const.ts'
 import { tidy, parseLayout, type BoardLayout } from './tidy.ts'
+import { stableNodeKey } from './keys.ts'
 // @ts-expect-error virtual module provided by the plugin
 import shConfig from 'virtual:sh-config'
 // @ts-expect-error virtual module: null in dev; a published build inlines manifest+boards
@@ -26,14 +27,22 @@ export interface Node {
   /** Explicit per-frame override, set by scoped theme actions; cleared by a global set.
    *  The only theme value that persists into the board file. */
   themeUser?: string
-  /** Size provenance for CONTENT frames (SPEC-026), explicit: 'auto' = measured
+  /** Size provenance for CONTENT frames, explicit: 'auto' = measured
    *  (transient - never serialized); 'manual' = the human's - measurements never
    *  overwrite; 'device' = a preset's. UI frames never carry it. Only manual/device
    *  persist, so a reload can tell an authored size from a measured one. */
   sizeMode?: 'auto' | 'manual' | 'device'
+  /** Transient (never serialized): this node was sized by the 390x844 GUESS because its
+   *  frame was not in the manifest yet AND its file carried no w/h (the create-first
+   *  choreography's append-before-scan race). applyManifest corrects ONLY these when the
+   *  frame arrives - an authored size on a temporarily-missing frame is never touched. */
+  sizeFallback?: boolean
   status: 'loading' | 'ready' | 'error'; error?: string; missing?: boolean
 }
-export interface Toast { id: number; text: string }
+/** A Live Jam notification: a persistent bottom-right glass pill for a Marver
+ *  reply. Frame-first: the FRAME is the news (icon + title, blue), Marver + preview below. */
+export interface JamNote { threadId: string; board: string; preview: string; ts: number; frame?: string; frameTitle?: string; intent?: string }
+export interface Toast { id: number; text: string; jam?: JamNote }
 
 export const CONFIG: { viewports: Record<string, { width: number; height: number }>; themes: string[]; zoomSpeed?: number; noTheme: boolean; setup?: boolean; projectName?: string } = shConfig
 
@@ -55,6 +64,18 @@ export async function fetchBoardNames(): Promise<string[]> {
 /** Display name for a board: the reserved 'all-scenes' key reads as "All scenes". */
 export const boardLabel = (n: string) => humanize(n)
 
+/** The frames a board pins, straight from its file (dev fetch / published inline) -
+ *  membership only, never a load. Cross-board data-goto asks "which board shows this
+ *  frame?" without touching the live board state. */
+export async function boardFrames(name: string): Promise<string[]> {
+  const board: any = DATA
+    ? DATA.boards[name]
+    : (await (await fetch(`${ROUTE}/api/boards/${name}`)).json())?.board
+  return Array.isArray(board?.nodes)
+    ? board.nodes.map((n: any) => (n && typeof n.frame === 'string' ? n.frame : '')).filter(Boolean)
+    : []
+}
+
 const HEADER = 28
 let toastSeq = 0
 const nodeKey = () => 'n_' + Math.random().toString(36).slice(2, 8)
@@ -82,12 +103,12 @@ const initialViewTheme = () => {
 }
 const manifestKey = (m: Manifest) => JSON.stringify(m.frames)   // any change counts, not just added/removed ids
 
-/** Latest measured content heights, keyed frameId@width. TRANSIENT by design
- *  (SPEC-026): auto sizes are never serialized - a reload remeasures. */
+/** Latest measured content heights, keyed frameId@width. TRANSIENT by design:
+ * auto sizes are never serialized - a reload remeasures. */
 const measuredHeights = new Map<string, number>()
 
 function defaultSize(frame: FrameEntry) {
-  // content frames (SPEC-026): own width from Doc layout; height from the latest
+  // content frames: own width from Doc layout; height from the latest
   // measurement at that width, or a placeholder until sh:measure lands.
   // meta.viewport, when declared, wins - the existing precedence.
   if (frame.contentWidth && !frame.viewport) {
@@ -100,7 +121,7 @@ function defaultSize(frame: FrameEntry) {
 
 let resizedInGesture = false
 
-/** sceneRows is the legacy shorthand for a plain rows layout (SPEC-024 §5). */
+/** sceneRows is the legacy shorthand for a plain rows layout. */
 const effectiveLayout = (layout: BoardLayout | null, sceneRows: string[][] | null): BoardLayout | undefined =>
   layout ?? (sceneRows?.length ? { rows: sceneRows.map((r) => [...r]) } : undefined)
 
@@ -116,14 +137,14 @@ interface State {
   selection: string[]                 // ordered; last entry is the primary (bar anchor)
   interact: string | null
   viewTheme: string                   // the global theme preference; sticky across boards and reloads
-  play: { at: string; device: string; theme: string } | null   // play mode (SPEC-M2 §1); at = current frame id
+  play: { at: string; device: string; theme: string } | null   // play mode; at = current frame id
   gesture: boolean                    // a frame drag/resize is in progress - canvas panning is disabled
-  laser: boolean                      // laser/inspect mode (SPEC-M3 §7): frames outline their structure
+  laser: boolean                      // laser/inspect mode: frames outline their structure
   board: string                       // active board name; 'all-scenes' is the auto board
   boardAuto: boolean                  // auto boards gain new frames on arrival; curated boards never do
   deviceView: string | null           // board-wide device preview (viewport name), null = free-form layout
-  sceneRows: string[][] | null        // LEGACY scene arrangement (SPEC-023 §2); still round-trips through save
-  layout: BoardLayout | null          // lane-flow recipe (SPEC-024), parsed; wins over sceneRows when both exist
+  sceneRows: string[][] | null        // LEGACY scene arrangement; still round-trips through save
+  layout: BoardLayout | null          // lane-flow recipe, parsed; wins over sceneRows when both exist
   layoutRaw: unknown                  // the author's layout VERBATIM - save round-trips this, never the parse
   baseLayout: Record<string, { x: number; y: number; w?: number; h?: number }> | null   // snapshot taken on entering a device view; Default restores it exactly (auto content entries carry positions only - their sizes are measured)
   panelOpen: boolean
@@ -169,6 +190,15 @@ interface State {
   setTheme(theme: string): void
   runTidy(): void
   toast(text: string): void
+  jamToast(note: JamNote): void
+  dismissToast(id: number): void
+  clearJamToasts(): void
+  /** Frames Marver is editing right now (Live Jam presence) - drives the working glow. */
+  working: string[]
+  /** When each working frame's job started (ms epoch) - phases the animations so parallel
+   *  frames never pulse in sync. */
+  workingSince: Record<string, number>
+  setWorking(frames: string[]): void
   spawn(frameId: string): Node | null
   save(): Promise<boolean>
 }
@@ -191,7 +221,7 @@ export const useStore = create<State>((set, get) => {
   let switchSeq = 0                                  // last click wins when board switches race
   const scheduleSave = () => { editRev++; clearTimeout(saveTimer); saveTimer = setTimeout(() => get().save(), 500) }
 
-  // SPEC-026: one cancelable, BOARD-SCOPED reflow after content measurements settle.
+  // One cancelable, BOARD-SCOPED reflow after content measurements settle.
   // The captured board name is the generation guard - a debounce surviving a board
   // switch fires into a name check and dies, never touching the new board.
   let reflowTimer: ReturnType<typeof setTimeout> | undefined
@@ -225,7 +255,7 @@ export const useStore = create<State>((set, get) => {
     },
   }
 
-  /** Published parity for content-frame sizes (SPEC-026): manual/device sizes persist
+  /** Published parity for content-frame sizes: manual/device sizes persist
    *  to the session the same way theme pins do - a board switch or reload on a
    *  published canvas must not silently drop a hand-resized spec frame. Keys are
    *  frame#occurrence: node keys are minted per load on virtual boards, but the node
@@ -293,19 +323,26 @@ export const useStore = create<State>((set, get) => {
         boardHash = sha256
         if (typeof board?.auto === 'boolean') boardAuto = board.auto
         // Agent-authored boards may be just a frame list - fill sizes/keys, tidy on first load.
-        // Keys are load-bearing (iframe identity, selection) - dupes/blanks get reminted.
-        // Board nodes whose file is gone stay, flagged - deletion is surfaced, never silent (spec §7).
+        // Keys are load-bearing (iframe identity, selection, COMMENT ANCHORS) - dupes/blanks
+        // get minted DETERMINISTICALLY (keys.ts): a random key here orphaned every comment
+        // created on a never-saved board the moment it reloaded.
+        // Board nodes whose file is gone stay, flagged - deletion is surfaced, never silent.
         const seenKeys = new Set<string>()
+        const ordinals = new Map<string, number>()   // per-frame keyless-occurrence counter
         nodes = (Array.isArray(board?.nodes) ? board.nodes : [])
           .filter((n: any) => n && typeof n.frame === 'string')
           .map((n: any) => {
             const f = manifest.frames.find((x) => x.id === n.frame)
             const d = f ? defaultSize(f) : { w: 390, h: 844 }
             if (typeof n.x !== 'number' || typeof n.y !== 'number') needTidy = true
-            let key = typeof n.key === 'string' && n.key ? n.key : nodeKey()
-            if (seenKeys.has(key)) key = nodeKey()
+            let key = typeof n.key === 'string' && n.key ? n.key : ''
+            if (!key || seenKeys.has(key)) {
+              let salt = ordinals.get(n.frame) ?? 0
+              do { key = stableNodeKey(boardName, n.frame, salt++) } while (seenKeys.has(key))
+              ordinals.set(n.frame, salt)
+            }
             seenKeys.add(key)
-            // content-frame size provenance round-trips (SPEC-026); auto nodes saved no
+            // content-frame size provenance round-trips; auto nodes saved no
             // w/h, so they fall to defaultSize (placeholder) and remeasure on mount
             const sizeMode = f?.contentWidth
               ? { sizeMode: (n.sizeMode === 'manual' || n.sizeMode === 'device' ? n.sizeMode : 'auto') as Node['sizeMode'] }
@@ -315,6 +352,7 @@ export const useStore = create<State>((set, get) => {
               frame: n.frame,
               x: typeof n.x === 'number' ? n.x : 0, y: typeof n.y === 'number' ? n.y : 0,
               w: typeof n.w === 'number' ? n.w : d.w, h: typeof n.h === 'number' ? n.h : d.h,
+              ...(!f && typeof n.w !== 'number' && typeof n.h !== 'number' ? { sizeFallback: true } : {}),
               ...sizeMode,
               // pins persist as their own field (exact round-trip). Legacy boards stored a
               // theme on EVERY node: only values differing from the frame's static default
@@ -345,7 +383,7 @@ export const useStore = create<State>((set, get) => {
         if (board?.baseLayout && typeof board.baseLayout === 'object') baseLayout = board.baseLayout
       }
       // auto-managed goes both ways (friction log #15): an auto board gains new frames
-      // AND sheds deleted ones. Tombstone cards are a curated-board concept (spec §7).
+      // AND sheds deleted ones. Tombstone cards are a curated-board concept.
       // Pruning at load DIRTIES the board (dev only) so the file on disk sheds the
       // tombstones too - otherwise a recreated frame id resurrects its stale node.
       let prunedAtLoad = false
@@ -361,6 +399,15 @@ export const useStore = create<State>((set, get) => {
       // saved piled up at the origin)
       if (boardAuto) {
         const placed = new Set(nodes.map((n) => n.frame))
+        // newcomers get deterministic keys too - on published auto boards (all-scenes)
+        // this path mints EVERY key, every visit, and comments anchor to them
+        const haveKeys = new Set(nodes.map((n) => n.key))
+        const mint = (frame: string) => {
+          let salt = 0, k = stableNodeKey(boardName, frame, salt)
+          while (haveKeys.has(k)) k = stableNodeKey(boardName, frame, ++salt)
+          haveKeys.add(k)
+          return k
+        }
         let maxX = nodes.reduce((a, n) => Math.max(a, n.x + n.w), 0)
         for (const f of manifest.frames) {
           if (placed.has(f.id)) continue
@@ -375,7 +422,7 @@ export const useStore = create<State>((set, get) => {
             : null
           if (sibling) { x = sibling.x + sibling.w + Math.max(140, sibling.w * 0.12); y = sibling.y }
           else { x = nodes.length ? maxX + 96 : 0; y = 0 }
-          const node: Node = { key: nodeKey(), frame: f.id, x, y, w, h, theme: resolveTheme(f), status: 'loading', ...(f.contentWidth ? { sizeMode: (vp ? 'device' : 'auto') as Node['sizeMode'] } : {}) }
+          const node: Node = { key: mint(f.id), frame: f.id, x, y, w, h, theme: resolveTheme(f), status: 'loading', ...(f.contentWidth ? { sizeMode: (vp ? 'device' : 'auto') as Node['sizeMode'] } : {}) }
           nodes.push(node)
           maxX = Math.max(maxX, x + w)
         }
@@ -420,7 +467,7 @@ export const useStore = create<State>((set, get) => {
   return {
     manifest: null, nodes: [], selection: [], interact: null, viewTheme: initialViewTheme(), play: null, gesture: false, laser: false,
     board: DATA?.default ?? 'all-scenes', boardAuto: (DATA?.default ?? 'all-scenes') === 'all-scenes', deviceView: null, sceneRows: null, layout: null, layoutRaw: undefined, baseLayout: null,
-    panelOpen: true, scale: 1, toasts: [], boardHash: null, dirty: false,
+    panelOpen: true, scale: 1, toasts: [], working: [], workingSince: {}, boardHash: null, dirty: false,
     pendingFrameRevisions: {}, externalLeases: {}, playUpdateRevision: null, playNav: 0,
 
     async boot() {
@@ -485,15 +532,23 @@ export const useStore = create<State>((set, get) => {
         const d = defaultSize(f)
         const maxY = next.reduce((a, n) => Math.max(a, n.y + n.h), 0)
         // a grouped newcomer lands BESIDE its siblings, not at the canvas bottom - the
-        // badge/caption say "these belong together"; the position must agree (SPEC-023 §3)
+        // badge/caption say "these belong together"; the position must agree
         const sibs = f.variantGroup
           ? next.filter((n) => { const g = m.frames.find((x) => x.id === n.frame)?.variantGroup; return g === f.variantGroup && !n.missing })
           : []
         const right = sibs.length ? sibs.reduce((a, n) => (n.x > a.x ? n : a)) : null
         const mode = f.contentWidth ? { sizeMode: (vp ? 'device' : 'auto') as Node['sizeMode'] } : {}
+        // deterministic key (keys.ts): a comment dropped on a live-joined frame must
+        // survive the reload, where the SAME key gets minted by the board-load path
+        const mintKey = (() => {
+          const have = new Set(next.map((n) => n.key))
+          let salt = 0, k = stableNodeKey(get().board, f.id, salt)
+          while (have.has(k)) k = stableNodeKey(get().board, f.id, ++salt)
+          return k
+        })()
         const node = right
-          ? { key: nodeKey(), frame: f.id, x: right.x + right.w + Math.max(140, right.w * 0.12), y: right.y, w: vp?.width ?? d.w, h: vp?.height ?? d.h, theme: resolveTheme(f), status: 'loading' as const, ...mode }
-          : { key: nodeKey(), frame: f.id, x: 0, y: maxY + 96, w: vp?.width ?? d.w, h: vp?.height ?? d.h, theme: resolveTheme(f), status: 'loading' as const, ...mode }
+          ? { key: mintKey, frame: f.id, x: right.x + right.w + Math.max(140, right.w * 0.12), y: right.y, w: vp?.width ?? d.w, h: vp?.height ?? d.h, theme: resolveTheme(f), status: 'loading' as const, ...mode }
+          : { key: mintKey, frame: f.id, x: 0, y: maxY + 96, w: vp?.width ?? d.w, h: vp?.height ?? d.h, theme: resolveTheme(f), status: 'loading' as const, ...mode }
         next.push(node)
         // in a device view, the snapshot learns the newcomer's DEFAULT size so 0 restores it sanely
         if (vp && nextBase) nextBase = { ...nextBase, [node.key]: { x: node.x, y: node.y, w: d.w, h: d.h } }
@@ -504,7 +559,21 @@ export const useStore = create<State>((set, get) => {
       let retinted = false
       for (const n of next) {
         const missing = !live.has(n.frame)
-        if (missing !== !!n.missing) { n.missing = missing; changed = true }
+        if (missing !== !!n.missing) {
+          // a node whose frame just ARRIVED (the create-first choreography: the agent
+          // appends the board node before the manifest registers the file) was sized by
+          // the 390x844 GUESS - its real viewport is only knowable now. ONLY guessed
+          // sizes are corrected (sizeFallback): a restored frame keeps its authored w/h.
+          const arrived = !missing && m.frames.find((x) => x.id === n.frame)
+          if (arrived && n.sizeFallback && !arrived.contentWidth) {
+            const d = defaultSize(arrived)
+            n.w = vp?.width ?? d.w
+            n.h = vp?.height ?? d.h
+          }
+          if (arrived) delete n.sizeFallback
+          n.missing = missing
+          changed = true
+        }
         // a frame's declared meta.theme may have changed - re-resolve unpinned nodes
         // (derived value: re-render yes, dirty/save no)
         const f = m.frames.find((x) => x.id === n.frame)
@@ -521,7 +590,7 @@ export const useStore = create<State>((set, get) => {
         if (!missing && n.status === 'error') { n.status = 'loading'; n.nav = (n.nav ?? 0) + 1; retinted = true }
       }
       // auto boards prune deleted frames outright - "auto-managed" must manage both
-      // directions (friction log #15). Curated boards keep the explicit card (spec §7).
+      // directions (friction log #15). Curated boards keep the explicit card.
       let final = next
       if (boardAuto) {
         final = next.filter((n) => !n.missing)
@@ -582,7 +651,7 @@ export const useStore = create<State>((set, get) => {
       set((s) => {
         const W = Math.max(120, w), H = Math.max(80, h)
         const cur = s.nodes.find((n) => n.key === key)
-        // a human-resized CONTENT frame goes 'manual': measurements never overwrite it (SPEC-026)
+        // a human-resized CONTENT frame goes 'manual': measurements never overwrite it
         const content = !!s.manifest?.frames.find((x) => x.id === cur?.frame)?.contentWidth
         return {
           nodes: s.nodes.map((n) => (n.key === key ? { ...n, w: W, h: H, ...(content ? { sizeMode: 'manual' as const } : {}) } : n)),
@@ -598,7 +667,7 @@ export const useStore = create<State>((set, get) => {
       if (!inGesture) scheduleSave()
     },
 
-    /** SPEC-026 sh:measure. Admission: content frames only, finite positive numbers,
+    /** sh:measure. Admission: content frames only, finite positive numbers,
      *  clamped. A height only commits when it was measured at the width being applied;
      *  auto sizes are transient - applying one never dirties the board (positions from
      *  the follow-up reflow do, exactly like a human resize). */
@@ -607,7 +676,7 @@ export const useStore = create<State>((set, get) => {
       const node = s.nodes.find((n) => n.key === key)
       // Only an explicit DEVICE viewport locks a content frame's height. 'auto' and 'manual' both
       // auto-fit height: a content frame must always grow/shrink to show ALL its content, even after
-      // the human drags its WIDTH (SPEC-026 r4). 'manual' just means the human owns the WIDTH; the
+      // the human drags its WIDTH. 'manual' just means the human owns the WIDTH; the
       // HEIGHT is still measured, so resizing width reflows and refits height (no clipped/empty frame).
       if (!node || node.sizeMode === 'device') return
       if (node.frame !== frameId) return                  // generation guard: a reused node key
@@ -657,7 +726,7 @@ export const useStore = create<State>((set, get) => {
           const f = s.manifest?.frames.find((x) => x.id === n.frame)
           const content = !!f?.contentWidth
           if (vp) return { ...n, w: vp.width, h: vp.height, ...(content ? { sizeMode: 'device' as const } : {}) }
-          // digit 0 on a CONTENT frame = back to auto: measured size, remeasure ahead (SPEC-026)
+          // digit 0 on a CONTENT frame = back to auto: measured size, remeasure ahead
           const b = s.baseLayout?.[n.key]
           if (content && f) {
             const d = defaultSize(f)
@@ -702,7 +771,7 @@ export const useStore = create<State>((set, get) => {
           if (vp) return { ...n, w: vp.width, h: vp.height, ...(content ? { sizeMode: 'device' as const } : {}) }
           if (!f) return n
           const d = defaultSize(f)
-          // digit 0 on a content frame clears provenance back to auto (SPEC-026)
+          // digit 0 on a content frame clears provenance back to auto
           return { ...n, w: d.w, h: d.h, ...(content ? { sizeMode: 'auto' as const } : {}) }
         })
         const baseLayout = s.baseLayout ? { ...s.baseLayout } : null
@@ -717,7 +786,7 @@ export const useStore = create<State>((set, get) => {
     selectAll() {
       set((s) => ({ selection: s.nodes.map((n) => n.key) }))
     },
-    // group/scene selection from sidebar rows and canvas captions (SPEC-023 feedback)
+    // group/scene selection from sidebar rows and canvas captions
     selectMany(keys) {
       set((s) => {
         const valid = keys.filter((k) => s.nodes.some((n) => n.key === k))
@@ -745,7 +814,7 @@ export const useStore = create<State>((set, get) => {
     },
     setGesture(gesture) {
       set({ gesture })
-      // SPEC-024 §4: a board WITH a layout recipe re-applies it when a resize
+      // A board WITH a layout recipe re-applies it when a resize
       // gesture ends - sizes changed, so lanes and gaps must recompute
       if (!gesture && resizedInGesture) {
         resizedInGesture = false
@@ -833,6 +902,22 @@ export const useStore = create<State>((set, get) => {
       set((s) => ({ toasts: [...s.toasts, { id, text }] }))
       setTimeout(() => set((s) => ({ toasts: s.toasts.filter((t) => t.id !== id) })), 4000)
     },
+    /** A Live Jam reply notification: persistent (no auto-dismiss), one per thread (a newer reply
+     *  supersedes), capped so the stack stays small. */
+    jamToast(note) {
+      const id = ++toastSeq
+      set((s) => ({ toasts: [...s.toasts.filter((t) => t.jam?.threadId !== note.threadId), { id, text: 'Marver replied', jam: note }].slice(-8) }))
+    },
+    dismissToast(id) { set((s) => ({ toasts: s.toasts.filter((t) => t.id !== id) })) },
+    clearJamToasts() { set((s) => ({ toasts: s.toasts.filter((t) => !t.jam) })) },
+    setWorking(frames) {
+      // preserve each frame's original start time; stamp now() only for newly-working frames -
+      // the start phases the working animations so parallel frames never pulse in sync
+      const prev = get().workingSince
+      const workingSince: Record<string, number> = {}
+      for (const f of frames) workingSince[f] = prev[f] ?? Date.now()
+      set({ working: frames, workingSince })
+    },
     spawn(frameId) {
       const { manifest, nodes, deviceView, baseLayout } = get()
       const f = manifest?.frames.find((x) => x.id === frameId)
@@ -855,7 +940,7 @@ export const useStore = create<State>((set, get) => {
       // a resize gesture in flight = torn state (new sizes, pre-recipe positions):
       // even a PREVIOUSLY scheduled timer must defer to the gesture-end save
       if (get().gesture && resizedInGesture) { scheduleSave(); return Promise.resolve(false) }
-      // a published canvas is read-only ON DISK (spec §12): theme pins persist to the
+      // a published canvas is read-only ON DISK: theme pins persist to the
       // session instead, and dirty must clear or switchBoard's save-flush loop wedges
       if (DATA) {
         sessionPins.write(get().board, get().nodes)
@@ -866,11 +951,11 @@ export const useStore = create<State>((set, get) => {
       const p = saveChain.then(async () => {
         // recheck INSIDE the serialized chain: a save queued behind an in-flight PUT
         // may only execute after a resize gesture began - the entry guard above ran
-        // too early to see it (codex probe: torn PUT #2 behind blocked PUT #1)
+        // too early to see it (torn PUT #2 behind blocked PUT #1)
         if (get().gesture && resizedInGesture) { scheduleSave(); return false }
         const rev = editRev
         const { nodes, boardHash, deviceView, baseLayout, board: boardName, boardAuto } = get()
-        // Missing nodes persist too - only the explicit remove button drops them (spec §7).
+        // Missing nodes persist too - only the explicit remove button drops them.
         const board = {
           version: 1, name: boardName, auto: boardAuto,
           // deviceView and the free-form snapshot persist independently: a scoped
@@ -879,7 +964,7 @@ export const useStore = create<State>((set, get) => {
           ...(get().sceneRows?.length ? { sceneRows: get().sceneRows } : {}),
           ...(get().layoutRaw !== undefined ? { layout: get().layoutRaw } : {}),
           // baseLayout entries for auto content nodes keep POSITIONS only - their
-          // measured dimensions are transient and never reach the file (SPEC-026)
+          // measured dimensions are transient and never reach the file
           ...(baseLayout ? {
             baseLayout: Object.fromEntries(Object.entries(baseLayout).map(([k, b]) => {
               const n = nodes.find((x) => x.key === k)
@@ -887,11 +972,14 @@ export const useStore = create<State>((set, get) => {
             })),
           } : {}),
           // only PINNED themes persist - inherited values follow viewTheme at load time.
-          // Content frames in AUTO save no dimensions (SPEC-026): measured sizes are
+          // Content frames in AUTO save no dimensions: measured sizes are
           // transient - a reflow-triggered save can never leak an auto height to disk.
-          nodes: nodes.map(({ key, frame, x, y, w, h, themeUser, sizeMode }) => ({
+          // Guessed sizes (sizeFallback: the frame was not in the manifest yet) stay
+          // transient too - persisting the 390x844 guess would make it look authored
+          // and immortalize it across reloads.
+          nodes: nodes.map(({ key, frame, x, y, w, h, themeUser, sizeMode, sizeFallback }) => ({
             key, frame, x: Math.round(x), y: Math.round(y),
-            ...(sizeMode === 'auto' ? {} : { w: Math.round(w), h: Math.round(h) }),
+            ...(sizeMode === 'auto' || sizeFallback ? {} : { w: Math.round(w), h: Math.round(h) }),
             ...(sizeMode === 'manual' || sizeMode === 'device' ? { sizeMode } : {}),
             ...(themeUser ? { themeUser } : {}),
           })),