Give the desktop version-mismatch warning a resolution path

The Software Updates section showed a red "version mismatch" warning next
to "Check for Updates", but that button only queries for a newer release and
can never reconcile a frontend/backend mismatch — so users clicked it, saw a
spinner, and the warning stayed put.

Reframe the warning as an informational Alert placed at the bottom of the card,
decoupled from the update button, and give it a concrete resolution path
(restart to finish applying the update; reinstall the latest version if it
persists). It now names the two versions in play instead of the opaque
"client / AppConfig" wording.

Generated-By: PostHog Code
Task-Id: 008872df-bfde-4089-a6ed-f4a431e93957

frontend/editor/public/locales/en-US/translation.toml

@@ -9046,7 +9046,9 @@ updateBehaviorError = "Could not change update behavior"
 updateBehaviorErrorLocked = "This setting is locked by your administrator."
 updateBehaviorLockedDescription = "Your administrator has configured how Stirling-PDF handles updates on this machine. Contact them to change this."
 updateBehaviorSaved = "Update behavior saved."
-versionMismatch = "Warning: A mismatch has been detected between the client version and the AppConfig version. Using different versions can lead to compatibility issues, errors, and security risks. Please ensure that server and client are using the same version."
+versionMismatch = "The app frontend ({{frontendVersion}}) and backend ({{backendVersion}}) are running different versions. This usually happens briefly while an update is being applied."
+versionMismatchResolution = "Restart Stirling-PDF to finish applying the update. If the warning persists after restarting, reinstall the latest version to bring both components back in sync."
+versionMismatchTitle = "Version mismatch"
 viewDetails = "View Details"
 
 [settings.general.versionInfo]

frontend/editor/src/core/components/shared/config/configSections/GeneralSection.tsx

@@ -11,6 +11,7 @@ import {
   Group,
   Anchor,
   Badge,
+  Alert,
 } from "@mantine/core";
 import { Button } from "@app/ui/Button";
 import { ActionIcon } from "@app/ui/ActionIcon";
@@ -304,14 +305,6 @@ const GeneralSection: React.FC<GeneralSectionProps> = ({
                       {frontendVersionLabel}
                     </Text>
                   </Text>
-                  {mismatchVersion && (
-                    <Text size="sm" c="red" mt={4}>
-                      {t(
-                        "settings.general.updates.versionMismatch",
-                        "Warning: A mismatch has been detected between the client version and the AppConfig version. Using different versions can lead to compatibility issues, errors, and security risks. Please ensure that server and client are using the same version.",
-                      )}
-                    </Text>
-                  )}
                 </div>
               </Group>
             )}
@@ -461,6 +454,48 @@ const GeneralSection: React.FC<GeneralSectionProps> = ({
                 />
               </Stack>
             )}
+
+            {/* Frontend/backend version mismatch notice. Informational, not an
+                error, and deliberately separated from "Check for Updates" — the
+                update check only looks for a newer *release* and cannot
+                reconcile a mismatch between the app's bundled components. The
+                mismatch is normally transient while an update is being applied,
+                so the resolution is to restart (or reinstall) the app rather
+                than to check for updates. */}
+            {mismatchVersion && (
+              <Alert
+                variant="light"
+                color="yellow"
+                icon={
+                  <LocalIcon
+                    icon="info-outline-rounded"
+                    width="1.2rem"
+                    height="1.2rem"
+                  />
+                }
+                title={t(
+                  "settings.general.updates.versionMismatchTitle",
+                  "Version mismatch",
+                )}
+              >
+                <Text size="sm">
+                  {t(
+                    "settings.general.updates.versionMismatch",
+                    "The app frontend ({{frontendVersion}}) and backend ({{backendVersion}}) are running different versions. This usually happens briefly while an update is being applied.",
+                    {
+                      frontendVersion: frontendVersionLabel,
+                      backendVersion: config?.appVersion ?? "",
+                    },
+                  )}
+                </Text>
+                <Text size="sm" mt={4}>
+                  {t(
+                    "settings.general.updates.versionMismatchResolution",
+                    "Restart Stirling-PDF to finish applying the update. If the warning persists after restarting, reinstall the latest version to bring both components back in sync.",
+                  )}
+                </Text>
+              </Alert>
+            )}
           </Stack>
         </Paper>
       )}