13. Neon Drift

# 13. Neon Drift

Build a top-down time-trial racing game with drifting, wrapped in a synthwave aesthetic. The player races a glowing car against the clock across a 3-track ladder — Sunset Coast, Neon Canyon, Grid City — beating each track's gold time to unlock the next. The final screen after conquering Grid City is a champion screen, not an endless mode.

The point is a simple, legible purpose: beat the gold time, unlock the next track, finish the ladder. The fun is the drift: the car should feel like it is on the edge of grip, rewarding handbrake slides through corners and punishing sloppy lines with lost seconds.

The first screen must state the goal in one line ("Beat the gold time to unlock the next track.") with the track ladder shown below it — three tracks, locked ones visibly locked. No other menus.

## Core Loop

- The car drives on a closed circuit seen from above (a slight camera tilt is allowed). Lap timing starts when the countdown ends.
- A race is a fixed number of laps (3 recommended). The finish time is compared against the track's gold time.
- Beating gold unlocks the next track and shows it unlocking on the ladder screen. Losing shows the gap to gold and a Retry button.
- Unlock state persists in `localStorage`; returning players see their ladder progress and best times.

## Driving Model

- Arcade drift physics: throttle, brake/reverse, steering, and a handbrake that breaks rear traction.
- The car must have two readable states: gripping (follows steering) and drifting (slides with a controllable slip angle, leaving light trails).
- Drifting must be fast through corners when controlled and costly when it scrubs into the wall or grass. It must not be a strict win button on straights.
- Off-track surfaces (grass, sand, runoff) slow the car noticeably. Walls collide; no falling through the world.
- Checkpoints around the circuit prevent lap-cutting: a lap only counts if all checkpoints were crossed in order.

## Tracks

Three tracks, each a distinct circuit layout, not a reskin of one oval:

- **Sunset Coast** — wide, sweeping; teaches basic drifting. Gold time lenient.
- **Neon Canyon** — tighter switchbacks, walls close to the racing line.
- **Grid City** — 90-degree corners and a hairpin complex; demands chained drifts.

Each track needs its own gold time, tuned so a decent run finishes within a few seconds over gold and a good run beats it. Show the gold time on the track select and in the HUD.

## Ghost and Timing

- Record the player's best lap per track and replay it as a translucent ghost car on subsequent attempts.
- The ghost must be a recording of the player's actual car state, replayed verbatim — not a scripted path.
- Timing display: current lap, last lap, best lap, and a live delta against gold pace (green when ahead, red when behind).

## HUD and Screens

- First screen: goal sentence, three-track ladder with lock states, controls, and best times.
- In race: current lap time, lap counter, live delta to gold, speed. All readable without covering the track center.
- Finish: total time, gold time, margin, and either "Track unlocked" with the ladder updating or "Retry — you were X.XXs off gold".
- Champion screen after beating Grid City's gold: total career times per track, and a Free Run option that keeps the game playable after completion.

## Controls

- **W / Arrow Up**: throttle — **S / Arrow Down**: brake/reverse
- **A / D or Arrows**: steer — **Space**: handbrake
- **R**: restart race — **Esc / P**: pause
- **Enter**: confirm on menus. Fully playable on keyboard; touch buttons optional.

## Visual Rules

- Full-screen 2D or 3D into a `<canvas>`. Synthwave: dark sky, gradient horizon, glowing grid or sunset backdrop, neon track edges, emissive car with a light trail.
- The car's state must be readable at a glance: drift trail, brake lights, steering angle on the wheels.
- Speed feel: subtle camera pull-back with speed, trackside elements scrolling with parallax or depth.
- No external art, textures, or audio fetched at runtime; everything drawn in code (one CDN font allowed).
- Honor `prefers-reduced-motion`: no camera shake, no zoom pulses; gameplay unchanged.
- 30+ fps at 1280×800 on a 2020 laptop.

## Hard Requirements

- Single `index.html`, no build step; opens over `file://`.
- Canvas 2D or WebGL via a CDN library (Three.js, PixiJS, or raw canvas); any CDN assets listed in `manifest.json.externalAssets`.
- Keyboard accessible; `lang="en"` on `<html>`.
- No login, no analytics, no network requests for runtime art, audio, or data.

Expose a small automated verification hook:

```js
window.__drift = {
  ready: true,
  getState(),        // screen (menu/racing/paused/finish), track, lap, lapTime, bestTimes, unlocks
  selectTrack(i),    // must respect lock state
  startRace(),
  setInput(input),   // { throttle, brake, steer, handbrake } for scripted drives
  getCar(),          // position, heading, speed, slip angle, onTrack
  getTiming(),       // current/last/best lap, gold time, delta
  getGhost(),        // ghost sample count for the current track
  resetProgress()    // clear localStorage unlocks and times
};
```

The hook must call the same game functions the UI uses, not a parallel simulation.

## Loop / Validation Rule

Do not stop until you have personally verified all of the following in a browser:

1. The first screen shows the goal, the three-track ladder with tracks 2 and 3 locked, and starts a race with no console errors.
2. Throttle, brake, steering, and handbrake all work; the handbrake visibly puts the car into a sliding drift with a light trail.
3. Off-track driving slows the car; walls stop it; the car can never leave the world or skip a checkpoint to record a lap.
4. Lap timing is accurate: crossing the line starts/ends laps, and 3 laps produce a finish screen with the correct total.
5. The live delta turns green ahead of gold pace and red behind it.
6. Finishing Sunset Coast under its gold time unlocks Neon Canyon on the ladder and shows the unlock; a slower time does not.
7. After a lap is completed, a translucent ghost replays the recorded best lap on the next attempt.
8. Pause, restart (R), and menu keyboard navigation all work.
9. Reloading the page preserves unlocks and best times via `localStorage`; the hook can clear them.
10. Beating Grid City's gold time shows the champion screen with per-track times.
11. Reduced-motion mode removes camera effects while driving stays identical.
12. The game holds 30+ fps at 1280×800 mid-drift with the ghost active.

If any check fails, fix the specific mechanism and run all twelve checks again.