feat: enforce no hardcoded colors across entire CMS

Added scripts/check-admin-colors.mjs — scans all src/ files for:
- text-white, text-black (use theme text vars)
- bg-white, bg-black (use theme background/overlay vars)
- bg/text/border/ring with gray/slate/zinc/stone palette
- bg/text/border/ring with red/green/blue/etc palette

Fixed 21 violations across 11 files:
- Overlays: bg-black/* → bg-foreground/*
- Text: text-white → text-primary-foreground
- Backgrounds: bg-white/10 → bg-background/10
- Green accents: bg-green-* → bg-primary
- Red accents: bg-red-* → bg-destructive

Integrated into:
- lint-staged: runs on every *.ts/*.tsx commit
- vitest: src/lib/no-hardcoded-colors.test.ts replaces old audit test
- Allowlist: shadcn/ui primitives (button, badge, dialog) + 4 graphical files

src/components/admin/catalog-manager/catalog-manager-dialog.tsx

@@ -74,7 +74,7 @@ export function CatalogManagerDialog({
 			{mounted && open
 				? createPortal(
 						<div className="fixed inset-0 z-[200]">
-							<div className="absolute inset-0 bg-black/70" />
+							<div className="absolute inset-0 bg-foreground/70" />
 							<div
 								role="dialog"
 								aria-modal="true"

src/components/admin/media-picker.tsx

@@ -94,7 +94,7 @@ export function MediaPicker({
 					role="button"
 					tabIndex={0}
 					aria-label="Close media picker"
-					className="fixed inset-0 z-50 flex items-center justify-center bg-black/50"
+					className="fixed inset-0 z-50 flex items-center justify-center bg-foreground/50"
 					onClick={(e) => {
 						if (e.target === e.currentTarget) setOpen(false);
 					}}

src/components/auth/register-form.tsx

@@ -180,7 +180,7 @@ export function RegisterForm({
 			>
 				{(error || state.error) && (
 					<div
-						className="animate-fade-in-up p-3 rounded-lg text-sm font-semibold text-white"
+						className="animate-fade-in-up p-3 rounded-lg text-sm font-semibold text-primary-foreground"
 						style={{ backgroundColor: "var(--color-danger)" }}
 					>
 						{error || state.error}

src/components/site-header.tsx

@@ -96,7 +96,7 @@ export async function SiteHeader() {
 					) : (
 						<div className="text-center">
 							<h1
-								className="font-black tracking-tight leading-none text-white"
+								className="font-black tracking-tight leading-none text-primary-foreground"
 								style={{
 									fontFamily: "var(--font-nunito)",
 									fontSize: "clamp(2rem, 7vw, 5.5rem)",
@@ -133,8 +133,8 @@ export async function SiteHeader() {
 					}}
 				>
 					<span className="relative flex h-2 w-2 sm:h-2.5 sm:w-2.5">
-						<span className="animate-ping absolute inline-flex h-full w-full rounded-full bg-green-400 opacity-75" />
-						<span className="relative inline-flex rounded-full h-2 w-2 sm:h-2.5 sm:w-2.5 bg-green-500" />
+						<span className="animate-ping absolute inline-flex h-full w-full rounded-full bg-primary opacity-75" />
+						<span className="relative inline-flex rounded-full h-2 w-2 sm:h-2.5 sm:w-2.5 bg-primary" />
 					</span>
 					<span
 						className="text-xs sm:text-sm font-bold tracking-wide"

src/components/top-header.tsx

@@ -231,7 +231,7 @@ export async function TopHeader({ session }: { session: Session | null }) {
 					</form>
 					<Link
 						href="/messages"
-						className="relative flex items-center gap-1 rounded-lg px-1.5 sm:px-2 py-1.5 transition-colors hover:bg-white/10"
+						className="relative flex items-center gap-1 rounded-lg px-1.5 sm:px-2 py-1.5 transition-colors hover:bg-background/10"
 					>
 						<svg
 							xmlns="http://www.w3.org/2000/svg"
@@ -376,7 +376,7 @@ export async function TopHeader({ session }: { session: Session | null }) {
 											<Link
 												key={u.id}
 												href="/messages"
-												className="flex items-center gap-2 rounded-lg px-2 py-1 text-xs transition-colors hover:bg-white/10"
+												className="flex items-center gap-2 rounded-lg px-2 py-1 text-xs transition-colors hover:bg-background/10"
 											>
 												<UserAvatarThumbnail
 													figure={u.look}