Shadow Clash

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 2D side-view fighting game titled “Shadow Clash,” rendered in a single HTML canvas with a fixed 1280×720 logical scene scaled to fit any screen. The game is a one-on-one arena fight: the player character Kage, a simple bright turquoise/teal humanoid, faces the pink/coral CPU opponent Rai on the right. Keep the camera fixed and centered on the entire arena; there is no scrolling or perspective movement.

Visual style: dark neon arcade presentation with clean vector-like canvas shapes, no external art assets. Use a deep navy-to-near-black vertical background gradient. The lower arena begins around the lower third of the scene and is a dark purple floor with diagonal lavender grid lines and a horizontal line near the fighters’ feet. Behind it, draw a dark city skyline made from blocky buildings with a few dim window lights, plus a large translucent pale moon in the upper-right. Add two decorative cage pillars near the left and right edges: dark posts with purple inner highlights and pale lavender caps. Fighters cast soft black oval shadows.

Fighters should be stylized stick/rounded figures. Kage is teal and Rai is coral-pink/red. Each has a round peach-colored head, colored semicircle hair/cap, a dark horizontal visor/band across the upper torso, a rounded rectangular torso, thick line-art arms and legs, and pale glove/hand ends. They stand on the same floor plane, face one another, and can walk horizontally within arena bounds. Animate a subtle walking bob. Face each fighter toward the other automatically. Use simple attack pose changes: punch extends the forward arm, kick extends a leg, and special surrounds the fighter with a translucent purple circular aura.

Core gameplay: begin with a full-screen dark translucent overlay and centered panel showing the glowing title “SHADOW CLASH,” Mongolian instructional text about defeating the opponent with combos and filling the special meter, and a large purple gradient “FIGHT” button. After starting, show a brief “FIGHT!” center message. The player controls Kage, initially positioned left of center, while Rai starts right of center and is controlled by lightweight AI. The AI approaches when too far away and periodically attacks when within approximately 210 pixels. Keep both fighters constrained to x=150..1130 and grounded at y=535, with basic gravity available for the simple fighter motion.

Combat rules: player movement is horizontal at about 260 pixels/second using A/D or left/right arrow keys; on-screen left/right circular buttons provide the same movement for touch devices. Holding Space or the on-screen GUARD button raises guard, unless the player is attacking. The intended attack controls are J = punch, K = kick, and L = special, and the touch buttons labeled J PUNCH, K KICK, and L SPECIAL must trigger them. Punch has roughly 92-pixel reach and deals 8 damage; kick has roughly 112-pixel reach and deals 12 damage; special has roughly 150-pixel reach and deals 30 damage. Attacks have short startup/active/recovery windows and may hit only once per attack. A normal hit gives the attacker 10 special-meter points; a special consumes the full 100-meter resource and does not refill it from its hit. Both fighters slowly regenerate special meter over time, with the player filling faster. A guarded normal attack is mostly blocked, dealing only 2 damage, granting the defender special meter, and producing a blue-white block burst; special attacks cannot be blocked.

Add responsive combat feedback: screen shake on impact, hit flashes, colored particle bursts, expanding ring effects, attack sounds and distinct block/special/win tones using simple Web Audio oscillators. Show a “SHADOW BURST” message when the player launches a special. Track each fighter’s combo, reset it after about 1.1 seconds without a hit, and show “N HIT COMBO” in large italic yellow text near the upper-right when the player has more than one consecutive hit.

HUD: overlay fixed HTML/CSS UI above the canvas. At the top-left show “SHADOW CLASH” branding; at top-right show the control hint “A / D хөдөлгөөн · J punch · K kick · L special · Space guard.” Centered below, show three columns: Kage’s name and a skewed outlined teal health bar with a thin purple/pink special bar beneath; a center “ROUND” label and large “1”; and Rai’s right-aligned name with a skewed outlined coral health bar and special bar beneath. Health starts at 100 for both; health bars visibly shrink toward their respective origin sides. Place touch controls along the bottom: translucent circular left/right movement buttons on the left, and GUARD/SPACE, J/PUNCH, K/KICK, and purple-outlined L/SPECIAL buttons on the right. On desktop, movement circles can be hidden while the keyboard hint remains visible, but attack/guard controls should remain usable.

When either health bar reaches zero, stop the fight, show a large center “YOU WIN” if Rai is defeated or “DEFEATED” if Kage loses, play the win tone only on victory, then show a modal panel after a short delay. The victory panel should say “Victory” and explain that Rai’s defense was broken; the loss panel should say “Rematch?” and explain that Kage fell. Change the button to “Rematch,” and reset both fighters, meters, effects, and health when selected. Maintain the dark neon, minimal, polished arcade UI throughout, with responsive scaling and touch-safe controls.