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/rare-values/page.tsx

@@ -4,6 +4,7 @@ import {
   deleteCategory,
   deleteValue,
 } from "@/actions/admin-rare-values";
+import { StatusCard } from "@/components/admin/dashboard";
 import { prisma } from "@/lib/prisma";
 
 export const dynamic = "force-dynamic";
@@ -40,11 +41,16 @@ export default async function AdminRareValues() {
   return (
     <main>
       <h1>Rare Values</h1>
-      <p className="muted">
+      <p className="muted" style={{ marginTop: "-0.4rem" }}>
         Catalog of rare furni and their trade values, grouped by category. Each category is
         rendered as a tab on the public rare values page.
       </p>
 
+      <div className="admin-stats">
+        <StatusCard label="Categories" value={categories.length} icon="🗂️" />
+        <StatusCard label="Rare items" value={values.length} icon="💎" />
+      </div>
+
       <form action={createCategory} className="card" style={{ marginBottom: "1.5rem" }}>
         <h3 style={{ marginTop: 0 }}>New category</h3>
         <div style={{ display: "flex", gap: "0.5rem", flexWrap: "wrap" }}>
@@ -74,10 +80,11 @@ export default async function AdminRareValues() {
                   flexWrap: "wrap",
                 }}
               >
-                <div style={{ display: "flex", gap: "0.6rem", alignItems: "baseline" }}>
+                <div style={{ display: "flex", gap: "0.6rem", alignItems: "baseline", flexWrap: "wrap" }}>
                   <strong>{cat.name}</strong>
-                  <span className="muted">badge {cat.badge}</span>
-                  <span className="muted">priority {cat.priority}</span>
+                  <span className="admin-badge">badge {cat.badge}</span>
+                  <span className="admin-badge">priority {cat.priority}</span>
+                  <span className="muted">{rows.length} item{rows.length === 1 ? "" : "s"}</span>
                 </div>
                 <form action={deleteCategory}>
                   <input type="hidden" name="id" value={catId} />
@@ -104,7 +111,9 @@ export default async function AdminRareValues() {
                       <td className="muted">{v.itemId ?? "—"}</td>
                       <td>{v.creditValue ?? "—"}</td>
                       <td>{v.currencyValue ?? "—"}</td>
-                      <td className="muted">{v.currencyType}</td>
+                      <td>
+                        <span className="admin-badge">{v.currencyType}</span>
+                      </td>
                       <td className="muted">{v.furnitureIcon}</td>
                       <td>
                         <form action={deleteValue}>