Tab row: fit nine tabs inside the centre column

The ninth tab (Shader) pushed the row past the centre column: List
ended at 962 while the column ended at 925, so the last buttons sat
under the inspector and clickText('Container') hit the List tab
instead (CI runs 5 and 6, module 16). Tab buttons now use padding 4
via a new Button padding option; e2e step 14b guards the row width
using the widget box rather than getBounds(), which sees only the
label on an untoggled ghost button.

Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com>

src/editor/Editor.ts

@@ -270,8 +270,24 @@ export class Editor implements PlayHost {
     ui().focus.validate();
   }
 
+  /**
+   * Global x-extent of every tab button, from the widget box – not `getBounds()`, which on an
+   * untoggled ghost tab sees nothing but the label (the background is not drawn at all).
+   */
+  tabBounds(): Record<CentreTab, { x: number; right: number }> {
+    const out = {} as Record<CentreTab, { x: number; right: number }>;
+    for (const tab of TAB_ORDER) {
+      const button = this.tabButtons[tab];
+      const x = button.toGlobal({ x: 0, y: 0 }).x;
+      out[tab] = { x, right: x + button.w };
+    }
+    return out;
+  }
+
   private tabButton(tab: CentreTab): Button {
-    return new Button(TAB_LABELS[tab], { variant: 'ghost', minWidth: 90, onClick: () => this.showTab(tab) });
+    // Half the theme padding: nine tabs at the full 8 px overflow the centre column of a 1280 px
+    // window by 27 px, and a button past its edge sits under the inspector (measured, CI run 5).
+    return new Button(TAB_LABELS[tab], { variant: 'ghost', padding: 4, onClick: () => this.showTab(tab) });
   }
 
   boot(): Promise<void> {