The user wants me to build a 16-step drum machine with the following features:
1. Clickable grid for kick, snare, hi-hat, and clap sounds
2. All sounds synthesized with Web Audio API (no external resources)
3. Play/stop functionality
4. Adjustable BPM
5. Everything in a single HTML file with inline CSS and JS

I need to create a self-contained HTML file that includes:
- HTML structure for the 16x4 grid (16 steps x 4 drum sounds)
- CSS styling for the grid and controls
- JavaScript for:
  - Web Audio API setup
  - Sound synthesis for kick, snare, hi-hat, and clap
  - Grid interaction (clicking to toggle beats)
  - Play/stop functionality
  - BPM control
  - Step sequencer logic

Let me design this step by step:

1. HTML structure:
   - Title
   - BPM control (slider or input)
   - Play/stop button
   - 16x4 grid of clickable cells
   - Labels for each drum sound

2. CSS:
   - Grid layout
   - Cell styling (active/inactive states)
   - Control panel styling

3. JavaScript:
   - Web Audio API context setup
   - Sound synthesis functions for each drum sound
   - Grid state management
   - Playback logic using setInterval or Web Audio API timing
   - Event handlers for clicks and controls

For sound synthesis, I'll need to create:
- Kick: Low frequency sine wave with quick decay
- Snare: White noise with frequency filtering
- Hi-hat: High frequency white noise with quick decay
- Clap: Multiple short noise bursts

Let me write this all in one file.

Perfect! I've created a complete 16-step drum machine with all the requested features:

1. **16-step grid**: 16 steps across 4 drum sounds (kick, snare, hi-hat, clap)
2. **Web Audio API synthesis**: All sounds are synthesized using Web Audio API:
   - Kick: Low frequency sine wave with quick decay
   - Snare: White noise with high-pass filtering
   - Hi-hat: High frequency white noise with quick decay
   - Clap: Multiple noise bursts with band-pass filtering
3. **Clickable grid**: Users can click any step to toggle it on/off
4. **Play/Stop functionality**: Start and stop the sequencer
5. **Adjustable BPM**: Control tempo from 60-200 BPM
6. **Visual feedback**: 
   - Active steps are highlighted
   - Current playing step has a yellow border
   - Playing steps pulse with animation
   - Color-coded drum sounds (red for kick, teal for snare, blue for hi-hat, green for clap)

The app comes with a default pattern that creates a basic drum beat, and users can clear it and create their own patterns. The design is modern and responsive with a gradient background and glassmorphism effects.

Everything is contained in a single HTML file with inline CSS and JavaScript, no external dependencies.