Edit the graph during play and watch values and flow run through it

The graph was only locked by five edit-mode guards in GraphCanvas. The
running game reads the graph by reference each frame, so a new node, edge,
changed value, disconnect or undo takes effect from the next frame. Stop
discards these edits like everything else changed in play. A new On start
node does not fire for a behavior that has already started.

During play every data output shows the value it last produced, in the
highlight colour and refreshed ten times a second. Values are kept per
graph, because node ids are only unique within one; with several
instances the most recent value wins. The Variables node reads the live
variable bag, so only its own outputs are kept, as a snapshot.

Each time an exec edge fires, a bead runs along it in 0.3 s, at most one
every 0.15 s per edge, following the same curve the edge is drawn with.
Beads run on game time and freeze while paused; the game logic is
unchanged.

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>

src/editor/debugHook.ts

@@ -198,6 +198,10 @@ export function installDebugHook(app: Application, state: EditorState, editor: E
       nodeSettings: (nodeId: string) => graphEditor.canvas.nodeSettings(nodeId),
       /** Each input row as drawn: its name, and the inline value beside it while unconnected. */
       nodeInputs: (nodeId: string) => graphEditor.canvas.nodeInputs(nodeId),
+      /** Each output row as drawn: while playing, the value it last carried in front of its name. */
+      nodeOutputs: (nodeId: string) => graphEditor.canvas.nodeOutputs(nodeId),
+      /** Beads in flight on exec edges as drawn, in graph coordinates; `progress` 0 = source, 1 = target. */
+      beads: () => graphEditor.canvas.beadsDrawn(),
       /** Drawn rectangles on screen: what "fit" has to keep inside `canvasRect`. */
       nodeRect: (nodeId: string) => graphEditor.canvas.nodeRect(nodeId),
       canvasRect: () => graphEditor.canvas.canvasRect(),