I'll create a single-page web app with a canvas maze generator and solver. The app will include:

1. A canvas for drawing the maze and solution.
2. Controls to generate a new maze, choose algorithm (BFS or A*), solve, step through animation.
3. Recursive backtracker algorithm to generate random maze.
4. A* or BFS solver with animation.

Let's first check current directory and then write index.html.

Empty workspace. I'll write index.html now. Let's create a comprehensive single file.

Now I'll write the index.html file with all CSS and JS inline. I'll create a 2D grid maze using cell walls. Use canvas for drawing. I'll implement recursive backtracker (depth-first) to generate maze, then BFS and A* for solving. Provide animation steps.

Let's create the file.

Now I'll create the index.html file. I'll write everything inline. Let's craft the HTML structure, CSS, and JavaScript. I'll implement the maze as grid of cells, each with walls (top, right, bottom, left). Recursive backtracker uses stack. For solving, BFS (queue) or A* (with Manhattan distance). We'll animate step by step.

I'll keep the maze size manageable (e.g., 20x20 cells) and each cell size 20px. Canvas size accordingly.

Let's write the file.

Now create the index.html file. I'll write a comprehensive self-contained HTML file with CSS and JS. I'll implement recursive backtracker for maze generation, then BFS and A* for solving, with animation.

Let's write the file.