fix(room-modal): center identity hero + drop close-button autofocus

apps/fluux/src/components/ModalShell.tsx

@@ -39,6 +39,11 @@ export function ModalShell({
               <button
                 onClick={close}
                 aria-label={t('common.close')}
+                // Escape closes the modal, so the X is a pointer-only affordance:
+                // kept out of the tab order (and thus the focus trap's initial
+                // target) so opening a modal never lands focus here — which would
+                // otherwise draw the focus ring and pop this tooltip unprompted.
+                tabIndex={-1}
                 className="p-1 text-fluux-muted hover:text-fluux-text rounded hover:bg-fluux-hover tap-target"
               >
                 <X className="size-4" />

apps/fluux/src/components/RoomInfoModal.tsx

@@ -22,10 +22,10 @@ export function RoomInfoModal({ room, onClose }: RoomInfoModalProps) {
   return (
     <ModalShell title={room.name} onClose={onClose} width="max-w-md" panelClassName="max-h-[80vh] flex flex-col">
       <div className="p-4 flex flex-col gap-4 flex-1 min-h-0 overflow-y-auto">
-        {/* Identity row */}
-        <div className="flex items-center gap-3 min-w-0">
+        {/* Identity — centered hero (the name is the modal title above) */}
+        <div className="flex flex-col items-center gap-2 text-center">
           <RoomAvatar identifier={room.jid} name={room.name} avatarUrl={room.avatar} size="xl" />
-          <p className="text-sm text-fluux-muted break-all select-text">{room.jid}</p>
+          <p className="text-sm text-fluux-muted break-all select-text max-w-full">{room.jid}</p>
         </div>
 
         {/* Topic — only when set */}