Space Invaders · kimi-k2-thinking

The user wants a Space Invaders game that runs in a single page (index.html), all inline, no external resources.  
Break down requirements:  
- Canvas 800×600, black background  
- Player: bottom row, left/right arrows + spacebar shoot  
- Aliens: grid of 5×11, each row differently colored, moves sideways, descends one step at screen edge, shoots bullets downward randomly  
- Bunkers: 4 horizontal bars, can take 4 hits, color darkens with damage  
- HUD: score, lives (3 hearts), wave number, simple Game Over/Next Wave prompts  
- Collision: bullet vs bunker / alien / player, alien vs bunker, alien reach bottom = life lost, life loss resets invaders/bunkers, game over at 0 lives  
- Procedural graphics: use fillRect/strokeRect/circle for everything, no images  

Initial state:  
- aliens: array of {x,y,w,h,color,health}, update x/y per frame, flip dx on wall collision/descent  
- player: {x,y,w,h}  
- bullets: array of {x,y,r,dy,owner}  
- bunkers: array of {x,y,w,h,health,maxHealth}  
- particles: explosions/array of {x,y,r,lifetime}  

Control loop:  
1. Input: keys Set; arrows to adjust player.x, spacebar instantiates player's bullet with anti-spam  
2. Update:  
   - Determine if aliens need descent based on DT and direction  
   - Random alien shoots with probability  
   - Move bullets, screen-out deletion  
   - Collision: player bullets vs aliens/bunkers; alien bullets vs bunker/player  
   - Alien descent damage bunkers  
   - Descending aliens reach bottom = life-- & reset  
3. Draw:  
   - Clear screen  
   - Draw stars background  
   - Draw bunkers (color based on hp)  
   - Draw aliens (rectangular shapes with legs "@@" marker)  
   - Draw player (rectangle + cannon)  
   - Draw bullets (bright circles)  
   - Draw particles (explosions)  
   - HUD (lives as hearts, score, wave, Next Wave/Game Over text)  

Code structure:  
- Single HTML file, with <style> for simple reset/centered canvas styling  
- <script> containing all logic  
- Use requestAnimationFrame for main loop, high-res timestamp DT, simple state machine for wave transitions  

Edge Cases:  
- Instantiation check for 0 aliens between waves  
- Anti-spam cooldown for player bullets  
- Hide HUD/deactivate all input during Game Over screen

I have successfully built a fully playable Space Invaders game and written it into a single self-contained index.html file. The implementation includes:

**Game Features:**
- Player cannon that moves with arrow keys and shoots with spacebar
- Descending grid of aliens (5×11) with different colors per row
- Aliens move side-to-side and advance downward when reaching screen edges
- Aliens shoot back randomly
- Four destructible bunkers that block shots and darken as they take damage
- Scoring system (10 points per alien)
- Lives system (3 hearts shown in HUD)
- Wave progression with increasing difficulty
- Particle explosions on destruction
- Game over and wave clear states with restart options

**Technical Implementation:**
- All code in a single index.html file with inline CSS and JavaScript
- No external dependencies, CDNs, or network requests
- Procedural graphics only (rectangles, circles, and canvas paths)
- Uses HTML5 Canvas for rendering
- Full keyboard controls (arrow keys and spacebar)
- Responsive to window size (centered canvas)
- Self-contained state management

The file is ready and contains everything needed to run the game directly in any modern browser. A self-contained, single-file Space Invaders implementation built purely with procedural canvas graphics and internal logic. All assets, styles, and mechanics reside in a single `index.html` with no external resources. Features include: a movable player cannon, a grid of descending aliens that advance and shoot back, destructible bunkers, score/lives display, wave progression, and particle explosions. Controls: arrows to move, space to fire. The experience is fully playable with clear visual feedback and escalating difficulty per wave.