feat: two-step registration with avatar/color picker, fix focus ring clipping

Refactor RegisterPage into a two-step flow: credentials first, then
personalization (display name, avatar upload, avatar color). Replace the
dual-panel sliding layout with conditional rendering and CSS keyframe
animations to eliminate overflow-hidden clipping of focus rings.

Supporting changes:
- Server accepts avatarColor on registration
- Auth store resets all user-scoped stores on login/register/logout
- Voice store gains resetSession() for full session cleanup
- Sync presence status to federated instances
- Propagate presence_update to socialStore regardless of origin

packages/web/src/utils/profileSync.ts

@@ -30,6 +30,7 @@ export async function syncProfileToRemote(inst: ConnectedInstance): Promise<void
       accentColor: homeUser.accentColor || undefined,
       bio: homeUser.bio || undefined,
       customStatus: homeUser.customStatus || undefined,
+      status: homeUser.status || undefined,
     };
 
     // Sync avatar
@@ -66,8 +67,8 @@ export async function syncProfileToRemote(inst: ConnectedInstance): Promise<void
 
 // ─── Incremental sync (profile update) ──────────────────────────────────────
 
-/** Sync-eligible text fields (no status, replicatedInstances, homeUserId). */
-const SYNC_FIELDS = ['displayName', 'avatarColor', 'accentColor', 'bio', 'customStatus'] as const;
+/** Sync-eligible text fields (no replicatedInstances, homeUserId). */
+const SYNC_FIELDS = ['displayName', 'avatarColor', 'accentColor', 'bio', 'customStatus', 'status'] as const;
 
 /**
  * Push a partial profile update to all connected remote instances.