feat: presence avatar border rings (P5-18) + room emoji prefix support (P5-6)

P5-18: PresenceRingAvatar wrapper component applies a 2px box-shadow
ring to user avatars — green (online), yellow (idle/unavailable), red
(DND via status_msg='dnd'), no ring (offline). Applied to: message
timeline sender avatars, members drawer (members + knock requests),
@mention autocomplete, and inbox notification senders.

P5-6: Leading emoji in room names renders at 1.15× in the sidebar via
Unicode emoji regex detection in RoomNavItem. Emoji picker (EmojiBoard
in PopOut) added to all three room-name inputs: Create Room dialog
(converted to controlled input), Room Settings name field (shown only
when canEditName), and the "Rename for me" local rename dialog.

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

src/app/features/room/message/Message.tsx

@@ -82,6 +82,7 @@ import colorMXID from '../../../../util/colorMXID';
 import { getPowerTagIconSrc } from '../../../hooks/useMemberPowerTag';
 import { ForwardMessageDialog } from './ForwardMessageDialog';
 import { useBookmarks } from '../../../hooks/useBookmarks';
+import { PresenceRingAvatar } from '../../../components/presence';
 
 // Delivery status indicator for own messages
 function DeliveryStatus({
@@ -873,25 +874,27 @@ export const Message = React.memo(
         <AvatarBase
           className={messageLayout === MessageLayout.Bubble ? css.BubbleAvatarBase : undefined}
         >
-          <Avatar
-            className={css.MessageAvatar}
-            as="button"
-            size="300"
-            data-user-id={senderId}
-            onClick={onUserClick}
-          >
-            <UserAvatar
-              userId={senderId}
-              src={
-                senderAvatarMxc
-                  ? (mxcUrlToHttp(mx, senderAvatarMxc, useAuthentication, 48, 48, 'crop') ??
-                    undefined)
-                  : undefined
-              }
-              alt={senderDisplayName}
-              renderFallback={() => <Icon size="200" src={Icons.User} filled />}
-            />
-          </Avatar>
+          <PresenceRingAvatar userId={senderId}>
+            <Avatar
+              className={css.MessageAvatar}
+              as="button"
+              size="300"
+              data-user-id={senderId}
+              onClick={onUserClick}
+            >
+              <UserAvatar
+                userId={senderId}
+                src={
+                  senderAvatarMxc
+                    ? (mxcUrlToHttp(mx, senderAvatarMxc, useAuthentication, 48, 48, 'crop') ??
+                      undefined)
+                    : undefined
+                }
+                alt={senderDisplayName}
+                renderFallback={() => <Icon size="200" src={Icons.User} filled />}
+              />
+            </Avatar>
+          </PresenceRingAvatar>
         </AvatarBase>
       );