We need to output index.html with all code self-contained. No external assets. Should be a playable Asteroids-like game. Use canvas, vector ship that rotates & thrusts, shoots, wraps edges, asteroids split, score and lives. Use procedural vector drawing only. Must be a single HTML file with CSS in <style>, JS in <script>. Let's craft a simple implementation.

We need to handle user controls: arrow keys rotate left/right, up thrusts forward, space shoots.

We'll create canvas full-screen (or fixed size). Use requestAnimationFrame loop.

Implement ship as triangle with procedural lines.

Implement asteroids as polygons with random points; they split into smaller ones when hit.

Simplify: asteroids as circles approximated with path arcs? But vector: could be random line shapes. For simplicity, we can draw asteroids as random polygons (paths). When hit, split into 2 smaller asteroids each with half radius and random position.

We need score and lives UI displayed.

We'll need to store asteroids array, each with position, velocity, radius, maybe edges (list of points) for collision detection. Simpler: use circles for detection and procedural drawing: draw random procedural shape using arcs.

We can make asteroids as circles with random radius, drawn with procedural scribbles: draw random sinusoidal curves? Keep simple: draw circle with stroke, but that's not vector? It's fine.

We must not use external assets.

We'll implement:

- canvas width/height = window.innerWidth/innerHeight.

- Ship object: position, angle, velocity, thrust length.

- Input: key states.

- Update: move ship, apply thrust, rotate.

- Bullets: array of objects with position, velocity.

- Asteroids: array of objects with position, velocity, radius, maybe size class.

- On each frame, spawn new asteroids at start.

- Collision detection: distance between ship bullet and asteroid <= radius.

- When bullet hits asteroid: remove bullet, split asteroid into two smaller ones if radius > minSize else remove.

- Lives: start with 3; lose life on collision with asteroid (non-bullet). Reset ship position.

- Score increments for each asteroid destroyed.

Implementation details:

- Use double arrays for asteroids.

Simplify: Use radius threshold; when an asteroid is hit, create two new asteroids with radius * 0.7 and random offsets for velocity.

- Ensure wrap-around.

We'll code all within script.

Now write index.html with style for canvas maybe body {margin:0; overflow:hidden;} canvas {display:block;}

Script: define constants: canvas, ctx, ship, bullets, asteroids, playerLives, playerScore.

Initialize: create initial asteroids (maybe 3). Create ship at center.

Game loop: update positions, handle input, draw.

Render ship as triangle using ctx.beginPath().

Render asteroids: for each, draw random shape: maybe draw a circle with procedural lines using ctx.moveTo and lineTo random points on circumference? Could do star shape.

But requirement: procedural vector graphics only.

That is fine.

We can draw each asteroid as a random polygon with many points on circum, using beginPath, moveTo, lineTo.

Now implement.

Given constraints of this environment, we can just output final HTML content.

Thus answer: Provide index.html.

We need to produce final answer with the file content.

Thus I will output a code block with the file content.

Make sure it is a single file.

Let's craft final HTML.

Potential pitfalls: must be fully self-contained and functional within sandbox; no external resources.

We can embed everything.

Thus answer with index.html.

Now I will write the HTML.

We have written index.html with a complete single-page Asteroids game. The user asked to build a playable Asteroids game on a canvas: a thrust-and-rotate vector ship that shoots and wraps around the screen edges, splitting asteroids into smaller pieces, with score and lives. Procedural vector graphics only, no external assets. Our file includes canvas, CSS in style tag, JavaScript in script tag. It uses procedural vector drawing.

Check for any missing requirement: Must be self-contained, no external resources. We have included HUD with lives and score. It splits asteroids. It uses procedural shapes for asteroids (polygon) and for ship (triangle). All done.

We need to ensure that the file runs fully sandboxed. It should be fine.

Now respond with the file path and confirm creation.