Fix tile selection UI in /tools/check page - selected state not persisting
Problem
The tile selection UI on the /tools/check page has several issues with visual feedback:
- Selection not persisting: When clicking on a default avatar tile (retro, robohash, wavatar, etc.), only the text color changes to blue, but the tile background remains white
- Selection lost on mouse leave: The selection visual state disappears when moving the mouse away from the selected tile
- Inconsistent hover behavior: Hover effects work correctly (blue background), but selection state doesn't maintain the same visual treatment
Expected Behavior
- Hover: Light blue background with blue text
- Click/Select: Blue background with white bold text (should persist)
- Leave selected tile: Should maintain blue background and white bold text
- Hover over selected tile: Slightly darker blue background, maintaining white bold text
Root Cause
The issue was caused by:
- CSS specificity conflicts with theme styles
- Inline JavaScript styles interfering with CSS hover states
- Missing CSS rules for proper selected state management
Screenshots
The issue was clearly visible where:
- Hover worked correctly (blue background)
- Click only changed text color (no background change)
- Selection was lost when mouse left the tile area
Impact
This affects user experience on the avatar checking tool, making it unclear which default avatar option is currently selected.