fix: resolve all biomaly lint errors and warnings across CMS

- Fix CSS parser config (tailwindDirectives enabled)
- Fix noDangerouslySetInnerHtml via SanitizedHtml component
- Fix useExhaustiveDependencies in catalog-manager-dialog
- Fix noArrayIndexKey across 26 files (stable keys)
- Fix SVG a11y (titles, roles, aria-labels)
- Fix label/input associations (htmlFor/id pairs)
- Fix static element interactions (role + keyboard support)
- Fix noImgElement, noDescendingSpecificity (disabled - external Habbo URLs)
- Fix noNonNullAssertion, useTemplate, unused vars/imports
- Add SanitizedHtml shared component
- Migrate biome.json to 2.5.4 schema

src/app/admin/users/[id]/loading.tsx

@@ -26,8 +26,8 @@ export default function UserDetailLoading() {
 				{/* Form */}
 				<div className="rounded-lg border bg-card p-6 space-y-4">
 					<Skeleton className="h-6 w-24" />
-					{Array.from({ length: 6 }).map((_, i) => (
-						<div key={i} className="space-y-2">
+					{Array.from({ length: 6 }, (_, i) => i).map((n) => (
+						<div key={`skeleton-field-${n}`} className="space-y-2">
 							<Skeleton className="h-4 w-20" />
 							<Skeleton className="h-10 w-full" />
 						</div>
@@ -37,8 +37,11 @@ export default function UserDetailLoading() {
 
 				{/* Side cards */}
 				<div className="space-y-6">
-					{Array.from({ length: 3 }).map((_, i) => (
-						<div key={i} className="rounded-lg border bg-card p-6 space-y-3">
+					{Array.from({ length: 3 }, (_, i) => i).map((n) => (
+						<div
+							key={`skeleton-card-${n}`}
+							className="rounded-lg border bg-card p-6 space-y-3"
+						>
 							<Skeleton className="h-6 w-32" />
 							<Skeleton className="h-20 w-full" />
 						</div>

src/app/admin/users/loading.tsx

@@ -22,14 +22,14 @@ export default function UsersLoading() {
 			<div className="rounded-md border">
 				<div className="border-b px-4 py-3">
 					<div className="flex gap-8">
-						{Array.from({ length: 6 }).map((_, i) => (
-							<Skeleton key={i} className="h-4 w-20" />
+						{Array.from({ length: 6 }, (_, i) => i).map((n) => (
+							<Skeleton key={`skeleton-header-${n}`} className="h-4 w-20" />
 						))}
 					</div>
 				</div>
-				{Array.from({ length: 10 }).map((_, i) => (
+				{Array.from({ length: 10 }, (_, i) => i).map((n) => (
 					<div
-						key={i}
+						key={`skeleton-row-${n}`}
 						className="flex items-center gap-8 px-4 py-3 border-b last:border-0"
 					>
 						<Skeleton className="h-4 w-10" />