Split Settings into sub-pages and add DNS cache clearing

Settings was a single long page. Break it into a sub-nav (Notifications,
DNS Badges, Cache) with its own route per section, each loading and
saving independently. Also add the DNS record-cache clearing action
that Sloth Manager had — a new admin-only POST /api/dns/cache/clear
truncates the zone/record cache tables so stale data can be wiped and
zones re-synced from scratch.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>

web/src/App.tsx

@@ -1,5 +1,5 @@
 import { useEffect, useState, type ReactNode } from "react";
-import { Routes, Route } from "react-router-dom";
+import { Routes, Route, Navigate } from "react-router-dom";
 import { api, type CurrentUser, type UserRole, UnauthorizedError } from "./api/client";
 import Login from "./pages/Login";
 import Dashboard from "./pages/Dashboard";
@@ -11,6 +11,9 @@ import Dns from "./pages/Dns";
 import ServersTasks from "./pages/ServersTasks";
 import Integrations from "./pages/Integrations";
 import Settings from "./pages/Settings";
+import NotificationSettings from "./pages/settings/NotificationSettings";
+import DnsBadgeSettings from "./pages/settings/DnsBadgeSettings";
+import CacheSettings from "./pages/settings/CacheSettings";
 import AppShell from "./layout/AppShell";
 
 const roleRank: Record<UserRole, number> = { viewer: 0, operator: 1, admin: 2 };
@@ -87,7 +90,12 @@ export default function App() {
               <Settings />
             </RequireRole>
           }
-        />
+        >
+          <Route index element={<Navigate to="notifications" replace />} />
+          <Route path="notifications" element={<NotificationSettings />} />
+          <Route path="dns-badges" element={<DnsBadgeSettings />} />
+          <Route path="cache" element={<CacheSettings />} />
+        </Route>
       </Routes>
     </AppShell>
   );