Neon Coil

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.

Rebuild a responsive 2D browser arcade game titled "Neon Coil," using a full-screen fixed canvas with an HTML/CSS HUD layered above it. The game is a neon Snake-style score attack: the player controls a glowing segmented coil on a fixed 24-column by 18-row grid. Start each run with exactly three horizontal square segments at grid coordinates (5,9), (6,9), and (7,9), with the head at (7,9) moving right. A bright pulsing magenta/pink glowing circular core appears at a random unoccupied grid cell. Move the coil one cell at a time; eating the core adds 10 points, grows the coil by one segment, and places another core randomly in an empty cell. The starting movement interval is 145 ms, and after each collected core it becomes faster by reducing the interval 4.2 ms per extra segment, down to a minimum of 56 ms. Display the resulting speed as a rounded moves-per-second value (1000 divided by the interval). The run ends immediately if the head leaves the 24x18 board or collides with any part of its own body; there are no enemies, hazards, lives, weapons, or wrapping. On game over, stop movement, preserve/update a persistent best score in local storage, hide the movement controls, and show a centered overlay reading "RUN OVER" with text containing the current score, best score, and final coil segment count, plus a "RUN AGAIN" button.

Use a centered board whose dimensions are 24*cell by 18*cell, with a responsive cell size based on the viewport (at least 14 pixels), and no scrolling. Render a dark translucent board backdrop and thin cyan-blue grid lines around every cell. Render the food as a small magenta/pink circle with a soft neon glow and subtle size pulsing. Render each coil segment as a glowing square centered in its grid cell: the head is near-white/cyan and larger, while the body uses a cyan-to-purple/pink hue progression and slightly smaller squares, all with bloom-like shadows. The background is a deep navy/black radial gradient, brighter blue-purple near the center and almost black at the edges. Keep the camera static and top-down; the board is simply centered in the full viewport.

Create a HUD matching the futuristic neon aesthetic. At the top, show the widely letter-spaced bold brand "NEON COIL" in pale white/cyan with cyan glow. On the right, show two outlined rounded statistic cards labeled "SCORE" and "LENGTH," displaying the current score and coil segment count. Below the board, show centered text in muted light blue such as "SPEED 7 • BEST 0," updating speed and persistent best score. During active play, provide a four-button directional pad at the bottom center in a 3-column by 2-row arrangement: up centered on the first row, then left/down/right on the second row. Buttons are circular/rounded dark navy controls with cyan outlines, white triangular arrow icons, and subtle glow. Also support keyboard Arrow keys and W/A/S/D, with reversal prevention so a direction cannot be changed directly into the opposite current or queued direction. Support touch swipes on the canvas as an alternative directional input. Ignore a direction input while stopped.

Initially show the centered start overlay above the board with a dark blue/purple translucent panel, rounded cyan border and glow, large glowing "NEON COIL" heading, the explanatory text "Eat the glowing cores. Every core makes your coil longer — and faster.", and a bright cyan-to-purple pill-shaped "START RUN" button. The board and decorative HUD can be visible behind the overlay, while the directional pad is hidden until the run starts. Pressing the start button, or Space/Enter while stopped, resets score, length, position, direction, speed, and food and begins a new run. Use a clean system sans-serif typeface, dark color scheme, cyan grid/UI accents, magenta food glow, and restrained neon bloom throughout. Ensure the layout adapts to portrait mobile screens and wider desktop screens; on wide screens the directional controls may appear slightly faded, but remain usable.