Act as a senior WebGL/game engine developer. Write a complet...

Prompt

Act as a senior WebGL/game engine developer. Write a complete, self-contained procedural isometric dungeon generator in a single HTML file using Three.js and an OrthographicCamera. Technical Requirements: 1. Grid & Data Model: - 30x30 discrete logical grid. - Tile cell states: 0 = Empty/Void, 1 = Room Floor, 2 = Corridor Floor, 3 = Wall. 2. Procedural Generation Algorithm: - Generate exactly 5 non-overlapping rectangular rooms (random dimensions between 4x4 and 7x7 tiles). - Connect the rooms sequentially using L-shaped (Manhattan) corridors to guarantee complete dungeon traversal with no isolated dead ends. - Run a cellular neighbor check (Moore neighborhood) to place wall cells (state 3) on any empty cell adjacent to a floor cell (orthogonally or diagonally). 3. Isometric Rendering (Three.js): - Configure an OrthographicCamera at true isometric angles (yaw 45°, pitch ~35.264° / Math.atan(1 / Math.SQRT2)) with a fixed frustum size. - Render modular geometries: * Room floors: Low, light-stone blocks. * Corridor floors: Darker stone blocks to distinguish pathways. * Walls: Elevated blocks (height = 1.5 units) with distinct top and side face materials. * Distinct visual treatment or geometry offsets for outer vs. inner wall corners. - Use InstancedMesh or merged geometries to keep draw calls minimal. 4. Lighting & Diorama Aesthetics: - Soft ambient light combined with an angled DirectionalLight (castShadow = true) to produce clean, sharp cast shadows. - Dark, clean background to present the dungeon as a floating isometric diorama. 5. Controls & Interaction: - OrbitControls restricted to rotate/pan while maintaining the orthographic projection. - Include a simple UI button in the corner: "Generate New Dungeon".

A system prompt was added to support web rendering