The user wants a playable Asteroids game as a single self-contained HTML file. Let me build this carefully. I need:

1. A canvas-based game
2. Vector ship that rotates and thrusts
3. Shooting mechanics
4. Screen wrapping for all objects
5. Asteroids that split into smaller pieces
6. Score and lives display
7. Procedural vector graphics only (no external assets)

Let me write this all into one index.html file with CSS in a style tag and JS in a script tag.

Let me think about the game structure:

- Ship: has position, velocity, rotation, can thrust, can rotate, can shoot
- Bullets: have position, velocity, lifetime
- Asteroids: have position, velocity, size (large, medium, small), points for drawing
- Game loop: update and draw
- Screen wrapping
- Collision detection
- Score and lives

Let me write the code.

For the ship, I'll draw a triangle pointing right. For asteroids, I'll generate irregular polygons.

Let me think about the physics:
- Ship thrust in direction of rotation
- Velocity with some damping
- Bullet with high velocity

Asteroid sizes:
- Large: 60px radius
- Medium: 30px radius  
- Small: 15px radius

When a large asteroid is hit, it splits into 2 medium. When medium is hit, splits into 2 small. When small is hit, it's destroyed.

Scoring:
- Large: 100 points (when split)
- Medium: 50 points (when split)
- Small: 20 points (when destroyed)

Let me write the full game.

I'll use requestAnimationFrame for the game loop.

Let me think about the vector ship shape - a triangle pointing to the right:
- Nose at (10, 0)
- Two rear points at (-5, -5) and (-5, 5)

For thrust, I'll draw a flame/outline when thrusting.

Let me code this up properly with all the details.

For asteroid polygon generation, I'll create points around a circle with varying radii.

Let me write the complete HTML file now.

Let me review the game for any issues. Let me test it by opening it in a browser... but I can't do that. Let me review the code carefully.

Issues I see:
1. The "round clear" message uses `document.querySelector('#msg span')` which would target the first span in #msg, but the #msg has `<span id="finalScore">0</span>` inside it. The text content approach is wrong. Let me fix the win condition handling.

2. When the player clears all asteroids, I show #msg with round clear, but then the game stops (no requestAnimationFrame call) because update returns if gameOver. But gameOver is only set true on death. Actually after showing round clear, the loop continues because gameOver is false. But then asteroids spawn in update() again... Actually, in update I call spawnAsteroids() when asteroids.length === 0, which spawns new asteroids. But there's a race: I check asteroids.length === 0, set msgEl display, but the loop keeps running. The msg would stay visible though.

Let me reconsider the win/round clear logic. It's a nice feature but the implementation is buggy. Let me simplify - maybe just show a "Round Clear" briefly then continue, or remove it to keep things clean.

Actually, let me make the round clear cleaner: when all asteroids are destroyed, show a brief overlay, then continue to next wave. But the current implementation has a problem - after setting msgEl display, the loop continues and asteroids respawn, but msg stays visible because I never hide it.

Let me simplify and make it work properly. I'll remove the round clear message or handle it with a timer.

Let me also reconsider: the `document.querySelector('#msg span')` selects the first span which is finalScore span. Setting its textContent to 'ROUND CLEAR!...' is wrong.

Let me fix the win condition to use a timer-based approach that's clean. Actually, let me just make it simpler - spawn the next wave and continue without a complex message, or handle it with a brief pause.

Let me rewrite the relevant parts. Let me think about what's cleanest:

Option: When asteroids.length === 0, set a flag, spawn next wave after a short delay, show "ROUND CLEAR" for a moment.

Let me implement with a clean timer approach.

Also, I realize there might be an issue with the thrust - the ship's thrust uses rand for the flare each draw which is fine.

Let me also double check the Bullet shoot - ship.shoot() checks cooldown. Good.

One issue: In the game loop, I check `if (keys['Space']...)` but Space might cause page issues. I added a keydown listener that prevents default. Good.

Let me also reconsider the ship thrust - I should maybe increase maxSpeed handling and make controls feel good.

Let me also think about whether the game is actually playable and fun. The physics seem reasonable.

Let me fix the round-clear issue properly. I'll restructure:

- When asteroids empty: set waveComplete, show msg, pause briefly
- Use a timer to continue

Actually, let me keep it simpler and just not do the round clear message — instead, when all asteroids are destroyed, spawn a new set and optionally give a bonus. But the "GAME OVER" only shows final score. Let me handle round clear with a clean timer.

Let me rewrite the update() win section and restart logic. I'll also make sure that when the round clears, we don't respawn immediately causing overlap with the message.

Let me restructure:

```
let wave = 1;
let paused = false;

function update() {
  if (gameOver || paused) return;
  ...
  if (asteroids.length === 0) {
    wave++;
    // bonus for clearing
    score += 1000;
    scoreEl.textContent = String(score);
    paused = true;
    msgEl.querySelector('#msg span').textContent = 'ROUND ' + (wave-1) + ' CLEAR!';
    msgEl.style.display = 'block';
    setTimeout(() => {
      paused = false;
      msgEl.style.display = 'none';
      spawnAsteroids();
    }, 1500);
  }
}
```

Wait, but spawnAsteroids spawns 4 asteroids based on hard-coded. Let me make number increase with wave.

Hmm, let me restructure spawnAsteroids to take a count. Let me rewrite the whole file more cleanly since there are a few bugs.

Actually, let me just do targeted edits for the buggy parts rather than rewriting the whole thing. The main bug is the round-clear message and the respawn logic.

Let me look at the issues:
1. Round clear: shows msg, but then loops continue and respawn asteroids immediately (the asteroids.length===0 check triggers every frame since spawnAsteroids is called which adds asteroids, so next frame it won't be 0). Actually after spawnAsteroids() is called, asteroids.length becomes >0, so the check won't trigger again. But the msg stays visible because we set display:block and never hide it. So the player sees the round clear msg while new asteroids spawn. That's a bug.

Let me fix by using a paused flag and timer.

2. The `document.querySelector('#msg span')` selects the finalScore span. Setting its textContent is wrong.

Let me rewrite the file cleanly. It's easier to just rewrite given the number of interdependent changes.

Let me also add:
- Increasing difficulty with waves (more asteroids)
- A "READY" indicator at start

Let me rewrite the whole file with improvements.

Let me also make sure the ship feels good - maybe increase turn rate slightly and thrust.

Let me also reconsider: the stars are redrawn each frame with globalAlpha flicker-free since deterministic. Fine.

Let me also add a slight particle explosion when asteroids split or ship is hit - optional but nice. Let me add simple particle effects.

Actually, let me keep it focused but polished. Let me add particles for asteroid destruction and ship hit.

Let me rewrite the entire file.

There are bugs in the round-clear logic. Let me rewrite the entire file cleanly to fix the issues and add polish (particle effects, wave progression, proper message handling).

Let me rewrite the whole file.

Now let me test that the file works. I can't open a browser, but let me at least verify the file is valid by checking for syntax issues. Let me try running it with node to check for JS syntax errors.

Actually, the JS is inside a browser context with DOM APIs, so node won't run it directly. But I can extract and check the JS syntax. Let me use node to check the syntax of just the script.

Let me try a basic check - extract the script and run it through node --check. But it references document etc. Actually node --check only checks syntax, not runtime. Let me try.

Let me copy the script portion and check syntax. Actually, let me just use a simpler approach - check if there are obvious issues.

Let me verify the file exists and test with a headless approach if available.

Let me extract the script content and check it for syntax errors using node --check.

The syntax is OK. Now let me try to actually test the game in a headless browser if available. Let me check if there's a browser available.