[TASK] style UI component's states: focus, selected, active, hover.

### Description

Currently, Web Forms has a mix of styles for focus, selected, active, and hover states in Question's types and other components.

The scope of this ticket is to standardize the styling of these states and ensure good user experience.

---

### Checklist
- [X] **Does it need UI/UX design?**
- If yes, describe the UI/UX requirements or attach a Figma link in the "Design" section.
- [ ] **Does it need API design?**
- If yes, specify the endpoints, methods, or data structures needed.
- [ ] **Does it need design around state flow?**
- If yes, outline the state flow requirements.
- [ ] **Does it need a test plan?**
- If yes, add the test plan as a comment in this task or attach the document.
---

### User Stories

- **As a** [user type],
**I want** [functionality],
**so that** [benefit].

---

### Design

- **Figma Link**: [Insert URL]

---

### Dependencies
- https://github.com/getodk/web-forms/issues/196

Start by reviewing the Web Forms Question types and other UI components to inventory their focus, selected, active, and hover styles. Check the dependency in issue #196 and clarify the missing design requirements; done means these states are standardized across the identified components with a consistent user experience.

Written by the indexing model from the issue text.