fix(mobile): make media gallery and members panel accessible on mobile

MediaGallery: fixed panel now goes full-width (100%) on mobile instead
of the inaccessible 320px right sidebar. Added 'Media Gallery' MenuItem
to RoomMenu (visible only on mobile) so users can open it from the
More Options (···) button.

MembersDrawer: removed ScreenSize.Desktop gate in Room.tsx so it now
renders on mobile too. CSS media query (≤750px) makes it position:fixed
inset:0 width:100% on mobile instead of the 266px desktop sidebar.
Added 'Members' MenuItem to RoomMenu for mobile access.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

src/app/features/room/RoomViewHeader.tsx

@@ -80,10 +80,14 @@ import { bookmarksPanelAtom } from '../../state/bookmarksPanel';
 type RoomMenuProps = {
   room: Room;
   requestClose: () => void;
+  galleryOpen?: boolean;
+  onToggleGallery?: () => void;
 };
-const RoomMenu = forwardRef<HTMLDivElement, RoomMenuProps>(({ room, requestClose }, ref) => {
+const RoomMenu = forwardRef<HTMLDivElement, RoomMenuProps>(
+  ({ room, requestClose, galleryOpen, onToggleGallery }, ref) => {
   const mx = useMatrixClient();
   const [hideActivity] = useSetting(settingsAtom, 'hideActivity');
+  const screenSize = useScreenSizeContext();
   const unread = useRoomUnread(room.roomId, roomToUnreadAtom);
   const powerLevels = usePowerLevelsContext();
   const creators = useRoomCreators(room);
@@ -99,6 +103,7 @@ const RoomMenu = forwardRef<HTMLDivElement, RoomMenuProps>(({ room, requestClose
   const [invitePrompt, setInvitePrompt] = useState(false);
   const [reportRoomOpen, setReportRoomOpen] = useState(false);
   const [bookmarksOpen, setBookmarksOpen] = useAtom(bookmarksPanelAtom);
+  const [peopleDrawer, setPeopleDrawer] = useSetting(settingsAtom, 'isPeopleDrawer');
 
   const handleMarkAsRead = () => {
     markAsRead(mx, room.roomId, hideActivity);
@@ -186,6 +191,38 @@ const RoomMenu = forwardRef<HTMLDivElement, RoomMenuProps>(({ room, requestClose
             Saved Messages
           </Text>
         </MenuItem>
+        {screenSize === ScreenSize.Mobile && (
+          <MenuItem
+            onClick={() => {
+              setPeopleDrawer(!peopleDrawer);
+              requestClose();
+            }}
+            size="300"
+            after={<Icon size="100" src={Icons.User} filled={peopleDrawer} />}
+            radii="300"
+            aria-pressed={peopleDrawer}
+          >
+            <Text style={{ flexGrow: 1 }} as="span" size="T300" truncate>
+              Members
+            </Text>
+          </MenuItem>
+        )}
+        {screenSize === ScreenSize.Mobile && onToggleGallery && (
+          <MenuItem
+            onClick={() => {
+              onToggleGallery();
+              requestClose();
+            }}
+            size="300"
+            after={<Icon size="100" src={Icons.Photo} filled={galleryOpen} />}
+            radii="300"
+            aria-pressed={galleryOpen}
+          >
+            <Text style={{ flexGrow: 1 }} as="span" size="T300" truncate>
+              Media Gallery
+            </Text>
+          </MenuItem>
+        )}
         {!isServerNotice && (
           <MenuItem
             onClick={handleInvite}
@@ -288,7 +325,8 @@ const RoomMenu = forwardRef<HTMLDivElement, RoomMenuProps>(({ room, requestClose
       </Box>
     </Menu>
   );
-});
+},
+);
 
 type CallMenuProps = {
   onVoiceCall: () => void;
@@ -783,7 +821,12 @@ export function RoomViewHeader({ callView }: { callView?: boolean }) {
                     escapeDeactivates: stopPropagation,
                   }}
                 >
-                  <RoomMenu room={room} requestClose={() => setMenuAnchor(undefined)} />
+                  <RoomMenu
+                    room={room}
+                    requestClose={() => setMenuAnchor(undefined)}
+                    galleryOpen={galleryOpen}
+                    onToggleGallery={() => setGalleryOpen((v) => !v)}
+                  />
                 </FocusTrap>
               }
             />