Ember Drift Background

# Ember Drift — Animated Background

## Goal
Build a canvas background of 40-60 warm ember particles slowly rising, swaying and fading — fireflies-meeting-campfire. It must drop cleanly into an existing Next.js + Tailwind project as a self-contained component.

## Design Spec
- Base: near-black #0A0705 with a faint warm radial glow at bottom center (12% opacity) — the implied heat source.
- Particles: 1.5-3px circles, colors sampled from #FF9E5E/#FFC46B/#FF7847, individual opacity 20-80%.
- Each ember: rises 20-50px/sec, horizontal sway ±14px on a sine, lifespan 6-12s with fade-in/out over first/last 15%.
- Depth illusion: smaller embers slower and dimmer; a few 'hero' embers 4px with a tiny glow shadow.
- Density prop scales count (mobile default 24, desktop 48) — cap DPR at 1.5 for battery.

## Motion Spec
- RequestAnimationFrame loop with delta-time — same speed on 60/120Hz displays.
- Occasional gust: every 8-14s all embers drift 30px right over 2s, then settle — imperceptible wind.
- Pause rendering when the section is off-viewport (IntersectionObserver) and on tab hidden.
- Respect `prefers-reduced-motion` — provide a static fallback that still looks intentional.

## Component API
- `<EmberDrift density?: 'low'|'normal'|'high' glow?: boolean className? />`

## Quality Bar
- TypeScript strict, zero `any`. Tailwind only — no external CSS files.
- Works on mobile: touch targets ≥ 44px, no hover-only affordances.
- 60fps: animate only `transform` and `opacity`; use `will-change` sparingly.
- Accessible: correct roles/aria, keyboard operable, focus-visible styles.