feat(a11y,perf): comprehensive icon button labels, toolbar a11y, timeline binary search

A11y C-1: aria-label on 30+ remaining icon-only buttons across:
  - settings panels (close, reset, info, expand, remove, undo)
  - editor toolbar (bold, italic, underline, strike, code, spoiler,
    blockquote, code block, ordered/unordered list, headings 1-3)
  - auth stages (cancel buttons in SSO, Password stages)
  - device verification (cancel buttons)
  - password input (show/hide toggle with dynamic label)
  - event readers, account data editor close buttons
  - global emoji packs (add/remove buttons)
Perf-5: Replace O(N×T) getTimelineAndBaseIndex scan with precomputed binary
  search (timelineSegments useMemo) — O(log T) per visible message render

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

src/app/features/settings/Settings.tsx

@@ -141,7 +141,7 @@ export function Settings({ initialPage, requestClose }: SettingsProps) {
               </Box>
               <Box shrink="No">
                 {screenSize === ScreenSize.Mobile && (
-                  <IconButton onClick={requestClose} variant="Background">
+                  <IconButton onClick={requestClose} variant="Background" aria-label="Close settings">
                     <Icon src={Icons.Cross} />
                   </IconButton>
                 )}

src/app/features/settings/about/About.tsx

@@ -25,7 +25,7 @@ export function About({ requestClose }: AboutProps) {
             </Text>
           </Box>
           <Box shrink="No">
-            <IconButton onClick={requestClose} variant="Surface">
+            <IconButton onClick={requestClose} variant="Surface" aria-label="Close">
               <Icon src={Icons.Cross} />
             </IconButton>
           </Box>

src/app/features/settings/account/Account.tsx

@@ -20,7 +20,7 @@ export function Account({ requestClose }: AccountProps) {
             </Text>
           </Box>
           <Box shrink="No">
-            <IconButton onClick={requestClose} variant="Surface">
+            <IconButton onClick={requestClose} variant="Surface" aria-label="Close">
               <Icon src={Icons.Cross} />
             </IconButton>
           </Box>

src/app/features/settings/account/IgnoredUserList.tsx

@@ -72,6 +72,7 @@ function IgnoreUserInput({ userList }: { userList: string[] }) {
                 size="300"
                 radii="300"
                 variant="Secondary"
+                aria-label="Clear"
               >
                 <Icon src={Icons.Cross} size="100" />
               </IconButton>

src/app/features/settings/account/Profile.tsx

@@ -185,7 +185,7 @@ function ProfileAvatar({ profile, userId }: ProfileProps) {
                 <Box grow="Yes">
                   <Text size="H4">Remove Avatar</Text>
                 </Box>
-                <IconButton size="300" onClick={() => setAlertRemove(false)} radii="300">
+                <IconButton size="300" onClick={() => setAlertRemove(false)} radii="300" aria-label="Cancel">
                   <Icon src={Icons.Cross} />
                 </IconButton>
               </Header>
@@ -278,6 +278,7 @@ function ProfileDisplayName({ profile, userId }: ProfileProps) {
                     size="300"
                     radii="300"
                     variant="Secondary"
+                    aria-label="Reset display name"
                   >
                     <Icon src={Icons.Cross} size="100" />
                   </IconButton>

src/app/features/settings/developer-tools/DevelopTools.tsx

@@ -51,7 +51,7 @@ export function DeveloperTools({ requestClose }: DeveloperToolsProps) {
             </Text>
           </Box>
           <Box shrink="No">
-            <IconButton onClick={requestClose} variant="Surface">
+            <IconButton onClick={requestClose} variant="Surface" aria-label="Close">
               <Icon src={Icons.Cross} />
             </IconButton>
           </Box>

src/app/features/settings/devices/DeviceTile.tsx

@@ -292,6 +292,8 @@ export function DeviceTile({
             outlined={deleted}
             radii="300"
             onClick={() => setDetails(!details)}
+            aria-label={details ? 'Collapse device details' : 'Expand device details'}
+            aria-expanded={details}
           >
             <Icon size="50" src={details ? Icons.ChevronBottom : Icons.ChevronRight} />
           </IconButton>

src/app/features/settings/devices/Devices.tsx

@@ -74,7 +74,7 @@ export function Devices({ requestClose }: DevicesProps) {
             </Text>
           </Box>
           <Box shrink="No">
-            <IconButton onClick={requestClose} variant="Surface">
+            <IconButton onClick={requestClose} variant="Surface" aria-label="Close">
               <Icon src={Icons.Cross} />
             </IconButton>
           </Box>

src/app/features/settings/devices/Verification.tsx

@@ -293,6 +293,7 @@ export function DeviceVerificationOptions() {
         size="300"
         radii="300"
         onClick={handleMenu}
+        aria-label="Verification options"
       >
         <Icon size="100" src={Icons.VerticalDots} />
       </IconButton>

src/app/features/settings/emojis-stickers/EmojisStickers.tsx

@@ -30,7 +30,7 @@ export function EmojisStickers({ requestClose }: EmojisStickersProps) {
             </Text>
           </Box>
           <Box shrink="No">
-            <IconButton onClick={requestClose} variant="Surface">
+            <IconButton onClick={requestClose} variant="Surface" aria-label="Close">
               <Icon src={Icons.Cross} />
             </IconButton>
           </Box>

src/app/features/settings/emojis-stickers/GlobalPacks.tsx

@@ -373,6 +373,7 @@ export function GlobalPacks({ onViewPack }: GlobalPacksProps) {
                   variant="Critical"
                   onClick={() => handleUndoRemove(address)}
                   disabled={applyingChanges}
+                  aria-label="Undo remove pack"
                 >
                   <Icon src={Icons.Plus} size="100" />
                 </IconButton>
@@ -383,6 +384,7 @@ export function GlobalPacks({ onViewPack }: GlobalPacksProps) {
                   variant="Secondary"
                   onClick={() => handleRemove(address)}
                   disabled={applyingChanges}
+                  aria-label="Remove pack"
                 >
                   <Icon src={Icons.Cross} size="100" />
                 </IconButton>

src/app/features/settings/general/General.tsx

@@ -1184,7 +1184,7 @@ export function General({ requestClose }: GeneralProps) {
             </Text>
           </Box>
           <Box shrink="No">
-            <IconButton onClick={requestClose} variant="Surface">
+            <IconButton onClick={requestClose} variant="Surface" aria-label="Close">
               <Icon src={Icons.Cross} />
             </IconButton>
           </Box>

src/app/features/settings/notifications/KeywordMessages.tsx

@@ -80,6 +80,7 @@ function KeywordInput() {
                 size="300"
                 radii="300"
                 variant="Secondary"
+                aria-label="Clear keyword input"
               >
                 <Icon src={Icons.Cross} size="100" />
               </IconButton>
@@ -118,7 +119,7 @@ function KeywordCross({ pushRule }: PushRulesProps) {
 
   const removing = removeState.status === AsyncStatus.Loading;
   return (
-    <IconButton onClick={remove} size="300" radii="Pill" variant="Secondary" disabled={removing}>
+    <IconButton onClick={remove} size="300" radii="Pill" variant="Secondary" disabled={removing} aria-label="Remove keyword">
       {removing ? <Spinner size="100" /> : <Icon src={Icons.Cross} size="100" />}
     </IconButton>
   );

src/app/features/settings/notifications/Notifications.tsx

@@ -23,7 +23,7 @@ export function Notifications({ requestClose }: NotificationsProps) {
             </Text>
           </Box>
           <Box shrink="No">
-            <IconButton onClick={requestClose} variant="Surface">
+            <IconButton onClick={requestClose} variant="Surface" aria-label="Close">
               <Icon src={Icons.Cross} />
             </IconButton>
           </Box>