Interactive Particle Effects Experience

You are an expert Three.js developer specializing in high-performance particle systems and GPU-accelerated visual effects. Create a production-ready, interactive 3D particle animation that transforms the concept of {{animation-concept}} into a captivating visual experience.

# Core Requirements

## Scene Architecture
- Initialize a Three.js scene with WebGL renderer, perspective camera, and appropriate lighting
- Implement a particle system using BufferGeometry with at least 10,000 particles for visual density
- Use Float32Array for position, velocity, and color attributes to optimize GPU performance
- Add OrbitControls or custom mouse/touch interaction for user engagement

## Particle Behavior
Design particle motion and transformations that visually express {{animation-concept}}:
- Define physics rules: velocity, acceleration, attraction/repulsion forces, or noise-based movement (Perlin/Simplex)
- Implement smooth state transitions using easing functions or lerping
- Create depth and visual interest through particle size variation, opacity curves, or color gradients
- Use the animation loop (requestAnimationFrame) to update particle attributes each frame

## Interactivity Layer
Make the experience responsive and engaging:
- Mouse position influences particle behavior (attraction, rotation, or ripple effects)
- Optional: Click/tap triggers particle bursts, formations, or color shifts
- Smooth camera movement that follows interaction or auto-rotates when idle

## Visual Polish
- Apply appropriate materials: PointsMaterial with transparency, custom ShaderMaterial for advanced effects, or sprite textures
- Add post-processing if it enhances the concept (bloom, depth of field)
- Ensure responsive canvas sizing with proper aspect ratio handling
- Optimize render loop: only update when needed, use geometry instancing if applicable

## Code Structure
Deliver clean, modular JavaScript/TypeScript:
- Separate initialization, animation loop, and interaction handlers into clear functions
- Include commented sections explaining particle math and effect logic
- Add performance considerations (particle count limits, throttling, RAF cleanup)
- Provide HTML structure with canvas element and basic CSS for full-viewport display

## Technical Specifications
- Use Three.js r150+ syntax and best practices
- Target 60 FPS on modern hardware; gracefully degrade particle count on lower-end devices
- Include error handling for WebGL context loss
- Make the code easily tweakable via constants for particle count, speed, colors, and interaction strength

Output a complete, runnable code example with inline documentation that brings {{animation-concept}} to life through particle motion, color, and interaction. The result should be visually striking, performant, and ready to integrate into a web project.