Adapt + improve all public pages to the atom design system

Extended the same design-system treatment to the public site, faithful
to AtomCMS's "atom" theme. New src/components/public/ui.tsx provides the
signature atom building blocks + a scoped CSS layer:
- ContentCard: surface card with a primary-tinted header (icon circle +
  title + subtitle) and padded body — the atom content-card, used as
  every page's header and section wrapper.
- StatBlock / stat-grid, EmptyState, OnlineBadge (online/offline pill),
  RankBadge (medals for the top 3), and responsive .card-grid helpers.

Swept ~45 public pages (home/community/rankings hand-built as the
reference; the rest via parallel agents that read the schema and
preserved every query, server action, auth gate and field name):
heroes → ContentCard headers, lists → card-grids in ContentCards,
"no X" → EmptyState, status → OnlineBadge/RankBadge. The leaderboard
gained Credits/Diamonds/Duckets tabs (usersCurrency).

Behaviour unchanged. Verified on the prod server against amx_test: 15+
public pages render the content-cards/grids with real data, no errors;
computed styles confirm the tinted header, icon circle, medal + online
pills. Fixed an undefined --color-golden ref. tsc 0, vitest 49/49,
next build 0.

src/app/verify/page.tsx

@@ -1,5 +1,6 @@
 import Link from "next/link";
 import { isValidVerificationToken } from "@/actions/email-verify";
+import { ContentCard, EmptyState } from "@/components/public/ui";
 import { prisma } from "@/lib/prisma";
 
 // Reads + writes the live users table — must never be statically rendered.
@@ -50,54 +51,44 @@ export default async function VerifyPage({
   }
 
   return (
-    <main>
-      <h1>Email verification</h1>
-      <div className="card" style={{ marginTop: "1rem" }}>
-        {status === "verified" ? (
-          <>
-            <h2 style={{ marginTop: 0 }}>You're all set</h2>
-            <p className="muted">
-              Your email address has been verified. You can now log in and play.
-            </p>
-            <p style={{ marginTop: "1rem" }}>
-              <Link href="/login" className="btn btn-primary">
-                Go to login
-              </Link>
-            </p>
-          </>
-        ) : status === "already" ? (
-          <>
-            <h2 style={{ marginTop: 0 }}>Already verified</h2>
-            <p className="muted">This email address has already been confirmed.</p>
-            <p style={{ marginTop: "1rem" }}>
-              <Link href="/login" className="btn btn-primary">
-                Go to login
-              </Link>
-            </p>
-          </>
-        ) : status === "unavailable" ? (
-          <>
-            <h2 style={{ marginTop: 0 }}>Try again shortly</h2>
-            <p className="muted">
-              We couldn't reach the server to verify your email. Please retry the link in a
-              moment.
-            </p>
-          </>
-        ) : (
-          <>
-            <h2 style={{ marginTop: 0 }}>Invalid or expired link</h2>
-            <p className="muted">
-              This verification link is not valid. Make sure you opened the full link from your
-              email, or request a new one.
-            </p>
-            <p style={{ marginTop: "1rem" }}>
-              <Link href="/login" className="btn btn-outline">
-                Back to login
-              </Link>
-            </p>
-          </>
-        )}
-      </div>
+    <main style={{ maxWidth: 480, margin: "2rem auto" }}>
+      {status === "verified" ? (
+        <ContentCard icon="✅" title="You're all set" subtitle="Email verified">
+          <p className="muted" style={{ marginTop: 0 }}>
+            Your email address has been verified. You can now log in and play.
+          </p>
+          <Link href="/login" className="btn btn-primary">
+            Go to login
+          </Link>
+        </ContentCard>
+      ) : status === "already" ? (
+        <ContentCard icon="✅" title="Already verified" subtitle="Nothing left to do">
+          <p className="muted" style={{ marginTop: 0 }}>
+            This email address has already been confirmed.
+          </p>
+          <Link href="/login" className="btn btn-primary">
+            Go to login
+          </Link>
+        </ContentCard>
+      ) : status === "unavailable" ? (
+        <ContentCard icon="⏳" title="Try again shortly" subtitle="Server unreachable">
+          <p className="muted" style={{ margin: 0 }}>
+            We couldn't reach the server to verify your email. Please retry the link in a moment.
+          </p>
+        </ContentCard>
+      ) : (
+        <ContentCard icon="📧" title="Email verification" subtitle="Invalid or expired link">
+          <EmptyState icon="🔗">
+            This verification link is not valid. Make sure you opened the full link from your email,
+            or request a new one.
+          </EmptyState>
+          <div style={{ textAlign: "center" }}>
+            <Link href="/login" className="btn btn-outline">
+              Back to login
+            </Link>
+          </div>
+        </ContentCard>
+      )}
     </main>
   );
 }