Beatbound Runner

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 responsive browser arcade rhythm runner titled “Beatbound Runner,” implemented with a full-screen HTML canvas plus HTML/CSS overlays. The game is a 2D side-on neon scene: the player stays horizontally fixed around 24% of the viewport width while pink obstacles travel from the right toward the player along a ground lane. The objective is to jump over obstacles in time with a steady musical pulse, maintaining a combo and earning score until three misses end the run.

Use a dark navy vertical-gradient background (#0a0d25 to #111942). Draw a subtle music-grid backdrop with about nine evenly spaced cyan-blue vertical lines extending from roughly 20% screen height down toward the ground. The ground begins around 77% of screen height: a dark blue floor below it with a brighter blue top edge. At the player’s position, draw a vertical cyan timing line extending above and slightly below the ground, with a translucent cyan beat ring centered just above the ground; the ring pulses larger/brighter on each beat. Use a clean, minimal neon/vector art style with cyan player effects and pink obstacle effects, soft glow/shadows, rounded shapes, and no detailed scenery.

The player is a small glowing cyan rounded-square character, approximately 40x40 pixels, with two dark square eyes and a short white horizontal mouth. It stands just above the ground, has a soft cyan shadow on the floor, a subtle idle rotation/bob, and rotates more noticeably while airborne. Add small cyan particle bursts when jumping and when successfully clearing an obstacle. The player uses simple vertical physics: gravity about 2100, jump velocity about -760, and only one jump at a time; landing returns it to the ground. Jump input should be queued and accepted when grounded. Support Space, ArrowUp, W, mouse click, and touch/pointer tap.

Spawn one rounded pink obstacle on every beat at 120 BPM (one beat every 0.5 seconds). Each obstacle is a glowing pink rounded rectangle about 34x42 pixels tall, with a small pale-pink horizontal highlight near its upper section. Spawn it at the right and move it left so it reaches the player after approximately 2.7 seconds. Give obstacles a tiny vertical wobble. The beat timing test is strict and rhythm-focused: an obstacle is considered successfully hit if the player is airborne while the obstacle is within roughly +/-0.20 seconds of its timing point at the cyan line. When it reaches/passes the line, resolve it exactly once. A successful jump increments combo and awards 100 plus 10 times the new combo; reset combo and decrement one of three internal lives on a miss. Show cyan success particles and a short ascending tone on success, pink particles on a miss. Remove obstacles shortly after they pass the timing point. Play a generated electronic pulse sound on every beat, with a stronger accent every fourth beat, plus a jump tone and success tone; initialize/resume Web Audio after the user starts.

At the top of the screen, overlay a fixed HUD: left-aligned uppercase spaced “BEATBOUND RUNNER” branding in pale periwinkle; right-aligned COMBO and SCORE labels with large white numeric values. Do not add a visible lives counter because the supplied game only tracks lives internally. At the bottom center, show the instruction “Jump on the cyan beat ring — Space, tap, or click,” with “cyan beat ring” highlighted cyan.

Before play, show a centered modal card over a dark radial overlay. The card has a thin translucent periwinkle border, dark translucent navy fill, and soft shadow. It says “Run the beat.” in very large bold white type, followed by “Obstacles arrive on the pulse. Jump when the ring hits the line and keep your combo alive.” and a large pill-shaped pale button labeled “Start the run.” Starting resets score, combo, best combo, internal lives (3), obstacles, particles, and beat timing. The canvas remains visible behind the overlay.

When all three lives are lost, stop gameplay and show a centered “RUN COMPLETE” modal in the same style. Display a large cyan grade calculated from score: S for score above 900, A above 600, B above 300, otherwise C. Show contextual text: for S, “Locked in. Every jump landed.”; for A, “Sharp timing — keep the streak going.”; otherwise “The beat is learnable. Run it again.” Also show “Score [value] · Best combo [value]” and a pill button “Run it back” that fully resets and restarts the run. Keep the layout mobile-friendly and prevent page scrolling; scale canvas for device pixel ratio while fitting any viewport.