# One-Shot Prompt

**Theme**: Neon Arcade
**Generated**: 2025-04-03

## Prompt

Write a complete Snake game using HTML5 Canvas with all HTML, CSS, and JavaScript in a single self-contained file themed around NEON ARCADE — a synthwave-inspired, electric aesthetic with glowing trails, pulsing grid effects, and vibrant magenta-cyan-purple palette.

### Visual Treatment
- Deep black background (#050505) with subtle animated grid lines in electric purple (#8b5cf6) that pulse slowly
- Snake: Gradient body from cyan (#06b6d4) at tail to magenta (#e879f9) at head, each segment has soft glow effect
- Snake head: Bright white highlight with "eye" accents, slightly larger than body segments
- Food: Pulsing neon orb that cycles between gold (#fbbf24) and hot pink (#f472b6), with particle aura
- Particle effects on food collection: 12-16 sparkles that burst outward in random directions, fading over 600ms
- Screen flash on game over: Brief red (#ef4444) overlay fade lasting 400ms
- Score display: Glowing cyan text with subtle flicker animation matching the arcade vibe

### Game States
1. **Start Screen**: Large glowing title "SERPENTINE" with animated underline, "Press SPACE to Start" pulsing below, WASD/Arrow controls hint in corner
2. **Playing**: Active gameplay with score counter in top-left, high score in top-right, subtle grid pulse animation in background
3. **Paused**: Dark overlay with "PAUSED" text, pulsing gently, press P or ESC to resume
4. **Game Over**: Full-screen overlay showing final score, high score comparison, "Press SPACE to Restart", snake silhouette fading in background

### Technical Requirements
- Snake moves on 20x20 grid, canvas 600x600 (scales responsively for mobile)
- Speed starts at 150ms per tick, decreases by 2ms per food eaten (minimum 60ms)
- Arrow keys and WASD for control, P/ESC for pause, SPACE for start/restart
- Touch: swipe detection for mobile (min 30px swipe, prevent scroll)
- Direction buffer: queue next input if during movement, prevent 180° reversals
- High score persisted in localStorage under key "serpentine_highscore"
- Smooth requestAnimationFrame loop with interpolation for visual smoothness
- Retina support: scale canvas by devicePixelRatio, CSS keeps display size
- No external images or CDNs (except Google Fonts optional for 'Orbitron' arcade font)

### Animation Details
- Snake segments interpolate between grid positions using lerp factor 0.3
- Food pulse: scale oscillates 0.9 to 1.1 over 800ms
- Background grid: alpha pulses 0.1 to 0.3 over 4 seconds
- Trail effect: Each snake segment leaves fading afterimage for 200ms
- State transitions: 300ms fade between start/playing/gameover screens

### Polish
- Favicon: inline SVG data URI with snake emoji
- Page title: "Serpentine — Neon Snake Game"
- prefers-reduced-motion: disable particle effects, simplify transitions
- Mobile: canvas scales to viewport width with max-width 600px, maintain aspect ratio
- No console errors, clean up event listeners on unload