SIGN IN SIGN UP

Put the edit avatar back in the middle, and make the tip cards usable from the keyboard

The keyboard and screen-reader pass turned the edit avatar into a <button>,
and a button is inline-block, so `margin: auto` stopped centring it. It is a
block again without the button's own chrome. Its focus ring is drawn outside
the circle: the placeholder avatar covers all of it and hid the ring, which
is drawn inside the edge.

The stories viewer put focus on its first button when it opened - Close - so
Space, the pause key, closed it. Focus now lands on the dialog itself.

The empty-column tip cards:
- The segmented rows (System/Dark/Light, the suggestion modes, the chat
  filters) were divs no key could reach. They are toggle buttons with
  aria-pressed and one tab stop per row: Tab enters on the chosen one, the
  arrows move, Enter or Space picks. Picking needs Enter or Space: were an
  arrow to pick, every press on System/Dark/Light would switch the theme.
- The two cards that are not showing are only faded, so they are now inert
  and leave the tab order and the accessibility tree. Each card is a group
  named by its title, and Next/Previous say which card came up.
- The corner button is named and says whether the deck is open.
- The trending packs are buttons, named by the pack title.

The theme strip (tips, General Settings, the QR popup) could not be used
from the keyboard at all. It is a toolbar: one tab stop on the chosen theme,
the arrows between tiles, Enter or Space to apply. Its focus ring sits on
top of the wallpaper, because the ring drawn under it was never seen and the
one outside looked exactly like the selection. Every tile also held a
hidden "Chat background" tab stop, because the wallpaper preview had become
a button for the background grid; only the grid tile is a button now.

attachPickerGrid grew what the rows need: native buttons keep their own
names, the tab stop starts on the pressed item and follows the choice when
it is picked with the pointer, and a grid that already has its items no
longer gets a second tab stop. It stopped adding `navigable-list`, which
painted every `.active` grey, including the selected theme tile.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
E
Eduard Kuzmenko committed
5a87c445e85387208ca25611c28ee52b65c47ccf
Parent: b2b794a