Adapt + improve all admin pages to the new design system

Swept the whole housekeeping panel (34 pages) so it's a consistent,
improved adaptation of the old Filament admin rather than bare tables:
- Live status tiles (StatusCard) summarising each page's data — counts
  and stateful metrics (users online, active/permanent bans, pending
  applications, settings, radio shouts, etc.).
- Status pills (admin-badge ok/danger) replacing ad-hoc text: online/
  offline, account/ip ban types, permanent vs timed, command OK/FAIL,
  alert severity & read/new, enabled/disabled, open/closed.
- Sections wrapped in .admin-section with h2 headers; redundant inline
  table styling removed (the global .admin layer handles it).
- alerts/logs/emulator hand-built as the reference pattern; the rest
  via parallel agents that read the schema and preserved every server
  action, query and field name.

Behaviour unchanged (same actions, queries, field names). Verified in a
real authed admin session (prod, amx_test): pages render with live data
(Users tiles show 7 real accounts + online/offline pills), no errors.
tsc 0, vitest 49/49, next build 0.

src/app/admin/settings/page.tsx

@@ -1,4 +1,5 @@
 import { createSetting, deleteSetting, updateSetting } from "@/actions/admin-settings";
+import { StatusCard } from "@/components/admin/dashboard";
 import { prisma } from "@/lib/prisma";
 
 export const dynamic = "force-dynamic";
@@ -11,50 +12,73 @@ export default async function AdminSettings() {
     settings = [];
   }
 
+  const documented = settings.filter((s) => !!s.comment).length;
+
   return (
     <main>
       <h1>CMS Settings</h1>
-      <p className="muted">
+      <p className="muted" style={{ marginTop: "-0.4rem" }}>
         Key/value config read at runtime via <code>siteSettings.get()</code>. Saving busts the cache.
       </p>
 
-      <form action={createSetting} className="card" style={{ marginBottom: "1.5rem" }}>
-        <h3 style={{ marginTop: 0 }}>Add / overwrite</h3>
-        <div style={{ display: "flex", gap: "0.5rem", flexWrap: "wrap" }}>
-          <input name="key" placeholder="key" required />
-          <input name="value" placeholder="value" style={{ flex: 1, minWidth: 160 }} />
-          <input name="comment" placeholder="comment" />
-          <button type="submit">Save</button>
-        </div>
-      </form>
-
-      <div className="grid">
-        {settings.map((s) => (
-          <div key={s.key} className="card">
-            <div style={{ display: "flex", gap: "0.75rem", alignItems: "baseline" }}>
-              <strong style={{ minWidth: 220 }}>{s.key}</strong>
-              <form
-                action={updateSetting}
-                style={{ display: "flex", gap: "0.5rem", flex: 1 }}
-              >
-                <input type="hidden" name="key" value={s.key} />
-                <input name="value" defaultValue={s.value} style={{ flex: 1 }} />
-                <button type="submit">Save</button>
-              </form>
-              <form action={deleteSetting}>
-                <input type="hidden" name="key" value={s.key} />
-                <button type="submit">✕</button>
-              </form>
-            </div>
-            {s.comment ? (
-              <p className="muted" style={{ margin: "0.4rem 0 0" }}>
-                {s.comment}
-              </p>
-            ) : null}
-          </div>
-        ))}
+      <div className="admin-stats">
+        <StatusCard label="Settings" value={settings.length} icon="🗄️" />
+        <StatusCard label="With comment" value={documented} icon="📝" />
       </div>
-      {settings.length === 0 ? <p className="muted">No settings yet.</p> : null}
+
+      <section className="admin-section">
+        <h2>Add / overwrite</h2>
+        <form action={createSetting} className="card">
+          <div style={{ display: "flex", gap: "0.5rem", flexWrap: "wrap" }}>
+            <input name="key" placeholder="key" required />
+            <input name="value" placeholder="value" style={{ flex: 1, minWidth: 160 }} />
+            <input name="comment" placeholder="comment" />
+            <button type="submit" className="btn btn-primary">
+              Save
+            </button>
+          </div>
+        </form>
+      </section>
+
+      <section className="admin-section">
+        <h2>
+          Settings <span className="admin-badge">{settings.length}</span>
+        </h2>
+        {settings.length === 0 ? (
+          <p className="muted">No settings yet.</p>
+        ) : (
+          <div className="grid">
+            {settings.map((s) => (
+              <div key={s.key} className="card">
+                <div style={{ display: "flex", gap: "0.75rem", alignItems: "baseline" }}>
+                  <strong style={{ minWidth: 220 }}>{s.key}</strong>
+                  <form
+                    action={updateSetting}
+                    style={{ display: "flex", gap: "0.5rem", flex: 1 }}
+                  >
+                    <input type="hidden" name="key" value={s.key} />
+                    <input name="value" defaultValue={s.value} style={{ flex: 1 }} />
+                    <button type="submit" className="btn btn-outline">
+                      Save
+                    </button>
+                  </form>
+                  <form action={deleteSetting}>
+                    <input type="hidden" name="key" value={s.key} />
+                    <button type="submit" className="btn btn-danger">
+                      ✕
+                    </button>
+                  </form>
+                </div>
+                {s.comment ? (
+                  <p className="muted" style={{ margin: "0.4rem 0 0" }}>
+                    {s.comment}
+                  </p>
+                ) : null}
+              </div>
+            ))}
+          </div>
+        )}
+      </section>
     </main>
   );
 }