Build a **3D arena game with a built-in level editor**, inspired by a top-down/isometric spider-bot battle arena. The user supplied a reference GIF — read frames to understand the visual.

## REFERENCE
The source GIF and extracted keyframes live in `/home/claudebot/fable-test/areagame/reference-frames/` (frame-001.png through frame-010.png). **Read 2-3 frames first** with your image-aware Read tool so you can match the vibe.

What the reference shows (user's verbatim description):
> "an arena room with little spider robots with turrets on top that shoot and explode each other with a variety of laser and bomb abilities. pretty simple."

Visual elements I can see in the frames:
- **Top-down / 3D tilted-isometric camera** on a tile floor — tiles are dark with red/orange highlights and some emissive glow
- **Yellow laser beams snake across the floor** — auto-targeting / linked lasers between bots
- **Small spider-form bots** with a glowing turret-cap on top — the player and 1-2 enemy bots
- **Explosions** — bright orange/red radial bursts with shockwave ring + ember particles
- **Dark moody lighting** with hot accent colors (yellow lasers, red/orange explosions, cyan player ring)
- **HUD**: top-left = player avatar with a circular health-ring; bottom center = 7-icon ability hotbar; top-right = pause button

## PRIORITY (user explicit):
> "save time on going too fancy with the gameplay, save it for later. more important to get the editor right and a particle/explosion thing for gameplay."

So: **EDITOR is the priority**, gameplay is "slice of playable game (as shown)". Don't over-engineer the AI/abilities — get a clean playable slice + a great editor.

## GAMEPLAY SLICE (the "as shown" baseline):
- 3D arena room — flat tilted tile floor, walls around perimeter, low ambient lighting
- **Player spider-bot**: arrow/WASD to move (4 or 8 direction), mouse to aim, primary fire = laser beam to cursor
- **Enemy spider-bot(s)**: simple AI — wander OR seek-player; fires lasers back at player when in range
- **Bomb ability** (right-click or Space): drops a timed bomb that explodes after ~1.2s with a radial damage burst
- **HP / damage**: bots have ~3 HP; laser hit = 1 dmg, bomb hit = 2 dmg; KO when 0 HP
- **Win condition**: clear all enemies in the room → "level cleared" message
- **One arena layout** as the baseline level (the editor will let users build new layouts)

**EXPLOSIONS / PARTICLES (user called this out — make it FEEL good)**:
- Radial expanding ring shockwave on each explosion
- Ember/spark particles scattering with gravity
- Brief screen shake scaled to explosion size
- Hit-flash on damaged bots
- Laser beams have a glow + slight bloom

## LEVEL EDITOR (the big ask):
- **Toggle**: press `E` (or a dedicated UI button) to flip between PLAY mode and EDITOR mode at any time
- **Editor camera**: same isometric view as play, but with grid overlay
- **Palette panel** (sidebar): place-able entities, click to select then click on grid to place
  - Wall (blocks movement/lasers)
  - Floor tile (paint the ground)
  - Player spawn (only one — placing again moves it)
  - Enemy spider-bot (multiple)
  - Turret (stationary auto-firing — optional bonus)
- **Edit operations**:
  - LEFT click on grid with selected palette → place entity
  - RIGHT click on grid → delete entity at that cell
  - DRAG from palette → drop on grid (drag-and-drop alternative)
  - Selected entity highlight in palette
- **Serialization (USER EXPLICITLY ASKED FOR THIS — must work)**:
  - "Save Level" button → produces JSON like `{ "version": 1, "size": [w,h], "playerSpawn": [x,y], "walls": [...], "enemies": [...], "turrets": [...] }`
  - Download as `.json` file via blob URL
  - "Load Level" button → file picker accepts the same JSON and rebuilds the level
  - **Test reproducibility**: e2e test should save a level, reload it, and verify identical state
- **Play test from editor**: a button in editor mode = "Play from here" that drops you straight into the current edit as PLAY mode without saving anywhere else
- **localStorage**: auto-save the current edit-in-progress so a refresh doesn't lose it

## TECH:
- Vite + TS. three.js for the 3D arena and bots (procgen geometry — simple ExtrudeGeometry for bots, BoxGeometry for walls, PlaneGeometry for tiles). No external textures, no gpt-image-2 (user said save the API budget). Use canvas-baked materials and emissive colors.
- DOM-overlay HUD + editor palette (CSS sidebars).
- `base: './'`. `npm run build` → `dist/` populates. TS strict.
- `window.__game` debug hook: `{ phase, mode, hp, enemies, levelJson }`

## OUT OF SCOPE:
- No gpt-image-2 / external images / textures (procgen everything)
- No multiplayer
- No multiple stages / progression
- No ability tree (just laser + bomb is fine for the slice)
- Don't try to perfectly match the GIF aesthetic — capture the VIBE, not pixel parity.

## SHIPPING DISCIPLINE:
- **By turn ~10**: arena renders, player bot moves + shoots laser, one enemy spawns + reacts
- **By turn ~20**: bomb ability works with particles + screen shake, enemy AI cleared, level-cleared state
- **By turn ~30**: editor toggle works, palette panel placed, wall + spawn + enemy can be placed/deleted
- **By turn ~40**: save/load level JSON works (download blob + file pick), play-from-editor button works
- **Hard cap 50 turns.** Slice + editor > perfect anything. If you hit 35 and the editor saves/loads but only walls work, ship — turrets and polish can come later.

WHEN DONE: one-line summary including the name you chose (something arena-coded, e.g. "Spider Arena", "Bolt Pit", "Filament Arena", whatever).
