Fix WebInterface node overlap for large arbitration graphs

[Copilot]

The graph layout algorithm used a fixed uniform height per option (optionOuterHeight = 50px), ignoring the actual vertical space consumed by nested arbitrators. This caused sibling subtrees at the same depth to overlap when children had differing numbers of descendants.

Changes

• arbitrator_option.js: Replace flat uniform-spacing layout with subtree-aware positioning:
  • Add optionSubtreeHeight(behavior) — recursively sums children's heights (leaf → optionOuterHeight; arbitrator → sum of children's subtree heights)
  • Rewrite optionY(index) to accumulate subtree heights and center each node within its allocated space, instead of multiplying by a fixed step

// Before: uniform 50px step regardless of subtree depth
optionY(index) {
    return index * this.optionOuterHeight
        - this.options.length / 2 * this.optionOuterHeight
        + this.optionOuterHeight / 2;
}

// After: each option occupies space proportional to its subtree
optionY(index) {
    let totalHeight = 0;
    for (const option of this.options) {
        totalHeight += this.optionSubtreeHeight(option.behavior);
    }
    let subtreeStartY = this.optionInnerHeight / 2 - totalHeight / 2;
    let y = subtreeStartY;
    for (let i = 0; i < index; i++) {
        y += this.optionSubtreeHeight(this.options[i].behavior);
    }
    let currentSubtreeHeight = this.optionSubtreeHeight(this.options[index].behavior);
    return y + currentSubtreeHeight / 2 - this.optionInnerHeight / 2;
}

Backward-compatible: flat (leaf-only) trees produce identical positions to the previous algorithm.

• example_nested_large.yaml + UI link: adds the example from the issue report as a loadable demo.

Before / After

Large nested graph (from the issue) — nodes no longer overlap:

Existing nested example — unaffected:

Original prompt

---

This section details on the original issue you should resolve

<issue_title>WebInterface is overlapping with larger arbitration_graphs</issue_title>
<issue_description>WebInterface is unusable with larger arbitration_graphs as nodes overlay each other, see example here:

type: PriorityArbitrator
name: R
invocationCondition: true
commitmentCondition: true
options:
  - type: Option
    behavior:
      type: PriorityArbitrator
      name: Uninitialized
      invocationCondition: true
      commitmentCondition: true
      options:
        - type: Option
          behavior:
            type: Behavior
            name: A
            invocationCondition: true
            commitmentCondition: true
          verificationResult: passed
          flags:
            - INTERRUPTABLE
        - type: Option
          behavior:
            type: Behavior
            name: B
            invocationCondition: false
            commitmentCondition: false
          flags:
            - INTERRUPTABLE
        - type: Option
          behavior:
            type: Behavior
            name: C
            invocationCondition: false
            commitmentCondition: false
          flags:
            - INTERRUPTABLE
        - type: Option
          behavior:
            type: Behavior
            name: D
            invocationCondition: true
            commitmentCondition: true
          flags:
            - INTERRUPTABLE
      activeBehavior: 0
    verificationResult: passed
    flags:
      - INTERRUPTABLE
  - type: Option
    behavior:
      type: PriorityArbitrator
      name: E
      invocationCondition: true
      commitmentCondition: false
      options:
        - type: Option
          behavior:
            type: Behavior
            name: F
            invocationCondition: false
            commitmentCondition: false
          flags:
            - INTERRUPTABLE
        - type: Option
          behavior:
            type: Behavior
            name: G
            invocationCondition: false
            commitmentCondition: false
          flags:
            - INTERRUPTABLE
        - type: Option
          behavior:
            type: PriorityArbitrator
            name: H
            invocationCondition: true
            commitmentCondition: false
            options:
              - type: Option
                behavior:
                  type: Behavior
                  name: I
                  invocationCondition: false
                  commitmentCondition: false
                flags:
                  - INTERRUPTABLE
              - type: Option
                behavior:
                  type: Behavior
                  name: J
                  invocationCondition: true
                  commitmentCondition: true
                flags:
                  - INTERRUPTABLE
          flags:
            - INTERRUPTABLE
    flags:
      - INTERRUPTABLE
activeBehavior: 0
```</issue_description>

## Comments on the Issue (you are @copilot in this section)

<comments>
<comment_new><author>@orzechow</author><body>
Dear @MarvinKlemp, thanks for reporting! Nice to see, that you're using our library 🚀 

This issue is a known problem – caused by our attempt for a recursive compact rendering.
Unfortunately, it needs a refactoring of the graph drawing algorithm. Thus, I can't give you a time estimate for a fix.
Feel free to contribute, if you're into WebDev.

We're aware though, that this is a blocker for using the UI with large arbitration graphs and should be fixed!
Until then, you can fall back to the terminal printouts for debugging…</body></comment_new>
</comments>

• Fixes WebInterface is overlapping with larger arbitration_graphs #119

---

✨ Let Copilot coding agent set things up for you — coding agent works faster and does higher quality work when set up for your repo.

[orzechow]

Please avoid adding more dependencies.