Polish content pages: share AuthTopBar, page-grid helper and responsive tables

- Extract shared AuthTopBar frosted top bar; reuse in login & register
- Add .page-grid class replacing 48 inline grid styles
- Add .table-scroll + .table-cell-truncate helpers; wrap leaderboard/staff tables
- Constrain settings page width (max-w-5xl) and stack profile card on mobile
- Use theme background var for shop category icon (dark-mode safe)

src/app/(site)/settings/page.tsx

@@ -44,7 +44,7 @@ export default async function SettingsPage() {
 	const avatar = avatarImageUrl(user.look);
 
 	return (
-		<div className="flex flex-col gap-6 pb-14">
+		<div className="mx-auto flex w-full max-w-5xl flex-col gap-6 pb-14">
 			{/* Header */}
 			<Reveal>
 				<SurfaceCard
@@ -100,7 +100,7 @@ export default async function SettingsPage() {
 				<SurfaceCard
 					title={t("publicProfile")}
 					icon="/assets/images/icons/navigation/me.png"
-					bodyClassName="p-5 flex items-center gap-5"
+					bodyClassName="p-5 flex flex-col sm:flex-row items-center sm:items-center gap-5"
 				>
 					<div className="shrink-0">
 						<div

src/app/(site)/settings/sessions/page.tsx

@@ -79,7 +79,7 @@ export default async function SessionsPage({
 	}
 
 	return (
-		<main style={{ display: "grid", gap: "1.5rem" }}>
+		<main className="page-grid">
 			{signedOutAll === "1" ? (
 				<p
 					role="status"