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)/help/[category]/page.tsx

@@ -103,7 +103,7 @@ export default async function HelpCategoryPage({
 	const hasButton = Boolean(cat.buttonText && cat.buttonText.trim() !== "");
 
 	return (
-		<main style={{ display: "grid", gap: "1.5rem" }}>
+		<main className="page-grid">
 			<p style={{ margin: 0 }}>
 				<Link href="/help">{t("back")}</Link>
 			</p>

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

@@ -112,7 +112,7 @@ export default async function HelpCenterPage() {
 	}
 
 	return (
-		<main style={{ display: "grid", gap: "1.5rem" }}>
+		<main className="page-grid">
 			<ContentCard
 				icon="❓"
 				title={t("title")}

src/app/(site)/help/tickets/[id]/page.tsx

@@ -157,7 +157,7 @@ export default async function HelpTicketDetailPage({
 	];
 
 	return (
-		<main style={{ display: "grid", gap: "1.5rem" }}>
+		<main className="page-grid">
 			{replied === "1" ? (
 				<div role="status" style={feedbackStyle("success")}>
 					{t("success.replied")}

src/app/(site)/help/tickets/page.tsx

@@ -67,7 +67,7 @@ export default async function HelpTicketsPage({
 						: null;
 
 	return (
-		<main style={{ display: "grid", gap: "1.5rem" }}>
+		<main className="page-grid">
 			{created === "1" ? (
 				<div role="status" style={feedbackStyle("success")}>
 					{t("success.created")}