fix(FN-2491): align auth actions in mobile settings modal

- Import SettingsModal.css directly in SettingsModal to ensure extracted styles load reliably
- Adjust mobile auth provider layout so non-info header actions stay right-aligned
- Align API key controls to the right on mobile by updating section, row, and button alignment rules
- Extend mobile CSS regression assertions to cover the new auth alignment rules

packages/dashboard/app/components/SettingsModal.css

@@ -801,6 +801,10 @@
     gap: 10px;
   }
 
+  .auth-provider-header > div:not(.auth-provider-info):not(.auth-apikey-section) {
+    margin-left: auto;
+  }
+
   .auth-provider-info {
     width: 100%;
     flex-basis: 100%;
@@ -809,11 +813,13 @@
   .auth-apikey-section {
     width: 100%;
     flex-basis: 100%;
-    align-items: stretch;
+    align-items: flex-end;
   }
 
   .auth-apikey-input-row {
+    width: 100%;
     flex-wrap: wrap;
+    justify-content: flex-end;
   }
 
   .auth-apikey-input {
@@ -824,6 +830,7 @@
 
   .auth-apikey-input-row .btn {
     flex-shrink: 0;
+    margin-left: auto;
   }
 
   .auth-hint {

packages/dashboard/app/components/SettingsModal.tsx

@@ -7,6 +7,7 @@ import type { AuthProvider, ModelInfo, BackupListResponse, SettingsExportData, M
 import { useMemoryBackendStatus } from "../hooks/useMemoryBackendStatus";
 import type { ToastType } from "../hooks/useToast";
 import { ThemeSelector } from "./ThemeSelector";
+import "./SettingsModal.css";
 import { CustomModelDropdown } from "./CustomModelDropdown";
 import { FileEditor } from "./FileEditor";
 const PluginManager = lazy(() => import("./PluginManager").then((m) => ({ default: m.PluginManager })));

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

@@ -255,6 +255,10 @@ describe("SettingsModal mobile adaptations", () => {
     expectMobileRule(css, ".settings-preset-item", "flex-direction: column;");
     expectMobileRule(css, ".settings-preset-item-actions", "justify-content: flex-start;");
     expectMobileRule(css, ".settings-preset-size-grid", "grid-template-columns: 1fr;");
+    expectMobileRule(css, ".auth-provider-header > div:not(.auth-provider-info):not(.auth-apikey-section)", "margin-left: auto;");
+    expectMobileRule(css, ".auth-apikey-section", "align-items: flex-end;");
+    expectMobileRule(css, ".auth-apikey-input-row", "justify-content: flex-end;");
+    expectMobileRule(css, ".auth-apikey-input-row .btn", "margin-left: auto;");
   });
 
   it("styles settings scrollbar rules for sidebar and content", () => {