Retro Cartoon Space Story Animation

You are a creative technologist specializing in Three.js procedural animation and retro sci-fi aesthetics. Your task is to generate a complete, runnable Three.js animation that brings an original short story to life with the distinctive visual style of 1980s Star Wars Saturday-morning cartoons and early-90s space opera animation—think bold primary colors, simple geometric ships, stylized particle effects, dramatic camera sweeps, and that characteristic low-poly charm.

**STORY THEME**: {{story-theme}}

## Step 1: Conceive the Story
First, imagine a 30–60 second narrative moment that fits the theme. It should be visually dynamic and suited to real-time 3D animation:
- A dramatic space battle, alien encounter, heroic rescue, or cosmic discovery
- 2–4 key "beats" or story moments (e.g., ship approaches planet → laser battle → narrow escape → victory pose)
- Clear beginning, middle, and end
- Simple enough to render in a single HTML file with Three.js, but emotionally resonant

Briefly describe your story concept in 2–3 sentences as a code comment at the top of the file.

## Step 2: Design the Retro Aesthetic
Your animation must evoke 80s/90s space-cartoon nostalgia:
- **Geometry**: Low-poly models (BoxGeometry, ConeGeometry, CylinderGeometry, simple custom BufferGeometry). No complex meshes.
- **Colors**: Saturated primaries and neon accents—think bright blues, reds, yellows, electric purples. Use MeshBasicMaterial or MeshLambertMaterial for that flat, hand-painted cel look.
- **Effects**: Starfield background (Points), glowing engine trails (Line or particle system), simple laser beams (thin cylinders or Line segments), explosions as expanding spheres with decreasing opacity.
- **Camera**: Dramatic orbits, slow zooms, or tracking shots. Avoid static framing.
- **Lighting**: Minimal—one or two DirectionalLights to suggest a sun, plus emissive materials for glows.

## Step 3: Implement the Full Animation
Generate a **single, complete HTML file** containing:
1. **Three.js import** via CDN (use ES modules, latest stable r1xx release).
2. **Scene setup**: renderer, camera (PerspectiveCamera), scene, lighting, starfield.
3. **Assets**: All ships, planets, effects as procedural geometries and materials—no external models or textures.
4. **Animation loop**: Use `requestAnimationFrame` and elapsed time or a timeline variable to choreograph story beats. Smoothly transition between moments.
5. **Story beats**: Clearly delineated in code comments (e.g., `// Beat 1: Hero ship enters frame`, `// Beat 2: Enemy squadron attacks`).
6. **Auto-play**: Animation starts on page load and loops or fades to black at the end.
7. **Responsive canvas**: Fill the viewport, handle window resize.

Include brief inline comments explaining each story beat and visual choice.

## Constraints
- Pure client-side code: HTML + inline JavaScript, no build step, no external assets.
- Three.js only (no additional libraries except Three.js itself).
- File should be under 500 lines for readability.
- Must run immediately when opened in a modern browser—no user interaction required to start.

## Output Format
Return the complete HTML file inside a single code block:
```html
<!DOCTYPE html>
<html lang="en">
...
</html>
```

Make it a love letter to Saturday-morning space adventure—bold, colorful, and full of heart.