improvement(fairies): improve fairy button hover UX (tldraw#7222)

Improves fairy button UX:
- Shows tooltip on hover for fairy toggle button
- Hides plus button until the fairy list is hovered (on devices with
hover support)

### Change type

- [x] `improvement`

### Test plan

1. Open a file in the editor with the fairy HUD visible
2. Hover over the fairy list to see the plus button appear
3. Hover over a fairy toggle button to see the tooltip

- [ ] Unit tests
- [ ] End to end tests

### Release notes

- Improved fairy button UX with hover states.

<!-- CURSOR_SUMMARY -->
---

> [!NOTE]
> Show tooltip on hover for fairy toggle button and fade-in the plus
button only when the fairy list is hovered on hover-capable devices.
> 
> - **Styles (fairy.css)**:
> - **Toggle button**: Show `::after` on hover to enable tooltip
visibility.
> - **Plus button**: On `@media (hover: hover)`, default `opacity: 0`
with transition; reveal (`opacity: 1`) when `.fairy-list` is hovered.
> 
> <sup>Written by [Cursor
Bugbot](https://cursor.com/dashboard?tab=bugbot) for commit
4bca1ce. This will update automatically
on new commits. Configure
[here](https://cursor.com/dashboard?tab=bugbot).</sup>
<!-- /CURSOR_SUMMARY -->

---------

Co-authored-by: Claude <noreply@anthropic.com>

Author: steveruizok

apps/dotcom/client/src/tla/styles/fairy.css

@@ -114,6 +114,10 @@
 	display: none;
 }
 
+.fairy-toggle-button:hover::after {
+	display: block;
+}
+
 .fairy-toggle-button[data-is-sleeping='true'] {
 	opacity: 0.45;
 }
@@ -307,6 +311,19 @@
 	color: white;
 }
 
+@media (hover: hover) {
+	.fairy-plus-button {
+		opacity: 0;
+		transition:
+			background-color 0.1s ease,
+			opacity 0.12s ease;
+		transition-delay: 0.12s;
+	}
+	.fairy-list:hover .fairy-plus-button {
+		opacity: 1;
+	}
+}
+
 .fairy-button-project-indicator {
 	position: absolute;
 	top: 2px;