feat(FN-3913): align settings modal header action button sizing

Fixes header action button sizing in the SettingsModal to improve visual alignment across desktop and mobile, with regression tests added to prevent future regressions.

Fusion-Task-Id: FN-3913

packages/dashboard/app/components/SettingsModal.css

@@ -4,6 +4,8 @@
 
 /* === Settings Modal header action buttons (Star on GitHub, Help) === */
 .settings-header-actions {
+  --settings-header-action-height: calc(var(--space-md) * 2 + var(--space-xs) / 2);
+
   display: flex;
   align-items: stretch;
   gap: var(--space-xs);
@@ -14,16 +16,26 @@
 /* Keep the GitHub Star and Help buttons at matching heights regardless of
    their differing icon sizes (provider icon 16px vs. HelpCircle 13px). */
 .settings-header-actions > .settings-github-star-btn,
-.settings-header-actions > .btn {
-  height: calc(var(--space-md) * 2 + var(--space-xs) / 2);
+.settings-header-actions > .settings-header-help-btn {
+  height: var(--settings-header-action-height);
   box-sizing: border-box;
 }
 
+.settings-header-help-btn {
+  display: inline-flex;
+  align-items: center;
+}
+
 @media (max-width: 768px) {
   /* Preserve mobile touch targets while keeping visuals compact via icon sizing/padding. */
+  .settings-header-actions {
+    --settings-header-action-height: calc(var(--space-md) * 3);
+  }
+
   .settings-header-actions > .btn-icon,
-  .settings-header-actions > .settings-github-star-btn {
-    min-height: calc(var(--space-md) * 3);
+  .settings-header-actions > .settings-github-star-btn,
+  .settings-header-actions > .settings-header-help-btn {
+    min-height: var(--settings-header-action-height);
   }
 
   .settings-header-actions > .btn-icon {
@@ -32,7 +44,7 @@
 
   .settings-github-star-btn__action,
   .settings-github-star-btn__count {
-    min-height: calc(var(--space-md) * 3);
+    min-height: var(--settings-header-action-height);
   }
 }
 

packages/dashboard/app/components/SettingsModal.tsx

@@ -5880,7 +5880,7 @@ export function SettingsModal({
               href="https://github.com/Runfusion/Fusion/discussions"
               target="_blank"
               rel="noopener noreferrer"
-              className="btn btn-sm"
+              className="btn btn-sm settings-header-help-btn"
               aria-label="Help and discussions"
               title="Help and discussions"
             >

packages/dashboard/app/components/__tests__/SettingsModal.test.tsx

@@ -716,6 +716,23 @@ describe("SettingsModal", () => {
     });
   });
 
+  describe("settings header actions", () => {
+    it("renders Help and GitHub star controls with shared header sizing contract class hooks", async () => {
+      renderModal();
+      await waitForSettingsModalReady();
+
+      const headerActions = document.querySelector(".settings-header-actions");
+      expect(headerActions).toBeInTheDocument();
+
+      const starLink = within(headerActions as HTMLElement).getByRole("link", { name: "Star Fusion on GitHub" });
+      const helpLink = within(headerActions as HTMLElement).getByRole("link", { name: "Help and discussions" });
+
+      expect(starLink).toHaveClass("settings-github-star-btn");
+      expect(helpLink).toHaveClass("settings-header-help-btn");
+      expect(helpLink).toHaveClass("btn", "btn-sm");
+    });
+  });
+
   describe("settings version display", () => {
     it("renders the app version from the health endpoint", async () => {
       renderModal();

packages/dashboard/app/components/__tests__/settings-mobile.test.tsx

@@ -334,6 +334,12 @@ describe("SettingsModal mobile adaptations", () => {
     // Base rules: desktop uses --space-xl horizontal margin for remote header elements
     expectBaseRule(css, ".remote-status-bar", "margin: 0 var(--space-xl) var(--space-md);");
     expectBaseRule(css, ".remote-share-block", "margin: 0 var(--space-xl) var(--space-md);");
+
+    // Settings header actions keep Help/Star controls on a shared height contract.
+    expectBaseRule(css, ".settings-header-actions", "--settings-header-action-height: calc(var(--space-md) * 2 + var(--space-xs) / 2);");
+    expectBaseRule(css, ".settings-header-actions > .settings-header-help-btn", "height: var(--settings-header-action-height);");
+    expectMobileRule(css, ".settings-header-actions", "--settings-header-action-height: calc(var(--space-md) * 3);");
+    expectMobileRule(css, ".settings-header-actions > .settings-header-help-btn", "min-height: var(--settings-header-action-height);");
   });
 
   it("styles settings scrollbar rules for sidebar and content", () => {