Race the Sun

# Task: Build an HTML Game Create an endless-runner game (vanilla JS, no external assets, no CDN, no libraries) in the spirit of *Race the Sun*. The top priority is **fun, tight, juicy gameplay** — every mechanic should feel responsive and satisfying. ## Core Fantasy Pilot a sleek solar craft endlessly forward through a procedural geometric world. The world revolves around a distant sun on the horizon. Stay in the light, dodge obstacles, grab energy, and survive as long as possible as speed ramps up. ## Gameplay Specification **Movement** - Auto-forward motion; speed gradually accelerates over time - Player controls: Left/Right strafe, Up/Down pitch (WASD or arrow keys) - Bank/roll the craft when strafing (visual tilt + slight forward lean on pitch) - Snappy controls: short easing on input (≈80–120ms), but with a tiny inertia tail so it feels weighty, not floaty - Optional: small "boost" on tap (space) limited by an energy bar **World & Camera** - Endless procedural course seeded by a per-run seed - Three lanes or a wide 2D plane; obstacles spawn in waves and ramps - Camera fixed behind/above the craft, with subtle screen-shake on near-misses and bigger shake on collisions - Speed lines / chromatic-aberration flourish when above a velocity threshold **Sun & Energy** - The sun sits on the horizon and slowly sinks during a run; if it sets, game over - Craft has an energy meter; drains slowly, drains faster when in shadow (behind tall obstacles or off-sun side) - Pickups: ⚡ energy cells, ✦ score tokens, and chain-multiplier orbs - Crashing = game over; near-misses = score bonus + screen-shake **Scoring & Loop** - Score = distance × multiplier from collected tokens - Show distance, score, multiplier, energy, and current speed on HUD - Local high score saved via `localStorage` - Title screen → play → game-over screen with restart (R or click) ## Visual & Audio Style - **Look:** minimalist low-poly geometry, bold silhouettes, vibrant gradient sky (sunset palette), strong contrast between sunlit and shadowed zones - **FX:** particles for thrust, pickups, and crashes; brief flash on damage; speed-line overlay at high speed - **Sound:** procedurally generated via WebAudio (short synth blips for pickup, low thud for crash, wind/drone loop tied to speed) — keep it simple but punchy ## Technical Requirements - HTML5 Canvas, requestAnimationFrame, target 60 FPS - Procedural generation with a deterministic seed per run - Simple geometric collision (AABB or circle vs. AABB) - Clear section comments (`// === SETUP ===`, etc.) - Tunable constants block at the top (speeds, gravity, spawn rates, colors) for easy balancing - Aim for 600–1500 lines of focused, readable code ## Quality Bar (must hit all) - Controls feel *immediately* responsive — no input lag, no sticky movement - Difficulty curve is fair: easy to learn, tense by 30s, frantic by 90s - Every interaction has feedback: particles, shake, sound, color - It must be fun to fail — restart-to-play should be one keystroke - Runs smoothly in a modern Chrome/Firefox tab at 1080p