fix: use space gradients for mutual space avatars and add federation indicators in profile modal

Space avatars in the mutual spaces tab now use getSpaceGradient() instead of
a flat grey background, matching the sidebar appearance. Mutual friends and
spaces from remote instances show a globe icon with the instance hostname.
Also wires up federated mutuals loading, correct API client routing for
remote user profiles, and the new mutuals utility.

packages/web/src/stores/instanceStore.ts

@@ -2,7 +2,7 @@ import { create } from 'zustand';
 import type { User, InstanceInfoResponse, ReplicatedInstance, AuthResponse } from '@backspace/shared';
 import { BackspaceApiClient, createApiClient, api } from '../api/client';
 import { useAuthStore } from './authStore';
-import { setApiForOriginResolver, setUserIdForOriginResolver, useSpaceStore } from './spaceStore';
+import { setApiForOriginResolver, setUserIdForOriginResolver, setOriginFromHostnameResolver, useSpaceStore } from './spaceStore';
 import { connectInstance, disconnectInstance, disconnectAllRemote } from '../hooks/useWebSocket';
 
 // ─── Types ───────────────────────────────────────────────────────────────────
@@ -605,3 +605,13 @@ setUserIdForOriginResolver((origin: string): string | undefined => {
   const instance = useInstanceStore.getState().instances.find(i => i.origin === origin);
   return instance?.user.id;
 });
+
+// ─── Hostname → origin resolution (federation) ────────────────────────────────
+// Maps a user's homeInstance hostname to its full origin URL.
+
+setOriginFromHostnameResolver((hostname: string): string => {
+  const inst = useInstanceStore.getState().instances.find(i => {
+    try { return new URL(i.origin).host === hostname; } catch { return false; }
+  });
+  return inst?.origin ?? '';
+});

packages/web/src/stores/spaceStore.ts

@@ -582,6 +582,27 @@ export function getApiForOrigin(origin: string): BackspaceApiClient {
   return _getApiForOrigin(origin);
 }
 
+// ─── Hostname → origin resolution (federation) ────────────────────────────────
+// Converts a user's `homeInstance` hostname (e.g. "remote.example.com") to a
+// full origin URL (e.g. "https://remote.example.com") by looking up connected
+// instances.  Registered by instanceStore on import.
+
+let _resolveOriginFromHostname: ((hostname: string) => string) | null = null;
+
+export function setOriginFromHostnameResolver(resolver: (hostname: string) => string): void {
+  _resolveOriginFromHostname = resolver;
+}
+
+/**
+ * Returns the instance origin for a federated user based on their homeInstance.
+ * '' = home/local user, 'https://...' = remote instance.
+ */
+export function resolveUserOrigin(user: { homeInstance?: string | null }): string {
+  const host = user.homeInstance;
+  if (!host || host === window.location.host) return '';
+  return _resolveOriginFromHostname?.(host) ?? '';
+}
+
 // ─── User ID resolution (federation) ──────────────────────────────────────────
 // Same resolver pattern as getApiForOrigin — registered by instanceStore on
 // import to break the circular dependency chain.