Gridiron Drive

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 single-screen 2D top-down arcade football game titled “Gridiron Drive.” Render the play area in an HTML canvas filling the viewport, with a dark navy gradient background and a green rectangular football field centered with white boundary lines, ten vertical yard sections, small yard labels (0 through 90), and a dashed gold line of scrimmage while a play is live. Use a clean, modern dark sports UI: translucent navy rounded panels, white bold text, muted gray-blue helper text, and bright gold/yellow primary buttons and highlights.

At the top left show a HUD pill with the live drive information in this format: “Drive 1 · Down 1 · 10 yd to go · Score 0” (the drive/down/to-go values may update during play; the implementation starts at Drive 1, Down 1, 10 yards to go, score 0). Under it show status text such as “Choose a play,” “Offense · [seconds]s,” “Defense · [seconds]s,” or the result of the previous play. At the top right provide a gold “Playbook” button and, on desktop, a “Reset drive” button.

Start in a playbook phase with a large centered rounded panel titled “Gridiron Drive,” subtitle: “Call a formation, snap the ball, then read the defense. Pass, catch, collide, tackle, fumble, or pick it off.” Provide exactly three selectable play cards in a responsive grid (stack them vertically on narrow screens):
- “Gun · Slants” — “Fast inside routes. Quick read, short gain, tight windows.” Select this initially with a gold outline/highlight.
- “Gun · Four Verticals” — “Stretch the safeties. Big-play chance, interception risk.”
- “Trips · Screen” — “Safer throw to the flat. Receivers block after the catch.”
Include a gold “Snap ball” button in the panel. Include the desktop instruction text “Desktop: WASD move · mouse aims · Space passes · Shift sprint.” The panel disappears after snapping and can be reopened with Playbook.

When the ball is snapped, create a live play on the field. Use simple colored circular player tokens with white outlines, subtle oval shadows, and small dark role letters: the offense is cyan/light blue and the defense is pink/red. Place an offensive quarterback labeled Q, a center labeled C, three receivers labeled R, and four defenders labeled D. The QB begins with a small brown football ellipse attached to the token; show the ball as a brown football with a pale seam/outline when it is airborne or loose. The offense starts near the left/middle side of the field and attacks toward the right. Receivers automatically run routes determined by the selected play: Slants uses quick inside routes, Four Verticals sends receivers deep, and Trips Screen uses a short screen-like set of routes. Show the line of scrimmage as a dashed gold vertical line during live play.

Offense gameplay: the user controls the current offensive ball carrier, initially the QB, with WASD or the left virtual joystick. Clamp players to the field. Holding Shift makes the controlled carrier sprint faster. Aim passing with the mouse position over the canvas; draw a gold crosshair/target at the aim location. On touch/mobile, provide a circular joystick at bottom left and a circular “AIM” control at bottom right, plus a gold PASS button near the lower right/center. On desktop also allow Space (and P) to pass. Pressing PASS throws toward the current aim point, with a speed based on distance; choose the receiver whose direction is closest to the throw direction. During flight, the ball follows its velocity with slight downward gravity and drag. A nearby receiver can catch it after a short delay, then becomes the controlled ball carrier and the status says “Catch! Run after the catch.” A nearby defender can intercept after a short delay, switching possession to defense and showing “INTERCEPTION!” If the pass remains incomplete, let the ball become loose.

Defense gameplay: defenders pursue the offensive ball carrier. Rush defenders go directly toward the carrier; covering defenders pursue the nearest receiver before a pass and pursue the carrier after the ball is thrown/caught. If a defender collides with the carrier, end the play with “Tackle made” and a brief camera shake. There is a chance a tackle causes a fumble; show “FUMBLE! Recover the ball” and make the football loose with a small random velocity. Any nearby player can recover a loose ball; otherwise the defense recovers it after a delay. When possession is defense, let the user control defenders with WASD or the joystick and move into the offensive ball carrier to tackle; offensive players move toward the carrier. Preserve the visible “Defense · seconds” status and live defensive controls.

Play flow and HUD behavior: each live play has an approximately 18-second play clock; if it expires without a ball in flight, end the play with “Play clock expired.” After an offensive tackle or other offensive play end, advance the down and reduce yards-to-go by a small variable gain, never below one; after fourth down, switch to defense and reset down/to-go to 1 and 10 with “Turnover on downs.” Possession changes reset down/to-go to 1 and 10 and end the play. Show the result in the status/tip area and allow the Playbook button to select another play and snap again. Keep the score display, initially zero; do not add unrelated scoring rules. Provide a “Reset drive” action that restores Drive 1, Down 1, 10 yards to go, Score 0, playbook phase, and the initial selected Slants setup.

At the bottom center show contextual helper text: in the playbook, “Pick a formation and play. Passing aim is shown by the gold target.” during offense, “Move the QB, aim, and press PASS or Space.” and during defense, “Move into the ball carrier to tackle.” Keep the visual style polished and minimal, with no 3D models: use flat canvas shapes, high contrast, rounded HUD controls, responsive mobile layout, pointer/touch input, keyboard input, and subtle camera shake on collisions/fumbles.