feat(ui): enhance mobile user experience and authentication handling

Add `UserNavMobile` component for improved mobile navigation. Update dashboard and profile pages to include authentication checks with loading states and login prompts. Introduce category-specific content tabs on the profile page. Apply sidebar enhancements, including new sections for user favorites and memes.

frontend/src/components/user-nav-mobile.tsx

@@ -0,0 +1,39 @@
+"use client";
+
+import { LogIn, User as UserIcon } from "lucide-react";
+import Link from "next/link";
+import * as React from "react";
+import { Avatar, AvatarFallback, AvatarImage } from "@/components/ui/avatar";
+import { Button } from "@/components/ui/button";
+import { useAuth } from "@/providers/auth-provider";
+
+export function UserNavMobile() {
+	const { user, isAuthenticated, isLoading } = useAuth();
+
+	if (isLoading) {
+		return <div className="h-8 w-8 rounded-full bg-zinc-200 animate-pulse" />;
+	}
+
+	if (!isAuthenticated || !user) {
+		return (
+			<Button variant="ghost" size="icon" asChild className="h-9 w-9">
+				<Link href="/login">
+					<LogIn className="h-5 w-5" />
+				</Link>
+			</Button>
+		);
+	}
+
+	return (
+		<Button variant="ghost" size="icon" asChild className="h-9 w-9 p-0">
+			<Link href="/profile">
+				<Avatar className="h-8 w-8 border">
+					<AvatarImage src={user.avatarUrl} alt={user.username} />
+					<AvatarFallback>
+						{user.username.slice(0, 2).toUpperCase()}
+					</AvatarFallback>
+				</Avatar>
+			</Link>
+		</Button>
+	);
+}