Polish admin hub pages: drop duplicate headers, align CTAs and empties.

Remove redundant titles under AdminHubChrome, style events/polls create flows with admin chrome + i18n, and standardize empty states / teams form classes.

Co-authored-by: Cursor <[email protected]>

src/app/admin/teams/page.tsx

@@ -1,4 +1,3 @@
-import { Users } from "lucide-react";
 import { getTranslations } from "next-intl/server";
 import { createTeam, deleteTeam } from "@/actions/admin-teams";
 import { StatusCard } from "@/components/admin/dashboard";
@@ -45,20 +44,6 @@ export default async function AdminTeams() {
 
 	return (
 		<main>
-			<div className="flex items-center gap-3 mb-6">
-				<div className="w-10 h-10 rounded-xl bg-gradient-to-br from-[var(--admin-accent)]/20 to-[var(--admin-accent)]/5 grid place-items-center">
-					<Users size={20} className="text-[var(--admin-accent)]" />
-				</div>
-				<div>
-					<h1 className="m-0 text-xl font-extrabold text-[var(--admin-text)]">
-						{t("title")}
-					</h1>
-					<p className="m-0 text-xs text-[var(--admin-text-muted)] mt-0.5">
-						{t("subtitle")}
-					</p>
-				</div>
-			</div>
-
 			<div className="grid grid-cols-[repeat(auto-fit,minmax(180px,1fr))] gap-3.5 mb-6">
 				<StatusCard label={t("teamRanks")} value={teams.length} icon="🛡️" />
 				<StatusCard
@@ -70,11 +55,11 @@ export default async function AdminTeams() {
 				<StatusCard label={t("hidden")} value={hidden} icon="🙈" />
 			</div>
 
-			<div className="admin-card" style={{ marginBottom: "1.5rem" }}>
-				<h3 style={{ marginTop: 0 }}>{t("newTeamRank")}</h3>
-				<form action={createTeam} style={{ display: "grid", gap: "0.6rem" }}>
+			<div className="admin-card mb-6">
+				<h3 className="mt-0">{t("newTeamRank")}</h3>
+				<form action={createTeam} className="grid gap-2.5">
 					<div className="grid grid-cols-1 gap-4 md:grid-cols-2">
-						<label style={{ display: "grid", gap: "0.25rem" }}>
+						<label className="grid gap-1">
 							<span className="text-sm theme-text-muted dark:theme-text-muted">
 								{t("rankName")}
 							</span>
@@ -84,13 +69,13 @@ export default async function AdminTeams() {
 								required
 							/>
 						</label>
-						<label style={{ display: "grid", gap: "0.25rem" }}>
+						<label className="grid gap-1">
 							<span className="text-sm theme-text-muted dark:theme-text-muted">
 								{t("badgeCode")}
 							</span>
 							<input name="badge" placeholder={t("badgeCodePlaceholder")} />
 						</label>
-						<label style={{ display: "grid", gap: "0.25rem" }}>
+						<label className="grid gap-1">
 							<span className="text-sm theme-text-muted dark:theme-text-muted">
 								{t("jobDescription")}
 							</span>
@@ -99,7 +84,7 @@ export default async function AdminTeams() {
 								placeholder={t("jobDescriptionPlaceholder")}
 							/>
 						</label>
-						<label style={{ display: "grid", gap: "0.25rem" }}>
+						<label className="grid gap-1">
 							<span className="text-sm theme-text-muted dark:theme-text-muted">
 								{t("staffColor")}
 							</span>
@@ -110,14 +95,8 @@ export default async function AdminTeams() {
 							/>
 						</label>
 					</div>
-					<label
-						style={{ display: "flex", alignItems: "center", gap: "0.4rem" }}
-					>
-						<input
-							type="checkbox"
-							name="hiddenRank"
-							style={{ width: "auto" }}
-						/>
+					<label className="flex items-center gap-1.5">
+						<input type="checkbox" name="hiddenRank" className="w-auto" />
 						<span className="text-sm theme-text-muted dark:theme-text-muted">
 							{t("hiddenRank")}
 						</span>
@@ -164,22 +143,11 @@ export default async function AdminTeams() {
 											{team.jobDescription ?? "—"}
 										</td>
 										<td>
-											<span
-												style={{
-													display: "inline-flex",
-													alignItems: "center",
-													gap: "0.4rem",
-												}}
-											>
+											<span className="inline-flex items-center gap-1.5">
 												<span
 													aria-hidden
-													style={{
-														width: 14,
-														height: 14,
-														borderRadius: 4,
-														border: "1px solid var(--admin-border)",
-														background: team.staffColor,
-													}}
+													className="h-3.5 w-3.5 rounded border border-[var(--admin-border)]"
+													style={{ background: team.staffColor }}
 												/>
 												{team.staffColor}
 											</span>