Make the dialogue/utterance editor vertical, matching the mystery graph

Input on top, output on the bottom, exit sinks in a row below; wires flow
downward. Cards auto-expand, so their heights are measured (offsetHeight) to
place the bottom output port. Seed and Tab-created utterances now stack downward.

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

server/storyGraphRepository.ts

@@ -280,7 +280,7 @@ export function createStoryGraphRepository(pool: Pool): StoryGraphRepository {
             }
             const utteranceId = randomUUID(); created.push(utteranceId)
             await client.query('INSERT INTO osint.utterances (id,node_id,utterer,npc_id,pose_key,text,xpos,ypos,sort_order) VALUES ($1,$2,$3,$4,$5,$6,$7,$8,$9)',
-              [utteranceId, nodeIds.get(node.key), utterance.utterer || 'npc', npcId, utterance.pose || null, utterance.text, 40 + index * 250, 60, index])
+              [utteranceId, nodeIds.get(node.key), utterance.utterer || 'npc', npcId, utterance.pose || null, utterance.text, 60, 60 + index * 120, index])
           }
           // Chain via parent: each line follows the previous one (one child = linear).
           for (let i = 1; i < created.length; i++)