From da732c7eae2fe07b259d7090893282a90723a538 Mon Sep 17 00:00:00 2001
From: Lee Kelly <hello@leekelly.org>
Date: Mon, 17 Aug 2026 02:24:44 +0000
Subject: [PATCH 1/2] refactor(settings): align settings copy and status
 feedback

- Standardize settings labels and helper text
- Add inline save and integration test statuses
- Remove obsolete sponsor section
---
 .../SettingsMetadataSponsorSection.jsx        |  28 ----
 frontend/src/index.css                        |  53 ++-----
 frontend/src/pages/ProfilePage.jsx            |   9 +-
 frontend/src/pages/Settings/SettingsPage.jsx  |  29 ++--
 .../components/CommunityGuideModal.jsx        |   9 +-
 .../components/LidarrSettingsModalContent.jsx |  60 ++++----
 .../Settings/components/PathMappingModal.jsx  |   6 +-
 .../components/PlexSelfLinkSection.jsx        |   5 +-
 .../components/QualityProfileModal.jsx        |   2 +-
 .../components/SettingsAccountTab.jsx         |  39 ++---
 .../components/SettingsConnectTab.jsx         |  27 ++--
 .../components/SettingsDiscoverTab.jsx        |  33 ++---
 .../SettingsDownloadClientsSection.jsx        |  94 ++++++------
 .../components/SettingsIndexersSection.jsx    |  46 +++---
 .../components/SettingsIntegrationCards.jsx   |  40 +++---
 .../components/SettingsMetadataTab.jsx        |   2 +-
 .../components/SettingsPlaybackSection.jsx    |  55 +++----
 .../components/SettingsPlaybackTab.jsx        |   4 +-
 .../components/SettingsRssNewsTab.jsx         |  34 ++---
 .../components/SettingsStorageSection.jsx     |  61 ++++----
 .../Settings/components/SettingsTasksTab.jsx  |   8 +-
 .../Settings/components/SettingsUsersTab.jsx  |   6 +-
 .../components/arr/SettingsArrLayout.jsx      |  12 +-
 frontend/src/pages/Settings/settingsArr.css   | 134 ++++++++++++++++--
 .../src/pages/Settings/settingsTabsConfig.js  |  36 ++---
 25 files changed, 450 insertions(+), 382 deletions(-)
 delete mode 100644 frontend/src/components/SettingsMetadataSponsorSection.jsx

diff --git a/frontend/src/components/SettingsMetadataSponsorSection.jsx b/frontend/src/components/SettingsMetadataSponsorSection.jsx
deleted file mode 100644
index ed959c45b..000000000
--- a/frontend/src/components/SettingsMetadataSponsorSection.jsx
+++ /dev/null
@@ -1,28 +0,0 @@
-import { ExternalLink, Heart } from "lucide-react";
-
-function SettingsMetadataSponsorSection() {
-  return (
-    <div className="settings-page__section settings-page__section--sponsor">
-      <div className="settings-page__section-header">
-        <h3 className="settings-page__section-title">Support hosted services</h3>
-        <Heart className="settings-page__sponsor-icon" aria-hidden="true" />
-      </div>
-      <p className="settings-page__sponsor-copy">
-        Aurral&apos;s metadata and search backends currently run on personal infrastructure and may
-        experience occasional downtime. Sponsorship goes directly toward maintaining Aurral, keeping
-        those services online, and funding cloud capacity when needed.
-      </p>
-      <a
-        href="https://github.com/sponsors/lklynet/"
-        target="_blank"
-        rel="noopener noreferrer"
-        className="btn btn-secondary btn-sm settings-page__sponsor-cta"
-      >
-        <ExternalLink className="settings-page__banner-cta-icon" aria-hidden="true" />
-        Become a sponsor
-      </a>
-    </div>
-  );
-}
-
-export default SettingsMetadataSponsorSection;
diff --git a/frontend/src/index.css b/frontend/src/index.css
index fc75a3b30..d15db93dc 100644
--- a/frontend/src/index.css
+++ b/frontend/src/index.css
@@ -9145,16 +9145,6 @@ button.native-library-genre-row:focus-visible {
   line-height: 1.5;
 }
 
