style(settings): render member handles in mono and power-group headers as uppercase tracked labels

src/app/components/member-tile/MemberTile.tsx

@@ -41,8 +41,14 @@ export const MemberTile = as<'button', MemberTileProps>(
             <b>{name}</b>
           </Text>
           <Box alignItems="Center" justifyContent="SpaceBetween" gap="100">
-            <Text as="span" size="T200" priority="300" truncate>
-              {username}
+            <Text
+              as="span"
+              size="T200"
+              priority="300"
+              truncate
+              style={{ fontFamily: 'var(--font-mono)' }}
+            >
+              {username ? `@${username}` : member.userId}
             </Text>
           </Box>
         </Box>

src/app/features/common-settings/members/Members.tsx

@@ -351,9 +351,19 @@ export function Members({ requestClose }: MembersProps) {
                       <div
                         style={{
                           paddingTop: vItem.index === 0 ? 0 : config.space.S500,
+                          paddingBottom: config.space.S100,
                         }}
                       >
-                        <Text size="L400">{tagOrMember.name}</Text>
+                        <Text
+                          size="L400"
+                          style={{
+                            textTransform: 'uppercase',
+                            letterSpacing: '0.08em',
+                            color: 'rgba(230, 230, 233, 0.5)',
+                          }}
+                        >
+                          {tagOrMember.name}
+                        </Text>
                       </div>
                     </VirtualTile>
                   );