fix: consistent avatar gradient colors across all 17 call sites

Avatar fallback gradients were hashed by display name alone when no
user prop was passed, causing the same person to appear in different
colors across messages, replies, member lists, voice panels, etc.

Added userId prop to Avatar and wired it through all 17 call sites
so the gradient always hashes by user ID.

packages/web/src/components/ui/Avatar.tsx

@@ -11,6 +11,7 @@ interface AvatarProps {
   className?: string;
   onClick?: (e: React.MouseEvent) => void;
   user?: User;
+  userId?: string;
 }
 
 const statusColors: Record<string, string> = {
@@ -20,11 +21,11 @@ const statusColors: Record<string, string> = {
   offline: 'bg-status-offline',
 };
 
-export function Avatar({ src, name, size = 40, status, className = '', onClick, user }: AvatarProps) {
+export function Avatar({ src, name, size = 40, status, className = '', onClick, user, userId }: AvatarProps) {
   const openUserProfile = useUIStore((s) => s.openUserProfile);
   const initials = name.charAt(0).toUpperCase();
   const fontSize = size < 32 ? 'text-xs' : size < 48 ? 'text-sm' : 'text-lg';
-  const gradient = getAvatarGradient(user?.id, name);
+  const gradient = getAvatarGradient(userId ?? user?.id, name);
 
   const handleClick = (e: React.MouseEvent) => {
     if (onClick) {