Neon Snake

Cinevva's analyzer read this game's design doc and its source, then wrote the brief below. "Make your own" hands it to the game creator as your opening message, so you start from a real spec rather than a one-line idea.

Create a playable browser game titled “Neon Snake” using Three.js with a dark neon arcade presentation. Render a 20 by 20 square gameplay grid on a flat horizontal plane, viewed from an orthographic camera positioned above and slightly toward the front (camera at approximately (0,10,10) looking at the origin). The scene background should be nearly black navy (#000011), with thin dark teal grid lines (#003333) spanning the full board. Keep the canvas full-screen and resize the orthographic camera with the viewport.

Implement classic grid-based Snake. The snake starts centered on the board at length 3, initially traveling right: its head is at the center cell and two body cells trail to the left. Each movement advances exactly one cell on a timer, initially every 180 ms. Use Arrow keys or WASD to turn up, down, left, and right; prevent an immediate reversal into the snake’s current direction. The snake head is a bright cyan solid rectangular block, while body segments are bright magenta/pink rectangular blocks. Blocks should be slightly smaller than each cell (about 85% of cell width/depth), have a shallow height, and sit just above the grid. The head and food can have subtle pulsing scale animation to reinforce the neon style.

Place one collectible food item at a random unoccupied grid cell, never overlapping the snake. Display it as a bright purple glowing-looking sphere. When the head enters the food cell, increase the score by 10, grow the snake by leaving its tail in place, spawn a new food item at another free cell, and increase the movement speed by reducing the interval by 12 ms, down to a minimum interval of 50 ms. The score should be shown at the upper-left in a fixed HUD reading “SCORE: 0” initially, using a monospace font, cyan text, and a cyan glow/text shadow.

End the game when the snake reaches any board boundary or collides with any part of its own body. Stop movement and show a centered fixed overlay reading “GAME OVER” in large neon pink-glowing text, with a transparent button below labeled “RESTART,” outlined in cyan. Clicking RESTART resets the score, speed, snake position, direction, food, and game-over state to the initial setup. Do not add wraparound, lives, obstacles, pause functionality, weapons, or extra HUD elements: the implemented gameplay is the straightforward bounded Snake loop described above. Use basic unlit/emissive-looking colored Three.js materials and the minimal black, cyan, magenta, purple, and teal visual palette visible in the reference.