[A11Y] [Medium] Button missing keyboard event handler in ShellwrightRecording component

## Accessibility Issue: Button missing keyboard event handler

**WCAG Level:** A
**Severity:** Medium
**Category:** Keyboard Navigation Issues

### Issue Description
The toggle button in the ShellwrightRecording component only has an `onClick` handler but no keyboard event handlers. While standard `` elements are keyboard accessible by default (responding to Enter and Space), this should be verified to ensure proper functionality for keyboard-only users.

Additionally, the button lacks a visible focus indicator in the CSS - the `:focus` pseudo-class is not defined for the `.toggle` class.

### User Impact
- **Affected Users:** Keyboard-only users, users with motor disabilities
- **Severity:** Users may have difficulty seeing when the button is focused

### Violations Found

#### File: `src/components/ShellwrightRecording/ShellwrightRecording.tsx`
**Lines:** 35-42
```tsx
setShowPrompt(!showPrompt)}
>
{showPrompt ? 'Show recording' : 'Show prompt'}

```

**Issue:** Button missing visible focus styles (handled in CSS module)

---

#### File: `src/components/ShellwrightRecording/ShellwrightRecording.module.css`
**Lines:** 32-42
```css
.toggle {
background: none;
border: 1px solid var(--ifm-color-emphasis-300);
border-radius: 4px;
padding: 0.25rem 0.5rem;
font-size: 0.8rem;
cursor: pointer;
color: var(--ifm-color-emphasis-700);
}

.toggle:hover {
background: var(--ifm-color-emphasis-100);
}
```

**Issue:** Missing `:focus` and `:focus-visible` styles for visible focus indicator

---
### Recommended Fix
```css
.toggle {
background: none;
border: 1px solid var(--ifm-color-emphasis-300);
border-radius: 4px;
padding: 0.25rem 0.5rem;
font-size: 0.8rem;
cursor: pointer;
color: var(--ifm-color-emphasis-700);
}

.toggle:hover {
background: var(--ifm-color-emphasis-100);
}

.toggle:focus {
outline: 2px solid var(--ifm-color-primary);
outline-offset: 2px;
}

.toggle:focus:not(:focus-visible) {
outline: none;
}

.toggle:focus-visible {
outline: 2px solid var(--ifm-color-primary);
outline-offset: 2px;
}
```

**Changes Made:**
1. Added `:focus` styles for visible focus indicator
2. Added `:focus-visible` for better mouse/keyboard differentiation

### Testing Instructions
1. Navigate to any page with a ShellwrightRecording component
2. Use Tab key to focus the "Show prompt" button
3. Verify a visible focus ring appears around the button
4. Press Enter or Space to activate the button
5. Verify the toggle works correctly

### Resources
- [WCAG 2.4.7 Focus Visible](https://www.w3.org/WAI/WCAG21/Understanding/focus-visible.html)
- [MDN: :focus-visible](https://developer.mozilla.org/en-US/docs/Web/CSS/:focus-visible)

### Acceptance Criteria
- [ ] Focus styles added to the toggle button
- [ ] Keyboard navigation works correctly
- [ ] Focus indicator is visible when using keyboard
- [ ] Manual testing completed

---