fix(list): centre the sender avatar against the row

List rows lay out with items-start, because the sender line, subject and
preview stack and the body should govern the row height. The avatar
inherited that and pinned itself to the top, level with the sender line,
leaving it visibly high against a two- or three-line row.

Give the avatar self-center in both the single-message and thread rows.
The row keeps items-start, so nothing else moves — in particular the
extra-compact checkbox, which is mutually exclusive with the avatar and
carries its own mt-2 offset, is untouched.

components/email/thread-list-item.tsx

@@ -331,7 +331,7 @@ const SingleEmailItem = React.forwardRef<HTMLDivElement, SingleEmailItemProps>(
               name={sender?.name}
               email={sender?.email}
               size={isFocusedMailLayout ? "sm" : "md"}
-              className="flex-shrink-0 shadow-sm"
+              className="flex-shrink-0 self-center shadow-sm"
               disableImages={hideJunkAvatarImages}
               checked={isChecked}
               onToggle={handleCheckboxClick}
@@ -773,7 +773,7 @@ export const ThreadListItem = React.forwardRef<HTMLDivElement, ThreadListItemPro
             )}
 
             {density !== 'extra-compact' && (
-              <div className="relative flex-shrink-0">
+              <div className="relative flex-shrink-0 self-center">
                 <SelectableAvatar
                   name={avatarPerson?.name}
                   email={avatarPerson?.email}