Keep an output's name readable beside a long inline value (#306)

An input and an output in the same port row were cut to fit each on
its own. The input text could reach x = 123 and the output label could
start at x = 83, so a long inline value ran under the output's name.
At Animation playing a long animation name covered "progress".

- The output label is placed first and keeps its room. The input text
  is cut with an ellipsis 6 px before it, as decided in the issue.
- The rule is a pure function in src/editor/graph/portRow.ts. A row
  without an output keeps the input's old limit of 108 px.
- The value a run shows beside an output uses the same rule. Its left
  edge can no longer lie right of its right edge.
- New test hook __gm.graph.rowSpans(nodeId) gives each row's input
  and output text as cut and placed, in node units.
- NODE_WIDTH stays as it is, as decided in the issue.

Tests:
- Gate: 230 files, 3520 tests (6 new in port-row.test.ts).
- e2e 6: all passed, 149 checks (148 + 1).
- Counter-check: with the rule switched off, the input text reaches
  x = 121.4 under "progress" at x = 114.1, and the new check fails.

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

src/editor/debug/graphHooks.ts

@@ -20,6 +20,8 @@ export function graphHooks({ state, editor }: HookContext) {
       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),
+      /** Each row's input and output text as cut and placed, in node units: two that overlap collide (#306). */
+      rowSpans: (nodeId: string) => graphEditor.canvas.nodeRowSpans(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`. */