# Particle Burst Feature Plan

## Overview
Add a click interaction that creates a radial burst of particles and shifts the color palette.

## Implementation Details

### 1. Global State Addition
Add a `hueOffset` variable to track the current color shift:
```javascript
let hueOffset = 0; // Shifts the particle color palette
```

### 2. Click Event Handler
Add to the script (after the mousemove listener):
```javascript
canvas.addEventListener('click', (e) => {
    const clickX = e.clientX;
    const clickY = e.clientY;

    // Shift hue for variety
    hueOffset += 15 + Math.random() * 15; // Shift by 15-30 degrees

    // Create burst of particles
    const burstCount = 40;
    for (let i = 0; i < burstCount; i++) {
        particles.push(new BurstParticle(clickX, clickY, hueOffset));
    }
});
```

### 3. BurstParticle Class (or extend Particle)
Create particles with radial velocity:
- Position: click coordinates
- Angle: random 0 to 2π
- Speed: random range (e.g., 2-8) for varying distances
- Size: slightly larger than normal particles (6-12px)
- Decay: slightly faster for quick burst effect

### 4. Particle Constructor Update
Modify the `Particle` constructor to accept an optional hue offset:
```javascript
constructor(x, y, hueShift = 0) {
    // ... existing code ...
    const hue = Math.random() * 60 + 180 + hueShift; // Blue-cyan + shift
    this.color = `hsla(${hue}, 100%, 70%,`;
}
```

## File Changes
- **index.html**: Add click listener, hueOffset variable, and optional hueShift parameter to Particle

## Visual Effect
- Each click creates an explosion of blue-cyan particles at the cursor
- Subsequent clicks shift the color palette gradually (e.g., cyan → green → yellow)
- Trail effect continues to work with the new particles