Challenges

Create a complete Pong game as a single self-contained HTML file.

REQUIRED FEATURES:
1. Canvas-based rendering, centered in viewport (maintains 2:1 aspect ratio, max 800x400)
2. Two player modes selectable from start screen:
   a) 1P vs AI (player on left, AI on right)
   b) 2P local (W/S for left, Arrow Up/Down for right)
3. Mode selection screen with buttons/keyboard selection
4. Paddles: 100px tall, 12px wide, move smoothly with velocity (not instant snap)
5. AI paddle tracks ball with configurable reaction delay (50% accuracy, not frame-perfect)
6. Ball: 10px square, starts from center with random angle, speed increases slightly per hit
7. Ball reflection: angle changes based on where it hits the paddle (top/mid/bottom = different outgoing angle)
8. Wall bounce: top/bottom walls reflect ball normally
9. Scoring: first to 7 wins, points shown as large centered numbers
10. Center dashed line (classic Pong aesthetic)
11. Score display: large numbers at top (e.g. "3 — 5")
12. Start screen: "PONG" title, "1P vs AI" / "2P Local" selection instructions, "Press 1 or 2"
13. During play: current score shown, win condition displayed at 1 point away ("Match point")
14. Win screen: large "PLAYER X WINS!" or "AI WINS!", final score, "Press Space to play again"
15. Pause: press P or Escape

AUDIO:
16. Web Audio API: paddle hit (medium pitch tone), wall bounce (low pitch tone), score (two-tone sequence), win jingle (ascending arpeggio)

VISUAL:
17. Classic black-and-white Pong aesthetic (or dark theme with neon accents)
18. Paddles have subtle glow effect
19. Ball has motion trail (fading positions)
20. Clean HUD

CODE:
21. Single HTML file, vanilla JS, Canvas 2D
22. requestAnimationFrame with delta-time physics (frame-independent)
23. Modular: paddle class, ball class, AI class, game state machine