fix(ui): unify heading help, table sizing and navigation contracts

Verified with the coordinated workspace changes by devkit full run
2026-09-08T225814-186389-0000-3e3ed7cd (all seven phases passed).
This shared UI pass does not mark the individual module reviews complete.

webui/conformance/HeadingHelpScenario.tsx

@@ -0,0 +1,38 @@
+import { useState } from "react";
+import Button from "../src/components/Button";
+import Card from "../src/components/Card";
+import Dialog from "../src/components/Dialog";
+import PageLayout from "../src/components/PageLayout";
+import PageActionBar from "../src/components/PageActionBar";
+import WorkspaceActionBar from "../src/components/WorkspaceActionBar";
+import DocumentationHelpLink, { DocumentationHelpProvider } from "../src/components/help/DocumentationHelpLink";
+import TextWithHelp from "../src/components/help/TextWithHelp";
+import WidgetHeadingHelpScenario from "./WidgetHeadingHelpScenario";
+
+export default function HeadingHelpScenario() {
+  const [open, setOpen] = useState(false);
+  const [loading, setLoading] = useState(true);
+  if (new URLSearchParams(location.search).has("widgets")) return <WidgetHeadingHelpScenario />;
+  const help = <DocumentationHelpLink reference={{ contextId: "dashboard" }} />;
+  const longTitle = `Dashboard ${"DokumentationsüberschriftOhneLeerzeichen".repeat(5)}`;
+  return <DocumentationHelpProvider localDocsAvailable={false}>
+    <main className="conformance-root">
+      <PageLayout archetype="overview" mode="embedded" title="Dashboard" titleHelp={help} headerLoading={loading}
+        actions={<PageActionBar variant="overview" primaryActions={<Button onClick={() => setLoading(value => !value)}>Toggle loading</Button>} />}>
+        <WorkspaceActionBar variant="workspace" title="Workspace" titleHelp={help} primaryActions={<Button>Refresh</Button>} />
+        <Card title={longTitle} titleHelp={help} collapsible persistCollapse={false} data-testid="help-card">
+          <p data-testid="help-card-content">Saved data</p>
+        </Card>
+        <TextWithHelp as="div" help={help}><h3>Section</h3></TextWithHelp>
+        <div style={{ width: 120 }} data-testid="raw-text-help">
+          <TextWithHelp help={help}>{"UnbrokenLabel".repeat(8)}</TextWithHelp>
+        </div>
+        <Button data-testid="open-help-dialog" onClick={() => setOpen(true)}>Edit settings</Button>
+        <Dialog open={open} title={longTitle} titleHelp={help} onClose={() => setOpen(false)}
+          footer={<Button data-testid="dialog-last-action">Save</Button>}>
+          <label>Value<input defaultValue="Saved value" /></label>
+        </Dialog>
+      </PageLayout>
+    </main>
+  </DocumentationHelpProvider>;
+}