Refine dashboard hero, mobile nav, animations and touch polish

- Stack the /me dashboard hero (avatar + info) on small screens instead of
  crowding them side by side; center the avatar and info on mobile
- Respect prefers-reduced-motion in the Reveal scroll animation
- Make the desktop pitch-in (NavDropdown) and mobile menu more consistent;
  give the mobile menu a max-height with overscroll containment so long
  navs scroll instead of overflowing on small phones
- Add safe-area insets for notched devices on header, nav and footer
- Polish whole-link content-cards (community tiles) with hover lift and a
  visible focus ring
- Enforce a comfortable min touch height on all .btn buttons

src/components/mobile-nav.tsx

@@ -63,7 +63,7 @@ export function MobileNav({
 			<AnimatePresence>
 				{open && (
 					<motion.div
-						className="absolute left-0 top-full mt-2 w-[min(86vw,320px)] z-50 origin-top-left"
+						className="absolute left-0 top-full mt-2 w-[min(88vw,360px)] z-50 origin-top-left"
 						style={{ backgroundColor: "transparent" }}
 						variants={mobileMenuVariants}
 						initial="hidden"
@@ -71,7 +71,7 @@ export function MobileNav({
 						exit="exit"
 					>
 						<div
-							className="flex flex-col gap-y-1 p-2 rounded-2xl border shadow-xl
+							className="flex flex-col gap-y-1 p-2 rounded-2xl border shadow-xl max-h-[calc(100dvh-5rem)] overflow-y-auto overscroll-contain
 								bg-[var(--color-dropdown,var(--color-surface,#fff))]"
 							style={{
 								borderColor: