Clash Alley

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 "Clash Alley": a fast 1v1 side-view fighting mini-game in a simple 3D diorama arena. Use Three.js with a perspective camera positioned high and in front of the fighters to create an orthographic-ish side-on view, with a dark navy background, subtle fog, a flat charcoal fighting platform, a darker back wall, strong soft shadows, bright rim lighting, and short glowing cyan/pink rectangular lane stripes across the foreground. Keep the arena uncluttered and make the camera subtly follow the midpoint between the two fighters; add brief camera shake and a bright impact light on hits.

The two fighters are stylized low-detail box characters made from simple cuboids: a rectangular colored torso, square skin-colored head, belt/accent strip, two rectangular skin-colored arms with accent-colored gloves, and two colored rectangular legs. The player starts on the left facing right and is bright blue/cyan; the CPU starts on the right facing left and is magenta/red-orange. Add oval/circular dark shadow discs beneath them. Animate idle bobbing, walking leg swings, attack arm/leg movements, blocking poses, hurt lean, and flip the rig to face the opponent. On successful hits, show a short flash, small colored particle burst, impact lighting, and camera shake.

Begin with a full-screen character-selection overlay over the arena. It should have a dark translucent panel, the Clash Alley kicker/title, the heading "Choose Your Fighter", explanatory text saying the CPU counterpicks from the remaining roster, and three clickable fighter cards. The roster must be exactly: Blaze (Rushdown), blue body with cyan accent, speed 5.25, punch damage 8, kick damage 12, defense multiplier 1.0, jump 8.8, dash 10.2; Atlas (Tank), green body with yellow accent, speed 4.1, punch 11, kick 16, defense 0.82, jump 7.9, dash 8.8; Shade (Counter), purple/magenta body with orange accent, speed 4.6, punch 9, kick 15, defense 0.9, jump 8.4, dash 9.4. Cards show a color swatch, name, role, description, and visual Speed/Power/Defense stat bars. Clicking a fighter selects the player, randomly chooses one of the other two for the CPU, applies their colors and stats, closes the overlay, and starts the match.

Implement a best-of-three set: the first fighter to win 2 rounds wins the set. Each round starts with both fighters at 100 health, positions at x=-3 and x=3, and a 60-second timer. Show a between-round message and automatically reset into the next round after about 2.2 seconds; a completed set shows either "YOU TAKES THE SET" or "CPU TAKES THE SET". If time expires, award the round to whoever has more health, or declare a draw if health is equal. Track three round markers per side, filling player markers with a cyan/blue gradient and CPU markers with an orange/pink gradient.

Player controls: A/D move horizontally, W jump, J punch, K kick, L block, Shift dash, and R restart the set and reopen character select. Movement is constrained to a horizontal lane from x=-6.8 to 6.8, with gravity and jumping. Punches last about 0.28 seconds, have short range around 1.65 units, and deal the selected fighter's punch damage; kicks last about 0.4 seconds, reach about 1.95 units, and deal kick damage. Attacks only connect during their middle timing window, only when facing the opponent and at approximately the same height. Prevent attacks during cooldown, hurt states, round transitions, or selection. Dash is a brief forward burst using the selected dash stat. Blocking is held with L when not attacking and reduces incoming damage to roughly 25%; only block attacks coming from the opponent's facing direction. Hits cause knockback, a small upward launch, temporary hurt state, health reduction using the defender's defense multiplier, and can end the round at zero health. Prevent the fighters from overlapping and always orient them toward one another.

Give the CPU a simple reactive AI: it faces the player, advances when farther than about 1.8 units, occasionally dashes when far away, and at close range alternates between punch, kick, and blocking. It should sometimes block when the player is attacking, with behavior influenced by the selected CPU character's aggression stat. CPU actions obey the same short-range attacks, hit detection, blocking, cooldowns, health, hurt, jump/physics, and arena boundaries as the player.

Use a fixed DOM HUD over the canvas. At the top, place a left YOU panel and right CPU panel with character name and role, three round dots, and animated health bars; use cyan/blue gradients for the player and orange/pink gradients for the enemy. Center a large timer with a ROUND 1/ROUND 2/ROUND 3 or FINAL label and status messages such as "Choose a fighter", "Round 2 Fight!", "Blocking", "Punch", "Kick", "First to 2", "YOU WINS ROUND", "CPU WINS ROUND", and "ROUND DRAW". Put a bottom-center translucent controls strip reading "A/D move · W jump · J punch · K kick · L block · Shift dash · R restart set". Use bold condensed display typography for headings and timer, clean sans-serif body text, translucent dark panels, thin light borders, responsive layout, and a mobile fallback that stacks the HUD and character cards vertically. Add simple Tone.js synthesized sounds for punch, kick, hit, block, jump, dash, selection, and win events, initialized on user interaction.