- **Description**: Asteroid Dodger — dodge falling asteroids in a spaceship. Side-to-side movement at bottom of screen, asteroids fall from top with increasing speed and frequency, collision = death, score increases by dodging.
## Step 1: Scaffold
- **Entities**: Ship (src/entities/Ship.js), Asteroid (src/entities/Asteroid.js)
- **Constants keys**: GAME (dimensions), SAFE_ZONE (Play.fun widget), SHIP (size/speed/position/colors), ASTEROID (radius/speed/spawn/pool/colors), SCORING (points per dodge), STARS (background starfield), COLORS (space theme + UI), UI (fonts/buttons), TRANSITION (fade durations)
- **Scoring system**: +1 point for each asteroid that passes the bottom of the screen without hitting the ship. Difficulty scales with score: asteroid speed increases by SPEED_PER_SCORE per point, spawn interval decreases by SPAWN_INTERVAL_PER_SCORE ms per point, both capped.
- **Fail condition**: Ship collides with any asteroid -> game over -> camera shake -> transition to GameOverScene
- **Input scheme**: Mobile-first tap zones (left half = move left, right half = move right) + keyboard (arrow keys / A+D). No jump — horizontal movement only.
## Decisions / Known Issues
- No gravity system: Ship stays fixed at Y position near bottom, asteroids use explicit downward velocity instead of global gravity
- Asteroid pool size of 30 prevents runaway object creation at high difficulty
- Ship hitbox shrunk to 70% for forgiving collision feel
- Asteroid textures are procedurally generated (5 variants) with jagged circles and craters
- Scrolling starfield background for space atmosphere
- Score system wired via EventBus: asteroid deactivates at bottom -> emits asteroid:passed -> ScoreSystem increments -> emits score:changed
- isMuted added to GameState for future audio integration
- No title screen — boots directly into gameplay per conventions
- No in-game score HUD — Play.fun widget handles display
-`src/sprites/asteroids.js` — 16x16 asteroid rocks, 4 variants (round boulder, tall angular, wide flat, small irregular). Each has craters (dark/light spots) and jagged edges
-`src/sprites/explosion.js` — 8x8 explosion effect, 3 frames (small burst, medium fireball, fading smoke). Plays on ship-asteroid collision
-`src/sprites/tiles.js` — 16x16 star cluster tiles (3 variants: sparse/dense/faint), 8x8 nebula decorations (2 variants: purple wisp, blue wisp)
- **Renderer**: `src/core/PixelRenderer.js` — `renderPixelArt()` for static textures, `renderSpriteSheet()` for animated spritesheets
- **Dimension changes**: Sprite scale is dynamically computed from Constants values (SHIP.WIDTH/HEIGHT, ASTEROID.MAX_RADIUS) so no Constants changes were needed. Ship uses `setDisplaySize(SHIP.WIDTH, SHIP.HEIGHT)`. Asteroids use `setDisplaySize(radius*2, radius*2)`.
- **Animations**: Ship has `ship-engine` animation (2 frames, 8fps, looping). Explosion has `explosion-anim` (3 frames, 10fps, plays once on collision).
- **Physics bodies**: Ship hitbox set to 70% of display size with centered offset. Asteroid hitbox set to circular 70% of radius for forgiving collision.