-.settings-page__modal-reminder {
-  margin: 0;
-  padding: 0.5rem 0.75rem;
-  color: var(--aurral-text-muted);
-  font-size: 0.75rem;
-  line-height: 1.45;
-  background: color-mix(in srgb, var(--aurral-text) 4%, transparent);
-  border-radius: var(--aurral-radius-sm);
-}
-
 .settings-page__advanced-toggle-row {
   display: flex;
   justify-content: flex-start;
@@ -9605,34 +9595,6 @@ button.native-library-genre-row:focus-visible {
   height: 0.9rem;
 }
 
-.settings-page__section--sponsor {
-  padding: 1rem 1.125rem;
-  margin-bottom: 2rem;
-  border-radius: var(--aurral-radius-sm);
-  background: var(--aurral-surface-raised);
-}
-
-.settings-page__section--sponsor .settings-page__section-header {
-  margin-bottom: 0.5rem;
-}
-
-.settings-page__sponsor-icon {
-  width: 1rem;
-  height: 1rem;
-  color: var(--aurral-text-muted);
-}
-
-.settings-page__sponsor-copy {
-  margin: 0 0 0.875rem;
-  color: var(--aurral-text-muted);
-  font-size: 0.875rem;
-  line-height: 1.55;
-}
-
-.settings-page__sponsor-cta {
-  width: fit-content;
-}
-
 .settings-page__link {
   color: var(--aurral-text-muted);
   text-decoration: underline;
@@ -9685,11 +9647,6 @@ button.native-library-genre-row:focus-visible {
   padding: 1rem 1.125rem 0;
 }
 
-.settings-page__modal--integration .settings-page__modal-reminder {
-  flex-shrink: 0;
-  margin: 0.625rem 1.125rem 0;
-}
-
 .settings-page__modal-body {
   flex: 1;
   min-height: 0;
@@ -12475,6 +12432,7 @@ button.native-library-genre-row:focus-visible {
 }
 
 .profile-page__header {
+  position: relative;
   display: flex;
   align-items: flex-start;
   justify-content: space-between;
@@ -12489,10 +12447,17 @@ button.native-library-genre-row:focus-visible {
 }
 
 .profile-page__save-state {
+  position: absolute;
+  top: 0.25rem;
+  right: 0;
   flex-shrink: 0;
-  padding-top: 0.25rem;
   color: var(--aurral-text-subtle);
   font-size: 0.75rem;
+  visibility: hidden;
+}
+
+.profile-page__save-state.is-saving {
+  visibility: visible;
 }
 
 .profile-settings {
diff --git a/frontend/src/pages/ProfilePage.jsx b/frontend/src/pages/ProfilePage.jsx
index 51dcec6c1..252a0be6d 100644
--- a/frontend/src/pages/ProfilePage.jsx
+++ b/frontend/src/pages/ProfilePage.jsx
@@ -30,8 +30,13 @@ function ProfilePage() {
           <h1 className="page-title">Profile</h1>
           <p className="page-subtitle">Personal listening history and library defaults</p>
         </div>
-        <span className="profile-page__save-state" aria-live="polite">
-          {account.saving ? "Saving…" : "Saved automatically"}
+        <span
+          className={`profile-page__save-state${account.saving ? " is-saving" : ""}`}
+          aria-live="polite"
+          aria-busy={account.saving}
+          aria-hidden={!account.saving}
+        >
+          {account.saving ? "Saving…" : null}
         </span>
       </div>
 
diff --git a/frontend/src/pages/Settings/SettingsPage.jsx b/frontend/src/pages/Settings/SettingsPage.jsx
index 19ef53eae..374bab7f6 100644
--- a/frontend/src/pages/Settings/SettingsPage.jsx
+++ b/frontend/src/pages/Settings/SettingsPage.jsx
@@ -3,7 +3,6 @@ import { Navigate, useParams } from "react-router-dom";
 import { useToast } from "../../contexts/ToastContext";
 import { useAuth } from "../../contexts/AuthContext";
 import { useDocumentTitle } from "../../hooks/useDocumentTitle";
-import SettingsMetadataSponsorSection from "../../components/SettingsMetadataSponsorSection";
 import { useSettingsData } from "./hooks/useSettingsData";
 import { useSettingsTabs } from "./hooks/useSettingsTabs";
 import { useSettingsUsers } from "./hooks/useSettingsUsers";
@@ -207,16 +206,13 @@ function SettingsPage() {
         );
       case "metadata":
         return (
-          <>
-            <SettingsMetadataSponsorSection />
-            <SettingsMetadataTab
-              settings={data.settings}
-              updateSettings={data.updateSettings}
-              health={data.health}
-              handleSaveSettings={data.handleSaveSettings}
-              hidePanelHeader
-            />
-          </>
+          <SettingsMetadataTab
+            settings={data.settings}
+            updateSettings={data.updateSettings}
+            health={data.health}
+            handleSaveSettings={data.handleSaveSettings}
+            hidePanelHeader
+          />
         );
       case "users":
         return (
@@ -303,6 +299,17 @@ function SettingsPage() {
               activeTab={tabs.activeTab}
               onSelectTab={handleTabSelect}
             />
+            {tabs.activeTab !== "tasks" ? (
+              <div
+                className={`settings-arr__save-state${data.saving ? " is-saving" : ""}`}
+                role="status"
+                aria-live="polite"
+                aria-busy={data.saving}
+                aria-hidden={!data.saving}
+              >
+                {data.saving ? "Saving…" : null}
+              </div>
+            ) : null}
 
             {renderTabContent()}
           </div>
diff --git a/frontend/src/pages/Settings/components/CommunityGuideModal.jsx b/frontend/src/pages/Settings/components/CommunityGuideModal.jsx
index 7a990488d..d3d8ed71f 100644
--- a/frontend/src/pages/Settings/components/CommunityGuideModal.jsx
+++ b/frontend/src/pages/Settings/components/CommunityGuideModal.jsx
@@ -20,10 +20,10 @@ export function CommunityGuideModal({ show, onClose, onApply }) {
         tabIndex={-1}
       >
         <h3 id={titleId} className="settings-page__modal-title">
-          Apply Davo&apos;s Recommended Settings
+          Apply recommended settings
         </h3>
         <p className="settings-page__modal-copy">
-          This will apply Davo&apos;s Community Lidarr Guide settings to your Lidarr instance:
+          Apply Davo&apos;s Community Lidarr Guide settings to your Lidarr instance:
         </p>
         <ul className="settings-page__modal-list">
           <li>Update quality definitions for FLAC and FLAC 24bit</li>
@@ -41,15 +41,14 @@ export function CommunityGuideModal({ show, onClose, onApply }) {
             className="settings-page__link"
           >
             Read the full guide
-          </a>{" "}
-          for more details on these settings.
+          </a>
         </p>
         <div className="settings-page__modal-actions">
           <button type="button" onClick={onClose} className="btn btn-secondary">
             Cancel
           </button>
           <button type="button" onClick={onApply} className="btn btn-primary">
-            Apply Settings
+            Apply settings
           </button>
         </div>
       </div>
diff --git a/frontend/src/pages/Settings/components/LidarrSettingsModalContent.jsx b/frontend/src/pages/Settings/components/LidarrSettingsModalContent.jsx
index 1ad0aaefe..f74e6545f 100644
--- a/frontend/src/pages/Settings/components/LidarrSettingsModalContent.jsx
+++ b/frontend/src/pages/Settings/components/LidarrSettingsModalContent.jsx
@@ -41,6 +41,7 @@ export function LidarrSettingsSection({
   showInfo,
 }) {
   const [lidarrTestLatencyMs, setLidarrTestLatencyMs] = useState(null);
+  const [lidarrTestStatus, setLidarrTestStatus] = useState(null);
 
   const safeLidarrRootFolders = Array.isArray(lidarrRootFolders) ? lidarrRootFolders : [];
   const safeLidarrProfiles = Array.isArray(lidarrProfiles) ? lidarrProfiles : [];
@@ -65,16 +66,19 @@ export function LidarrSettingsSection({
     const url = settings.integrations?.lidarr?.url;
     const apiKey = settings.integrations?.lidarr?.apiKey;
     if (!url || !apiKey) {
+      setLidarrTestStatus({ tone: "error", message: "Enter the URL and API key." });
       showError("Please enter both URL and API key");
       return;
     }
     setTestingLidarr(true);
     setLidarrTestLatencyMs(null);
+    setLidarrTestStatus(null);
     const startTime = performance.now();
     try {
       const result = await testLidarrConnection(url, apiKey);
       setLidarrTestLatencyMs(Math.round(performance.now() - startTime));
       if (result.success) {
+        setLidarrTestStatus({ tone: "success", message: "Connected." });
         showSuccess(`Lidarr connection successful! (${result.instanceName || "Lidarr"})`);
         setLoadingLidarrRootFolders(true);
         setLoadingLidarrProfiles(true);
@@ -115,12 +119,14 @@ export function LidarrSettingsSection({
           setLoadingLidarrTags(false);
         }
       } else {
+        setLidarrTestStatus({ tone: "error", message: "Connection failed. Check the URL and API key, then retry." });
         showError(
           `Connection failed: ${result.message || result.error}${result.details ? `\n${result.details}` : ""}`,
         );
       }
     } catch (err) {
       setLidarrTestLatencyMs(Math.round(performance.now() - startTime));
+      setLidarrTestStatus({ tone: "error", message: "Connection failed. Check the URL and API key, then retry." });
       const errorMsg = err.response?.data?.message || err.response?.data?.error || err.message;
       showError(`Connection failed: ${errorMsg}`);
     } finally {
@@ -192,9 +198,6 @@ export function LidarrSettingsSection({
         <div className="settings-page__section-header">
           <div className="settings-page__section-intro">
             <h3 className="settings-page__section-title">Lidarr</h3>
-            <p className="settings-page__section-note">
-              Connect Aurral to your Lidarr instance and configure library defaults.
-            </p>
           </div>
         </div>
       </div>
@@ -230,11 +233,19 @@ export function LidarrSettingsSection({
             >
               {testingLidarr ? "Testing..." : "Test connection"}
             </button>
+            {lidarrTestStatus ? (
+              <span
+                className={`arr-test-result arr-test-result--${lidarrTestStatus.tone}`}
+                role={lidarrTestStatus.tone === "error" ? "alert" : "status"}
+              >
+                {lidarrTestStatus.message}
+              </span>
+            ) : null}
           </>
         }
       >
         <div className="arr-info">
-          Music library manager. File access, mounts, and path mappings are checked in{" "}
+          Music library manager. Path access and mappings are checked in{" "}
           <Link to="/settings/system" className="arr-link">
             System
           </Link>
@@ -250,13 +261,14 @@ export function LidarrSettingsSection({
             value={settings.integrations?.lidarr?.url || ""}
             onChange={(e) => {
               setLidarrTestLatencyMs(null);
+              setLidarrTestStatus(null);
               updateLidarr({ url: e.target.value });
             }}
           />
         </SettingsArrFormGroup>
 
         <SettingsArrFormGroup
-          label="API Key"
+          label="API key"
           labelFor="lidarr-api-key"
           help={
             <>
@@ -275,6 +287,7 @@ export function LidarrSettingsSection({
             value={settings.integrations?.lidarr?.apiKey || ""}
             onChange={(e) => {
               setLidarrTestLatencyMs(null);
+              setLidarrTestStatus(null);
               updateLidarr({ apiKey: e.target.value });
             }}
           />
@@ -297,7 +310,10 @@ export function LidarrSettingsSection({
       </SettingsArrFieldSet>
 
       <SettingsArrFieldSet legend="Defaults">
-        <SettingsArrFormGroup label="Default Root Folder" labelFor="lidarr-root-folder">
+        <p className="arr-form-help">
+          Users can override the root folder and quality profile in Profile.
+        </p>
+        <SettingsArrFormGroup label="Default root folder" labelFor="lidarr-root-folder">
           <SettingsSelect
             id="lidarr-root-folder"
             value={settings.integrations?.lidarr?.rootFolderPath || ""}
@@ -319,13 +335,9 @@ export function LidarrSettingsSection({
               </option>
             ))}
           </SettingsSelect>
-          <p className="settings-page__section-note">
-            Users can set their own default in Profile → Library Defaults, which overrides
-            this instance-wide setting.
-          </p>
         </SettingsArrFormGroup>
 
-        <SettingsArrFormGroup label="Default Quality Profile" labelFor="lidarr-quality-profile">
+        <SettingsArrFormGroup label="Default quality profile" labelFor="lidarr-quality-profile">
           <SettingsSelect
             id="lidarr-quality-profile"
             value={
@@ -353,13 +365,9 @@ export function LidarrSettingsSection({
               </option>
             ))}
           </SettingsSelect>
-          <p className="settings-page__section-note">
-            Users can set their own default in Profile → Library Defaults, which overrides
-            this instance-wide setting.
-          </p>
         </SettingsArrFormGroup>
 
-        <SettingsArrFormGroup label="Default Metadata Profile" labelFor="lidarr-metadata-profile">
+        <SettingsArrFormGroup label="Default metadata profile" labelFor="lidarr-metadata-profile">
           <SettingsSelect
             id="lidarr-metadata-profile"
             value={
@@ -417,23 +425,23 @@ export function LidarrSettingsSection({
           </SettingsSelect>
         </SettingsArrFormGroup>
 
-        <SettingsArrFormGroup label="Default Monitoring Option" labelFor="lidarr-monitor-option">
+        <SettingsArrFormGroup label="Default monitoring option" labelFor="lidarr-monitor-option">
           <SettingsSelect
             id="lidarr-monitor-option"
             value={settings.integrations?.lidarr?.defaultMonitorOption || "none"}
             onChange={(e) => updateLidarr({ defaultMonitorOption: e.target.value })}
           >
-            <option value="none">None (Artist Only)</option>
-            <option value="existing">Existing Albums</option>
-            <option value="all">All Albums</option>
-            <option value="future">Future Albums</option>
-            <option value="missing">Missing Albums</option>
-            <option value="latest">Latest Album</option>
-            <option value="first">First Album</option>
+            <option value="none">None (artist only)</option>
+            <option value="existing">Existing albums</option>
+            <option value="all">All albums</option>
+            <option value="future">Future albums</option>
+            <option value="missing">Missing albums</option>
+            <option value="latest">Latest album</option>
+            <option value="first">First album</option>
           </SettingsSelect>
         </SettingsArrFormGroup>
 
-        <SettingsArrFormGroup label="Search on Add">
+        <SettingsArrFormGroup label="Search on add">
           <PillToggle
             className="settings-toggle"
             checked={settings.integrations?.lidarr?.searchOnAdd || false}
@@ -456,7 +464,7 @@ export function LidarrSettingsSection({
           disabled={applyingCommunityGuide || !health?.lidarrConfigured}
           className="arr-btn arr-btn--primary"
         >
-          {applyingCommunityGuide ? "Applying..." : "Apply Davo's Recommended Settings"}
+          {applyingCommunityGuide ? "Applying..." : "Apply recommended settings"}
         </button>
         <p className="arr-form-help arr-form-help--spaced">
           Creates quality profile, updates quality definitions, adds custom formats, and updates
diff --git a/frontend/src/pages/Settings/components/PathMappingModal.jsx b/frontend/src/pages/Settings/components/PathMappingModal.jsx
index 17d7d3d6e..536e92458 100644
--- a/frontend/src/pages/Settings/components/PathMappingModal.jsx
+++ b/frontend/src/pages/Settings/components/PathMappingModal.jsx
@@ -73,7 +73,7 @@ export function PathMappingModal({ title, initialValue, onClose, onSave }) {
           </div>
           <div className="arr-modal__body">
             <SettingsArrFormGroup
-              label="Applies To"
+              label="Applies to"
               help="Limit this mapping to paths reported by a specific integration, or use all sources."
             >
               <SettingsSelect
@@ -93,7 +93,7 @@ export function PathMappingModal({ title, initialValue, onClose, onSave }) {
               </SettingsSelect>
             </SettingsArrFormGroup>
             <SettingsArrFormGroup
-              label="Remote Path"
+              label="Remote path"
               help="Path the other app reports, such as a host-only mount path from Lidarr or NZBGet."
             >
               <SettingsInput
@@ -108,7 +108,7 @@ export function PathMappingModal({ title, initialValue, onClose, onSave }) {
               />
             </SettingsArrFormGroup>
             <SettingsArrFormGroup
-              label="Local Path"
+              label="Local path"
               help="Path Aurral should use inside its container to read that remote path."
             >
               <div className="arr-path-input">
diff --git a/frontend/src/pages/Settings/components/PlexSelfLinkSection.jsx b/frontend/src/pages/Settings/components/PlexSelfLinkSection.jsx
index c40fe43f0..845d1e183 100644
--- a/frontend/src/pages/Settings/components/PlexSelfLinkSection.jsx
+++ b/frontend/src/pages/Settings/components/PlexSelfLinkSection.jsx
@@ -104,10 +104,9 @@ export function PlexSelfLinkSection({ showSuccess, showError, className = "" })
   return (
     <div className={`settings-page__section${className ? ` ${className}` : ""}`}>
       <div className="settings-page__section-intro">
-        <h3 className="settings-page__section-title">Plex Account</h3>
+        <h3 className="settings-page__section-title">Plex account</h3>
         <p className="settings-page__section-note">
-          Link your own Plex.tv account (e.g. if an admin invited you as a friend to their Plex
-          server) so your flow and shared playlists are created under your own Plex login.
+          Link your Plex account so flows and shared playlists use your login.
         </p>
       </div>
 
diff --git a/frontend/src/pages/Settings/components/QualityProfileModal.jsx b/frontend/src/pages/Settings/components/QualityProfileModal.jsx
index 399f57a97..b0c2ab82d 100644
--- a/frontend/src/pages/Settings/components/QualityProfileModal.jsx
+++ b/frontend/src/pages/Settings/components/QualityProfileModal.jsx
@@ -110,7 +110,7 @@ export function QualityProfileModal({ profile, onChange, onClose }) {
   };
 
   return (
-    <SettingsIntegrationModal title="Quality Profile" onClose={onClose} wide>
+    <SettingsIntegrationModal title="Quality profile" onClose={onClose} wide>
       <SettingsModalIntro>
         Rank qualities from best to worst. Aurral accepts allowed qualities and upgrades tracks until they reach the cutoff.
       </SettingsModalIntro>
diff --git a/frontend/src/pages/Settings/components/SettingsAccountTab.jsx b/frontend/src/pages/Settings/components/SettingsAccountTab.jsx
index 967b918ce..7de4cb8df 100644
--- a/frontend/src/pages/Settings/components/SettingsAccountTab.jsx
+++ b/frontend/src/pages/Settings/components/SettingsAccountTab.jsx
@@ -90,9 +90,6 @@ export function SettingsAccountTab({
         <div className="settings-page__section profile-settings__section">
           <div className="settings-page__section-intro">
             <h3 className="settings-page__section-title">Appearance</h3>
-            <p className="settings-page__section-note">
-              Choose how Aurral looks on this device.
-            </p>
           </div>
           <fieldset className="settings-page__fields profile-settings__fields">
             <div className="profile-settings__field">
@@ -134,9 +131,9 @@ export function SettingsAccountTab({
         <div className="settings-page__section profile-settings__section">
           <div className="settings-page__section-header">
             <div className="settings-page__section-intro">
-              <h3 className="settings-page__section-title">Listening History</h3>
+              <h3 className="settings-page__section-title">Listening history</h3>
               <p className="settings-page__section-note">
-                Connect a listening service to personalize discovery recommendations.
+                Connect a service to personalize discovery.
               </p>
             </div>
             {profileSummary ? (
@@ -172,8 +169,7 @@ export function SettingsAccountTab({
             {listenHistoryProvider === "local" ? (
               <div className="profile-settings__field">
                 <p className="settings-page__hint">
-                  Use Aurral play events for personalized recommendations. Aurral will not read
-                  listening history from an external service.
+                  Uses Aurral play events only.
                 </p>
               </div>
             ) : listenHistoryProvider === "koito" ? (
@@ -191,8 +187,7 @@ export function SettingsAccountTab({
                   onChange={(e) => setListenHistoryUrl(e.target.value)}
                 />
                 <p className="settings-page__hint">
-                  Your self-hosted Koito instance URL. Aurral reads top artists from Koito&apos;s
-                  chart API to power personalized discovery.
+                  Aurral reads top artists from Koito for personalized discovery.
                 </p>
               </div>
             ) : (
@@ -213,8 +208,7 @@ export function SettingsAccountTab({
                   onChange={(e) => setListenHistoryUsername(e.target.value)}
                 />
                 <p className="settings-page__hint">
-                  Aurral uses the profile selected above for personalized discovery recommendations.
-                  Configure the Last.fm API key in{" "}
+                  Aurral uses this profile for personalized discovery. Configure API credentials in{" "}
                   <Link to="/settings/connect" className="settings-page__link">
                     Settings → Connect
                   </Link>
@@ -233,10 +227,9 @@ export function SettingsAccountTab({
 
         <div className="settings-page__section profile-settings__section">
           <div className="settings-page__section-intro">
-            <h3 className="settings-page__section-title">Library Defaults</h3>
+            <h3 className="settings-page__section-title">Library defaults</h3>
             <p className="settings-page__section-note">
-              These defaults apply to one-click artist adds unless you override them from the
-              Customize action on the artist page.
+              Defaults for one-click artist adds. Profile values override them.
             </p>
           </div>
 
@@ -246,7 +239,7 @@ export function SettingsAccountTab({
           >
             <div className="profile-settings__field">
               <label className="profile-settings__label" htmlFor="profile-root-folder">
-                Default Root Folder
+                Default root folder
               </label>
               <SettingsSelect
                 id="profile-root-folder"
@@ -260,14 +253,11 @@ export function SettingsAccountTab({
                   </option>
                 ))}
               </SettingsSelect>
-              <p className="settings-page__hint">
-                Choose where one-click artist adds should be stored by default.
-              </p>
             </div>
 
             <div className="profile-settings__field">
               <label className="profile-settings__label" htmlFor="profile-quality-profile">
-                Default Quality Profile
+                Default quality profile
               </label>
               <SettingsSelect
                 id="profile-quality-profile"
@@ -281,9 +271,6 @@ export function SettingsAccountTab({
                   </option>
                 ))}
               </SettingsSelect>
-              <p className="settings-page__hint">
-                Choose the Lidarr quality profile for one-click artist adds.
-              </p>
             </div>
           </fieldset>
 
@@ -300,10 +287,10 @@ export function SettingsAccountTab({
 
         <div className="settings-page__section profile-settings__section profile-settings__section--action">
           <div className="settings-page__section-intro">
-            <h3 className="settings-page__section-title">Discovery Tastes</h3>
+            <h3 className="settings-page__section-title">Discovery tastes</h3>
             <p className="settings-page__section-note">
-              Clear your More like this and Less like this feedback so recommendations start fresh.
-              Manage hard exclusions on the <Link to="/blocklist" className="settings-page__link">Blocked Artists</Link> page.
+              Reset your recommendation feedback. Manage blocked artists separately.
+              {" "}<Link to="/blocklist" className="settings-page__link">Blocked artists</Link>
             </p>
           </div>
           <div className="profile-settings__action">
@@ -314,7 +301,7 @@ export function SettingsAccountTab({
               className="btn btn-secondary btn-sm"
             >
               <RotateCcw className={`artist-icon-xs${resettingTastes ? " animate-spin" : ""}`} />
-              {resettingTastes ? "Resetting…" : "Reset Discovery Tastes"}
+              {resettingTastes ? "Resetting…" : "Reset discovery tastes"}
             </button>
           </div>
         </div>
diff --git a/frontend/src/pages/Settings/components/SettingsConnectTab.jsx b/frontend/src/pages/Settings/components/SettingsConnectTab.jsx
index e72c8312d..ae4b6456a 100644
--- a/frontend/src/pages/Settings/components/SettingsConnectTab.jsx
+++ b/frontend/src/pages/Settings/components/SettingsConnectTab.jsx
@@ -1,4 +1,4 @@
-import { useState, useRef } from "react";
+import { useEffect, useState, useRef } from "react";
 import { testGotifyConnection } from "../../../utils/api/endpoints/settings.js";
 
 import { Plus, Trash2, GripVertical } from "lucide-react";
@@ -30,6 +30,7 @@ export function SettingsConnectTab({
   showError,
 }) {
   const [activeModal, setActiveModal] = useState(null);
+  const [testStatus, setTestStatus] = useState(null);
   const gotify = settings.integrations?.gotify || {};
   const lastfm = settings.integrations?.lastfm || {};
   const ticketmaster = settings.integrations?.ticketmaster || {};
@@ -97,18 +98,25 @@ export function SettingsConnectTab({
   const [dragIdx, setDragIdx] = useState(null);
   const allowDragRef = useRef(null);
 
+  useEffect(() => {
+    setTestStatus(null);
+  }, [activeModal]);
+
   const handleTestGotify = async () => {
     const url = gotify.url;
     const token = gotify.token;
     if (!url || !token) {
-      showError("Enter Gotify URL and token first");
+      setTestStatus({ tone: "error", message: "Enter the Gotify URL and token." });
+      showError("Enter the Gotify URL and token first");
       return;
     }
     setTestingGotify(true);
     try {
       await testGotifyConnection(url, token);
+      setTestStatus({ tone: "success", message: "Test notification sent." });
       showSuccess("Test notification sent.");
     } catch (err) {
+      setTestStatus({ tone: "error", message: "Test failed. Check the URL and token, then retry." });
       const msg = err.response?.data?.message || err.response?.data?.error || err.message;
       showError(`Gotify test failed: ${msg}`);
     } finally {
@@ -177,9 +185,6 @@ export function SettingsConnectTab({
     <div className="arr-page">
       <form onSubmit={handleSave} className="arr-form" autoComplete="off">
         <SettingsArrFieldSet legend="Connections">
-          <div className="arr-info">
-            External services Aurral integrates with for notifications and discovery data.
-          </div>
           <SettingsArrCardGrid>
             <IntegrationCard
               title="Gotify"
@@ -380,7 +385,7 @@ export function SettingsConnectTab({
           ))}
         </SettingsArrFieldSet>
 
-        <SettingsArrFieldSet legend="Notification Events">
+        <SettingsArrFieldSet legend="Notification events">
           <SettingsArrFormGroup label="Discover updated">
             <PillToggle
               checked={webhookEvents.notifyDiscoveryUpdated || false}
@@ -428,10 +433,7 @@ export function SettingsConnectTab({
         </SettingsArrFieldSet>
 
         <SettingsArrFieldSet legend="Inbox">
-          <div className="arr-info">
-            Choose which library-based updates appear in the inbox dropdown.
-          </div>
-          <SettingsArrFormGroup label="Enable Inbox" labelFor="inbox-enabled">
+          <SettingsArrFormGroup label="Enable inbox" labelFor="inbox-enabled">
             <PillToggle
               id="inbox-enabled"
               checked={inbox.enabled !== false}
@@ -457,7 +459,7 @@ export function SettingsConnectTab({
               onChange={(e) => updateInbox({ shows: e.target.checked })}
             />
           </SettingsArrFormGroup>
-          <SettingsArrFormGroup label="Library Artist news" labelFor="inbox-news">
+          <SettingsArrFormGroup label="Library artist news" labelFor="inbox-news">
             <PillToggle
               id="inbox-news"
               checked={inbox.news !== false}
@@ -465,7 +467,7 @@ export function SettingsConnectTab({
               onChange={(e) => updateInbox({ news: e.target.checked })}
             />
           </SettingsArrFormGroup>
-          <SettingsArrFormGroup label="Recommended Artist news" labelFor="inbox-recommended-news">
+          <SettingsArrFormGroup label="Recommended artist news" labelFor="inbox-recommended-news">
             <PillToggle
               id="inbox-recommended-news"
               checked={inbox.recommendedNews === true}
@@ -490,6 +492,7 @@ export function SettingsConnectTab({
         <SettingsIntegrationModal
           title="Gotify"
           onClose={() => setActiveModal(null)}
+          testStatus={testStatus}
           footerActions={
             <button
               type="button"
diff --git a/frontend/src/pages/Settings/components/SettingsDiscoverTab.jsx b/frontend/src/pages/Settings/components/SettingsDiscoverTab.jsx
index 0e28b418b..799385ebb 100644
--- a/frontend/src/pages/Settings/components/SettingsDiscoverTab.jsx
+++ b/frontend/src/pages/Settings/components/SettingsDiscoverTab.jsx
@@ -90,14 +90,13 @@ export function SettingsDiscoverTab({
         {showLastfmDiscoverBanner && (
           <div className="settings-page__banner">
             <div className="settings-page__banner-copy">
-              <p className="settings-page__banner-title">Optional Last.fm upgrade</p>
+              <p className="settings-page__banner-title">Last.fm recommendations</p>
               <p className="settings-page__banner-text">
-                Add a free Last.fm API key in{" "}
+                Add a Last.fm API key in{" "}
                 <Link to="/settings/connect" className="arr-link">
                   Connect
                 </Link>{" "}
-                to unlock personalized recommendations, similar artists, tag search, and custom
-                weekly flows.
+                  for personalized recommendations, tags, and weekly flows.
               </p>
             </div>
             <button
@@ -109,25 +108,24 @@ export function SettingsDiscoverTab({
                   localStorage.setItem(LASTFM_DISCOVER_BANNER_KEY, "1");
                 } catch {}
               }}
-              aria-label="Dismiss Last.fm upgrade reminder"
+              aria-label="Dismiss Last.fm recommendations"
             >
               <X className="artist-icon-sm" />
             </button>
           </div>
         )}
 
-        <SettingsArrFieldSet legend="Discovery Behavior">
+        <SettingsArrFieldSet legend="Discovery behavior">
           <div className="arr-info">
-            Controls how often Aurral refreshes recommendations and flows. Listening history API
-            keys are configured in{" "}
+            Use{" "}
             <Link to="/settings/connect" className="arr-link">
               Connect
             </Link>
-            ; per-user accounts are in{" "}
+            {" "}for API keys and{" "}
             <Link to="/profile" className="arr-link">
               Profile
             </Link>
-            .
+            {" "}for personal accounts.
           </div>
 
           <SettingsArrFormGroup label="Auto-refresh frequency" labelFor="discover-refresh">
@@ -154,9 +152,8 @@ export function SettingsDiscoverTab({
               labelFor="discover-mode"
               help={
                 <>
-                  <strong>Safer</strong> favors more obvious recommendations.{" "}
-                  <strong>Balanced</strong> mixes familiar artists with exploration.{" "}
-                  <strong>Deeper</strong> pushes further beyond obvious similar artists.
+                  Safer favors familiar recommendations. Balanced mixes familiarity and exploration.
+                  Deeper goes further beyond similar artists.
                 </>
               }
             >
@@ -179,7 +176,7 @@ export function SettingsDiscoverTab({
               <SettingsArrFormGroup
                 label="Recommended artists"
                 labelFor="discover-recommendations"
-                help="Number of recommended artists generated on each refresh."
+                help="Artists generated per refresh."
               >
                 <SettingsInput
                   id="discover-recommendations"
@@ -201,7 +198,7 @@ export function SettingsDiscoverTab({
               </SettingsArrFormGroup>
               <SettingsArrFormGroup
                 label="Recommended playlists"
-                help="Generate personalized playlists (Discover Weekly, Trending Mix, Library Blend, Listening History, Release Radar). When disabled, only editorial playlists are shown."
+                help="Personalized playlists; off shows editorial playlists only."
               >
                 <PillToggle
                   className="settings-toggle"
@@ -219,7 +216,7 @@ export function SettingsDiscoverTab({
         </SettingsArrFieldSet>
 
         <SettingsArrFieldSet
-          legend="Cache Status"
+          legend="Cache status"
           actions={
             <>
               <button
@@ -232,7 +229,7 @@ export function SettingsDiscoverTab({
                   className={`artist-icon-xs${refreshingDiscovery ? " animate-spin" : ""}`}
                   aria-hidden
                 />
-                {refreshingDiscovery ? "Refreshing…" : "Refresh Discovery"}
+                {refreshingDiscovery ? "Refreshing…" : "Refresh discovery"}
               </button>
               <button
                 type="button"
@@ -244,7 +241,7 @@ export function SettingsDiscoverTab({
                   className={`artist-icon-xs${clearingCache ? " animate-spin" : ""}`}
                   aria-hidden
                 />
-                {clearingCache ? "Clearing…" : "Clear Image Cache"}
+                {clearingCache ? "Clearing…" : "Clear image cache"}
               </button>
             </>
           }
diff --git a/frontend/src/pages/Settings/components/SettingsDownloadClientsSection.jsx b/frontend/src/pages/Settings/components/SettingsDownloadClientsSection.jsx
index 06499a6d3..31c2b5d4c 100644
--- a/frontend/src/pages/Settings/components/SettingsDownloadClientsSection.jsx
+++ b/frontend/src/pages/Settings/components/SettingsDownloadClientsSection.jsx
@@ -1,4 +1,4 @@
-import { useState } from "react";
+import { useEffect, useState } from "react";
 import { testNzbgetConnection, testSabnzbdConnection, testSlskdConnection, testYtdlpConnection } from "../../../utils/api/endpoints/settings.js";
 
 import { Plus, RefreshCw, Trash2, Wrench } from "lucide-react";
@@ -65,9 +65,14 @@ export function SettingsDownloadClientsSection({
   const [testingYtdlp, setTestingYtdlp] = useState(false);
   const [testingNzbget, setTestingNzbget] = useState(false);
   const [testingSabnzbd, setTestingSabnzbd] = useState(false);
+  const [testStatus, setTestStatus] = useState(null);
   const [showAdvanced, setShowAdvanced] = useState(false);
   const [mappingModal, setMappingModal] = useState(null);
 
+  useEffect(() => {
+    setTestStatus(null);
+  }, [activeModal]);
+
   const integrations = settings.integrations || {};
   const slskd = integrations.slskd || {};
   const ytdlp = integrations.ytdlp || {};
@@ -148,6 +153,7 @@ export function SettingsDownloadClientsSection({
 
   const handleTestNzbget = async () => {
     if (!nzbgetEnabled || !nzbget.url) {
+      setTestStatus({ tone: "error", message: "Enable NZBGet and enter the server URL." });
       showError("Enable NZBGet and enter the server URL first");
       return;
     }
@@ -155,8 +161,10 @@ export function SettingsDownloadClientsSection({
     try {
       await handleSaveSettings();
       const result = await testNzbgetConnection();
+      setTestStatus({ tone: "success", message: "Connected." });
       showSuccess(result.message || "NZBGet connection OK");
     } catch (error) {
+      setTestStatus({ tone: "error", message: "Connection failed. Check the settings and retry." });
       showError(
         error.response?.data?.message ||
           error.response?.data?.error ||
@@ -170,6 +178,7 @@ export function SettingsDownloadClientsSection({
 
   const handleTestSabnzbd = async () => {
     if (!sabnzbdEnabled || !sabnzbd.url || !sabnzbd.apiKey) {
+      setTestStatus({ tone: "error", message: "Enable SABnzbd and enter the URL and API key." });
       showError("Enable SABnzbd and enter the server URL and API key first");
       return;
     }
@@ -177,8 +186,10 @@ export function SettingsDownloadClientsSection({
     try {
       await handleSaveSettings();
       const result = await testSabnzbdConnection();
+      setTestStatus({ tone: "success", message: "Connected." });
       showSuccess(result.message || "SABnzbd connection OK");
     } catch (error) {
+      setTestStatus({ tone: "error", message: "Connection failed. Check the settings and retry." });
       showError(
         error.response?.data?.message ||
           error.response?.data?.error ||
@@ -192,6 +203,7 @@ export function SettingsDownloadClientsSection({
 
   const handleTestSlskd = async () => {
     if (!slskd.url || !slskd.apiKey) {
+      setTestStatus({ tone: "error", message: "Enter the slskd URL and API key." });
       showError("Enter slskd URL and API key first");
       return;
     }
@@ -201,14 +213,18 @@ export function SettingsDownloadClientsSection({
       const result = await testSlskdConnection();
       if (result.success || result.ok) {
         if (result.warning || result.soulseekConnected === false) {
+          setTestStatus({ tone: "warning", message: "API reachable, but Soulseek is not connected." });
           showInfo(result.message || "slskd API is reachable, but Soulseek is not connected");
         } else {
+          setTestStatus({ tone: "success", message: "Connected." });
           showSuccess(result.message || "slskd connection OK");
         }
       } else {
+        setTestStatus({ tone: "error", message: "Connection failed. Check the settings and retry." });
         showError(result.message || "slskd connection failed");
       }
     } catch (error) {
+      setTestStatus({ tone: "error", message: "Connection failed. Check the settings and retry." });
       showError(
         error.response?.data?.message ||
           error.response?.data?.error ||
@@ -225,8 +241,10 @@ export function SettingsDownloadClientsSection({
     try {
       await handleSaveSettings();
       const result = await testYtdlpConnection();
+      setTestStatus({ tone: "success", message: "Connected." });
       showSuccess(result.message || "yt-dlp OK");
     } catch (error) {
+      setTestStatus({ tone: "error", message: "Connection failed. Check the settings and retry." });
       showError(
         error.response?.data?.message ||
           error.response?.data?.error ||
@@ -244,9 +262,6 @@ export function SettingsDownloadClientsSection({
         <div className="settings-page__section-header">
           <div className="settings-page__section-intro">
             <h3 className="settings-page__section-title">Download clients</h3>
-            <p className="settings-page__section-note">
-              Clients Aurral sends playlist and flow downloads to.
-            </p>
           </div>
         </div>
         <div className="settings-page__integration-card-grid">
@@ -281,9 +296,9 @@ export function SettingsDownloadClientsSection({
         </div>
       </div>
 
-      <SettingsArrFieldSet legend="Quality Profile">
+      <SettingsArrFieldSet legend="Quality profile">
         <div className="arr-info">
-          Choose acceptable formats, rank them by preference, and set the upgrade cutoff.
+          Choose formats, order, and upgrade cutoff.
         </div>
         <IntegrationCard
           title="Default"
@@ -294,7 +309,7 @@ export function SettingsDownloadClientsSection({
         />
       </SettingsArrFieldSet>
 
-      <SettingsArrFieldSet legend="Downloads Folder">
+      <SettingsArrFieldSet legend="Downloads folder">
         <SettingsArrFormGroup
           label="Path"
           labelFor="download-clients-download-folder"
@@ -314,10 +329,9 @@ export function SettingsDownloadClientsSection({
         </SettingsArrFormGroup>
       </SettingsArrFieldSet>
 
-      <SettingsArrFieldSet legend="Remote Path Mappings">
+      <SettingsArrFieldSet legend="Remote path mappings">
         <div className="arr-info">
-          Remote path mappings are rarely required. If Aurral and your download clients share the
-          same container mounts, match paths instead of adding mappings here.
+          Only needed when client and Aurral paths differ. Shared mounts need no mapping.
         </div>
 
         <div className="arr-table-wrap">
@@ -325,8 +339,8 @@ export function SettingsDownloadClientsSection({
             <thead>
               <tr>
                 <th scope="col">Source</th>
-                <th scope="col">Remote Path</th>
-                <th scope="col">Local Path</th>
+                <th scope="col">Remote path</th>
+                <th scope="col">Local path</th>
                 <th scope="col" className="arr-table__actions-head">
                   <span className="sr-only">Actions</span>
                 </th>
@@ -389,7 +403,7 @@ export function SettingsDownloadClientsSection({
       {mappingModal ? (
         <PathMappingModal
           title={
-            mappingModal.mode === "edit" ? "Edit Remote Path Mapping" : "Add Remote Path Mapping"
+            mappingModal.mode === "edit" ? "Edit remote path mapping" : "Add remote path mapping"
           }
           initialValue={
             mappingModal.mode === "edit" && mappingModal.index != null
@@ -413,6 +427,7 @@ export function SettingsDownloadClientsSection({
         <SettingsIntegrationModal
           title="slskd"
           onClose={() => setActiveModal(null)}
+          testStatus={testStatus}
           footerActions={
             <button
               type="button"
@@ -425,13 +440,11 @@ export function SettingsDownloadClientsSection({
             </button>
           }
         >
-          <SettingsModalSection title="General">
-            <SettingsModalToggle
-              label="Enable slskd"
-              checked={slskdEnabled}
-              onChange={(event) => updateIntegration("slskd", { enabled: event.target.checked })}
-            />
-          </SettingsModalSection>
+          <SettingsModalToggle
+            label="Enable slskd"
+            checked={slskdEnabled}
+            onChange={(event) => updateIntegration("slskd", { enabled: event.target.checked })}
+          />
 
           <SettingsModalSection title="Connection">
             <SettingsModalField label="Server URL">
@@ -484,6 +497,7 @@ export function SettingsDownloadClientsSection({
         <SettingsIntegrationModal
           title="yt-dlp"
           onClose={() => setActiveModal(null)}
+          testStatus={testStatus}
           footerActions={
             <button
               type="button"
@@ -496,13 +510,11 @@ export function SettingsDownloadClientsSection({
             </button>
           }
         >
-          <SettingsModalSection title="General">
-            <SettingsModalToggle
-              label="Enable yt-dlp"
-              checked={ytdlpEnabled}
-              onChange={(event) => updateIntegration("ytdlp", { enabled: event.target.checked })}
-            />
-          </SettingsModalSection>
+          <SettingsModalToggle
+            label="Enable yt-dlp"
+            checked={ytdlpEnabled}
+            onChange={(event) => updateIntegration("ytdlp", { enabled: event.target.checked })}
+          />
 
           <SettingsModalSection title="Behavior">
             <SettingsModalField label="Source priority">
@@ -524,7 +536,7 @@ export function SettingsDownloadClientsSection({
             <SettingsModalField
               label="Staging path"
               htmlFor="ytdlp-staging-path"
-              hint="Temporary and reviewable downloads stay here until Aurral imports them into the Downloads Folder."
+              hint="Temporary downloads stay here until imported."
             >
               <DownloadFolderField
                 id="ytdlp-staging-path"
@@ -541,6 +553,7 @@ export function SettingsDownloadClientsSection({
         <SettingsIntegrationModal
           title="NZBGet"
           onClose={() => setActiveModal(null)}
+          testStatus={testStatus}
           footerActions={
             <button
               type="button"
@@ -553,13 +566,11 @@ export function SettingsDownloadClientsSection({
             </button>
           }
         >
-          <SettingsModalSection title="General">
-            <SettingsModalToggle
-              label="Enable NZBGet"
-              checked={nzbgetEnabled}
-              onChange={(event) => updateIntegration("nzbget", { enabled: event.target.checked })}
-            />
-          </SettingsModalSection>
+          <SettingsModalToggle
+            label="Enable NZBGet"
+            checked={nzbgetEnabled}
+            onChange={(event) => updateIntegration("nzbget", { enabled: event.target.checked })}
+          />
 
           <SettingsModalSection title="Connection">
             <SettingsModalField label="Server URL">
@@ -668,6 +679,7 @@ export function SettingsDownloadClientsSection({
         <SettingsIntegrationModal
           title="SABnzbd"
           onClose={() => setActiveModal(null)}
+          testStatus={testStatus}
           footerActions={
             <button
               type="button"
@@ -680,13 +692,11 @@ export function SettingsDownloadClientsSection({
             </button>
           }
         >
-          <SettingsModalSection title="General">
-            <SettingsModalToggle
-              label="Enable SABnzbd"
-              checked={sabnzbdEnabled}
-              onChange={(event) => updateIntegration("sabnzbd", { enabled: event.target.checked })}
-            />
-          </SettingsModalSection>
+          <SettingsModalToggle
+            label="Enable SABnzbd"
+            checked={sabnzbdEnabled}
+            onChange={(event) => updateIntegration("sabnzbd", { enabled: event.target.checked })}
+          />
 
           <SettingsModalSection title="Connection">
             <SettingsModalField label="Server URL">
diff --git a/frontend/src/pages/Settings/components/SettingsIndexersSection.jsx b/frontend/src/pages/Settings/components/SettingsIndexersSection.jsx
index 79bae2182..6399591b0 100644
--- a/frontend/src/pages/Settings/components/SettingsIndexersSection.jsx
+++ b/frontend/src/pages/Settings/components/SettingsIndexersSection.jsx
@@ -27,6 +27,7 @@ export function SettingsIndexersSection({
 }) {
   const [activeModal, setActiveModal] = useState(null);
   const [testingProwlarr, setTestingProwlarr] = useState(false);
+  const [testStatus, setTestStatus] = useState(null);
   const [loadingProwlarrIndexers, setLoadingProwlarrIndexers] = useState(false);
   const [prowlarrIndexers, setProwlarrIndexers] = useState([]);
 
@@ -34,6 +35,10 @@ export function SettingsIndexersSection({
   const prowlarrConfigured = Boolean(prowlarr.url && prowlarr.apiKey);
   const prowlarrEnabled = prowlarr.enabled === true;
 
+  useEffect(() => {
+    setTestStatus(null);
+  }, [activeModal]);
+
   const updateIntegration = (key, patch) =>
     updateSettings({
       ...settings,
@@ -126,6 +131,7 @@ export function SettingsIndexersSection({
 
   const handleTestProwlarr = async () => {
     if (!prowlarrEnabled || !prowlarr.url || !prowlarr.apiKey) {
+      setTestStatus({ tone: "error", message: "Enable Prowlarr and enter the URL and API key." });
       showError("Enable Prowlarr and enter URL and API key first");
       return;
     }
@@ -134,8 +140,10 @@ export function SettingsIndexersSection({
       await handleSaveSettings();
       const result = await testProwlarrConnection();
       setProwlarrIndexers(Array.isArray(result.indexers) ? result.indexers : []);
+      setTestStatus({ tone: "success", message: "Connected." });
       showSuccess(result.message || "Prowlarr connection OK");
     } catch (error) {
+      setTestStatus({ tone: "error", message: "Connection failed. Check the URL and API key, then retry." });
       showError(
         error.response?.data?.message ||
           error.response?.data?.error ||
@@ -159,9 +167,6 @@ export function SettingsIndexersSection({
         <div className="settings-page__section-header">
           <div className="settings-page__section-intro">
             <h3 className="settings-page__section-title">Indexers</h3>
-            <p className="settings-page__section-note">
-              Configure Prowlarr and choose which Usenet indexers Aurral uses.
-            </p>
           </div>
           {loadingProwlarrIndexers && (
             <span className="settings-page__status">
@@ -210,6 +215,7 @@ export function SettingsIndexersSection({
         <SettingsIntegrationModal
           title="Prowlarr"
           onClose={() => setActiveModal(null)}
+          testStatus={testStatus}
           footerActions={
             <button
               type="button"
@@ -222,13 +228,11 @@ export function SettingsIndexersSection({
             </button>
           }
         >
-          <SettingsModalSection title="General">
-            <SettingsModalToggle
-              label="Enable Prowlarr"
-              checked={prowlarrEnabled}
-              onChange={(event) => updateIntegration("prowlarr", { enabled: event.target.checked })}
-            />
-          </SettingsModalSection>
+          <SettingsModalToggle
+            label="Enable Prowlarr"
+            checked={prowlarrEnabled}
+            onChange={(event) => updateIntegration("prowlarr", { enabled: event.target.checked })}
+          />
 
           <SettingsModalSection title="Connection">
             <SettingsModalField label="Server URL">
@@ -301,18 +305,16 @@ export function SettingsIndexersSection({
             const state = getIndexerState(activeIndexer);
             return (
               <>
-                <SettingsModalSection title="General">
-                  <SettingsModalToggle
-                    label="Enable in Aurral"
-                    checked={state.aurralEnabled}
-                    onChange={(event) =>
-                      updateProwlarrIndexer(activeIndexer.id, {
-                        enabled: event.target.checked,
-                        priority: state.priority,
-                      })
-                    }
-                  />
-                </SettingsModalSection>
+                <SettingsModalToggle
+                  label="Enable in Aurral"
+                  checked={state.aurralEnabled}
+                  onChange={(event) =>
+                    updateProwlarrIndexer(activeIndexer.id, {
+                      enabled: event.target.checked,
+                      priority: state.priority,
+                    })
+                  }
+                />
                 <SettingsModalSection title="Priority">
                   <SettingsModalField label="Priority">
                     <SettingsInput
diff --git a/frontend/src/pages/Settings/components/SettingsIntegrationCards.jsx b/frontend/src/pages/Settings/components/SettingsIntegrationCards.jsx
index af592f140..c126c5111 100644
--- a/frontend/src/pages/Settings/components/SettingsIntegrationCards.jsx
+++ b/frontend/src/pages/Settings/components/SettingsIntegrationCards.jsx
@@ -18,12 +18,13 @@ export function IntegrationCard({ title, subtitle, status, meta, onClick }) {
         {meta ? <span className="arr-card__meta">{meta}</span> : null}
       </span>
       <span className="arr-card__side">
-        <span
-          className={`arr-card__status arr-card__status--${statusTone(status.className)}`}
-          role="img"
-          aria-label={status.label}
-          title={status.label}
-        />
+        <span className="arr-card__status-wrap">
+          <span
+            className={`arr-card__status arr-card__status--${statusTone(status.className)}`}
+            aria-hidden="true"
+          />
+          <span className="arr-card__status-label">{status.label}</span>
+        </span>
         <Pencil className="artist-icon-sm" aria-hidden />
       </span>
     </button>
@@ -34,10 +35,9 @@ export function SettingsIntegrationModal({
   title,
   children,
   onClose,
-  saveReminder = true,
   wide = true,
   footerActions = null,
-  showDone = true,
+  testStatus = null,
 }) {
   const titleId = useId();
   const { dialogRef, handleBackdropClick } = useModalDialog({
@@ -67,21 +67,25 @@ export function SettingsIntegrationModal({
             onClick={onClose}
             aria-label="Close"
           >
-            <X className="artist-icon-md" />
+            <X className="artist-icon-md" aria-hidden="true" />
           </button>
         </div>
-        {saveReminder ? (
-          <p className="settings-page__modal-reminder">
-            Changes save automatically.
-          </p>
-        ) : null}
         <div className="settings-page__modal-body">
           <div className="settings-modal">{children}</div>
         </div>
-        <div className="settings-page__modal-actions">
-          {footerActions}
-          {showDone ? <button type="button" className="arr-btn arr-btn--primary" onClick={onClose}>Done</button> : null}
-        </div>
+        {footerActions || testStatus ? (
+          <div className="settings-page__modal-actions">
+            {testStatus ? (
+              <p
+                className={`settings-page__modal-result settings-page__modal-result--${testStatus.tone}`}
+                role={testStatus.tone === "error" ? "alert" : "status"}
+              >
+                {testStatus.message}
+              </p>
+            ) : null}
+            {footerActions}
+          </div>
+        ) : null}
       </div>
     </div>
   );
diff --git a/frontend/src/pages/Settings/components/SettingsMetadataTab.jsx b/frontend/src/pages/Settings/components/SettingsMetadataTab.jsx
index 7b54c2e92..486c3ffe9 100644
--- a/frontend/src/pages/Settings/components/SettingsMetadataTab.jsx
+++ b/frontend/src/pages/Settings/components/SettingsMetadataTab.jsx
@@ -13,7 +13,7 @@ export function SettingsMetadataTab({
     <form onSubmit={handleSaveSettings} className="settings-page__form" autoComplete="off">
       <div className="settings-page__section">
         <div className="settings-page__section-header">
-          <h3 className="settings-page__section-title">Metadata Server</h3>
+          <h3 className="settings-page__section-title">Metadata server</h3>
           {health?.metadataConfigured && (
             <span className="settings-page__status">
               <CheckCircle className="settings-page__status-icon" />
diff --git a/frontend/src/pages/Settings/components/SettingsPlaybackSection.jsx b/frontend/src/pages/Settings/components/SettingsPlaybackSection.jsx
index 8dfe892c3..efb9cf596 100644
--- a/frontend/src/pages/Settings/components/SettingsPlaybackSection.jsx
+++ b/frontend/src/pages/Settings/components/SettingsPlaybackSection.jsx
@@ -59,6 +59,7 @@ export function SettingsPlaybackSection({
   const [plexConnecting, setPlexConnecting] = useState(false);
   const [testingPlex, setTestingPlex] = useState(false);
   const [testingNavidrome, setTestingNavidrome] = useState(false);
+  const [testStatus, setTestStatus] = useState(null);
   const [syncingPlex, setSyncingPlex] = useState(false);
   const [plexServers, setPlexServers] = useState([]);
   const [plexLibraries, setPlexLibraries] = useState([]);
@@ -71,6 +72,10 @@ export function SettingsPlaybackSection({
   const [koitoUrl, setKoitoUrl] = useState("");
   const lastfmPollRef = useRef(null);
 
+  useEffect(() => {
+    setTestStatus(null);
+  }, [activeModal]);
+
   const navidrome = settings.integrations?.navidrome || {};
   const plex = settings.integrations?.plex || {};
   const navidromeConfigured = Boolean(navidrome.url);
@@ -257,6 +262,7 @@ export function SettingsPlaybackSection({
 
   const handleTestPlex = async () => {
     if (!plex.url || !plex.token) {
+      setTestStatus({ tone: "error", message: "Connect to Plex and select a server first." });
       showError("Connect to Plex and select a server first");
       return;
     }
@@ -264,14 +270,17 @@ export function SettingsPlaybackSection({
     try {
       const result = await testPlaybackConnection("plex", plex);
       if (result.success) {
+        setTestStatus({ tone: "success", message: "Connected." });
         showSuccess(`Plex connection successful!${result.version ? ` (v${result.version})` : ""}`);
         if (result.machineIdentifier) {
           updatePlex({ machineIdentifier: result.machineIdentifier });
         }
       } else {
+        setTestStatus({ tone: "error", message: "Connection failed. Check Plex settings and retry." });
         showError(`Connection failed: ${result.message || result.error}`);
       }
     } catch (err) {
+      setTestStatus({ tone: "error", message: "Connection failed. Check Plex settings and retry." });
       const errorMsg = err.response?.data?.message || err.response?.data?.error || err.message;
       showError(`Connection failed: ${errorMsg}`);
     } finally {
@@ -281,6 +290,7 @@ export function SettingsPlaybackSection({
 
   const handleTestNavidrome = async () => {
     if (!navidrome.url || !navidrome.username || !navidrome.password) {
+      setTestStatus({ tone: "error", message: "Enter the URL and credentials first." });
       showError("Enter Navidrome URL, username, and password first");
       return;
     }
@@ -290,8 +300,10 @@ export function SettingsPlaybackSection({
         await handleSaveSettings();
       }
       await testPlaybackConnection("navidrome", navidrome);
+      setTestStatus({ tone: "success", message: "Connected." });
       showSuccess("Navidrome connection OK");
     } catch (err) {
+      setTestStatus({ tone: "error", message: "Connection failed. Check the URL and credentials, then retry." });
       const errorMsg = err.response?.data?.message || err.response?.data?.error || err.message;
       showError(`Navidrome connection failed: ${errorMsg}`);
     } finally {
@@ -415,9 +427,9 @@ export function SettingsPlaybackSection({
 
   return (
     <>
-      <SettingsArrFieldSet legend="Playback Servers">
+      <SettingsArrFieldSet legend="Playback servers">
         <div className="arr-info">
-          Servers Aurral writes playlists to for in-app and external playback.
+          Where Aurral writes playlists.
         </div>
         <SettingsArrCardGrid>
           <IntegrationCard
@@ -439,8 +451,7 @@ export function SettingsPlaybackSection({
 
       <SettingsArrFieldSet legend="Scrobbling">
         <div className="arr-info">
-          Send completed local plays to your connected listening services. Aurral uses the same
-          provider flows as Navidrome; a Navidrome connection is not required.
+          Send completed local plays to listening services. Navidrome is not required.
         </div>
         <SettingsModalToggleGroup>
           {["lastfm", "listenbrainz", "koito"].map((provider) => {
@@ -477,8 +488,7 @@ export function SettingsPlaybackSection({
       {activeModal === "lastfm" && (
         <SettingsIntegrationModal title="Last.fm scrobbling" onClose={closeModal}>
           <SettingsModalIntro>
-            Link the Last.fm account that receives completed local plays. Aurral runs the same
-            Last.fm flow Navidrome uses; Navidrome is not required.
+            API key powers discovery. API secret is required for scrobbling.
           </SettingsModalIntro>
           {scrobbleStatus?.lastfm?.configured !== true ? (
             <SettingsModalCallout>
@@ -507,8 +517,7 @@ export function SettingsPlaybackSection({
       {activeModal === "listenbrainz" && (
         <SettingsIntegrationModal title="ListenBrainz scrobbling" onClose={closeModal}>
           <SettingsModalIntro>
-            Enter a ListenBrainz user token. Aurral validates and stores it directly; Navidrome is
-            not required.
+            Enter a user token. Navidrome is not required.
           </SettingsModalIntro>
           <SettingsModalSection title="Connection">
             <SettingsModalField label="User token">
@@ -536,7 +545,7 @@ export function SettingsPlaybackSection({
 
       {activeModal === "koito" && (
         <SettingsIntegrationModal title="Koito scrobbling" onClose={closeModal}>
-          <SettingsModalIntro>Koito accepts the ListenBrainz submission format and API key.</SettingsModalIntro>
+          <SettingsModalIntro>Koito uses the ListenBrainz format.</SettingsModalIntro>
           <SettingsModalSection title="Connection">
             <SettingsModalField label="Koito URL">
               <SettingsInput type="url" placeholder="https://koito.example.com" value={koitoUrl} onChange={(event) => setKoitoUrl(event.target.value)} />
@@ -562,6 +571,7 @@ export function SettingsPlaybackSection({
         <SettingsIntegrationModal
           title="Subsonic / Navidrome"
           onClose={closeModal}
+          testStatus={testStatus}
           footerActions={
             <button
               type="button"
@@ -588,6 +598,7 @@ export function SettingsPlaybackSection({
         <SettingsIntegrationModal
           title="Plex"
           onClose={closeModal}
+          testStatus={testStatus}
           footerActions={
             <button
               type="button"
@@ -601,9 +612,7 @@ export function SettingsPlaybackSection({
           }
         >
           <SettingsModalIntro>
-            Sign in with your Plex account to let Aurral create a dedicated music library pointed at
-            your flow downloads and build a playlist for each flow. Playlists appear in Plex and
-            Plexamp.
+            Connect Plex to create a library and playlists for Aurral flows.
           </SettingsModalIntro>
 
           <SettingsModalSection title="Account">
@@ -669,15 +678,13 @@ export function SettingsPlaybackSection({
             )}
           </SettingsModalSection>
 
-          <SettingsModalSection title="Aurral Library Path">
+          <SettingsModalSection title="Aurral library path">
             <SettingsModalField
               label="Plex Aurral Library path (optional)"
               hint={
                 <>
-                  Only needed if Plex runs in a different container/host than Aurral. Enter the
-                  downloads folder path as the <strong>Plex server</strong> sees it — Aurral appends{" "}
-                  <code>/aurral-weekly-flow</code>. Leave blank to use Aurral&apos;s own download
-                  path.
+                  Only needed when Plex sees downloads at a different path. Enter the Plex-side
+                  path; Aurral appends <code>/aurral-weekly-flow</code>.
                 </>
               }
             >
@@ -719,9 +726,8 @@ export function SettingsPlaybackSection({
               label="Include tracks from an existing library"
               hint={
                 <>
-                  If a flow includes songs you already have in another Plex library — like the
-                  one Lidarr manages — Aurral needs this library selected to reuse those songs in
-                  Plex playlists; without it, the tracks are silently left out of the playlist.
+                  Include an existing Plex library so playlists can reuse tracks already in your
+                  Lidarr library.
                 </>
               }
             >
@@ -770,10 +776,7 @@ export function SettingsPlaybackSection({
                 label="Local path for this library (optional)"
                 hint={
                   <>
-                    Plex reports this library&apos;s files at{" "}
-                    <code>{libraryAccessCheck?.reportedPath || plexLibraryMapping?.remote}</code>.
-                    Enter that same folder as <strong>Aurral</strong> sees it. Leave blank to
-                    remove this mapping.
+                    Enter the same path as Aurral sees it; leave blank to remove the mapping.
                   </>
                 }
               >
@@ -823,9 +826,7 @@ export function SettingsPlaybackSection({
               </button>
             </SettingsModalActions>
             <p className="settings-modal__hint">
-              Creates an &quot;Aurral&quot; music library pointed at your downloads, scans it, and
-              builds a playlist per flow. The Plex server must be able to read the same downloads
-              path Aurral writes to. Changes save automatically before syncing.
+              Creates the Aurral library and flow playlists, then scans Plex. Saves before syncing.
             </p>
           </SettingsModalSection>
         </SettingsIntegrationModal>
diff --git a/frontend/src/pages/Settings/components/SettingsPlaybackTab.jsx b/frontend/src/pages/Settings/components/SettingsPlaybackTab.jsx
index 103f0ee01..7769fa0fc 100644
--- a/frontend/src/pages/Settings/components/SettingsPlaybackTab.jsx
+++ b/frontend/src/pages/Settings/components/SettingsPlaybackTab.jsx
@@ -33,11 +33,11 @@ export function SettingsPlaybackTab({
           showInfo={showInfo}
         />
 
-        <SettingsArrFieldSet legend="Cover Art">
+        <SettingsArrFieldSet legend="Cover art">
           <SettingsArrFormGroup
             label="Generated cover style"
             labelFor="playlist-artwork-style"
-            help="Photo texture uses a random image from picsum with stylized typography. Aurral generated uses abstract palette covers."
+            help="Photo texture uses a photo background. Aurral generated uses abstract palette covers."
           >
             <SettingsSelect
               id="playlist-artwork-style"
diff --git a/frontend/src/pages/Settings/components/SettingsRssNewsTab.jsx b/frontend/src/pages/Settings/components/SettingsRssNewsTab.jsx
index 29a1ea487..c3d533e31 100644
--- a/frontend/src/pages/Settings/components/SettingsRssNewsTab.jsx
+++ b/frontend/src/pages/Settings/components/SettingsRssNewsTab.jsx
@@ -6,19 +6,19 @@ import { SettingsArrFieldSet, SettingsArrFormGroup } from "./arr/SettingsArrLayo
 import { SettingsIntegrationModal } from "./SettingsIntegrationCards";
 
 const GROUPS = [
-  ["major", "Major Music Publications & Magazines"],
-  ["indie", "Indie & Alternative Music Blogs"],
-  ["discovery", "Music Discovery & Curation"],
-  ["hiphop", "Hip-Hop & Rap"],
-  ["pop", "Pop & Mainstream"],
-  ["electronic", "Electronic & Dance Music"],
-  ["metal", "Metal & Hard Rock"],
+  ["major", "Major music publications & magazines"],
+  ["indie", "Indie & alternative music blogs"],
+  ["discovery", "Music discovery & curation"],
+  ["hiphop", "Hip-hop & rap"],
+  ["pop", "Pop & mainstream"],
+  ["electronic", "Electronic & dance music"],
+  ["metal", "Metal & hard rock"],
   ["country", "Country & Americana"],
   ["jazz", "Jazz"],
-  ["classical", "Classical & Contemporary Classical"],
-  ["specialty", "Genre Specialty"],
-  ["regional", "Regional Music Scenes"],
-  ["concerts", "Concerts, Festivals & Live Music"],
+  ["classical", "Classical & contemporary classical"],
+  ["specialty", "Genre specialty"],
+  ["regional", "Regional music scenes"],
+  ["concerts", "Concerts, festivals & live music"],
 ];
 
 export function SettingsRssNewsTab({ settings, updateSettings, handleSaveSettings }) {
@@ -107,8 +107,8 @@ export function SettingsRssNewsTab({ settings, updateSettings, handleSaveSetting
   return (
     <div className="arr-page">
       <form onSubmit={handleSaveSettings} className="arr-form" autoComplete="off">
-        <SettingsArrFieldSet legend="RSS News">
-          <SettingsArrFormGroup label="Enable RSS News" labelFor="enable-rss-news">
+        <SettingsArrFieldSet legend="RSS news">
+          <SettingsArrFormGroup label="Enable RSS news" labelFor="enable-rss-news">
             <PillToggle id="enable-rss-news" checked={news.enabled !== false} onChange={(event) => updateNews({ enabled: event.target.checked })} />
           </SettingsArrFormGroup>
         </SettingsArrFieldSet>
@@ -122,7 +122,11 @@ export function SettingsRssNewsTab({ settings, updateSettings, handleSaveSetting
           }
         >
           <div className="settings-news-feeds settings-news-feeds--page">
-            {feeds.map((feed, index) => feed.group === "custom" ? renderFeed(feed, index) : null)}
+            {feeds.some((feed) => feed.group === "custom") ? (
+              feeds.map((feed, index) => feed.group === "custom" ? renderFeed(feed, index) : null)
+            ) : (
+              <p className="arr-form-help">No custom feeds yet.</p>
+            )}
           </div>
         </SettingsArrFieldSet>
 
@@ -154,8 +158,6 @@ export function SettingsRssNewsTab({ settings, updateSettings, handleSaveSetting
         <SettingsIntegrationModal
           title={feedEditor.index === null ? "Add RSS feed" : "Edit RSS feed"}
           onClose={() => setFeedEditor(null)}
-          saveReminder={false}
-          showDone={false}
           footerActions={<button type="button" className="arr-btn arr-btn--primary arr-btn--icon" onClick={saveFeed} aria-label="Save feed" title="Save feed"><Save className="artist-icon-sm" aria-hidden /></button>}
         >
           <div className="settings-modal__section-body">
diff --git a/frontend/src/pages/Settings/components/SettingsStorageSection.jsx b/frontend/src/pages/Settings/components/SettingsStorageSection.jsx
index 1e49ff336..7d932a22c 100644
--- a/frontend/src/pages/Settings/components/SettingsStorageSection.jsx
+++ b/frontend/src/pages/Settings/components/SettingsStorageSection.jsx
@@ -48,8 +48,8 @@ function DiskSpaceTable({ entries = [] }) {
           <tr>
             <th scope="col">Location</th>
             <th scope="col">Role</th>
-            <th scope="col">Free Space</th>
-            <th scope="col">Total Space</th>
+            <th scope="col">Free space</th>
+            <th scope="col">Total space</th>
             <th scope="col">Used</th>
           </tr>
         </thead>
@@ -91,24 +91,22 @@ function DiskSpaceTable({ entries = [] }) {
   );
 }
 
-function SystemSection({ title, description, children }) {
+function SystemSection({ title, children }) {
   return (
     <section className="settings-system__section">
       <div className="settings-system__section-header">
         <h2 className="settings-system__section-title">{title}</h2>
-        {description ? <p className="settings-system__section-description">{description}</p> : null}
       </div>
       <div className="settings-system__rows">{children}</div>
     </section>
   );
 }
 
-function SystemRow({ label, description, children }) {
+function SystemRow({ label, children }) {
   return (
     <div className="settings-system__row">
       <div className="settings-system__copy">
         <div className="settings-system__label">{label}</div>
-        {description ? <p className="settings-system__description">{description}</p> : null}
       </div>
       <div className="settings-system__value">{children ?? "—"}</div>
     </div>
@@ -189,16 +187,8 @@ export function SettingsStorageHealthSection({
 
   return (
     <>
-      <SettingsArrFieldSet legend="Health">
-        <StorageHealthSummary result={healthResult} loading={checkingHealth} />
-      </SettingsArrFieldSet>
-
-      <SettingsArrFieldSet legend="Disk Space">
-        <DiskSpaceTable entries={system.diskSpace || []} />
-      </SettingsArrFieldSet>
-
       <SettingsArrFieldSet
-        legend="Storage Health"
+        legend="Storage health"
         actions={
           <button
             type="button"
@@ -207,17 +197,18 @@ export function SettingsStorageHealthSection({
             disabled={checkingHealth}
           >
             <RefreshCw className={`artist-icon-sm${checkingHealth ? " animate-spin" : ""}`} />
-            {checkingHealth ? "Checking…" : "Run Checks"}
+            {checkingHealth ? "Checking…" : "Run checks"}
           </button>
         }
       >
-        <p className="arr-form-help">
-          Verifies that Aurral can access configured library paths, transfer completed downloads,
-          and emit paths that playback servers can scan. Matching container paths are simplest,
-          but narrower mounts and remote path mappings are supported.
-        </p>
+        <StorageHealthSummary result={healthResult} loading={checkingHealth} />
+        <p className="arr-form-help">Checks configured library, download, and playback paths.</p>
         <StorageHealthDashboard result={healthResult} loading={checkingHealth} showSummary={false} />
       </SettingsArrFieldSet>
+
+      <SettingsArrFieldSet legend="Disk space">
+        <DiskSpaceTable entries={system.diskSpace || []} />
+      </SettingsArrFieldSet>
     </>
   );
 }
@@ -231,7 +222,6 @@ export function SettingsSystemSection({ health }) {
       <div className="settings-system__intro">
         <div>
           <h1 className="settings-system__title">System</h1>
-          <p className="settings-system__intro-text">A quick overview of the running Aurral app.</p>
         </div>
         <div className={`settings-system__status${runtimeReady ? " is-ready" : ""}`}>
           <span className="settings-system__status-dot" aria-hidden />
@@ -239,45 +229,42 @@ export function SettingsSystemSection({ health }) {
         </div>
       </div>
 
-      <SystemSection
-        title="Runtime"
-        description="The process and environment currently running Aurral."
-      >
-        <SystemRow label="Version" description="Current application build">
+      <SystemSection title="Runtime">
+        <SystemRow label="Version">
           {system.version || health?.appVersion}
         </SystemRow>
-        <SystemRow label="Uptime" description="Time since the application started">
+        <SystemRow label="Uptime">
           {formatUptime(system.uptimeSeconds)}
         </SystemRow>
-        <SystemRow label="Environment" description="Runtime mode and host">
+        <SystemRow label="Environment">
           {system.mode && system.hostname ? `${system.mode} · ${system.hostname}` : null}
         </SystemRow>
-        <SystemRow label="Platform" description="Node.js runtime and operating system">
+        <SystemRow label="Platform">
           {system.nodeVersion && system.platform && system.arch
             ? `Node ${system.nodeVersion} · ${system.platform} ${system.arch}`
             : null}
         </SystemRow>
-        <SystemRow label="Container" description="Whether Aurral is running in Docker">
+        <SystemRow label="Container">
           {system.docker == null ? null : system.docker ? "Docker" : "Host process"}
         </SystemRow>
       </SystemSection>
 
-      <SystemSection title="Data" description="Where Aurral stores its application data.">
-        <SystemRow label="Database" description="Database engine and version">
+      <SystemSection title="Data">
+        <SystemRow label="Database">
           {system.database?.label}
         </SystemRow>
-        <SystemRow label="App data" description="Application data directory">
+        <SystemRow label="App data">
           <code>{system.dataDir}</code>
         </SystemRow>
-        <SystemRow label="Database path" description="Active SQLite database file">
+        <SystemRow label="Database path">
           <code>{system.databasePath}</code>
         </SystemRow>
-        <SystemRow label="Startup directory" description="Directory used to start Aurral">
+        <SystemRow label="Startup directory">
           <code>{system.startupDirectory}</code>
         </SystemRow>
       </SystemSection>
 
-      <SystemSection title="More info" description="Useful links for the Aurral project.">
+      <SystemSection title="More info">
         {(system.links || []).map((link) => (
           <SystemRow key={link.label} label={link.label}>
             <a href={link.url} target="_blank" rel="noopener noreferrer" className="arr-link">
diff --git a/frontend/src/pages/Settings/components/SettingsTasksTab.jsx b/frontend/src/pages/Settings/components/SettingsTasksTab.jsx
index bc2aa98bc..67f7a8322 100644
--- a/frontend/src/pages/Settings/components/SettingsTasksTab.jsx
+++ b/frontend/src/pages/Settings/components/SettingsTasksTab.jsx
@@ -213,9 +213,9 @@ function ScheduledTable({ scheduled = [], loading = false }) {
           <tr>
             <th scope="col">Name</th>
             <th scope="col">Interval</th>
-            <th scope="col">Last Execution</th>
-            <th scope="col">Last Duration</th>
-            <th scope="col">Next Execution</th>
+            <th scope="col">Last run</th>
+            <th scope="col">Duration</th>
+            <th scope="col">Next run</th>
             <th scope="col">Result</th>
           </tr>
         </thead>
@@ -281,7 +281,7 @@ function WorkersTable({ workers = [], loading = false, showAllWorkers = false })
             <th scope="col">Queued</th>
             <th scope="col">Scheduled</th>
             <th scope="col">Failed</th>
-            <th scope="col">Last Run</th>
+            <th scope="col">Last run</th>
           </tr>
         </thead>
         <tbody>
diff --git a/frontend/src/pages/Settings/components/SettingsUsersTab.jsx b/frontend/src/pages/Settings/components/SettingsUsersTab.jsx
index 20e1a7993..7d6ba5ed7 100644
--- a/frontend/src/pages/Settings/components/SettingsUsersTab.jsx
+++ b/frontend/src/pages/Settings/components/SettingsUsersTab.jsx
@@ -197,7 +197,7 @@ export function SettingsUsersTab({
   return (
     <div className="arr-page">
       {authUser?.role !== "admin" ? (
-        <SettingsArrFieldSet legend="Change Password">
+        <SettingsArrFieldSet legend="Change password">
           <form
             className="arr-form"
             onSubmit={async (event) => {
@@ -275,7 +275,7 @@ export function SettingsUsersTab({
         </SettingsArrFieldSet>
       ) : (
         <>
-          <SettingsArrFieldSet legend="Local Network Auto-login">
+          <SettingsArrFieldSet legend="Local network auto-login">
             <SettingsArrFormGroup
               label="Auto-login"
               help={`${localBypassStatus.title}. ${localBypassStatus.detail}`}
@@ -713,7 +713,7 @@ export function SettingsUsersTab({
                                 />
                               </SettingsArrFormGroup>
                               <SettingsArrFormGroup
-                                label="Plex Account"
+                                label="Plex account"
                                 help="Link this user to a Plex Home managed user so their flow and playlists are created under that Plex account."
                               >
                                 <AdminPlexLinkField
diff --git a/frontend/src/pages/Settings/components/arr/SettingsArrLayout.jsx b/frontend/src/pages/Settings/components/arr/SettingsArrLayout.jsx
index ad667d492..cf1c1eb70 100644
--- a/frontend/src/pages/Settings/components/arr/SettingsArrLayout.jsx
+++ b/frontend/src/pages/Settings/components/arr/SettingsArrLayout.jsx
@@ -1,12 +1,18 @@
+import { useId } from "react";
+
 export function SettingsArrFieldSet({ legend, actions = null, children }) {
+  const headingId = useId();
+
   return (
-    <fieldset className="arr-fieldset">
+    <section className="arr-fieldset" aria-labelledby={headingId}>
       <div className="arr-fieldset__head">
-        <legend className="arr-fieldset__legend">{legend}</legend>
+        <h2 id={headingId} className="arr-fieldset__legend">
+          {legend}
+        </h2>
         {actions ? <div className="arr-fieldset__actions">{actions}</div> : null}
       </div>
       <div className="arr-fieldset__body">{children}</div>
-    </fieldset>
+    </section>
   );
 }
 
diff --git a/frontend/src/pages/Settings/settingsArr.css b/frontend/src/pages/Settings/settingsArr.css
index dca7fc439..f6509e9b9 100644
--- a/frontend/src/pages/Settings/settingsArr.css
+++ b/frontend/src/pages/Settings/settingsArr.css
@@ -174,6 +174,20 @@
   flex-shrink: 0;
 }
 
+.arr-test-result {
+  color: var(--arr-text-muted);
+  font-size: 0.75rem;
+  line-height: 1.4;
+}
+
+.arr-test-result--success {
+  color: var(--aurral-success);
+}
+
+.arr-test-result--error {
+  color: var(--aurral-danger);
+}
+
 .arr-fieldset__body {
   display: block;
 }
@@ -892,7 +906,6 @@
   font-weight: 400;
 }
 
-.settings-arr__modal .settings-page__modal-reminder,
 .settings-arr__modal .settings-modal__hint,
 .settings-arr__modal .settings-modal__intro {
   color: var(--arr-text-muted);
@@ -1588,9 +1601,28 @@
 }
 
 .settings-arr__content {
+  position: relative;
   padding: 1rem 0 2.5rem;
 }
 
+.settings-arr__save-state {
+  position: absolute;
+  top: 0;
+  right: 0.75rem;
+  z-index: 1;
+  color: var(--aurral-text-subtle);
+  font-size: 0.75rem;
+  line-height: 1.25;
+  text-align: right;
+  visibility: hidden;
+  pointer-events: none;
+}
+
+.settings-arr__save-state.is-saving {
+  color: var(--aurral-text-muted);
+  visibility: visible;
+}
+
 .settings-arr__toolbar {
   justify-content: flex-end;
   min-height: 2rem;
@@ -1815,13 +1847,6 @@
   letter-spacing: -0.02em;
 }
 
-.settings-arr .settings-page__section--sponsor {
-  padding: 0.875rem 1rem;
-  border: 1px solid var(--aurral-border);
-  border-radius: 0.75rem;
-  background: color-mix(in srgb, var(--aurral-text) 3%, transparent);
-}
-
 .settings-arr :is(.arr-input, .arr-select, .arr-textarea, .artist-input) {
   height: 2rem;
   padding: 0 0.625rem;
@@ -1973,17 +1998,26 @@
 
 .settings-arr .arr-card__main,
 .settings-arr .arr-card__side,
-.settings-arr .arr-card__status {
+.settings-arr .arr-card__status-wrap,
+.settings-arr .arr-card__status-label {
   min-width: 0;
 }
 
 .settings-arr .arr-card__title,
-.settings-arr .arr-card__status {
+.settings-arr .arr-card__status-label {
   overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;
 }
 
+.settings-arr .arr-card__status-wrap {
+  display: inline-flex;
+  align-items: center;
+  gap: 0.375rem;
+  color: var(--arr-text-muted);
+  font-size: 0.6875rem;
+}
+
 .settings-arr .arr-card__title {
   font-size: 0.875rem;
   font-weight: 600;
@@ -2103,11 +2137,91 @@
   border-color: var(--aurral-border);
 }
 
+.settings-arr .settings-page__modal-result {
+  flex: 1 1 auto;
+  min-width: 0;
+  margin: 0 auto 0 0;
+  color: var(--arr-text-muted);
+  font-size: 0.75rem;
+  line-height: 1.4;
+}
+
+.settings-arr .settings-page__modal-result--success {
+  color: var(--aurral-success);
+}
+
+.settings-arr .settings-page__modal-result--error {
+  color: var(--aurral-danger);
+}
+
+.settings-arr .settings-page__modal-result--warning {
+  color: var(--aurral-warning);
+}
+
+@media (pointer: coarse) {
+  .settings-arr .arr-btn--icon,
+  .arr-portal .arr-btn--icon {
+    width: 2.75rem;
+    min-width: 2.75rem;
+    height: 2.75rem;
+    min-height: 2.75rem;
+  }
+
+  .settings-arr .pill-toggle {
+    --w: 2rem;
+    --h: calc(var(--w) * 0.4865);
+    width: 2.75rem;
+    height: 2.75rem;
+    background: transparent;
+    box-shadow: none;
+  }
+
+  .settings-arr .pill-toggle::after {
+    position: absolute;
+    top: 0.875rem;
+    left: 0.375rem;
+    width: var(--w);
+    height: var(--h);
+    border-radius: var(--aurral-radius-round);
+    background: var(--aurral-surface-raised);
+    box-shadow: inset 0 0 0 1px var(--aurral-border);
+    content: "";
+  }
+
+  .settings-arr .pill-toggle::before {
+    top: calc(0.875rem + var(--thumb-offset));
+    bottom: auto;
+    left: calc(0.375rem + var(--thumb-offset));
+    z-index: 1;
+  }
+
+  .settings-arr .pill-toggle[aria-checked="true"] {
+    background: transparent;
+    box-shadow: none;
+  }
+
+  .settings-arr .pill-toggle[aria-checked="true"]::after {
+    background: var(--aurral-control-on);
+    box-shadow:
+      inset 0 0 0 1px color-mix(in srgb, var(--aurral-control-on) 72%, var(--aurral-text)),
+      0 0 0 1px color-mix(in srgb, var(--aurral-control-on) 38%, transparent);
+  }
+
+  .settings-arr .pill-toggle:focus-visible,
+  .settings-arr .pill-toggle[aria-checked="true"]:focus-visible {
+    box-shadow: 0 0 0 3px var(--aurral-ring);
+  }
+}
+
 @media (max-width: 48rem) {
   .settings-arr__content {
     padding: 0.5rem 0 2rem;
   }
 
+  .settings-arr__save-state {
+    top: 4rem;
+  }
+
   .settings-arr__toolbar {
     padding: 0 0.5rem;
   }
diff --git a/frontend/src/pages/Settings/settingsTabsConfig.js b/frontend/src/pages/Settings/settingsTabsConfig.js
index ef6e81b9a..b3b5182ec 100644
--- a/frontend/src/pages/Settings/settingsTabsConfig.js
+++ b/frontend/src/pages/Settings/settingsTabsConfig.js
@@ -15,14 +15,14 @@ import {
 
 export const SETTINGS_TABS = [
   { id: "system", label: "System", icon: Monitor },
-  { id: "storage-health", label: "Storage Health", icon: HardDrive },
+  { id: "storage-health", label: "Storage health", icon: HardDrive },
   { id: "tasks", label: "Tasks", icon: ListChecks },
   { id: "lidarr", label: "Lidarr", icon: Server },
   { id: "indexers", label: "Indexers", icon: DatabaseSearch },
-  { id: "download-clients", label: "Download Clients", icon: Download },
+  { id: "download-clients", label: "Download clients", icon: Download },
   { id: "playback", label: "Playback", icon: Music },
   { id: "connect", label: "Connect", icon: Bell },
-  { id: "rss-news", label: "RSS News", icon: Rss },
+  { id: "rss-news", label: "RSS news", icon: Rss },
   { id: "discover", label: "Discover", icon: Compass },
   { id: "metadata", label: "Metadata", icon: Database, hidden: true },
   { id: "users", label: "Users", icon: Users },
@@ -32,7 +32,7 @@ export const SETTINGS_NAV_TABS = SETTINGS_TABS.filter((tab) => !tab.hidden);
 
 const SETTINGS_SEARCH_METADATA = {
   system: {
-    sections: ["Runtime", "Data", "Display", "API Key", "More Info"],
+    sections: ["Runtime", "Data", "Display", "API key", "More info"],
     services: {
       Runtime: "version uptime host platform",
       Database: "sqlite data runtime",
@@ -51,7 +51,7 @@ const SETTINGS_SEARCH_METADATA = {
     },
   },
   "storage-health": {
-    sections: ["Health", "Disk Space", "Storage Health"],
+    sections: ["Health", "Disk space", "Storage health"],
     services: {
       Storage: "disk filesystem paths data directory",
       Downloads: "download paths free space",
@@ -98,7 +98,7 @@ const SETTINGS_SEARCH_METADATA = {
     },
   },
   indexers: {
-    sections: ["General", "Connection", "Indexing", "Priority", "Details"],
+    sections: ["Connection", "Indexing", "Priority", "Details"],
     services: {
       Prowlarr: "indexer manager search",
       Usenet: "audio indexers",
@@ -116,7 +116,7 @@ const SETTINGS_SEARCH_METADATA = {
     },
   },
   "download-clients": {
-    sections: ["Quality Profile", "Downloads Folder", "Remote Path Mappings", "General", "Connection", "Behavior", "Downloads", "Advanced"],
+    sections: ["Quality profile", "Downloads folder", "Remote path mappings", "Connection", "Behavior", "Downloads", "Advanced"],
     services: {
       slskd: "Soulseek download client",
       "yt-dlp": "YouTube web download client",
@@ -124,7 +124,7 @@ const SETTINGS_SEARCH_METADATA = {
       SABnzbd: "Usenet download client",
     },
     fields: {
-      "Quality Profile": "default acceptable allowed formats rank preference cutoff upgrades",
+      "Quality profile": "default acceptable allowed formats rank preference cutoff upgrades",
       Qualities: "FLAC MP3 M4A 128 192 256 320 bitrate hi-res standard allowed cutoff drag rank",
       "Automatic upgrades": "upgrade searches Flow Static tracks",
       "Upgrade interval": "days between checks",
@@ -150,7 +150,7 @@ const SETTINGS_SEARCH_METADATA = {
     },
   },
   playback: {
-    sections: ["Playback Servers", "Scrobbling", "Cover Art", "Connection", "Account", "Aurral Library Path", "Main library (optional)", "Sync"],
+    sections: ["Playback servers", "Scrobbling", "Cover art", "Connection", "Account", "Aurral library path", "Main library (optional)", "Sync"],
     services: {
       Navidrome: "Subsonic music server",
       Plex: "Plexamp music server",
@@ -173,7 +173,7 @@ const SETTINGS_SEARCH_METADATA = {
     },
   },
   connect: {
-    sections: ["Connections", "Webhooks", "Notification Events", "Inbox"],
+    sections: ["Connections", "Webhooks", "Notification events", "Inbox"],
     services: {
       Gotify: "push notifications mobile alerts",
       "Last.fm": "recommendations API key secret scrobbling",
@@ -198,22 +198,22 @@ const SETTINGS_SEARCH_METADATA = {
       "Weekly flow finished": "notification event webhook Gotify",
       "Request made": "notification event webhook Gotify",
       "Request available": "notification event webhook Gotify",
-      "Enable Inbox": "inbox on off",
+      "Enable inbox": "inbox on off",
       "Upcoming releases": "inbox albums",
       "Upcoming shows": "inbox concerts events",
-      "Library Artist news": "inbox RSS",
-      "Recommended Artist news": "inbox RSS",
+      "Library artist news": "inbox RSS",
+      "Recommended artist news": "inbox RSS",
       Discoveries: "inbox recommendations",
     },
   },
   "rss-news": {
-    sections: ["RSS News", "Custom feeds", "Feed groups"],
+    sections: ["RSS news", "Custom feeds", "Feed groups"],
     services: {
       News: "RSS articles artists library recommendations",
       Feeds: "music news sources custom feeds",
     },
     fields: {
-      "Enable RSS News": "news on off",
+      "Enable RSS news": "news on off",
       "Add RSS feed": "custom source",
       "Feed name": "custom RSS source",
       "Feed URL": "custom RSS address",
@@ -221,7 +221,7 @@ const SETTINGS_SEARCH_METADATA = {
     },
   },
   discover: {
-    sections: ["Discovery Behavior", "Cache Status"],
+    sections: ["Discovery behavior", "Cache status"],
     services: {
       "Last.fm": "recommendations listening history",
       ListenBrainz: "recommendations discovery fallback",
@@ -239,7 +239,7 @@ const SETTINGS_SEARCH_METADATA = {
     },
   },
   metadata: {
-    sections: ["Metadata Server"],
+    sections: ["Metadata server"],
     services: {
       BrainzMash: "MusicBrainz metadata provider",
     },
@@ -248,7 +248,7 @@ const SETTINGS_SEARCH_METADATA = {
     },
   },
   users: {
-    sections: ["Change Password", "Local Network Auto-login", "Users"],
+    sections: ["Change password", "Local network auto-login", "Users"],
     services: {
       Authentication: "login password security",
       Permissions: "roles access control",

From 5bcdc3f490209e2e369858f2e5362021b67248de Mon Sep 17 00:00:00 2001
From: Lee Kelly <hello@leekelly.org>
Date: Mon, 17 Aug 2026 02:46:07 +0000
Subject: [PATCH 2/2] fix(settings): address review feedback

---
 .../components/SettingsConnectTab.jsx         |  5 ++-
 .../SettingsDownloadClientsSection.jsx        |  8 +++-
 .../components/SettingsIndexersSection.jsx    |  5 ++-
 .../components/SettingsPlaybackSection.jsx    | 12 ++++--
 .../components/arr/SettingsArrLayout.jsx      | 14 +++----
 frontend/src/pages/Settings/settingsArr.css   | 40 +++++++++++--------
 6 files changed, 54 insertions(+), 30 deletions(-)

diff --git a/frontend/src/pages/Settings/components/SettingsConnectTab.jsx b/frontend/src/pages/Settings/components/SettingsConnectTab.jsx
index ae4b6456a..b1635a3a5 100644
--- a/frontend/src/pages/Settings/components/SettingsConnectTab.jsx
+++ b/frontend/src/pages/Settings/components/SettingsConnectTab.jsx
@@ -62,7 +62,8 @@ export function SettingsConnectTab({
     });
   };
 
-  const updateGotify = (patch) =>
+  const updateGotify = (patch) => {
+    setTestStatus(null);
     updateSettings({
       ...settings,
       integrations: {
@@ -70,6 +71,7 @@ export function SettingsConnectTab({
         gotify: { ...gotify, ...patch },
       },
     });
+  };
 
   const updateLastfm = (patch) =>
     updateSettings({
@@ -103,6 +105,7 @@ export function SettingsConnectTab({
   }, [activeModal]);
 
   const handleTestGotify = async () => {
+    setTestStatus(null);
     const url = gotify.url;
     const token = gotify.token;
     if (!url || !token) {
diff --git a/frontend/src/pages/Settings/components/SettingsDownloadClientsSection.jsx b/frontend/src/pages/Settings/components/SettingsDownloadClientsSection.jsx
index 31c2b5d4c..c0a32b419 100644
--- a/frontend/src/pages/Settings/components/SettingsDownloadClientsSection.jsx
+++ b/frontend/src/pages/Settings/components/SettingsDownloadClientsSection.jsx
@@ -98,7 +98,8 @@ export function SettingsDownloadClientsSection({
   const nzbgetEnabled = nzbget.enabled === true;
   const sabnzbdEnabled = sabnzbd.enabled === true;
 
-  const updateIntegration = (key, patch) =>
+  const updateIntegration = (key, patch) => {
+    setTestStatus(null);
     updateSettings({
       ...settings,
       integrations: {
@@ -109,6 +110,7 @@ export function SettingsDownloadClientsSection({
         },
       },
     });
+  };
 
   const updatePathMappings = (nextMappings) => {
     updateSettings({
@@ -152,6 +154,7 @@ export function SettingsDownloadClientsSection({
   };
 
   const handleTestNzbget = async () => {
+    setTestStatus(null);
     if (!nzbgetEnabled || !nzbget.url) {
       setTestStatus({ tone: "error", message: "Enable NZBGet and enter the server URL." });
       showError("Enable NZBGet and enter the server URL first");
@@ -177,6 +180,7 @@ export function SettingsDownloadClientsSection({
   };
 
   const handleTestSabnzbd = async () => {
+    setTestStatus(null);
     if (!sabnzbdEnabled || !sabnzbd.url || !sabnzbd.apiKey) {
       setTestStatus({ tone: "error", message: "Enable SABnzbd and enter the URL and API key." });
       showError("Enable SABnzbd and enter the server URL and API key first");
@@ -202,6 +206,7 @@ export function SettingsDownloadClientsSection({
   };
 
   const handleTestSlskd = async () => {
+    setTestStatus(null);
     if (!slskd.url || !slskd.apiKey) {
       setTestStatus({ tone: "error", message: "Enter the slskd URL and API key." });
       showError("Enter slskd URL and API key first");
@@ -237,6 +242,7 @@ export function SettingsDownloadClientsSection({
   };
 
   const handleTestYtdlp = async () => {
+    setTestStatus(null);
     setTestingYtdlp(true);
     try {
       await handleSaveSettings();
diff --git a/frontend/src/pages/Settings/components/SettingsIndexersSection.jsx b/frontend/src/pages/Settings/components/SettingsIndexersSection.jsx
index 6399591b0..21cdd6e6a 100644
--- a/frontend/src/pages/Settings/components/SettingsIndexersSection.jsx
+++ b/frontend/src/pages/Settings/components/SettingsIndexersSection.jsx
@@ -39,7 +39,8 @@ export function SettingsIndexersSection({
     setTestStatus(null);
   }, [activeModal]);
 
-  const updateIntegration = (key, patch) =>
+  const updateIntegration = (key, patch) => {
+    setTestStatus(null);
     updateSettings({
       ...settings,
       integrations: {
@@ -50,6 +51,7 @@ export function SettingsIndexersSection({
         },
       },
     });
+  };
 
   const loadProwlarrIndexers = async ({ quiet = false } = {}) => {
     if (!health?.prowlarrConfigured) {
@@ -130,6 +132,7 @@ export function SettingsIndexersSection({
   };
 
   const handleTestProwlarr = async () => {
+    setTestStatus(null);
     if (!prowlarrEnabled || !prowlarr.url || !prowlarr.apiKey) {
       setTestStatus({ tone: "error", message: "Enable Prowlarr and enter the URL and API key." });
       showError("Enable Prowlarr and enter URL and API key first");
diff --git a/frontend/src/pages/Settings/components/SettingsPlaybackSection.jsx b/frontend/src/pages/Settings/components/SettingsPlaybackSection.jsx
index efb9cf596..a1adefc59 100644
--- a/frontend/src/pages/Settings/components/SettingsPlaybackSection.jsx
+++ b/frontend/src/pages/Settings/components/SettingsPlaybackSection.jsx
@@ -99,7 +99,8 @@ export function SettingsPlaybackSection({
     setPlexPathPickerOpen(false);
   };
 
-  const updateNavidrome = (patch) =>
+  const updateNavidrome = (patch) => {
+    setTestStatus(null);
     updateSettings({
       ...settings,
       integrations: {
@@ -107,8 +108,10 @@ export function SettingsPlaybackSection({
         navidrome: { ...navidrome, ...patch },
       },
     });
+  };
 
-  const updatePlex = (patch) =>
+  const updatePlex = (patch) => {
+    setTestStatus(null);
     updateSettings({
       ...settings,
       integrations: {
@@ -116,6 +119,7 @@ export function SettingsPlaybackSection({
         plex: { ...plex, ...patch },
       },
     });
+  };
 
   const updatePlexLibraryLocalPath = (localPath) => {
     const trimmed = String(localPath || "").trim();
@@ -261,6 +265,7 @@ export function SettingsPlaybackSection({
   };
 
   const handleTestPlex = async () => {
+    setTestStatus(null);
     if (!plex.url || !plex.token) {
       setTestStatus({ tone: "error", message: "Connect to Plex and select a server first." });
       showError("Connect to Plex and select a server first");
@@ -270,11 +275,11 @@ export function SettingsPlaybackSection({
     try {
       const result = await testPlaybackConnection("plex", plex);
       if (result.success) {
-        setTestStatus({ tone: "success", message: "Connected." });
         showSuccess(`Plex connection successful!${result.version ? ` (v${result.version})` : ""}`);
         if (result.machineIdentifier) {
           updatePlex({ machineIdentifier: result.machineIdentifier });
         }
+        setTestStatus({ tone: "success", message: "Connected." });
       } else {
         setTestStatus({ tone: "error", message: "Connection failed. Check Plex settings and retry." });
         showError(`Connection failed: ${result.message || result.error}`);
@@ -289,6 +294,7 @@ export function SettingsPlaybackSection({
   };
 
   const handleTestNavidrome = async () => {
+    setTestStatus(null);
     if (!navidrome.url || !navidrome.username || !navidrome.password) {
       setTestStatus({ tone: "error", message: "Enter the URL and credentials first." });
       showError("Enter Navidrome URL, username, and password first");
diff --git a/frontend/src/pages/Settings/components/arr/SettingsArrLayout.jsx b/frontend/src/pages/Settings/components/arr/SettingsArrLayout.jsx
index cf1c1eb70..fd65f7bca 100644
--- a/frontend/src/pages/Settings/components/arr/SettingsArrLayout.jsx
+++ b/frontend/src/pages/Settings/components/arr/SettingsArrLayout.jsx
@@ -4,15 +4,13 @@ export function SettingsArrFieldSet({ legend, actions = null, children }) {
   const headingId = useId();
 
   return (
-    <section className="arr-fieldset" aria-labelledby={headingId}>
-      <div className="arr-fieldset__head">
-        <h2 id={headingId} className="arr-fieldset__legend">
-          {legend}
-        </h2>
-        {actions ? <div className="arr-fieldset__actions">{actions}</div> : null}
-      </div>
+    <fieldset className="arr-fieldset" aria-labelledby={headingId}>
+      <legend id={headingId} className="arr-fieldset__legend">
+        {legend}
+      </legend>
+      {actions ? <div className="arr-fieldset__actions">{actions}</div> : null}
       <div className="arr-fieldset__body">{children}</div>
-    </section>
+    </fieldset>
   );
 }
 
diff --git a/frontend/src/pages/Settings/settingsArr.css b/frontend/src/pages/Settings/settingsArr.css
index f6509e9b9..5f6547955 100644
--- a/frontend/src/pages/Settings/settingsArr.css
+++ b/frontend/src/pages/Settings/settingsArr.css
@@ -140,27 +140,20 @@
 }
 
 .arr-fieldset {
+  position: relative;
   margin: 0 0 1.25rem;
   padding: 0;
   min-width: 0;
   border: 0;
 }
 
-.arr-fieldset__head {
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-  gap: 0.75rem;
-  margin-bottom: 1.3125rem;
-  padding-bottom: 0.625rem;
-  border-bottom: 0.0625rem solid var(--aurral-border-strong);
-}
-
 .arr-fieldset__legend {
   display: block;
-  margin: 0;
-  padding: 0;
+  width: 100%;
+  margin: 0 0 1.3125rem;
+  padding: 0 0 0.625rem;
   border: 0;
+  border-bottom: 0.0625rem solid var(--aurral-border-strong);
   color: var(--aurral-text-muted);
   font-size: 1.3125rem;
   font-weight: 400;
@@ -168,6 +161,9 @@
 }
 
 .arr-fieldset__actions {
+  position: absolute;
+  top: 0;
+  right: 0;
   display: flex;
   align-items: center;
   gap: 0.5rem;
@@ -1685,7 +1681,6 @@
   background: transparent;
 }
 
-.settings-arr .arr-fieldset__head,
 .settings-arr .settings-page__section-header {
   min-height: 2rem;
   margin: 0 0 0.625rem;
@@ -1695,8 +1690,10 @@
 
 .settings-arr .arr-fieldset__legend,
 .settings-arr .settings-page__section-title {
-  margin: 0;
-  padding: 0;
+  min-height: 2rem;
+  margin: 0 0 0.625rem;
+  padding: 0 0.75rem;
+  border: 0;
   color: var(--aurral-text);
   font-size: 1.125rem;
   font-weight: 650;
@@ -1704,7 +1701,11 @@
   line-height: 1.25;
 }
 
-.settings-arr .arr-fieldset__actions,
+.settings-arr .arr-fieldset__actions {
+  top: 0;
+  right: 0.75rem;
+}
+
 .settings-arr .settings-page__inline-row {
   gap: 0.375rem;
 }
@@ -2170,6 +2171,7 @@
   .settings-arr .pill-toggle {
     --w: 2rem;
     --h: calc(var(--w) * 0.4865);
+
     width: 2.75rem;
     height: 2.75rem;
     background: transparent;
@@ -2222,6 +2224,12 @@
     top: 4rem;
   }
 
+  .settings-arr .arr-fieldset__actions {
+    position: static;
+    flex-wrap: wrap;
+    margin: -0.25rem 0.75rem 0.625rem;
+  }
+
   .settings-arr__toolbar {
     padding: 0 0.5rem;
   }