fix: show the focus ring on the About card in the settings sidebar and name it by what it shows

components/settings/__tests__/about-data-settings.test.tsx

@@ -54,3 +54,16 @@ describe('Backup & reset', () => {
     expect(alertSpy).not.toHaveBeenCalled();
   });
 });
+
+// SET-25: the About card in the settings sidebar is named by what it shows,
+// not a hard-coded English "About", and shows the focus ring.
+describe('About card', () => {
+  it('has a visible focus ring and no hard-coded English name', async () => {
+    const { AboutFooter } = await import('../about-data-settings');
+    render(<AboutFooter />);
+    const button = screen.getByTestId('settings-about').querySelector('button') as HTMLButtonElement;
+    expect(button.getAttribute('aria-label')).toBeNull();
+    expect(button.className).toContain('focus-visible:ring-2');
+    expect(button.textContent).toContain('about.title');
+  });
+});

components/settings/about-data-settings.tsx

@@ -85,7 +85,13 @@ export function AboutFooter() {
     <div data-testid="settings-about" className="px-3 py-2">
       {showGame && <SpamSiegeGame onClose={() => setShowGame(false)} />}
       <div className="flex items-center gap-3">
-        <button onClick={handleLogoClick} className="flex items-center gap-3 flex-1 min-w-0 text-start focus:outline-none group/about cursor-pointer" aria-label="About">
+        {/* Named by what it shows (app name and version), with the focus
+            ring every other stop in the sidebar has. */}
+        <button
+          type="button"
+          onClick={handleLogoClick}
+          className="flex items-center gap-3 flex-1 min-w-0 text-start rounded-md focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring group/about cursor-pointer"
+        >
           <img
             src={logoLight}
             alt={branded ? appName : 'Bulwark'}