Build a responsive, single-file HTML5 mobile casual game using Phaser.js (embedded via CDN) inside a web preview. The layout must be a vertical portrait soccer match. 1. 7v7 Foosball Layout: Structure the field with exactly 8 horizontal lines alternating between Teams. From bottom to top, the layout must be: - Bar 1 (YOU): 1 Goalkeeper (White shirt with yellow trim) - Bar 2 (YOU): 3 Defenders (White shirt with red diagonal sash) - Bar 3 (OPP): 2 Attacking Opponents (Solid Red shirt) - Bar 4 (YOU): 2 Midfielders (White shirt with red diagonal sash) - Bar 5 (OPP): 2 Midfielders Opponents (Solid Red shirt) - Bar 6 (YOU): 2 Attackers (White shirt with red diagonal sash) - Bar 7 (OPP): 3 Defending Opponents (Solid Red shirt) - Bar 8 (OPP): 1 Goalkeeper Opponent (Solid Red shirt) All players have stylized small hands close to the torso and a single solid blocky foot at the bottom. They are locked to move only horizontally (left-to-right) along their specific lines. 2. Slingshot Passing & Shooting: When the purple ball reaches any white teammate, trap it for 1 second. The user can drag back from that active player to display a directional indicator arrow. A short drag turns the arrow GREEN for a soft, precise PASS to another line. A long drag turns the arrow RED for a high-speed, powerful SHOT toward the net. Releasing fires the ball. 3. Complete Canvas: Both nets must be fully visible on a portrait mobile screen simultaneously without scrolling. On goals, trigger a 0.5-second screen shake and a golden "GOAL!" popup text.