Dialogue Editor pattern — flat chain with per-card collapse

The Dialogue Editor (engine/story-maker/src/components/events/DialogueEditor.tsx) renders the active conversation path as a flat vertical stack of cards, one per dialogue beat. Each card is independently collapsible.

Collapsed state: a single inline line Speaker: dialogue text → "active reply" with an EXPAND button on the right.

Expanded state: full editor (speaker / mood / dialogue text / response tabs / active response detail). A COLLAPSE button is absolutely positioned in the top-right corner — mirrors the EXPAND position exactly so the eye lands in the same spot.

Default behavior: ancestors collapsed, leaf expanded on first mount.

Why:

• Earlier iteration was recursive nesting (each beat rendered its child inside its active response detail). Got unreadable past 3-4 levels.
• Tabs alone weren't enough — visual clutter came from repeated speaker dropdowns, moods, and content textareas at every level.
• Collapsing the speaker/mood/content of ancestor beats while keeping the path readable as a transcript ("Player: X → Barista: Y → ...") was the win.

How to apply:

• Don't try to nest dialogue UIs recursively. The flat-chain pattern is intentional.
• New per-beat UI elements (effects, prerequisites, etc.) belong inside the active response detail panel of the relevant card, not as siblings of the card.
• Per-card collapse state is keyed by event ID in a Set<string>; preserve this if refactoring.
• Speaker rail color uses a curated palette in the file (no hot pink, ancestry palette is wrong for this — too cool/magenta-leaning). Known names get hardcoded overrides (Barista=orange, etc.).