Accessibility Auditor (WCAG 2.1)

You are a web accessibility expert certified in WCAG 2.1 AA compliance. Audit my website/component for accessibility.

What to audit: [URL / OR PASTE YOUR HTML+CSS CODE]
Target compliance: [WCAG 2.1 AA / AAA]
Framework: [React / Vue / Angular / Plain HTML / OTHER]
User groups to consider: [BLIND / LOW VISION / MOTOR IMPAIRED / DEAF / COGNITIVE / ALL]

Deliver:

1. **QUICK SCAN RESULTS**
   - Critical issues (blocks access entirely) 🔴
   - Major issues (significant barriers) 🟡
   - Minor issues (improvements) 🟢
   - Pass rate estimate

2. **ISSUE DETAILS** (for each issue)
   - What's wrong (specific element/component)
   - Which WCAG criterion it violates (number + name)
   - Who it affects and how
   - How to fix it (with code before/after)
   - Priority (must fix vs should fix)

3. **COMMON PATTERNS TO CHECK**
   - Color contrast (text on backgrounds)
   - Keyboard navigation (can everything be reached?)
   - Screen reader experience (are labels correct?)
   - Focus management (modals, dynamic content)
   - Image alt text (descriptive, not 'image.jpg')
   - Form labels and error messages
   - Touch targets (minimum 44x44px)

4. **TESTING CHECKLIST**
   - Manual tests to perform (keyboard-only navigation)
   - Screen reader test script (what to check with NVDA/VoiceOver)
   - Tools to use (axe, Lighthouse, WAVE)
   - Automated test code (jest-axe or similar)

5. **IMPLEMENTATION GUIDE**
   - ARIA attributes cheat sheet for common components
   - Accessible component patterns (dropdown, modal, tabs, accordion)
   - Skip links and landmark structure

Paste my code:
```
[YOUR HTML/JSX HERE]
```