Upload folder using huggingface_hub

Dockerfile

@@ -1,13 +1,32 @@
-ARG BASE_IMAGE=ghcr.io/meta-pytorch/openenv-base:latest
-FROM ${BASE_IMAGE}
-
-COPY src/openenv/ /app/src/openenv/
-COPY envs/wildfire_env/ /app/envs/wildfire_env/
-COPY README.md /app/README.md
-
-ENV ENABLE_WEB_INTERFACE=true
-
-HEALTHCHECK --interval=30s --timeout=3s --start-period=5s --retries=3 \
-    CMD curl -f http://localhost:8000/health || exit 1
-
-CMD ["sh", "-lc", "python -m uvicorn wildfire_env.server.app:app --host 0.0.0.0 --port ${PORT:-8000} --proxy-headers --forwarded-allow-ips='*'"]
+# Base image
+FROM python:3.11-slim
+
+# Set working directory
+WORKDIR /app/env
+
+# Install system dependencies
+RUN apt-get update && apt-get install -y \
+    git \
+    curl \
+    && rm -rf /var/lib/apt/lists/*
+
+# Copy environment files
+COPY . .
+
+# Install Python dependencies
+RUN pip install --no-cache-dir -e .
+
+# Expose port
+EXPOSE 8000
+
+# Set environment variables
+ENV PYTHONUNBUFFERED=1
+ENV ENABLE_WEB_INTERFACE=true
+
+# Health check
+HEALTHCHECK --interval=30s --timeout=3s --start-period=5s --retries=3 \
+    CMD curl -f http://localhost:8000/health || exit 1
+
+# Run the server
+# Use shell form to allow PORT variable expansion for Hugging Face Spaces
+CMD python -m uvicorn wildfire_env.server.app:app --host 0.0.0.0 --port ${PORT:-8000} --proxy-headers --forwarded-allow-ips '*'

README.md

@@ -1,1091 +1,1091 @@
----
-title: Wildfire Environment Server
-emoji: 🔥
-colorFrom: red
-colorTo: blue
-sdk: docker
-pinned: false
-app_port: 8000
-base_path: /web
-tags:
-  - openenv
-  - reinforcement-learning
-  - wildfire
-  - simulation
----
-
-# 🌲 Wildfire Environment
-
-Autonomous wildfire-control simulation for reinforcement-learning agents, built on the [OpenEnv](https://github.com/openenv) framework.  
-Agents must contain spreading fires using **water**, **firebreaks**, and **timing strategies** under changing **wind** and **humidity** conditions.
-
-[![Docker](https://img.shields.io/badge/docker-ready-blue)](https://hub.docker.com/)
-[![Python](https://img.shields.io/badge/python-3.10+-green)](https://www.python.org/)
-[![FastAPI](https://img.shields.io/badge/backend-fastapi-teal)](https://fastapi.tiangolo.com/)
-[![License](https://img.shields.io/badge/license-MIT-lightgrey)](LICENSE)
-
----
-
-## 📋 Table of Contents
-
-1. [Why Wildfire Simulation?](#-why-wildfire-simulation)
-2. [Quick Start](#-quick-start)
-3. [Environment Overview](#-environment-overview)
-4. [Grid Format & Encoding](#-grid-format--encoding)
-5. [Actions](#-actions)
-6. [Observations](#-observations)
-7. [Reward Structure](#-reward-structure)
-8. [Fire Spread Mechanics](#-fire-spread-mechanics)
-9. [Configuration](#-configuration)
-10. [Installation & Usage](#-installation--usage)
-11. [API Reference](#-api-reference)
-12. [Examples](#-examples)
-13. [Web Interface](#-web-interface)
-14. [Troubleshooting](#-troubleshooting)
-15. [References](#-references)
-
----
-
-## 🔥 Why Wildfire Simulation?
-
-Wildland fires are intensifying globally due to climate change — increasing the urgency for **AI-assisted decision-making**.  
-This environment explores how intelligent systems can **control** fire spread in real time, under limited resources.
-
-### Research Motivation
-✅ Based on real wildfire science inspired by:
-- **Rothermel Surface Fire Spread Model** (USDA Forest Service)
-- **MITRE Fireline's SimFire** — physics-informed RL fire simulator
-- **SimHarness** — RL evaluation for disaster response
-
-### Application Goals
-| Research Theme | Role in This Environment |
-|---|---|
-| Resource-Constrained Planning | Finite water + firebreak budgets |
-| Fire Spread + Containment Strategy | Directional wind & moisture effects |
-| Disaster Response RL | Safety-focused reward design |
-| LLM Agents for Control Tasks | Text-based action decision making |
-
-This makes WildfireEnv a **fast, controllable**, and **open benchmark** for applied RL and LLM reasoning.
-
----
-
-## 🚀 Quick Start
-
-### Using Docker (Recommended)
-
-```bash
-# Build base image (first time only)
-docker build -t openenv-base:latest -f src/core/containers/images/Dockerfile .
-
-# Build wildfire environment
-docker build -t wildfire-env:latest -f src/envs/wildfire_env/server/Dockerfile .
-
-# Run container
-docker run -p 8000:8000 -e ENABLE_WEB_INTERFACE=true wildfire-env:latest
-```
-
-**Note:** The web interface can be enabled with `ENABLE_WEB_INTERFACE=true`. Access it at `http://localhost:8000/web` when enabled.
-
-### Basic Python Client
-
-```python
-from envs.wildfire_env import WildfireEnv, WildfireAction
-
-# Connect to running server
-env = WildfireEnv(base_url="http://localhost:8000")
-
-# Reset environment
-result = env.reset()
-obs = result.observation
-print(f"Grid: {obs.width}x{obs.height}, Fires: {obs.burning_count}, Water: {obs.remaining_water}")
-
-# Take action (water a burning cell)
-result = env.step(WildfireAction(action="water", x=10, y=15))
-print(f"Reward: {result.reward:.2f}, Burning: {result.observation.burning_count}")
-
-# Create firebreak
-result = env.step(WildfireAction(action="break", x=12, y=15))
-
-# Wait (fire spreads)
-result = env.step(WildfireAction(action="wait"))
-
-env.close()
-```
-
----
-
-## 🔥 Environment Overview
-
-This environment models **forest-fire dynamics** influenced by:
-- **Wind direction** (8 directions + calm) - accelerates fire spread in wind direction
-- **Humidity** (0.0-1.0) - suppresses ignition probability
-- **Fuel type and spread rate** - vegetation burns and spreads to neighbors
-- **Limited resources** (water units, break materials) - strategic resource management
-- **Time pressure** (each step costs small reward penalty)
-
-The goal is to **minimize fire spread** and **total burned area** while using resources efficiently.
-
-### Episode Termination
-
-An episode ends when:
-- **All fires are extinguished** (`burning_count == 0`) - **Success!** 
-- **Maximum steps reached** (`step_count >= max_steps`) - Time limit exceeded
-
----
-
-## 🧱 Grid Format & Encoding
-
-### Grid Structure
-
-The grid is returned as a **flat 1D array** in the observation. To access cell at position `(x, y)`:
-
-```python
-index = y * width + x
-cell_value = observation.grid[index]
-```
-
-**Example:** For a 32×32 grid, cell at (10, 15):
-```python
-index = 15 * 32 + 10  # = 490
-cell_value = observation.grid[490]
-```
-
-### Cell Encoding
-
-| Code | Meaning        | Color (Visualization) | Behavior |
-|------|----------------|-----------------------|----------|
-| `0`  | Ash (burned)   | Black ⚫              | Burned out, cannot reignite |
-| `1`  | Fuel           | Green 🟩              | Healthy vegetation, can ignite |
-| `2`  | Burning        | Red 🔥                | Currently on fire, spreads to neighbors |
-| `3`  | Firebreak      | Brown 🟫              | Barrier, fire cannot cross |
-| `4`  | Water/Damp     | Blue 🔵               | Dampened, immune to ignition temporarily |
-
-### Grid Visualization Example
-
-```python
-import numpy as np
-
-obs = env.reset().observation
-grid_2d = np.array(obs.grid).reshape(obs.height, obs.width)
-
-# Now grid_2d[y][x] gives the cell value at position (x, y)
-print(grid_2d[15][10])  # Cell at x=10, y=15
-```
-
----
-
-## 🎮 Actions
-
-### Action Types
-
-#### 1. `water` - Apply Water
-**Extinguishes burning cells and dampens fuel to prevent ignition.**
-
-```python
-WildfireAction(action="water", x=10, y=15)
-```
-
-**Effects:**
-- **Burning cell (2)**: Extinguishes → becomes Water/Damp (4), gives **+0.25 reward**
-- **Fuel cell (1)**: Dampens → becomes Water/Damp (4), gives **-0.10 reward** (preventive, slight penalty)
-- **Water/Damp cell (4)**: Redundant watering, gives **-0.05 reward**
-- **Ash/Break (0, 3)**: Wasteful, gives **-0.05 reward**
-
-**Resource Cost:** 1 water unit per action  
-**Requires:** `remaining_water > 0` and valid coordinates
-
-**Best Use:** Extinguish active fires before they spread
-
----
-
-#### 2. `break` - Create Firebreak
-**Builds a fire-resistant barrier that stops fire spread.**
-
-```python
-WildfireAction(action="break", x=12, y=15)
-```
-
-**Effects:**
-- **Fuel/Water cell (1, 4)**: Creates firebreak → becomes Firebreak (3), gives **+0.15 reward**
-- **Burning cell (2)**: Extinguishes → becomes Firebreak (3), gives **-0.02 reward** (less effective than water)
-- **Firebreak (3)**: Redundant, gives **-0.01 reward**
-- **Ash (0)**: Wasteful, gives **-0.02 reward**
-
-**Resource Cost:** 1 firebreak material per action  
-**Requires:** `remaining_breaks > 0` and valid coordinates
-
-**Best Use:** Create barriers ahead of fire front to contain spread
-
----
-
-#### 3. `wait` - Do Nothing
-**Let natural fire dynamics occur (fire spreads).**
-
-```python
-WildfireAction(action="wait")
-```
-
-**Effects:**
-- No resource cost
-- No coordinate required
-- Fire spreads naturally to neighboring cells
-- Small time penalty (-0.01 reward per step)
-
-**Best Use:** When fire is contained, waiting for it to burn out
-
----
-
-### Invalid Actions
-
-Actions that fail (give **-0.05 reward**):
-- Invalid coordinates (out of bounds)
-- Using water when `remaining_water == 0`
-- Using break when `remaining_breaks == 0`
-- Missing required coordinates for water/break actions
-
----
-
-## 👁️ Observations
-
-### `WildfireObservation`
-
-Returned after every `reset()` or `step()`:
-
-```python
-@dataclass
-class WildfireObservation(Observation):
-    grid: List[int]          # Flat array: [1,1,2,1,...] length = width × height
-    width: int               # Grid width (default: 32)
-    height: int              # Grid height (default: 32)
-    step: int                # Current step number (0 at reset)
-    wind_dir: str            # "N", "NE", "E", "SE", "S", "SW", "W", "NW", "CALM"
-    humidity: float          # [0.0, 1.0] - higher = less fire spread
-    burning_count: int       # Number of cells currently on fire
-    burned_count: int        # Total number of ash cells (cumulative)
-    remaining_water: int     # Water units left
-    remaining_breaks: int    # Firebreak materials left
-    reward_hint: float       # Shaping reward (for debugging)
-    done: bool               # Episode ended?
-    reward: float            # Step reward
-```
-
-### Example Observation
-
-```python
-result = env.reset()
-obs = result.observation
-
-print(f"Step: {obs.step}")                    # 0
-print(f"Grid size: {obs.width}x{obs.height}") # 32x32
-print(f"Grid cells: {len(obs.grid)}")         # 1024
-print(f"Active fires: {obs.burning_count}")   # 2
-print(f"Wind: {obs.wind_dir}")                # "NE"
-print(f"Humidity: {obs.humidity:.2f}")        # 0.24
-print(f"Water left: {obs.remaining_water}")   # 8
-print(f"Breaks left: {obs.remaining_breaks}") # 50
-```
-
----
-
-## 💰 Reward Structure
-
-### Step Rewards
-
-| Action | Condition | Reward |
-|--------|-----------|--------|
-| **Water burning cell** | Extinguishes fire | **+0.25** |
-| **Water fuel cell** | Preventive dampening | **-0.10** |
-| **Create firebreak** | From fuel/water | **+0.15** |
-| **Fire spreads** | Each new burning cell | **-0.15 per cell** |
-| **Fire shrinks** | Each extinguished cell | **+0.10 per cell** |
-| **New burned area** | Each cell turns to ash | **-0.05 per cell** |
-| **Time penalty** | Every step | **-0.01** |
-| **Invalid action** | Out of bounds, no resources | **-0.05** |
-| **Redundant action** | Watering already damp cell | **-0.05** |
-
-### Episode End Bonuses
-
-When episode terminates (`done == True`):
-
-- **Fire contained** (`burning_count == 0`):
-  - **+0.5** base bonus
-  - **+0.5 × saved_ratio** bonus (proportion of cells not burned)
-
-- **Fallback reward**:
-  - **+0.2 × (1.0 - burned_ratio)** bonus
-
-**Example:** Perfect containment (no burned cells):
-```python
-Reward = +0.5 + 0.5 × 1.0 = +1.0
-```
-
-### Reward Interpretation
-
-- **Positive rewards**: Good containment actions, extinguishing fires
-- **Negative rewards**: Fire spread, resource waste, time penalty
-- **Goal**: Maximize cumulative reward = minimize fire damage
-
----
-
-## 🌪️ Fire Spread Mechanics
-
-### Spread Model
-
-Fire spreads using an **8-directional neighbor model**:
-
-1. **Burning cells persist** for `burn_lifetime = 3` ticks before turning to ash
-2. Each burning cell can ignite **neighboring fuel cells** (8 directions)
-3. Spread probability depends on:
-   - **Base ignition probability**: `0.30` (30% chance)
-   - **Humidity factor**: `(1.0 - humidity)` - higher humidity = less spread
-   - **Wind multiplier**: 
-     - **+2.0x** in wind direction
-     - **+0.5x** against wind
-     - **+1.0x** perpendicular
-   - **Diagonal factor**: `0.6x` for diagonal neighbors (slower spread)
-
-4. **Water/Damp cells (4)** are **immune** to ignition while damp
-5. **Firebreaks (3)** **cannot** be crossed by fire
-6. **Ash cells (0)** cannot reignite
-
-### Wind Effects
-
-| Wind Direction | Effect on Fire Spread |
-|----------------|----------------------|
-| **In wind direction** | 2× faster ignition probability |
-| **Against wind** | 0.5× slower ignition probability |
-| **Perpendicular** | Normal (1×) ignition probability |
-| **CALM** | No directional bias |
-
-### Water Dampening Duration
-
-Watered cells (4) remain damp for **6 ticks** before reverting to fuel (1).
-
-### Example Fire Spread
-
-```
-Step 0:     Step 1:     Step 2:
-🟩🟩🟩      🟩🟥🟩      🟫🟥🟫
-🟩🟥🟩  →   🟥🟥🟥  →   🟥🟥🟥  (Wind: E, spreading east)
-🟩🟩🟩      🟩🟥🟩      🟫🟥🟫
-```
-
----
-
-## ⚙️ Configuration
-
-### Environment Variables
-
-Set these **before starting the server**:
-
-| Variable | Description | Default | Range |
-|-----------|-------------|---------|-------|
-| `WILDFIRE_WIDTH` | Grid width in cells | `32` | 8-128 |
-| `WILDFIRE_HEIGHT` | Grid height in cells | `32` | 8-128 |
-| `WILDFIRE_HUMIDITY` | Initial humidity level | `0.25` | 0.0-1.0 |
-| `WILDFIRE_WIND` | Wind direction (fixed) | Random | `N`, `NE`, `E`, `SE`, `S`, `SW`, `W`, `NW`, `CALM` |
-| `WILDFIRE_SEED` | Random seed | `3407` | Any integer |
-| `WILDFIRE_MAX_STEPS` | Max steps per episode | `128` | 10-1000 |
-| `WILDFIRE_WATER_CAPACITY` | Initial water units | `8` | 1-100 |
-| `WILDFIRE_BREAK_CAPACITY` | Initial firebreak materials | `50` | 1-200 |
-
-### Python API Configuration
-
-```python
-from envs.wildfire_env.server.wildfire_environment import WildfireEnvironment
-
-env = WildfireEnvironment(
-    width=64,
-    height=64,
-    humidity=0.3,
-    init_sources=3,          # Number of initial fires
-    max_steps=200,
-    water_capacity=10,
-    break_capacity=75,
-    seed=42
-)
-```
-
-### Docker Configuration
-
-```bash
-docker run -p 8000:8000 \
-  -e WILDFIRE_WIDTH=64 \
-  -e WILDFIRE_HEIGHT=64 \
-  -e WILDFIRE_HUMIDITY=0.4 \
-  -e WILDFIRE_WIND=N \
-  -e WILDFIRE_WATER_CAPACITY=12 \
-  wildfire-env:latest
-```
-
-### Custom Configuration
-
-```bash
-# Build and run with custom configuration
-docker build -t openenv-base:latest -f src/core/containers/images/Dockerfile .
-docker build -t wildfire-env:latest -f src/envs/wildfire_env/server/Dockerfile .
-docker run -p 8000:8000 \
-  -e ENABLE_WEB_INTERFACE=true \
-  -e WILDFIRE_WIDTH=64 \
-  -e WILDFIRE_HEIGHT=64 \
-  -e WILDFIRE_HUMIDITY=0.5 \
-  wildfire-env:latest
-```
-
----
-
-## 🚀 Installation & Usage
-
-### Option 1: Docker (Recommended)
-
-**Manual setup:**
-```bash
-# Build base image (first time only)
-docker build -t openenv-base:latest -f src/core/containers/images/Dockerfile .
-
-# Build wildfire environment
-docker build -t wildfire-env:latest -f src/envs/wildfire_env/server/Dockerfile .
-
-# Run container
-docker run -p 8000:8000 -e ENABLE_WEB_INTERFACE=true wildfire-env:latest
-```
-
-This approach:
-- Builds the base image if needed
-- Rebuilds the wildfire image
-- Starts the container
-- Shows logs in real-time
-
-**Alternative: Using build_docker.sh script:**
-```bash
-# Build base image (first time only)
-docker build -t openenv-base:latest -f src/core/containers/images/Dockerfile .
-
-# Build wildfire environment using the script
-cd src/envs/wildfire_env/server
-./build_docker.sh
-
-# Run container
-docker run -d -p 8000:8000 --name wildfire-env-container wildfire-env:latest
-
-# View logs
-docker logs -f wildfire-env-container
-
-# Stop container
-docker stop wildfire-env-container
-
-# Remove container
-docker rm wildfire-env-container
-```
-
-### Option 2: Local Development (No Docker)
-
-**Requirements:**
-```bash
-pip install fastapi uvicorn numpy matplotlib requests
-```
-
-**Run server:**
-```bash
-# From OpenEnv root directory
-python -m envs.wildfire_env.server.app
-```
-
-**Or with environment variables:**
-```bash
-WILDFIRE_WIDTH=64 WILDFIRE_HUMIDITY=0.3 python -m envs.wildfire_env.server.app
-```
-
----
-
-## 📚 API Reference
-
-### Client Class
-
-```python
-from envs.wildfire_env import WildfireEnv
-
-# Connect to existing server
-env = WildfireEnv(base_url="http://localhost:8000")
-
-# Or create from Docker image
-env = WildfireEnv.from_docker_image("wildfire-env:latest")
-```
-
-### Methods
-
-#### `reset() -> StepResult[WildfireObservation]`
-
-Resets the environment to initial state.
-
-```python
-result = env.reset()
-obs = result.observation
-print(f"New episode: {obs.step == 0}")
-```
-
-#### `step(action: WildfireAction) -> StepResult[WildfireObservation]`
-
-Takes an action and returns new observation.
-
-```python
-action = WildfireAction(action="water", x=10, y=15)
-result = env.step(action)
-print(f"Reward: {result.reward}, Done: {result.done}")
-```
-
-#### `state -> WildfireState`
-
-Access current environment state.
-
-```python
-state = env.state
-print(f"Episode ID: {state.episode_id}")
-print(f"Total burned: {state.total_burned}")
-print(f"Total extinguished: {state.total_extinguished}")
-```
-
-#### `close()`
-
-Closes the connection (for HTTP clients, this is a no-op but good practice).
-
-```python
-env.close()
-```
-
-### Data Classes
-
-#### `WildfireAction`
-
-```python
-@dataclass
-class WildfireAction(Action):
-    action: str              # "water" | "break" | "wait"
-    x: Optional[int] = None  # Target X coordinate (required for water/break)
-    y: Optional[int] = None  # Target Y coordinate (required for water/break)
-```
-
-**Examples:**
-```python
-WildfireAction(action="water", x=10, y=15)
-WildfireAction(action="break", x=12, y=15)
-WildfireAction(action="wait")  # x, y not needed
-```
-
-#### `WildfireObservation`
-
-See [Observations](#-observations) section for full details.
-
-#### `WildfireState`
-
-```python
-@dataclass
-class WildfireState(State):
-    episode_id: str
-    step_count: int
-    total_burned: int
-    total_extinguished: int
-    last_action: str
-    width: int
-    height: int
-    wind_dir: str
-    humidity: float
-    remaining_water: int
-    remaining_breaks: int
-    grid: List[int]
-    burn_timers: List[int]
-```
-
----
-
-## 📖 Examples
-
-### Example 1: Simple Containment Strategy
-
-```python
-from envs.wildfire_env import WildfireEnv, WildfireAction
-import numpy as np
-
-env = WildfireEnv(base_url="http://localhost:8000")
-result = env.reset()
-obs = result.observation
-
-grid_2d = np.array(obs.grid).reshape(obs.height, obs.width)
-total_reward = 0
-
-while not result.done:
-    # Find burning cells
-    burning_indices = np.where(grid_2d == 2)
-    
-    if len(burning_indices[0]) > 0 and obs.remaining_water > 0:
-        # Water the first burning cell
-        y, x = burning_indices[0][0], burning_indices[1][0]
-        action = WildfireAction(action="water", x=int(x), y=int(y))
-    else:
-        # Wait if no water or no fires
-        action = WildfireAction(action="wait")
-    
-    result = env.step(action)
-    obs = result.observation
-    total_reward += result.reward or 0
-    
-    # Update grid
-    grid_2d = np.array(obs.grid).reshape(obs.height, obs.width)
-    
-    print(f"Step {obs.step}: Burning={obs.burning_count}, Reward={result.reward:.3f}")
-
-print(f"\nEpisode ended. Total reward: {total_reward:.2f}")
-print(f"Final stats: Burned={obs.burned_count}, Extinguished={env.state.total_extinguished}")
-env.close()
-```
-
-### Example 2: Firebreak Strategy
-
-```python
-from envs.wildfire_env import WildfireEnv, WildfireAction
-import numpy as np
-
-env = WildfireEnv(base_url="http://localhost:8000")
-result = env.reset()
-obs = result.observation
-
-def create_firebreak_barrier(obs, env):
-    """Create firebreak ahead of fire front based on wind direction."""
-    grid_2d = np.array(obs.grid).reshape(obs.height, obs.width)
-    wind = obs.wind_dir
-    
-    # Find burning cells
-    burning_y, burning_x = np.where(grid_2d == 2)
-    
-    if len(burning_x) == 0 or obs.remaining_breaks == 0:
-        return WildfireAction(action="wait")
-    
-    # Calculate fire front position
-    if wind == "E":
-        target_x = int(np.max(burning_x)) + 2  # Ahead of easternmost fire
-        target_y = int(np.mean(burning_y))
-    elif wind == "W":
-        target_x = int(np.min(burning_x)) - 2
-        target_y = int(np.mean(burning_y))
-    elif wind == "N":
-        target_x = int(np.mean(burning_x))
-        target_y = int(np.min(burning_y)) - 2
-    elif wind == "S":
-        target_x = int(np.mean(burning_x))
-        target_y = int(np.max(burning_y)) + 2
-    else:
-        # Fallback: water nearest burning cell
-        return WildfireAction(action="water", x=int(burning_x[0]), y=int(burning_y[0]))
-    
-    # Ensure within bounds
-    target_x = max(0, min(obs.width - 1, target_x))
-    target_y = max(0, min(obs.height - 1, target_y))
-    
-    return WildfireAction(action="break", x=target_x, y=target_y)
-
-total_reward = 0
-while not result.done:
-    action = create_firebreak_barrier(obs, env)
-    result = env.step(action)
-    obs = result.observation
-    total_reward += result.reward or 0
-    
-    if obs.step % 10 == 0:
-        print(f"Step {obs.step}: Fires={obs.burning_count}, Water={obs.remaining_water}, Breaks={obs.remaining_breaks}")
-
-env.close()
-```
-
-### Example 3: Visualization with Matplotlib
-
-```python
-import matplotlib.pyplot as plt
-import numpy as np
-import matplotlib.colors as mcolors
-from envs.wildfire_env import WildfireEnv, WildfireAction
-
-env = WildfireEnv(base_url="http://localhost:8000")
-result = env.reset()
-obs = result.observation
-
-# Setup colormap
-cmap = mcolors.ListedColormap([
-    "black",         # 0 = ash
-    "green",         # 1 = fuel
-    "red",           # 2 = burning
-    "saddlebrown",   # 3 = firebreak
-    "blue"           # 4 = water
-])
-norm = mcolors.BoundaryNorm([0, 1, 2, 3, 4, 5], cmap.N)
-
-fig, ax = plt.subplots(figsize=(8, 8))
-plt.ion()
-
-for step in range(50):
-    if result.done:
-        break
-    
-    # Render grid
-    grid_2d = np.array(obs.grid).reshape(obs.height, obs.width)
-    ax.clear()
-    ax.imshow(grid_2d, cmap=cmap, norm=norm, interpolation='nearest')
-    ax.set_title(
-        f"Step {obs.step} | Fires: {obs.burning_count} | Burned: {obs.burned_count}\n"
-        f"Wind: {obs.wind_dir} | Humidity: {obs.humidity:.2f} | "
-        f"Water: {obs.remaining_water} | Breaks: {obs.remaining_breaks}"
-    )
-    plt.pause(0.1)
-    
-    # Take action (simple: water first burning cell)
-    if obs.burning_count > 0 and obs.remaining_water > 0:
-        burning_indices = np.where(grid_2d == 2)
-        if len(burning_indices[0]) > 0:
-            y, x = burning_indices[0][0], burning_indices[1][0]
-            action = WildfireAction(action="water", x=int(x), y=int(y))
-        else:
-            action = WildfireAction(action="wait")
-    else:
-        action = WildfireAction(action="wait")
-    
-    result = env.step(action)
-    obs = result.observation
-
-plt.ioff()
-plt.show()
-env.close()
-```
-
-### Example 4: Training Loop for RL
-
-```python
-from envs.wildfire_env import WildfireEnv, WildfireAction
-import random
-
-env = WildfireEnv(base_url="http://localhost:8000")
-
-num_episodes = 10
-episode_rewards = []
-
-for episode in range(num_episodes):
-    result = env.reset()
-    obs = result.observation
-    episode_reward = 0
-    episode_steps = 0
-    
-    while not result.done:
-        # Random policy (replace with your RL agent)
-        if random.random() < 0.4 and obs.remaining_water > 0:
-            action = WildfireAction(
-                action="water",
-                x=random.randint(0, obs.width - 1),
-                y=random.randint(0, obs.height - 1)
-            )
-        elif random.random() < 0.3 and obs.remaining_breaks > 0:
-            action = WildfireAction(
-                action="break",
-                x=random.randint(0, obs.width - 1),
-                y=random.randint(0, obs.height - 1)
-            )
-        else:
-            action = WildfireAction(action="wait")
-        
-        result = env.step(action)
-        obs = result.observation
-        episode_reward += result.reward or 0
-        episode_steps += 1
-    
-    episode_rewards.append(episode_reward)
-    state = env.state
-    print(
-        f"Episode {episode + 1}: "
-        f"Reward={episode_reward:.2f}, "
-        f"Steps={episode_steps}, "
-        f"Burned={state.total_burned}, "
-        f"Extinguished={state.total_extinguished}"
-    )
-
-print(f"\nAverage reward: {sum(episode_rewards) / len(episode_rewards):.2f}")
-env.close()
-```
-
----
-
-## 🌐 Web Interface
-
-The Wildfire Environment includes a **custom web interface** with visual grid display and wildfire-specific features.
-
-### Accessing the Web Interface
-
-#### Using Docker
-
-```bash
-# Build base image (first time only)
-docker build -t openenv-base:latest -f src/core/containers/images/Dockerfile .
-
-# Build wildfire environment
-docker build -t wildfire-env:latest -f src/envs/wildfire_env/server/Dockerfile .
-
-# Run container
-docker run -p 8000:8000 -e ENABLE_WEB_INTERFACE=true wildfire-env:latest
-```
-
-Then open: `http://localhost:8000/web`
-
-#### Local Testing (No Docker)
-
-```bash
-# Enable web interface with flag
-ENABLE_WEB_INTERFACE=true PYTHONPATH=src uvicorn src.envs.wildfire_env.server.app:app --reload --host 0.0.0.0 --port 8000
-```
-
-### Web Interface Features
-
-#### Left Pane: Action Interface
-- **Wildfire-specific action form**
-  - Action dropdown: Water (Extinguish Fire), Break (Create Firebreak), Wait (Do Nothing)
-  - Coordinate inputs (X, Y) - auto-populated when clicking grid cells
-  - Coordinates show/hide based on action type
-- **Environment stats display**
-  - Step count
-  - Water remaining
-  - Breaks remaining
-  - Burning cells count
-- **Current state display**
-  - Status (Reset/Running)
-  - Episode ID
-  - Wind direction
-  - Humidity
-- **Control buttons**
-  - Reset Environment
-  - Get State
-
-#### Right Pane: Visual Grid & Logs
-- **Visual 2D Grid Display** 🔥
-  - 16×16 grid rendered as color-coded cells
-  - **Color coding:**
-    - 🟩 **Green** = Fuel (safe, value 1)
-    - 🔥 **Orange/Red** = Burning (fire, value 2)
-    - ⬛ **Dark Gray** = Ash (burned, value 0)
-    - 🟫 **Brown** = Firebreak (value 3)
-    - 🟦 **Blue** = Watered/Damp (value 4)
-  - **Interactive:** Click cells to set coordinates for water/break actions
-  - **Auto-updates:** Grid refreshes automatically via WebSocket
-- **Legend**
-  - Color-coded legend explaining all cell types
-- **Action history**
-  - Log of all actions with timestamps
-  - Shows action, observation, reward, and done status
-
-#### Additional Features
-- **WebSocket connection** - Real-time state updates without page refresh
-- **Instructions panel** - Collapsible environment documentation
-- **Grid status indicator** - Shows grid dimensions and cell count
-
-### Using the Web Interface
-
-1. **Start the server** (see above)
-2. **Open browser** to: `http://localhost:8000/web`
-3. **Click "Reset Environment"** to initialize and display the grid
-4. **Interact with the grid:**
-   - Click on a cell to set coordinates for water/break actions
-   - Or manually enter X, Y coordinates
-5. **Select action:**
-   - Choose `water`, `break`, or `wait` from the dropdown
-6. **Click "Execute Action"**
-7. **Watch the grid update in real-time:**
-   - Fire spreads automatically
-   - Cells change color based on state
-   - Stats update automatically
-8. **Monitor resources** in the stats panel (water, breaks, burning count)
-
----
-
-## 🔧 Troubleshooting
-
-### Common Issues
-
-#### 1. Connection Errors
-
-**Problem:** `ConnectionRefusedError` or `Cannot connect to server`
-
-**Solutions:**
-- Verify server is running: `curl http://localhost:8000/health`
-- Check Docker container: `docker ps | grep wildfire`
-- Ensure port 8000 is not in use: `lsof -i :8000`
-
-#### 2. Index Errors
-
-**Problem:** `IndexError: list index out of range`
-
-**Solution:** Ensure coordinates are within bounds:
-```python
-# Always check bounds before accessing
-if 0 <= x < obs.width and 0 <= y < obs.height:
-    action = WildfireAction(action="water", x=x, y=y)
-```
-
-#### 3. Invalid Action Warnings
-
-**Problem:** Actions returning -0.05 reward repeatedly
-
-**Solutions:**
-- Check `remaining_water` and `remaining_breaks` before using resources
-- Verify coordinates are integers and within grid bounds
-- Use `action="wait"` when resources are exhausted
-
-#### 4. Grid Format Confusion
-
-**Problem:** How to access grid cells?
-
-**Solution:**
-```python
-# Convert flat array to 2D
-grid_2d = np.array(obs.grid).reshape(obs.height, obs.width)
-
-# Access cell at (x, y)
-cell_value = grid_2d[y][x]
-
-# Or use flat index
-index = y * obs.width + x
-cell_value = obs.grid[index]
-```
-
-#### 5. Docker Build Failures
-
-**Problem:** `failed to solve: openenv-base:latest`
-
-**Solution:**
-```bash
-# Build base image first
-docker build -t openenv-base:latest -f src/core/containers/images/Dockerfile .
-
-# Then build wildfire image
-docker build -t wildfire-env:latest -f src/envs/wildfire_env/server/Dockerfile .
-```
-
-### Debugging Tips
-
-1. **Enable verbose logging:**
-   ```bash
-   docker logs -f wildfire-env-container
-   ```
-
-2. **Check environment state:**
-   ```python
-   state = env.state
-   print(f"State: {state}")
-   ```
-
-3. **Validate actions:**
-   ```python
-   obs = env.reset().observation
-   print(f"Bounds: 0 <= x < {obs.width}, 0 <= y < {obs.height}")
-   print(f"Resources: Water={obs.remaining_water}, Breaks={obs.remaining_breaks}")
-   ```
-
-4. **Monitor grid changes:**
-   ```python
-   prev_grid = obs.grid.copy()
-   result = env.step(action)
-   new_grid = result.observation.grid
-   changes = [i for i, (a, b) in enumerate(zip(prev_grid, new_grid)) if a != b]
-   print(f"Changed cells: {len(changes)}")
-   ```
-
----
-
-## 📊 Performance Considerations
-
-### Grid Size Impact
-
-- **Small grids (16×16)**: Fast, good for quick testing
-- **Medium grids (32×32)**: Default, balanced performance
-- **Large grids (64×64+)**: Slower, more realistic but requires more compute
-
-### Resource Limits
-
-- **Low water (4-8)**: Forces strategic decisions
-- **High water (20+)**: More forgiving, easier to succeed
-- **Low breaks (25)**: Emphasizes firebreak placement strategy
-- **High breaks (100+)**: More freedom, less constraint
-
-### Episode Length
-
-- **Short episodes (50 steps)**: Fast iteration, good for debugging
-- **Medium episodes (128 steps)**: Default, balanced
-- **Long episodes (200+ steps)**: Better for complex strategies
-
----
-
-## 🧭 References
-
-### Papers & Research
-
-- **Rothermel Model**: [USDA Forest Service - Surface Fire Spread Model](https://www.fs.fed.us/rm/pubs_series/rmrs/gtr/rmrs_gtr371.pdf)
-- **SimFire**: [MITRE Fireline Project](https://github.com/mitrefireline/simfire)
-- **RL for Wildfires**: [arXiv:2311.15925](https://arxiv.org/abs/2311.15925)
-
-### OpenEnv Framework
-
-- **Main Repository**: [OpenEnv GitHub](https://github.com/openenv)
-- **Documentation**: See `rfcs/` directory for design documents
-- **Other Environments**: See `src/envs/` for more environment examples
-
-### Related Tools
-
-- **FastAPI**: [FastAPI Documentation](https://fastapi.tiangolo.com/)
-- **Reinforcement Learning**: [Spinning Up in Deep RL](https://spinningup.openai.com/)
-- **Docker**: [Docker Documentation](https://docs.docker.com/)
-
----
-
-## 📝 License
-
-This environment is part of the OpenEnv project. See the main LICENSE file for details.
-
----
-
-## 🤝 Contributing
-
-Contributions welcome! Please see `CONTRIBUTING.md` in the main OpenEnv repository.
-
----
-
-## 🔖 Citations
-
-```bibtex
-@techreport{rothermel2022surface,
-  title     = {The Rothermel Surface Fire Spread Model and Associated Developments},
-  author    = {Andrews, Patricia L. and Rothermel, Richard C.},
-  year      = {2022},
-  institution = {USDA Forest Service},
-  number    = {RMRS-GTR-371},
-  url       = {https://www.fs.usda.gov/rm/pubs_series/rmrs/gtr/rmrs_gtr371.pdf}
-}
-
-@article{tapley2023reinforcement,
-  title   = {Reinforcement Learning for Wildfire Mitigation in Simulated Disaster Environments},
-  author  = {Tapley, A. and Dotter, M. and Doyle, M. and others},
-  journal = {arXiv preprint arXiv:2311.15925},
-  year    = {2023},
-  url     = {https://arxiv.org/abs/2311.15925}
-}
-
-@misc{mitrefireline2023simfire,
-  author = {{MITRE Fireline Project}},
-  title  = {SimFire: Wildfire Simulator for Decision-Support and AI Research},
-  year   = {2023},
-  howpublished = {\url{https://github.com/mitrefireline/simfire}}
-}
-
-@misc{wildfire-openenv-2025,
-  title  = {Wildfire Environment for OpenEnv: Containment-Focused RL Simulation},
-  author = {OpenEnv Contributors},
-  year   = {2025},
-  url    = {https://github.com/openenv/openenv}
-}
-```
-
----
-
-**Happy firefighting! 🔥🚒**
+---
+title: Wildfire Environment Server
+emoji: 🔥
+colorFrom: red
+colorTo: blue
+sdk: docker
+pinned: false
+app_port: 8000
+base_path: /web
+tags:
+  - openenv
+  - reinforcement-learning
+  - wildfire
+  - simulation
+---
+
+# 🌲 Wildfire Environment
+
+Autonomous wildfire-control simulation for reinforcement-learning agents, built on the [OpenEnv](https://github.com/openenv) framework.  
+Agents must contain spreading fires using **water**, **firebreaks**, and **timing strategies** under changing **wind** and **humidity** conditions.
+
+[![Docker](https://img.shields.io/badge/docker-ready-blue)](https://hub.docker.com/)
+[![Python](https://img.shields.io/badge/python-3.10+-green)](https://www.python.org/)
+[![FastAPI](https://img.shields.io/badge/backend-fastapi-teal)](https://fastapi.tiangolo.com/)
+[![License](https://img.shields.io/badge/license-MIT-lightgrey)](LICENSE)
+
+---
+
+## 📋 Table of Contents
+
+1. [Why Wildfire Simulation?](#-why-wildfire-simulation)
+2. [Quick Start](#-quick-start)
+3. [Environment Overview](#-environment-overview)
+4. [Grid Format & Encoding](#-grid-format--encoding)
+5. [Actions](#-actions)
+6. [Observations](#-observations)
+7. [Reward Structure](#-reward-structure)
+8. [Fire Spread Mechanics](#-fire-spread-mechanics)
+9. [Configuration](#-configuration)
+10. [Installation & Usage](#-installation--usage)
+11. [API Reference](#-api-reference)
+12. [Examples](#-examples)
+13. [Web Interface](#-web-interface)
+14. [Troubleshooting](#-troubleshooting)
+15. [References](#-references)
+
+---
+
+## 🔥 Why Wildfire Simulation?
+
+Wildland fires are intensifying globally due to climate change — increasing the urgency for **AI-assisted decision-making**.  
+This environment explores how intelligent systems can **control** fire spread in real time, under limited resources.
+
+### Research Motivation
+✅ Based on real wildfire science inspired by:
+- **Rothermel Surface Fire Spread Model** (USDA Forest Service)
+- **MITRE Fireline's SimFire** — physics-informed RL fire simulator
+- **SimHarness** — RL evaluation for disaster response
+
+### Application Goals
+| Research Theme | Role in This Environment |
+|---|---|
+| Resource-Constrained Planning | Finite water + firebreak budgets |
+| Fire Spread + Containment Strategy | Directional wind & moisture effects |
+| Disaster Response RL | Safety-focused reward design |
+| LLM Agents for Control Tasks | Text-based action decision making |
+
+This makes WildfireEnv a **fast, controllable**, and **open benchmark** for applied RL and LLM reasoning.
+
+---
+
+## 🚀 Quick Start
+
+### Using Docker (Recommended)
+
+```bash
+# Build base image (first time only)
+docker build -t openenv-base:latest -f src/core/containers/images/Dockerfile .
+
+# Build wildfire environment
+docker build -t wildfire-env:latest -f src/envs/wildfire_env/server/Dockerfile .
+
+# Run container
+docker run -p 8000:8000 -e ENABLE_WEB_INTERFACE=true wildfire-env:latest
+```
+
+**Note:** The web interface can be enabled with `ENABLE_WEB_INTERFACE=true`. Access it at `http://localhost:8000/web` when enabled.
+
+### Basic Python Client
+
+```python
+from envs.wildfire_env import WildfireEnv, WildfireAction
+
+# Connect to running server
+env = WildfireEnv(base_url="http://localhost:8000")
+
+# Reset environment
+result = env.reset()
+obs = result.observation
+print(f"Grid: {obs.width}x{obs.height}, Fires: {obs.burning_count}, Water: {obs.remaining_water}")
+
+# Take action (water a burning cell)
+result = env.step(WildfireAction(action="water", x=10, y=15))
+print(f"Reward: {result.reward:.2f}, Burning: {result.observation.burning_count}")
+
+# Create firebreak
+result = env.step(WildfireAction(action="break", x=12, y=15))
+
+# Wait (fire spreads)
+result = env.step(WildfireAction(action="wait"))
+
+env.close()
+```
+
+---
+
+## 🔥 Environment Overview
+
+This environment models **forest-fire dynamics** influenced by:
+- **Wind direction** (8 directions + calm) - accelerates fire spread in wind direction
+- **Humidity** (0.0-1.0) - suppresses ignition probability
+- **Fuel type and spread rate** - vegetation burns and spreads to neighbors
+- **Limited resources** (water units, break materials) - strategic resource management
+- **Time pressure** (each step costs small reward penalty)
+
+The goal is to **minimize fire spread** and **total burned area** while using resources efficiently.
+
+### Episode Termination
+
+An episode ends when:
+- **All fires are extinguished** (`burning_count == 0`) - **Success!** 
+- **Maximum steps reached** (`step_count >= max_steps`) - Time limit exceeded
+
+---
+
+## 🧱 Grid Format & Encoding
+
+### Grid Structure
+
+The grid is returned as a **flat 1D array** in the observation. To access cell at position `(x, y)`:
+
+```python
+index = y * width + x
+cell_value = observation.grid[index]
+```
+
+**Example:** For a 32×32 grid, cell at (10, 15):
+```python
+index = 15 * 32 + 10  # = 490
+cell_value = observation.grid[490]
+```
+
+### Cell Encoding
+
+| Code | Meaning        | Color (Visualization) | Behavior |
+|------|----------------|-----------------------|----------|
+| `0`  | Ash (burned)   | Black ⚫              | Burned out, cannot reignite |
+| `1`  | Fuel           | Green 🟩              | Healthy vegetation, can ignite |
+| `2`  | Burning        | Red 🔥                | Currently on fire, spreads to neighbors |
+| `3`  | Firebreak      | Brown 🟫              | Barrier, fire cannot cross |
+| `4`  | Water/Damp     | Blue 🔵               | Dampened, immune to ignition temporarily |
+
+### Grid Visualization Example
+
+```python
+import numpy as np
+
+obs = env.reset().observation
+grid_2d = np.array(obs.grid).reshape(obs.height, obs.width)
+
+# Now grid_2d[y][x] gives the cell value at position (x, y)
+print(grid_2d[15][10])  # Cell at x=10, y=15
+```
+
+---
+
+## 🎮 Actions
+
+### Action Types
+
+#### 1. `water` - Apply Water
+**Extinguishes burning cells and dampens fuel to prevent ignition.**
+
+```python
+WildfireAction(action="water", x=10, y=15)
+```
+
+**Effects:**
+- **Burning cell (2)**: Extinguishes → becomes Water/Damp (4), gives **+0.25 reward**
+- **Fuel cell (1)**: Dampens → becomes Water/Damp (4), gives **-0.10 reward** (preventive, slight penalty)
+- **Water/Damp cell (4)**: Redundant watering, gives **-0.05 reward**
+- **Ash/Break (0, 3)**: Wasteful, gives **-0.05 reward**
+
+**Resource Cost:** 1 water unit per action  
+**Requires:** `remaining_water > 0` and valid coordinates
+
+**Best Use:** Extinguish active fires before they spread
+
+---
+
+#### 2. `break` - Create Firebreak
+**Builds a fire-resistant barrier that stops fire spread.**
+
+```python
+WildfireAction(action="break", x=12, y=15)
+```
+
+**Effects:**
+- **Fuel/Water cell (1, 4)**: Creates firebreak → becomes Firebreak (3), gives **+0.15 reward**
+- **Burning cell (2)**: Extinguishes → becomes Firebreak (3), gives **-0.02 reward** (less effective than water)
+- **Firebreak (3)**: Redundant, gives **-0.01 reward**
+- **Ash (0)**: Wasteful, gives **-0.02 reward**
+
+**Resource Cost:** 1 firebreak material per action  
+**Requires:** `remaining_breaks > 0` and valid coordinates
+
+**Best Use:** Create barriers ahead of fire front to contain spread
+
+---
+
+#### 3. `wait` - Do Nothing
+**Let natural fire dynamics occur (fire spreads).**
+
+```python
+WildfireAction(action="wait")
+```
+
+**Effects:**
+- No resource cost
+- No coordinate required
+- Fire spreads naturally to neighboring cells
+- Small time penalty (-0.01 reward per step)
+
+**Best Use:** When fire is contained, waiting for it to burn out
+
+---
+
+### Invalid Actions
+
+Actions that fail (give **-0.05 reward**):
+- Invalid coordinates (out of bounds)
+- Using water when `remaining_water == 0`
+- Using break when `remaining_breaks == 0`
+- Missing required coordinates for water/break actions
+
+---
+
+## 👁️ Observations
+
+### `WildfireObservation`
+
+Returned after every `reset()` or `step()`:
+
+```python
+@dataclass
+class WildfireObservation(Observation):
+    grid: List[int]          # Flat array: [1,1,2,1,...] length = width × height
+    width: int               # Grid width (default: 32)
+    height: int              # Grid height (default: 32)
+    step: int                # Current step number (0 at reset)
+    wind_dir: str            # "N", "NE", "E", "SE", "S", "SW", "W", "NW", "CALM"
+    humidity: float          # [0.0, 1.0] - higher = less fire spread
+    burning_count: int       # Number of cells currently on fire
+    burned_count: int        # Total number of ash cells (cumulative)
+    remaining_water: int     # Water units left
+    remaining_breaks: int    # Firebreak materials left
+    reward_hint: float       # Shaping reward (for debugging)
+    done: bool               # Episode ended?
+    reward: float            # Step reward
+```
+
+### Example Observation
+
+```python
+result = env.reset()
+obs = result.observation
+
+print(f"Step: {obs.step}")                    # 0
+print(f"Grid size: {obs.width}x{obs.height}") # 32x32
+print(f"Grid cells: {len(obs.grid)}")         # 1024
+print(f"Active fires: {obs.burning_count}")   # 2
+print(f"Wind: {obs.wind_dir}")                # "NE"
+print(f"Humidity: {obs.humidity:.2f}")        # 0.24
+print(f"Water left: {obs.remaining_water}")   # 8
+print(f"Breaks left: {obs.remaining_breaks}") # 50
+```
+
+---
+
+## 💰 Reward Structure
+
+### Step Rewards
+
+| Action | Condition | Reward |
+|--------|-----------|--------|
+| **Water burning cell** | Extinguishes fire | **+0.25** |
+| **Water fuel cell** | Preventive dampening | **-0.10** |
+| **Create firebreak** | From fuel/water | **+0.15** |
+| **Fire spreads** | Each new burning cell | **-0.15 per cell** |
+| **Fire shrinks** | Each extinguished cell | **+0.10 per cell** |
+| **New burned area** | Each cell turns to ash | **-0.05 per cell** |
+| **Time penalty** | Every step | **-0.01** |
+| **Invalid action** | Out of bounds, no resources | **-0.05** |
+| **Redundant action** | Watering already damp cell | **-0.05** |
+
+### Episode End Bonuses
+
+When episode terminates (`done == True`):
+
+- **Fire contained** (`burning_count == 0`):
+  - **+0.5** base bonus
+  - **+0.5 × saved_ratio** bonus (proportion of cells not burned)
+
+- **Fallback reward**:
+  - **+0.2 × (1.0 - burned_ratio)** bonus
+
+**Example:** Perfect containment (no burned cells):
+```python
+Reward = +0.5 + 0.5 × 1.0 = +1.0
+```
+
+### Reward Interpretation
+
+- **Positive rewards**: Good containment actions, extinguishing fires
+- **Negative rewards**: Fire spread, resource waste, time penalty
+- **Goal**: Maximize cumulative reward = minimize fire damage
+
+---
+
+## 🌪️ Fire Spread Mechanics
+
+### Spread Model
+
+Fire spreads using an **8-directional neighbor model**:
+
+1. **Burning cells persist** for `burn_lifetime = 3` ticks before turning to ash
+2. Each burning cell can ignite **neighboring fuel cells** (8 directions)
+3. Spread probability depends on:
+   - **Base ignition probability**: `0.30` (30% chance)
+   - **Humidity factor**: `(1.0 - humidity)` - higher humidity = less spread
+   - **Wind multiplier**: 
+     - **+2.0x** in wind direction
+     - **+0.5x** against wind
+     - **+1.0x** perpendicular
+   - **Diagonal factor**: `0.6x` for diagonal neighbors (slower spread)
+
+4. **Water/Damp cells (4)** are **immune** to ignition while damp
+5. **Firebreaks (3)** **cannot** be crossed by fire
+6. **Ash cells (0)** cannot reignite
+
+### Wind Effects
+
+| Wind Direction | Effect on Fire Spread |
+|----------------|----------------------|
+| **In wind direction** | 2× faster ignition probability |
+| **Against wind** | 0.5× slower ignition probability |
+| **Perpendicular** | Normal (1×) ignition probability |
+| **CALM** | No directional bias |
+
+### Water Dampening Duration
+
+Watered cells (4) remain damp for **6 ticks** before reverting to fuel (1).
+
+### Example Fire Spread
+
+```
+Step 0:     Step 1:     Step 2:
+🟩🟩🟩      🟩🟥🟩      🟫🟥🟫
+🟩🟥🟩  →   🟥🟥🟥  →   🟥🟥🟥  (Wind: E, spreading east)
+🟩🟩🟩      🟩🟥🟩      🟫🟥🟫
+```
+
+---
+
+## ⚙️ Configuration
+
+### Environment Variables
+
+Set these **before starting the server**:
+
+| Variable | Description | Default | Range |
+|-----------|-------------|---------|-------|
+| `WILDFIRE_WIDTH` | Grid width in cells | `32` | 8-128 |
+| `WILDFIRE_HEIGHT` | Grid height in cells | `32` | 8-128 |
+| `WILDFIRE_HUMIDITY` | Initial humidity level | `0.25` | 0.0-1.0 |
+| `WILDFIRE_WIND` | Wind direction (fixed) | Random | `N`, `NE`, `E`, `SE`, `S`, `SW`, `W`, `NW`, `CALM` |
+| `WILDFIRE_SEED` | Random seed | `3407` | Any integer |
+| `WILDFIRE_MAX_STEPS` | Max steps per episode | `128` | 10-1000 |
+| `WILDFIRE_WATER_CAPACITY` | Initial water units | `8` | 1-100 |
+| `WILDFIRE_BREAK_CAPACITY` | Initial firebreak materials | `50` | 1-200 |
+
+### Python API Configuration
+
+```python
+from envs.wildfire_env.server.wildfire_environment import WildfireEnvironment
+
+env = WildfireEnvironment(
+    width=64,
+    height=64,
+    humidity=0.3,
+    init_sources=3,          # Number of initial fires
+    max_steps=200,
+    water_capacity=10,
+    break_capacity=75,
+    seed=42
+)
+```
+
+### Docker Configuration
+
+```bash
+docker run -p 8000:8000 \
+  -e WILDFIRE_WIDTH=64 \
+  -e WILDFIRE_HEIGHT=64 \
+  -e WILDFIRE_HUMIDITY=0.4 \
+  -e WILDFIRE_WIND=N \
+  -e WILDFIRE_WATER_CAPACITY=12 \
+  wildfire-env:latest
+```
+
+### Custom Configuration
+
+```bash
+# Build and run with custom configuration
+docker build -t openenv-base:latest -f src/core/containers/images/Dockerfile .
+docker build -t wildfire-env:latest -f src/envs/wildfire_env/server/Dockerfile .
+docker run -p 8000:8000 \
+  -e ENABLE_WEB_INTERFACE=true \
+  -e WILDFIRE_WIDTH=64 \
+  -e WILDFIRE_HEIGHT=64 \
+  -e WILDFIRE_HUMIDITY=0.5 \
+  wildfire-env:latest
+```
+
+---
+
+## 🚀 Installation & Usage
+
+### Option 1: Docker (Recommended)
+
+**Manual setup:**
+```bash
+# Build base image (first time only)
+docker build -t openenv-base:latest -f src/core/containers/images/Dockerfile .
+
+# Build wildfire environment
+docker build -t wildfire-env:latest -f src/envs/wildfire_env/server/Dockerfile .
+
+# Run container
+docker run -p 8000:8000 -e ENABLE_WEB_INTERFACE=true wildfire-env:latest
+```
+
+This approach:
+- Builds the base image if needed
+- Rebuilds the wildfire image
+- Starts the container
+- Shows logs in real-time
+
+**Alternative: Using build_docker.sh script:**
+```bash
+# Build base image (first time only)
+docker build -t openenv-base:latest -f src/core/containers/images/Dockerfile .
+
+# Build wildfire environment using the script
+cd src/envs/wildfire_env/server
+./build_docker.sh
+
+# Run container
+docker run -d -p 8000:8000 --name wildfire-env-container wildfire-env:latest
+
+# View logs
+docker logs -f wildfire-env-container
+
+# Stop container
+docker stop wildfire-env-container
+
+# Remove container
+docker rm wildfire-env-container
+```
+
+### Option 2: Local Development (No Docker)
+
+**Requirements:**
+```bash
+pip install fastapi uvicorn numpy matplotlib requests
+```
+
+**Run server:**
+```bash
+# From OpenEnv root directory
+python -m envs.wildfire_env.server.app
+```
+
+**Or with environment variables:**
+```bash
+WILDFIRE_WIDTH=64 WILDFIRE_HUMIDITY=0.3 python -m envs.wildfire_env.server.app
+```
+
+---
+
+## 📚 API Reference
+
+### Client Class
+
+```python
+from envs.wildfire_env import WildfireEnv
+
+# Connect to existing server
+env = WildfireEnv(base_url="http://localhost:8000")
+
+# Or create from Docker image
+env = WildfireEnv.from_docker_image("wildfire-env:latest")
+```
+
+### Methods
+
+#### `reset() -> StepResult[WildfireObservation]`
+
+Resets the environment to initial state.
+
+```python
+result = env.reset()
+obs = result.observation
+print(f"New episode: {obs.step == 0}")
+```
+
+#### `step(action: WildfireAction) -> StepResult[WildfireObservation]`
+
+Takes an action and returns new observation.
+
+```python
+action = WildfireAction(action="water", x=10, y=15)
+result = env.step(action)
+print(f"Reward: {result.reward}, Done: {result.done}")
+```
+
+#### `state -> WildfireState`
+
+Access current environment state.
+
+```python
+state = env.state
+print(f"Episode ID: {state.episode_id}")
+print(f"Total burned: {state.total_burned}")
+print(f"Total extinguished: {state.total_extinguished}")
+```
+
+#### `close()`
+
+Closes the connection (for HTTP clients, this is a no-op but good practice).
+
+```python
+env.close()
+```
+
+### Data Classes
+
+#### `WildfireAction`
+
+```python
+@dataclass
+class WildfireAction(Action):
+    action: str              # "water" | "break" | "wait"
+    x: Optional[int] = None  # Target X coordinate (required for water/break)
+    y: Optional[int] = None  # Target Y coordinate (required for water/break)
+```
+
+**Examples:**
+```python
+WildfireAction(action="water", x=10, y=15)
+WildfireAction(action="break", x=12, y=15)
+WildfireAction(action="wait")  # x, y not needed
+```
+
+#### `WildfireObservation`
+
+See [Observations](#-observations) section for full details.
+
+#### `WildfireState`
+
+```python
+@dataclass
+class WildfireState(State):
+    episode_id: str
+    step_count: int
+    total_burned: int
+    total_extinguished: int
+    last_action: str
+    width: int
+    height: int
+    wind_dir: str
+    humidity: float
+    remaining_water: int
+    remaining_breaks: int
+    grid: List[int]
+    burn_timers: List[int]
+```
+
+---
+
+## 📖 Examples
+
+### Example 1: Simple Containment Strategy
+
+```python
+from envs.wildfire_env import WildfireEnv, WildfireAction
+import numpy as np
+
+env = WildfireEnv(base_url="http://localhost:8000")
+result = env.reset()
+obs = result.observation
+
+grid_2d = np.array(obs.grid).reshape(obs.height, obs.width)
+total_reward = 0
+
+while not result.done:
+    # Find burning cells
+    burning_indices = np.where(grid_2d == 2)
+    
+    if len(burning_indices[0]) > 0 and obs.remaining_water > 0:
+        # Water the first burning cell
+        y, x = burning_indices[0][0], burning_indices[1][0]
+        action = WildfireAction(action="water", x=int(x), y=int(y))
+    else:
+        # Wait if no water or no fires
+        action = WildfireAction(action="wait")
+    
+    result = env.step(action)
+    obs = result.observation
+    total_reward += result.reward or 0
+    
+    # Update grid
+    grid_2d = np.array(obs.grid).reshape(obs.height, obs.width)
+    
+    print(f"Step {obs.step}: Burning={obs.burning_count}, Reward={result.reward:.3f}")
+
+print(f"\nEpisode ended. Total reward: {total_reward:.2f}")
+print(f"Final stats: Burned={obs.burned_count}, Extinguished={env.state.total_extinguished}")
+env.close()
+```
+
+### Example 2: Firebreak Strategy
+
+```python
+from envs.wildfire_env import WildfireEnv, WildfireAction
+import numpy as np
+
+env = WildfireEnv(base_url="http://localhost:8000")
+result = env.reset()
+obs = result.observation
+
+def create_firebreak_barrier(obs, env):
+    """Create firebreak ahead of fire front based on wind direction."""
+    grid_2d = np.array(obs.grid).reshape(obs.height, obs.width)
+    wind = obs.wind_dir
+    
+    # Find burning cells
+    burning_y, burning_x = np.where(grid_2d == 2)
+    
+    if len(burning_x) == 0 or obs.remaining_breaks == 0:
+        return WildfireAction(action="wait")
+    
+    # Calculate fire front position
+    if wind == "E":
+        target_x = int(np.max(burning_x)) + 2  # Ahead of easternmost fire
+        target_y = int(np.mean(burning_y))
+    elif wind == "W":
+        target_x = int(np.min(burning_x)) - 2
+        target_y = int(np.mean(burning_y))
+    elif wind == "N":
+        target_x = int(np.mean(burning_x))
+        target_y = int(np.min(burning_y)) - 2
+    elif wind == "S":
+        target_x = int(np.mean(burning_x))
+        target_y = int(np.max(burning_y)) + 2
+    else:
+        # Fallback: water nearest burning cell
+        return WildfireAction(action="water", x=int(burning_x[0]), y=int(burning_y[0]))
+    
+    # Ensure within bounds
+    target_x = max(0, min(obs.width - 1, target_x))
+    target_y = max(0, min(obs.height - 1, target_y))
+    
+    return WildfireAction(action="break", x=target_x, y=target_y)
+
+total_reward = 0
+while not result.done:
+    action = create_firebreak_barrier(obs, env)
+    result = env.step(action)
+    obs = result.observation
+    total_reward += result.reward or 0
+    
+    if obs.step % 10 == 0:
+        print(f"Step {obs.step}: Fires={obs.burning_count}, Water={obs.remaining_water}, Breaks={obs.remaining_breaks}")
+
+env.close()
+```
+
+### Example 3: Visualization with Matplotlib
+
+```python
+import matplotlib.pyplot as plt
+import numpy as np
+import matplotlib.colors as mcolors
+from envs.wildfire_env import WildfireEnv, WildfireAction
+
+env = WildfireEnv(base_url="http://localhost:8000")
+result = env.reset()
+obs = result.observation
+
+# Setup colormap
+cmap = mcolors.ListedColormap([
+    "black",         # 0 = ash
+    "green",         # 1 = fuel
+    "red",           # 2 = burning
+    "saddlebrown",   # 3 = firebreak
+    "blue"           # 4 = water
+])
+norm = mcolors.BoundaryNorm([0, 1, 2, 3, 4, 5], cmap.N)
+
+fig, ax = plt.subplots(figsize=(8, 8))
+plt.ion()
+
+for step in range(50):
+    if result.done:
+        break
+    
+    # Render grid
+    grid_2d = np.array(obs.grid).reshape(obs.height, obs.width)
+    ax.clear()
+    ax.imshow(grid_2d, cmap=cmap, norm=norm, interpolation='nearest')
+    ax.set_title(
+        f"Step {obs.step} | Fires: {obs.burning_count} | Burned: {obs.burned_count}\n"
+        f"Wind: {obs.wind_dir} | Humidity: {obs.humidity:.2f} | "
+        f"Water: {obs.remaining_water} | Breaks: {obs.remaining_breaks}"
+    )
+    plt.pause(0.1)
+    
+    # Take action (simple: water first burning cell)
+    if obs.burning_count > 0 and obs.remaining_water > 0:
+        burning_indices = np.where(grid_2d == 2)
+        if len(burning_indices[0]) > 0:
+            y, x = burning_indices[0][0], burning_indices[1][0]
+            action = WildfireAction(action="water", x=int(x), y=int(y))
+        else:
+            action = WildfireAction(action="wait")
+    else:
+        action = WildfireAction(action="wait")
+    
+    result = env.step(action)
+    obs = result.observation
+
+plt.ioff()
+plt.show()
+env.close()
+```
+
+### Example 4: Training Loop for RL
+
+```python
+from envs.wildfire_env import WildfireEnv, WildfireAction
+import random
+
+env = WildfireEnv(base_url="http://localhost:8000")
+
+num_episodes = 10
+episode_rewards = []
+
+for episode in range(num_episodes):
+    result = env.reset()
+    obs = result.observation
+    episode_reward = 0
+    episode_steps = 0
+    
+    while not result.done:
+        # Random policy (replace with your RL agent)
+        if random.random() < 0.4 and obs.remaining_water > 0:
+            action = WildfireAction(
+                action="water",
+                x=random.randint(0, obs.width - 1),
+                y=random.randint(0, obs.height - 1)
+            )
+        elif random.random() < 0.3 and obs.remaining_breaks > 0:
+            action = WildfireAction(
+                action="break",
+                x=random.randint(0, obs.width - 1),
+                y=random.randint(0, obs.height - 1)
+            )
+        else:
+            action = WildfireAction(action="wait")
+        
+        result = env.step(action)
+        obs = result.observation
+        episode_reward += result.reward or 0
+        episode_steps += 1
+    
+    episode_rewards.append(episode_reward)
+    state = env.state
+    print(
+        f"Episode {episode + 1}: "
+        f"Reward={episode_reward:.2f}, "
+        f"Steps={episode_steps}, "
+        f"Burned={state.total_burned}, "
+        f"Extinguished={state.total_extinguished}"
+    )
+
+print(f"\nAverage reward: {sum(episode_rewards) / len(episode_rewards):.2f}")
+env.close()
+```
+
+---
+
+## 🌐 Web Interface
+
+The Wildfire Environment includes a **custom web interface** with visual grid display and wildfire-specific features.
+
+### Accessing the Web Interface
+
+#### Using Docker
+
+```bash
+# Build base image (first time only)
+docker build -t openenv-base:latest -f src/core/containers/images/Dockerfile .
+
+# Build wildfire environment
+docker build -t wildfire-env:latest -f src/envs/wildfire_env/server/Dockerfile .
+
+# Run container
+docker run -p 8000:8000 -e ENABLE_WEB_INTERFACE=true wildfire-env:latest
+```
+
+Then open: `http://localhost:8000/web`
+
+#### Local Testing (No Docker)
+
+```bash
+# Enable web interface with flag
+ENABLE_WEB_INTERFACE=true PYTHONPATH=src uvicorn src.envs.wildfire_env.server.app:app --reload --host 0.0.0.0 --port 8000
+```
+
+### Web Interface Features
+
+#### Left Pane: Action Interface
+- **Wildfire-specific action form**
+  - Action dropdown: Water (Extinguish Fire), Break (Create Firebreak), Wait (Do Nothing)
+  - Coordinate inputs (X, Y) - auto-populated when clicking grid cells
+  - Coordinates show/hide based on action type
+- **Environment stats display**
+  - Step count
+  - Water remaining
+  - Breaks remaining
+  - Burning cells count
+- **Current state display**
+  - Status (Reset/Running)
+  - Episode ID
+  - Wind direction
+  - Humidity
+- **Control buttons**
+  - Reset Environment
+  - Get State
+
+#### Right Pane: Visual Grid & Logs
+- **Visual 2D Grid Display** 🔥
+  - 16×16 grid rendered as color-coded cells
+  - **Color coding:**
+    - 🟩 **Green** = Fuel (safe, value 1)
+    - 🔥 **Orange/Red** = Burning (fire, value 2)
+    - ⬛ **Dark Gray** = Ash (burned, value 0)
+    - 🟫 **Brown** = Firebreak (value 3)
+    - 🟦 **Blue** = Watered/Damp (value 4)
+  - **Interactive:** Click cells to set coordinates for water/break actions
+  - **Auto-updates:** Grid refreshes automatically via WebSocket
+- **Legend**
+  - Color-coded legend explaining all cell types
+- **Action history**
+  - Log of all actions with timestamps
+  - Shows action, observation, reward, and done status
+
+#### Additional Features
+- **WebSocket connection** - Real-time state updates without page refresh
+- **Instructions panel** - Collapsible environment documentation
+- **Grid status indicator** - Shows grid dimensions and cell count
+
+### Using the Web Interface
+
+1. **Start the server** (see above)
+2. **Open browser** to: `http://localhost:8000/web`
+3. **Click "Reset Environment"** to initialize and display the grid
+4. **Interact with the grid:**
+   - Click on a cell to set coordinates for water/break actions
+   - Or manually enter X, Y coordinates
+5. **Select action:**
+   - Choose `water`, `break`, or `wait` from the dropdown
+6. **Click "Execute Action"**
+7. **Watch the grid update in real-time:**
+   - Fire spreads automatically
+   - Cells change color based on state
+   - Stats update automatically
+8. **Monitor resources** in the stats panel (water, breaks, burning count)
+
+---
+
+## 🔧 Troubleshooting
+
+### Common Issues
+
+#### 1. Connection Errors
+
+**Problem:** `ConnectionRefusedError` or `Cannot connect to server`
+
+**Solutions:**
+- Verify server is running: `curl http://localhost:8000/health`
+- Check Docker container: `docker ps | grep wildfire`
+- Ensure port 8000 is not in use: `lsof -i :8000`
+
+#### 2. Index Errors
+
+**Problem:** `IndexError: list index out of range`
+
+**Solution:** Ensure coordinates are within bounds:
+```python
+# Always check bounds before accessing
+if 0 <= x < obs.width and 0 <= y < obs.height:
+    action = WildfireAction(action="water", x=x, y=y)
+```
+
+#### 3. Invalid Action Warnings
+
+**Problem:** Actions returning -0.05 reward repeatedly
+
+**Solutions:**
+- Check `remaining_water` and `remaining_breaks` before using resources
+- Verify coordinates are integers and within grid bounds
+- Use `action="wait"` when resources are exhausted
+
+#### 4. Grid Format Confusion
+
+**Problem:** How to access grid cells?
+
+**Solution:**
+```python
+# Convert flat array to 2D
+grid_2d = np.array(obs.grid).reshape(obs.height, obs.width)
+
+# Access cell at (x, y)
+cell_value = grid_2d[y][x]
+
+# Or use flat index
+index = y * obs.width + x
+cell_value = obs.grid[index]
+```
+
+#### 5. Docker Build Failures
+
+**Problem:** `failed to solve: openenv-base:latest`
+
+**Solution:**
+```bash
+# Build base image first
+docker build -t openenv-base:latest -f src/core/containers/images/Dockerfile .
+
+# Then build wildfire image
+docker build -t wildfire-env:latest -f src/envs/wildfire_env/server/Dockerfile .
+```
+
+### Debugging Tips
+
+1. **Enable verbose logging:**
+   ```bash
+   docker logs -f wildfire-env-container
+   ```
+
+2. **Check environment state:**
+   ```python
+   state = env.state
+   print(f"State: {state}")
+   ```
+
+3. **Validate actions:**
+   ```python
+   obs = env.reset().observation
+   print(f"Bounds: 0 <= x < {obs.width}, 0 <= y < {obs.height}")
+   print(f"Resources: Water={obs.remaining_water}, Breaks={obs.remaining_breaks}")
+   ```
+
+4. **Monitor grid changes:**
+   ```python
+   prev_grid = obs.grid.copy()
+   result = env.step(action)
+   new_grid = result.observation.grid
+   changes = [i for i, (a, b) in enumerate(zip(prev_grid, new_grid)) if a != b]
+   print(f"Changed cells: {len(changes)}")
+   ```
+
+---
+
+## 📊 Performance Considerations
+
+### Grid Size Impact
+
+- **Small grids (16×16)**: Fast, good for quick testing
+- **Medium grids (32×32)**: Default, balanced performance
+- **Large grids (64×64+)**: Slower, more realistic but requires more compute
+
+### Resource Limits
+
+- **Low water (4-8)**: Forces strategic decisions
+- **High water (20+)**: More forgiving, easier to succeed
+- **Low breaks (25)**: Emphasizes firebreak placement strategy
+- **High breaks (100+)**: More freedom, less constraint
+
+### Episode Length
+
+- **Short episodes (50 steps)**: Fast iteration, good for debugging
+- **Medium episodes (128 steps)**: Default, balanced
+- **Long episodes (200+ steps)**: Better for complex strategies
+
+---
+
+## 🧭 References
+
+### Papers & Research
+
+- **Rothermel Model**: [USDA Forest Service - Surface Fire Spread Model](https://www.fs.fed.us/rm/pubs_series/rmrs/gtr/rmrs_gtr371.pdf)
+- **SimFire**: [MITRE Fireline Project](https://github.com/mitrefireline/simfire)
+- **RL for Wildfires**: [arXiv:2311.15925](https://arxiv.org/abs/2311.15925)
+
+### OpenEnv Framework
+
+- **Main Repository**: [OpenEnv GitHub](https://github.com/openenv)
+- **Documentation**: See `rfcs/` directory for design documents
+- **Other Environments**: See `src/envs/` for more environment examples
+
+### Related Tools
+
+- **FastAPI**: [FastAPI Documentation](https://fastapi.tiangolo.com/)
+- **Reinforcement Learning**: [Spinning Up in Deep RL](https://spinningup.openai.com/)
+- **Docker**: [Docker Documentation](https://docs.docker.com/)
+
+---
+
+## 📝 License
+
+This environment is part of the OpenEnv project. See the main LICENSE file for details.
+
+---
+
+## 🤝 Contributing
+
+Contributions welcome! Please see `CONTRIBUTING.md` in the main OpenEnv repository.
+
+---
+
+## 🔖 Citations
+
+```bibtex
+@techreport{rothermel2022surface,
+  title     = {The Rothermel Surface Fire Spread Model and Associated Developments},
+  author    = {Andrews, Patricia L. and Rothermel, Richard C.},
+  year      = {2022},
+  institution = {USDA Forest Service},
+  number    = {RMRS-GTR-371},
+  url       = {https://www.fs.usda.gov/rm/pubs_series/rmrs/gtr/rmrs_gtr371.pdf}
+}
+
+@article{tapley2023reinforcement,
+  title   = {Reinforcement Learning for Wildfire Mitigation in Simulated Disaster Environments},
+  author  = {Tapley, A. and Dotter, M. and Doyle, M. and others},
+  journal = {arXiv preprint arXiv:2311.15925},
+  year    = {2023},
+  url     = {https://arxiv.org/abs/2311.15925}
+}
+
+@misc{mitrefireline2023simfire,
+  author = {{MITRE Fireline Project}},
+  title  = {SimFire: Wildfire Simulator for Decision-Support and AI Research},
+  year   = {2023},
+  howpublished = {\url{https://github.com/mitrefireline/simfire}}
+}
+
+@misc{wildfire-openenv-2025,
+  title  = {Wildfire Environment for OpenEnv: Containment-Focused RL Simulation},
+  author = {OpenEnv Contributors},
+  year   = {2025},
+  url    = {https://github.com/openenv/openenv}
+}
+```
+
+---
+
+**Happy firefighting! 🔥🚒**

__init__.py

@@ -0,0 +1,9 @@
+from .models import WildfireAction, WildfireObservation, WildfireState
+from .client import WildfireEnv
+
+__all__ = [
+    "WildfireAction",
+    "WildfireObservation",
+    "WildfireState",
+    "WildfireEnv",
+]

client.py

@@ -0,0 +1,37 @@
+# Support both in-repo and standalone imports
+try:
+    # In-repo imports (when running from OpenEnv repository)
+    from core.http_env_client import HTTPEnvClient
+    from core.client_types import StepResult
+    from .models import WildfireAction, WildfireObservation, WildfireState
+except ImportError:
+    # Standalone imports (when environment is standalone with openenv-core from pip)
+    from openenv_core.http_env_client import HTTPEnvClient
+    from openenv_core.client_types import StepResult
+    from wildfire_env.models import WildfireAction, WildfireObservation, WildfireState
+
+class WildfireEnv(HTTPEnvClient[WildfireAction, WildfireObservation]):
+    def _step_payload(self, action: WildfireAction) -> dict:
+        return {"action": action.action, "x": action.x, "y": action.y}
+
+    def _parse_result(self, payload: dict) -> StepResult[WildfireObservation]:
+        obs = WildfireObservation(**payload["observation"])
+        return StepResult(
+            observation=obs,
+            reward=payload.get("reward"),
+            done=payload.get("done", False),
+        )
+
+    def _parse_state(self, payload: dict) -> WildfireState:
+        return WildfireState(**payload)
+
+
+def render_grid(obs: WildfireObservation) -> str:
+    legend = {0:"⬛", 1:"🟩", 2:"🟥", 3:"🟫", 4:"🟦"}
+    w, h = obs.width, obs.height
+    g = obs.grid
+    rows = []
+    for y in range(h):
+        rows.append("".join(legend.get(g[y*w+x], "?") for x in range(w)))
+    meta = f"step={obs.step} wind={obs.wind_dir} hum={obs.humidity:.2f} burning={obs.burning_count} burned={obs.burned_count}"
+    return "\n".join(rows + [meta])

models.py

@@ -0,0 +1,54 @@
+from dataclasses import dataclass, field
+from typing import List, Optional
+
+# Support both in-repo and standalone imports
+try:
+    # In-repo imports (when running from OpenEnv repository)
+    from openenv.core.env_server import Action, Observation, State
+except ImportError:
+    # Standalone imports (when environment is standalone with openenv-core from pip)
+    from openenv_core.env_server import Action, Observation, State
+
+# Grid cell encoding:
+# 0 = empty/ash, 1 = fuel (healthy), 2 = burning, 3 = firebreak, 4 = watered (damp)
+# (You can tweak encodings, but keep them ints for compact obs.)
+
+@dataclass
+class WildfireAction(Action):
+    # action: "break" (build firebreak), "water" (drop water), "wait"
+    action: str
+    x: Optional[int] = None
+    y: Optional[int] = None
+
+@dataclass
+class WildfireObservation(Observation):
+    grid: List[int]                 # flattened grid H*W, ints in {0..4}
+    width: int
+    height: int
+    step: int
+    wind_dir: str                   # e.g. "N","NE","E","SE","S","SW","W","NW","CALM"
+    humidity: float                 # [0,1]
+    burning_count: int
+    burned_count: int               # total ash (0) cells (cumulative)
+    reward_hint: float = 0.0        # optional shaping info
+    remaining_water: int = 0
+    remaining_breaks: int = 0
+
+@dataclass
+class WildfireState(State):
+    episode_id: str = ""
+    step_count: int = 0
+    total_burned: int = 0
+    total_extinguished: int = 0
+    last_action: str = "reset"
+    # For visibility / debugging (not required by core):
+    width: int = 0
+    height: int = 0
+    wind_dir: str = "CALM"
+    humidity: float = 0.25
+    remaining_water: int = 20       # simple resource constraint
+    remaining_breaks: int = 50
+    # internal full grid as flattened ints
+    grid: List[int] = field(default_factory=list)
+    # burn timers for each cell (track how long cells have been burning/damp)
+    burn_timers: List[int] = field(default_factory=list)

openenv.yaml

@@ -0,0 +1,6 @@
+name: wildfire_env
+version: "0.1.0"
+description: "Wildfire containment environment for OpenEnv"
+action: WildfireAction
+observation: WildfireObservation
+

pyproject.toml

@@ -0,0 +1,34 @@
+[build-system]
+requires = ["setuptools>=45", "wheel"]
+build-backend = "setuptools.build_meta"
+
+[project]
+name = "openenv-wildfire-env"
+version = "0.1.0"
+description = "Wildfire Environment for OpenEnv - autonomous wildfire-control simulation for reinforcement learning"
+requires-python = ">=3.10"
+dependencies = [
+    "openenv-core[core]>=0.2.0",
+    "fastapi>=0.115.0",
+    "pydantic>=2.0.0",
+    "uvicorn[standard]>=0.24.0",
+    "requests>=2.31.0",
+]
+
+[project.optional-dependencies]
+dev = [
+    "pytest>=8.0.0",
+    "pytest-cov>=4.0.0",
+    "ipykernel>=6.29.5",
+    "matplotlib>=3.7.0",
+    "numpy>=1.24.0",
+]
+
+[project.scripts]
+server = "wildfire_env.server.app:main"
+
+
+[tool.setuptools]
+packages = ["wildfire_env", "wildfire_env.server"]
+package-dir = {"wildfire_env" = ".", "wildfire_env.server" = "server"}
+

run_server.sh

@@ -0,0 +1,9 @@
+#!/bin/bash
+# Run the wildfire environment server from the monorepo
+
+# Get the OpenEnv root directory (3 levels up from this script)
+OPENENV_ROOT="$(cd "$(dirname "$0")/../../.." && pwd)"
+
+# Run from monorepo root with proper PYTHONPATH
+cd "$OPENENV_ROOT"
+PYTHONPATH=src python -m envs.wildfire_env.server.app "$@"

server/__init__.py

@@ -0,0 +1,15 @@
+# Copyright (c) Arizona State University and contributors.
+# All rights reserved.
+#
+# This source code is licensed under the BSD-style license
+# found in the LICENSE file in the root directory of this source tree.
+
+"""
+Wildfire Environment Server.
+
+Server-side implementation of the wildfire environment for OpenEnv.
+"""
+
+from .wildfire_environment import WildfireEnvironment
+
+__all__ = ["WildfireEnvironment"]

server/app.py

@@ -0,0 +1,93 @@
+# server/app.py
+import os
+from fastapi.responses import HTMLResponse
+from fastapi import WebSocket, WebSocketDisconnect
+from dataclasses import asdict
+
+# Support both in-repo and standalone imports
+try:
+    # In-repo imports (when running from OpenEnv repository)
+    from openenv.core.env_server import create_fastapi_app
+    from openenv.core.env_server.web_interface import load_environment_metadata, WebInterfaceManager
+    from openenv.core.env_server.types import Action, Observation
+    from ..models import WildfireAction, WildfireObservation
+    from .wildfire_environment import WildfireEnvironment
+    from .wildfire_web_interface import get_wildfire_web_interface_html
+except ImportError:
+    # Standalone imports (when environment is standalone with openenv-core from pip)
+    from openenv_core.env_server import create_fastapi_app
+    from openenv_core.env_server.web_interface import load_environment_metadata, WebInterfaceManager
+    from openenv_core.env_server.types import Action, Observation
+    from wildfire_env.models import WildfireAction, WildfireObservation
+    from wildfire_env.server.wildfire_environment import WildfireEnvironment
+    from wildfire_env.server.wildfire_web_interface import get_wildfire_web_interface_html
+
+W = int(os.getenv("WILDFIRE_WIDTH", "16"))
+H = int(os.getenv("WILDFIRE_HEIGHT", "16"))
+env = WildfireEnvironment(width=W, height=H)
+
+# Create base app without web interface
+app = create_fastapi_app(env, WildfireAction, WildfireObservation)
+
+# Check if web interface should be enabled
+# This can be controlled via environment variable
+enable_web = (
+    os.getenv("ENABLE_WEB_INTERFACE", "false").lower() in ("true", "1", "yes")
+)
+
+if enable_web:
+    # Load environment metadata
+    metadata = load_environment_metadata(env, 'wildfire_env')
+
+    # Create web interface manager (needed for /web/reset, /web/step, /ws endpoints)
+    web_manager = WebInterfaceManager(env, WildfireAction, WildfireObservation, metadata)
+
+    # Add our custom wildfire interface route
+    @app.get("/web", response_class=HTMLResponse)
+    async def wildfire_web_interface():
+        """Custom wildfire-specific web interface."""
+        return get_wildfire_web_interface_html(metadata)
+
+    # Add web interface endpoints (these are needed for the interface to work)
+    @app.get("/web/metadata")
+    async def web_metadata():
+        """Get environment metadata."""
+        return asdict(metadata)
+
+    @app.websocket("/ws")
+    async def websocket_endpoint(websocket: WebSocket):
+        """WebSocket endpoint for real-time updates."""
+        await web_manager.connect_websocket(websocket)
+        try:
+            while True:
+                # Keep connection alive
+                await websocket.receive_text()
+        except WebSocketDisconnect:
+            await web_manager.disconnect_websocket(websocket)
+
+    @app.post("/web/reset")
+    async def web_reset():
+        """Reset endpoint for web interface."""
+        return await web_manager.reset_environment()
+
+    @app.post("/web/step")
+    async def web_step(request: dict):
+        """Step endpoint for web interface."""
+        action_data = request.get("action", {})
+        return await web_manager.step_environment(action_data)
+
+    @app.get("/web/state")
+    async def web_state():
+        """State endpoint for web interface."""
+        return web_manager.get_state()
+
+
+def main():
+    """Main entry point for running the server."""
+    import uvicorn
+    port = int(os.getenv("PORT", "8000"))
+    uvicorn.run(app, host="0.0.0.0", port=port)
+
+
+if __name__ == "__main__":
+    main()

server/build_docker.sh

@@ -0,0 +1,14 @@
+#!/bin/bash
+set -e
+
+TAG="${1:-latest}"
+IMAGE_NAME="wildfire-env:${TAG}"
+
+echo "🔥 Building Wildfire Environment Docker Image"
+SCRIPT_DIR="$( cd "$( dirname "${BASH_SOURCE[0]}" )" && pwd )"
+OPENENV_ROOT="$(cd "$SCRIPT_DIR/../../../.." && pwd)"
+
+docker build \
+    -f "$SCRIPT_DIR/Dockerfile" \
+    -t "$IMAGE_NAME" \
+    "$OPENENV_ROOT"

server/wildfire_environment.py

@@ -0,0 +1,413 @@
+
+import os
+import random
+import uuid
+
+# Support both in-repo and standalone imports
+try:
+    # In-repo imports (when running from OpenEnv repository)
+    from openenv.core.env_server import Environment
+    from ..models import WildfireAction, WildfireObservation, WildfireState
+except ImportError:
+    # Standalone imports (when environment is standalone with openenv-core from pip)
+    from openenv_core.env_server import Environment
+    from wildfire_env.models import WildfireAction, WildfireObservation, WildfireState
+
+# Helpers
+DIRS_8 = {
+    "N":  (0, -1), "NE": (1, -1), "E":  (1, 0), "SE": (1, 1),
+    "S":  (0,  1), "SW": (-1, 1), "W":  (-1, 0), "NW": (-1, -1),
+    "CALM": (0, 0),
+}
+
+def idx(x: int, y: int, w: int) -> int:
+    # Defensive type conversion to ensure all parameters are integers
+    x, y, w = int(x), int(y), int(w)
+    return y * w + x
+
+def in_bounds(x: int, y: int, w: int, h: int) -> bool:
+    # Defensive type conversion to ensure all parameters are integers
+    x, y, w, h = int(x), int(y), int(w), int(h)
+    return 0 <= x < w and 0 <= y < h
+
+
+class WildfireEnvironment(Environment):
+    """
+    Weather-aware wildfire simulation.
+
+    Grid encodings:
+      0 = ash (burned out)
+      1 = fuel / vegetation
+      2 = burning
+      3 = firebreak
+      4 = watered / damp
+
+    Each step:
+      - agent acts (water/break/wait)
+      - burning spreads to neighbors with wind + humidity effects
+      - burning cells burn for multiple ticks, then become ash
+    """
+
+    def __init__(
+        self,
+        width: int = 32,
+        height: int = 32,
+        base_ignite_prob: float = 0.30,
+        wind_bias: float = 0.20,      # kept for compatibility (not directly used in B model)
+        diag_factor: float = 0.7,     # kept for compatibility (not directly used in B model)
+        humidity: float = 0.25,
+        init_sources: int = 2,
+        seed: int = 3407,
+        max_steps: int = 128,
+        water_capacity: int = 8,      # ↓ encourage strategic water use
+        break_capacity: int = 50,
+    ):
+        super().__init__()
+
+        # --- Env-var overrides (optional) ---
+        width     = int(os.environ.get("WILDFIRE_WIDTH", width))
+        height    = int(os.environ.get("WILDFIRE_HEIGHT", height))
+        humidity  = float(os.environ.get("WILDFIRE_HUMIDITY", humidity))
+        forced_wind = os.environ.get("WILDFIRE_WIND", None)
+
+        # Store config (ensure integers)
+        self.w = int(width)
+        self.h = int(height)
+        self.base_ignite_prob = base_ignite_prob
+        self.wind_bias = wind_bias
+        self.diag_factor = diag_factor
+        self.init_humidity = humidity
+        self.init_sources = init_sources
+        self.rng = random.Random(seed)
+        self.max_steps = max_steps
+        self.init_water = water_capacity
+        self.init_breaks = break_capacity
+        self.forced_wind = forced_wind
+
+        # burn lifetime in ticks (balanced model)
+        self.burn_lifetime = 3
+
+        self._state = WildfireState()
+
+    # --- Core API ---
+
+    def reset(self) -> WildfireObservation:
+        # Ensure w and h are integers (defensive type conversion)
+        w, h = int(self.w), int(self.h)
+        
+        # Start with all fuel
+        grid = [1] * (w * h)
+
+        # Wind (forced if provided)
+        if self.forced_wind and self.forced_wind in DIRS_8:
+            wind_dir = self.forced_wind
+        else:
+            wind_dir = self.rng.choice(list(DIRS_8.keys()))
+
+        # Humidity small variation around init
+        humidity = min(1.0, max(0.0, self.init_humidity + self.rng.uniform(-0.05, 0.05)))
+
+        # Place initial fires
+        for _ in range(self.init_sources):
+            x = self.rng.randrange(w)
+            y = self.rng.randrange(h)
+            i = idx(x, y, w)
+            # Safety check: ensure index is within grid bounds
+            if 0 <= i < len(grid):
+                grid[i] = 2
+
+        self._state = WildfireState(
+            episode_id=str(uuid.uuid4()),
+            step_count=0,
+            total_burned=0,
+            total_extinguished=0,
+            last_action="reset",
+            width=w,
+            height=h,
+            wind_dir=wind_dir,
+            humidity=humidity,
+            remaining_water=self.init_water,
+            remaining_breaks=self.init_breaks,
+            grid=grid,
+        )
+
+        # per-cell burn timers (persist across steps)
+        self._state.burn_timers = [0] * (w * h)
+
+        obs = self._make_observation(reward_hint=0.0)
+        return obs
+
+    def step(self, action: WildfireAction) -> WildfireObservation:
+        st = self._state
+        reward = 0.0
+
+        # --- Agent action effects ---
+        if (
+            action.action == "water"
+            and st.remaining_water > 0
+            and action.x is not None
+            and action.y is not None
+        ):
+            reward += self._apply_water(action.x, action.y)
+        elif (
+            action.action == "break"
+            and st.remaining_breaks > 0
+            and action.x is not None
+            and action.y is not None
+        ):
+            reward += self._apply_break(action.x, action.y)
+        elif action.action == "wait":
+            pass
+        else:
+            reward -= 0.05  # invalid or exhausted resources
+
+        # --- Natural fire dynamics ---
+        prev_burning = self._burning_count()
+        prev_burned = sum(1 for v in st.grid if v == 0)
+
+        newly_burned = self._spread_fire()
+        new_burning = self._burning_count()
+        now_burned = sum(1 for v in st.grid if v == 0)
+
+        st.total_burned += newly_burned
+        st.step_count += 1
+        st.last_action = action.action
+
+        # --- Spread vs containment shaping ---
+        spread_delta = new_burning - prev_burning
+        burned_delta = now_burned - prev_burned
+
+        # Strong penalty for spread
+        if spread_delta > 0:
+            reward -= 0.15 * spread_delta  # 🔥 focus on containment
+        elif spread_delta < 0:
+            reward += 0.10 * abs(spread_delta)  # reward shrinkage
+
+        # Mild penalty for newly burned cells (area loss)
+        if burned_delta > 0:
+            reward -= 0.05 * burned_delta
+
+        # Small time penalty to prefer fast control
+        reward -= 0.01
+
+        done = self._is_done()
+
+        # --- End of episode bonuses ---
+        if done:
+            saved_ratio = self._saved_cells() / (self.w * self.h)
+            burned_ratio = now_burned / (self.w * self.h)
+            burning_left = self._burning_count()
+
+            # Big containment bonus
+            if burning_left == 0:
+                reward += 0.5 + 0.5 * saved_ratio
+
+            # Fallback proportional reward
+            reward += 0.2 * (1.0 - burned_ratio)
+
+        obs = self._make_observation(reward_hint=reward)
+        obs.done = done
+        obs.reward = reward
+        return obs
+
+
+    # --- Internal mechanics ---
+
+    def _apply_water(self, x: int, y: int) -> float:
+        st = self._state
+        # Ensure x and y are integers (defensive type conversion)
+        x, y = int(x), int(y)
+        if not in_bounds(x, y, self.w, self.h):
+            return -0.05
+
+        # Strong penalty if no water left
+        if st.remaining_water <= 0:
+            return -0.5
+
+        i = idx(x, y, self.w)
+        # Safety check: ensure index is within grid bounds
+        if i < 0 or i >= len(st.grid):
+            return -0.05
+        
+        reward = 0.0
+
+        if st.grid[i] == 2:
+            st.grid[i] = 4  # extinguish & dampen
+            st.burn_timers[i] = 0
+            st.total_extinguished += 1
+            reward += 0.25
+        elif st.grid[i] == 1:
+            st.grid[i] = 4  # dampen fuel (mild penalty to avoid spamming)
+            st.burn_timers[i] = 0
+            reward -= 0.10
+        elif st.grid[i] == 4:
+            # redundant watering
+            reward -= 0.05
+        else:
+            # watering ash/break gives slight penalty
+            reward -= 0.05
+
+        st.remaining_water -= 1
+        return reward
+
+    def _apply_break(self, x: int, y: int) -> float:
+        st = self._state
+        # Ensure x and y are integers (defensive type conversion)
+        x, y = int(x), int(y)
+        if not in_bounds(x, y, self.w, self.h):
+            return -0.05
+        i = idx(x, y, self.w)
+        # Safety check: ensure index is within grid bounds
+        if i < 0 or i >= len(st.grid):
+            return -0.05
+        
+        reward = 0.0
+
+        if st.grid[i] in (1, 4):
+            st.grid[i] = 3
+            st.burn_timers[i] = 0
+            reward += 0.15  # slightly more than before to make firebreaks attractive
+        elif st.grid[i] == 2:
+            st.grid[i] = 3
+            st.burn_timers[i] = 0
+            reward -= 0.02
+        elif st.grid[i] == 3:
+            reward -= 0.01
+        else:
+            reward -= 0.02
+
+        st.remaining_breaks -= 1
+        return reward
+
+    def _spread_fire(self) -> int:
+        """
+        Balanced wildfire spread model:
+          - burning cells persist for multiple ticks before turning to ash
+          - 8-direction spread (diagonals weaker)
+          - wind accelerates in wind direction, weakens upwind
+          - humidity suppresses ignition probability
+          - water (4) is IMMUNE to ignition while damp and reverts to fuel after several ticks
+        """
+        st = self._state
+        new_grid = st.grid[:]
+        newly_burned = 0
+
+        # Ensure w and h are integers (defensive type conversion)
+        w, h = int(self.w), int(self.h)
+
+        # 8-neighbor model
+        neighbors = [(-1, 0), (1, 0), (0, -1), (0, 1),
+                     (-1, -1), (1, -1), (-1, 1), (1, 1)]
+        wx, wy = DIRS_8.get(st.wind_dir, (0, 0))
+
+        base = self.base_ignite_prob
+        humidity_factor = (1.0 - st.humidity)
+
+        ignite_flags = [False] * (w * h)
+
+        # First pass: evaluate ignitions, increment burn timers
+        for y in range(h):
+            for x in range(w):
+                i = idx(x, y, w)
+                # Safety check: ensure index is within grid bounds
+                if i < 0 or i >= len(st.grid):
+                    continue
+                cell = st.grid[i]
+
+                if cell == 2:  # burning
+                    st.burn_timers[i] += 1
+
+                    for dx, dy in neighbors:
+                        nx, ny = x + dx, y + dy
+                        if not in_bounds(nx, ny, w, h):
+                            continue
+                        ni = idx(nx, ny, w)
+                        # Safety check: ensure neighbor index is within grid bounds
+                        if ni < 0 or ni >= len(st.grid):
+                            continue
+                        target = st.grid[ni]
+
+                        # Only fuel or water/damp can be candidates, but cells with code 4 (watered/damp) are immune to ignition
+                        if target == 4:
+                            # Watered/damp cells (code 4) do not ignite at all while in this state
+                            continue
+                        if target != 1:
+                            continue
+
+                        # Wind multiplier
+                        if (dx, dy) == (wx, wy):
+                            wind_mult = 2.0
+                        elif (dx, dy) == (-wx, -wy):
+                            wind_mult = 0.5
+                        else:
+                            wind_mult = 1.0
+
+                        # Diagonals weaker
+                        diag_mult = 0.6 if (dx != 0 and dy != 0) else 1.0
+
+                        p = base * humidity_factor * wind_mult * diag_mult
+                        p = max(0.0, min(1.0, p))
+                        if self.rng.random() < p:
+                            # Safety check: ensure ni is within ignite_flags bounds
+                            if 0 <= ni < len(ignite_flags):
+                                ignite_flags[ni] = True
+
+        # Second pass: apply transitions
+        for i, cell in enumerate(st.grid):
+            # Safety check: ensure index is within bounds for all arrays
+            if i < 0 or i >= len(new_grid) or i >= len(st.burn_timers):
+                continue
+            
+            if cell == 2:
+                # burns for burn_lifetime ticks before turning to ash
+                if st.burn_timers[i] >= self.burn_lifetime:
+                    new_grid[i] = 0  # ash
+                    newly_burned += 1
+                else:
+                    new_grid[i] = 2  # keep burning
+            elif i < len(ignite_flags) and ignite_flags[i] and new_grid[i] == 1:
+                new_grid[i] = 2
+                st.burn_timers[i] = 0
+            elif cell == 4:
+                # Water stays damp for several ticks before reverting to fuel
+                st.burn_timers[i] += 1
+                if st.burn_timers[i] >= 6:   # was 3; extend to make water useful
+                    new_grid[i] = 1
+
+        st.grid = new_grid
+        return newly_burned
+
+    def _burning_count(self) -> int:
+        return sum(1 for v in self._state.grid if v == 2)
+
+    def _saved_cells(self) -> int:
+        # cells not turned to ash (includes fuel, burning, break, water)
+        return sum(1 for v in self._state.grid if v in (1, 2, 3, 4))
+
+    def _is_done(self) -> bool:
+        return self._burning_count() == 0 or self._state.step_count >= self.max_steps
+
+    def _make_observation(self, reward_hint: float = 0.0) -> WildfireObservation:
+        st = self._state
+        burning = self._burning_count()
+        burned = sum(1 for v in st.grid if v == 0)
+        return WildfireObservation(
+            grid=st.grid[:],
+            width=self.w,
+            height=self.h,
+            step=st.step_count,
+            wind_dir=st.wind_dir,
+            humidity=st.humidity,
+            burning_count=burning,
+            remaining_water=st.remaining_water,     # ✅ new
+            remaining_breaks=st.remaining_breaks,   # ✅ new
+            burned_count=burned,
+            reward_hint=reward_hint,
+        )
+
+    # --- Required abstract property implementation ---
+    @property
+    def state(self) -> WildfireState:
+        """Return the current environment state."""
+        return self._state
+

server/wildfire_web_interface.py

@@ -0,0 +1,1022 @@
+"""
+Custom web interface for Wildfire Environment.
+
+This module provides a wildfire-specific web interface with visual grid display
+and wildfire-specific features, without modifying the base web_interface.py.
+"""
+
+from typing import Optional
+import json
+from dataclasses import asdict
+
+# Support both in-repo and standalone imports
+try:
+    # In-repo imports (when running from OpenEnv repository)
+    from core.env_server.types import EnvironmentMetadata
+    from ..models import WildfireAction
+except ImportError:
+    # Standalone imports (when environment is standalone with openenv-core from pip)
+    from openenv_core.env_server.types import EnvironmentMetadata
+    from wildfire_env.models import WildfireAction
+
+
+def get_wildfire_web_interface_html(metadata: Optional[EnvironmentMetadata] = None) -> str:
+    """Generate custom HTML for the wildfire environment web interface."""
+    
+    # Prepare README markdown and a simple HTML fallback
+    instructions_html = ""
+    instructions_json = "null"
+    if metadata and metadata.readme_content:
+        # Fallback lightweight conversion (in case JS markdown library fails)
+        instructions_html = _markdown_to_html_simple(metadata.readme_content)
+        # Primary: pass raw markdown to the client for proper rendering via marked.js
+        instructions_json = json.dumps(metadata.readme_content)
+    
+    return f"""
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Wildfire Environment - Web Interface</title>
+    <!-- Markdown rendering libraries -->
+    <script src="https://cdn.jsdelivr.net/npm/marked/marked.min.js"></script>
+    <script src="https://cdn.jsdelivr.net/npm/dompurify@3.1.6/dist/purify.min.js"></script>
+    <script>
+      // Embed raw README markdown for client-side rendering
+      window.__WILDFIRE_README__ = {instructions_json};
+    </script>
+    <style>
+        * {{
+            margin: 0;
+            padding: 0;
+            box-sizing: border-box;
+        }}
+        
+        body {{
+            font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
+            background-color: #f5f5f5;
+            height: 100vh;
+            overflow: hidden;
+        }}
+        
+        .container {{
+            display: flex;
+            height: 100vh;
+        }}
+        
+        .left-pane {{
+            width: 50%;
+            background: white;
+            border-right: 1px solid #e0e0e0;
+            display: flex;
+            flex-direction: column;
+        }}
+        
+        .right-pane {{
+            width: 50%;
+            background: #fafafa;
+            display: flex;
+            flex-direction: column;
+        }}
+        
+        .pane-header {{
+            padding: 20px;
+            border-bottom: 1px solid #e0e0e0;
+            background: #f8f9fa;
+            font-weight: 600;
+            font-size: 16px;
+        }}
+        
+        .pane-content {{
+            flex: 1;
+            padding: 20px;
+            overflow-y: auto;
+        }}
+        
+        /* Action Form Styles */
+        .action-form {{
+            background: white;
+            border: 1px solid #e0e0e0;
+            border-radius: 8px;
+            padding: 20px;
+            margin-bottom: 20px;
+        }}
+        
+        .form-group {{
+            margin-bottom: 15px;
+        }}
+        
+        .form-group label {{
+            display: block;
+            margin-bottom: 5px;
+            font-weight: 500;
+            color: #333;
+        }}
+        
+        .form-group select, .form-group input {{
+            width: 100%;
+            padding: 8px 12px;
+            border: 1px solid #ddd;
+            border-radius: 4px;
+            font-size: 14px;
+        }}
+        
+        .form-group select:focus, .form-group input:focus {{
+            outline: none;
+            border-color: #007bff;
+            box-shadow: 0 0 0 2px rgba(0, 123, 255, 0.25);
+        }}
+        
+        /* Buttons */
+        .btn {{
+            background: #007bff;
+            color: white;
+            border: none;
+            padding: 10px 20px;
+            border-radius: 4px;
+            cursor: pointer;
+            font-size: 14px;
+            margin-right: 10px;
+            margin-bottom: 10px;
+        }}
+        
+        .btn:hover {{
+            background: #0056b3;
+        }}
+        
+        .btn:disabled {{
+            background: #6c757d;
+            cursor: not-allowed;
+        }}
+        
+        .btn-secondary {{
+            background: #6c757d;
+        }}
+        
+        .btn-secondary:hover {{
+            background: #545b62;
+        }}
+        
+        /* Grid Visualization */
+        .grid-container {{
+            background: white;
+            border: 1px solid #e0e0e0;
+            border-radius: 8px;
+            padding: 20px;
+            margin-bottom: 20px;
+        }}
+        
+        .grid-display {{
+            display: inline-block;
+            border: 2px solid #333;
+            background: #fff;
+            padding: 5px;
+            margin: 10px 0;
+        }}
+        
+        .grid {{
+            display: grid;
+            gap: 1px;
+            background: #333;
+        }}
+        
+        .cell {{
+            width: 20px;
+            height: 20px;
+            display: flex;
+            align-items: center;
+            justify-content: center;
+            font-size: 10px;
+            cursor: pointer;
+            position: relative;
+        }}
+        
+        .cell.ash {{ background-color: #2f2f2f; }}
+        .cell.fuel {{ background-color: #228b22; }}
+        .cell.burning {{ background-color: #ff4500; }}
+        .cell.firebreak {{ background-color: #8b4513; }}
+        .cell.watered {{ background-color: #4169e1; }}
+        
+        .cell:hover {{
+            opacity: 0.8;
+            transform: scale(1.1);
+            z-index: 10;
+        }}
+        
+        /* Stats Display */
+        .stats-display {{
+            background: white;
+            border: 1px solid #e0e0e0;
+            border-radius: 8px;
+            padding: 15px;
+            margin-bottom: 20px;
+        }}
+        
+        .stats-grid {{
+            display: grid;
+            grid-template-columns: repeat(2, 1fr);
+            gap: 15px;
+            margin-top: 10px;
+        }}
+        
+        .stat-item {{
+            display: flex;
+            flex-direction: column;
+        }}
+        
+        .stat-label {{
+            font-size: 12px;
+            color: #666;
+            margin-bottom: 5px;
+        }}
+        
+        .stat-value {{
+            font-size: 20px;
+            font-weight: bold;
+            color: #007bff;
+        }}
+        
+        /* Instructions Section */
+        .instructions-section {{
+            background: white;
+            border: 1px solid #e0e0e0;
+            border-radius: 8px;
+            padding: 20px;
+            margin-bottom: 20px;
+        }}
+        
+        .instructions-header {{
+            display: flex;
+            justify-content: space-between;
+            align-items: center;
+            margin-bottom: 15px;
+        }}
+        
+        .instructions-title {{
+            font-size: 18px;
+            font-weight: 600;
+            color: #333;
+            margin: 0;
+        }}
+        
+        .instructions-toggle {{
+            background: #f8f9fa;
+            border: 1px solid #dee2e6;
+            border-radius: 4px;
+            padding: 5px 10px;
+            cursor: pointer;
+            font-size: 12px;
+            color: #6c757d;
+        }}
+        
+        .instructions-toggle:hover {{
+            background: #e9ecef;
+        }}
+        
+        .instructions-content {{
+            display: none;
+            max-height: 400px;
+            overflow-y: auto;
+            border-top: 1px solid #e0e0e0;
+            padding-top: 15px;
+        }}
+        
+        .instructions-content.expanded {{
+            display: block;
+        }}
+        
+        /* Legend */
+        .legend {{
+            background: white;
+            border: 1px solid #e0e0e0;
+            border-radius: 8px;
+            padding: 15px;
+            margin-bottom: 20px;
+        }}
+        
+        .legend-items {{
+            display: flex;
+            flex-wrap: wrap;
+            gap: 15px;
+            margin-top: 10px;
+        }}
+        
+        .legend-item {{
+            display: flex;
+            align-items: center;
+            gap: 8px;
+        }}
+        
+        .legend-color {{
+            width: 20px;
+            height: 20px;
+            border: 1px solid #333;
+        }}
+        
+        /* Connection Status */
+        .status-indicator {{
+            display: inline-block;
+            width: 8px;
+            height: 8px;
+            border-radius: 50%;
+            margin-right: 8px;
+        }}
+        
+        .status-connected {{
+            background: #28a745;
+        }}
+        
+        .status-disconnected {{
+            background: #dc3545;
+        }}
+        
+        /* Action Logs */
+        .logs-container {{
+            background: white;
+            border: 1px solid #e0e0e0;
+            border-radius: 8px;
+            padding: 15px;
+            max-height: 300px;
+            overflow-y: auto;
+        }}
+        
+        .log-entry {{
+            border-bottom: 1px solid #f0f0f0;
+            padding: 10px 0;
+        }}
+        
+        .log-entry:last-child {{
+            border-bottom: none;
+        }}
+        
+        .log-timestamp {{
+            font-size: 12px;
+            color: #666;
+            margin-bottom: 5px;
+        }}
+        
+        .log-action {{
+            background: #e3f2fd;
+            padding: 8px;
+            border-radius: 4px;
+            margin-bottom: 5px;
+            font-family: monospace;
+            font-size: 12px;
+        }}
+        
+        .log-reward {{
+            font-weight: 600;
+            color: #28a745;
+        }}
+        
+        .log-done {{
+            font-weight: 600;
+            color: #dc3545;
+        }}
+        
+        /* State Display */
+        .state-display {{
+            background: white;
+            border: 1px solid #e0e0e0;
+            border-radius: 8px;
+            padding: 15px;
+            margin-bottom: 20px;
+        }}
+        
+        .state-item {{
+            margin-bottom: 8px;
+        }}
+        
+        .state-label {{
+            font-weight: 500;
+            color: #666;
+        }}
+        
+        .state-value {{
+            color: #333;
+            font-family: monospace;
+        }}
+    </style>
+</head>
+<body>
+    <div class="container">
+        <!-- Left Pane: Action Interface -->
+        <div class="left-pane">
+            <div class="pane-header">
+                <span class="status-indicator status-disconnected" id="connection-status"></span>
+                Wildfire Containment Interface
+            </div>
+            <div class="pane-content">
+                <!-- Instructions Section -->
+                {_generate_instructions_section(instructions_html, metadata)}
+                
+                <!-- Action Form -->
+                <div class="action-form">
+                    <h3>Take Action</h3>
+                    <form id="action-form">
+                        <div class="form-group">
+                            <label for="action">Action Type <span style="color: red;">*</span></label>
+                            <select name="action" id="action" required>
+                                <option value="">-- Select Action --</option>
+                                <option value="water">Water (Extinguish Fire)</option>
+                                <option value="break">Break (Create Firebreak)</option>
+                                <option value="wait">Wait (Do Nothing)</option>
+                            </select>
+                            <small style="display: block; margin-top: 5px; color: #666;">
+                                Water: Extinguishes fire at target cell<br>
+                                Break: Creates firebreak to prevent spread<br>
+                                Wait: Fire continues spreading
+                            </small>
+                        </div>
+                        
+                        <div class="form-group" id="coordinates-group" style="display: none;">
+                            <label for="x">X Coordinate</label>
+                            <input type="number" name="x" id="x" min="0" placeholder="Enter X coordinate">
+                            
+                            <label for="y" style="margin-top: 10px;">Y Coordinate</label>
+                            <input type="number" name="y" id="y" min="0" placeholder="Enter Y coordinate">
+                            <small style="display: block; margin-top: 5px; color: #666;">
+                                Coordinates are required for water and break actions
+                            </small>
+                        </div>
+                        
+                        <button type="submit" class="btn" id="step-btn">Execute Action</button>
+                    </form>
+                </div>
+                
+                <!-- Control Buttons -->
+                <div style="margin-bottom: 20px;">
+                    <button class="btn btn-secondary" id="reset-btn">Reset Environment</button>
+                    <button class="btn btn-secondary" id="state-btn">Get State</button>
+                </div>
+                
+                <!-- Stats Display -->
+                <div class="stats-display">
+                    <h3>Environment Stats</h3>
+                    <div class="stats-grid">
+                        <div class="stat-item">
+                            <span class="stat-label">Step Count</span>
+                            <span class="stat-value" id="step-count">0</span>
+                        </div>
+                        <div class="stat-item">
+                            <span class="stat-label">Water Remaining</span>
+                            <span class="stat-value" id="water-remaining">0</span>
+                        </div>
+                        <div class="stat-item">
+                            <span class="stat-label">Breaks Remaining</span>
+                            <span class="stat-value" id="breaks-remaining">0</span>
+                        </div>
+                        <div class="stat-item">
+                            <span class="stat-label">Burning Cells</span>
+                            <span class="stat-value" id="burning-count">0</span>
+                        </div>
+                    </div>
+                </div>
+                
+                <!-- Current State Display -->
+                <div class="state-display">
+                    <h3>Current State</h3>
+                    <div id="current-state">
+                        <div class="state-item">
+                            <span class="state-label">Status:</span>
+                            <span class="state-value" id="env-status">Not initialized</span>
+                        </div>
+                        <div class="state-item">
+                            <span class="state-label">Episode ID:</span>
+                            <span class="state-value" id="episode-id">-</span>
+                        </div>
+                        <div class="state-item">
+                            <span class="state-label">Wind Direction:</span>
+                            <span class="state-value" id="wind-dir">-</span>
+                        </div>
+                        <div class="state-item">
+                            <span class="state-label">Humidity:</span>
+                            <span class="state-value" id="humidity">-</span>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </div>
+        
+        <!-- Right Pane: Visual Grid and Logs -->
+        <div class="right-pane">
+            <div class="pane-header">
+                Fire Grid Visualization
+            </div>
+            <div class="pane-content">
+                <!-- Legend -->
+                <div class="legend">
+                    <h3>Legend</h3>
+                    <div class="legend-items">
+                        <div class="legend-item">
+                            <div class="legend-color" style="background-color: #2f2f2f;"></div>
+                            <span>Ash (Burned)</span>
+                        </div>
+                        <div class="legend-item">
+                            <div class="legend-color" style="background-color: #228b22;"></div>
+                            <span>Fuel (Safe)</span>
+                        </div>
+                        <div class="legend-item">
+                            <div class="legend-color" style="background-color: #ff4500;"></div>
+                            <span>Burning (Fire)</span>
+                        </div>
+                        <div class="legend-item">
+                            <div class="legend-color" style="background-color: #8b4513;"></div>
+                            <span>Firebreak</span>
+                        </div>
+                        <div class="legend-item">
+                            <div class="legend-color" style="background-color: #4169e1;"></div>
+                            <span>Watered (Damp)</span>
+                        </div>
+                    </div>
+                </div>
+                
+                <!-- Grid Visualization -->
+                <div class="grid-container">
+                    <h3>Fire Grid</h3>
+                    <div id="grid-status" style="margin-bottom: 10px; font-size: 12px; color: #666;">
+                        Waiting for grid data... (Click "Reset Environment" to initialize)
+                    </div>
+                    <div class="grid-display">
+                        <div id="fire-grid" class="grid">
+                            <!-- Grid will be rendered here -->
+                        </div>
+                    </div>
+                    <p style="margin-top: 10px; font-size: 12px; color: #666;">
+                        Click on a cell to set coordinates for water/break actions
+                    </p>
+                </div>
+                
+                <!-- Action Logs -->
+                <div class="logs-container">
+                    <h3>Action History</h3>
+                    <div id="action-logs">
+                        No actions taken yet
+                    </div>
+                </div>
+            </div>
+        </div>
+    </div>
+
+    <script>
+        class WildfireWebInterface {{
+            constructor() {{
+                this.ws = null;
+                this.isConnected = false;
+                this.currentGrid = null;
+                this.gridWidth = 0;
+                this.gridHeight = 0;
+                this.init();
+            }}
+            
+            init() {{
+                this.connectWebSocket();
+                this.setupEventListeners();
+            }}
+            
+            connectWebSocket() {{
+                const protocol = window.location.protocol === 'https:' ? 'wss:' : 'ws:';
+                const wsUrl = `${{protocol}}//${{window.location.host}}/ws`;
+                
+                this.ws = new WebSocket(wsUrl);
+                
+                this.ws.onopen = () => {{
+                    this.isConnected = true;
+                    this.updateConnectionStatus(true);
+                    console.log('WebSocket connected');
+                    // Trigger initial state fetch
+                    this.fetchInitialState();
+                }};
+                
+                this.ws.onmessage = (event) => {{
+                    const data = JSON.parse(event.data);
+                    if (data.type === 'state_update') {{
+                        this.updateUI(data.episode_state);
+                    }}
+                }};
+                
+                this.ws.onclose = () => {{
+                    this.isConnected = false;
+                    this.updateConnectionStatus(false);
+                    console.log('WebSocket disconnected');
+                    setTimeout(() => this.connectWebSocket(), 3000);
+                }};
+                
+                this.ws.onerror = (error) => {{
+                    console.error('WebSocket error:', error);
+                }};
+            }}
+            
+            async fetchInitialState() {{
+                // Fetch current state on connection to display grid
+                try {{
+                    // Try to get current observation from state
+                    const stateResponse = await fetch('/web/state');
+                    const state = await stateResponse.json();
+                    
+                    // If we have grid data in state, render it
+                    if (state.grid && Array.isArray(state.grid) && state.width && state.height) {{
+                        console.log('Rendering grid from state');
+                        this.renderGrid(state.grid, state.width, state.height);
+                        return;
+                    }}
+                    
+                    // If no grid in state, try to get it from the current episode state
+                    // The WebSocket will send the current observation shortly
+                    console.log('No grid in state, waiting for WebSocket update...');
+                }} catch (error) {{
+                    console.error('Error fetching initial state:', error);
+                }}
+            }}
+            
+            setupEventListeners() {{
+                // Instructions toggle
+                const instructionsToggle = document.getElementById('instructions-toggle');
+                const instructionsContent = document.getElementById('instructions-content');
+                if (instructionsToggle && instructionsContent) {{
+                    instructionsToggle.addEventListener('click', () => {{
+                        instructionsContent.classList.toggle('expanded');
+                        instructionsToggle.textContent = instructionsContent.classList.contains('expanded') 
+                            ? 'Hide Instructions' : 'Show Instructions';
+                    }});
+                }}
+                
+                // Render README markdown into instructions (client-side, with proper markdown support)
+                const readmeMarkdown = window.__WILDFIRE_README__;
+                const instructionsTarget = document.getElementById('instructions-markdown');
+                if (instructionsTarget && readmeMarkdown) {{
+                    try {{
+                        if (typeof marked !== 'undefined' && typeof DOMPurify !== 'undefined') {{
+                            const html = DOMPurify.sanitize(marked.parse(readmeMarkdown));
+                            instructionsTarget.innerHTML = html;
+                        }}
+                    }} catch (e) {{
+                        console.error('Failed to render README markdown:', e);
+                    }}
+                }}
+                
+                // Action type change - show/hide coordinates
+                document.getElementById('action').addEventListener('change', (e) => {{
+                    const coordsGroup = document.getElementById('coordinates-group');
+                    if (e.target.value === 'water' || e.target.value === 'break') {{
+                        coordsGroup.style.display = 'block';
+                        document.getElementById('x').required = true;
+                        document.getElementById('y').required = true;
+                    }} else {{
+                        coordsGroup.style.display = 'none';
+                        document.getElementById('x').required = false;
+                        document.getElementById('y').required = false;
+                    }}
+                }});
+                
+                // Form submission
+                document.getElementById('action-form').addEventListener('submit', (e) => {{
+                    e.preventDefault();
+                    this.submitAction();
+                }});
+                
+                // Reset button
+                document.getElementById('reset-btn').addEventListener('click', () => {{
+                    this.resetEnvironment();
+                }});
+                
+                // State button
+                document.getElementById('state-btn').addEventListener('click', () => {{
+                    this.getState();
+                }});
+            }}
+            
+            async submitAction() {{
+                const formData = new FormData(document.getElementById('action-form'));
+                const action = {{}};
+                
+                for (const [key, value] of formData.entries()) {{
+                    if (value !== '') {{
+                        if (key === 'x' || key === 'y') {{
+                            action[key] = parseInt(value);
+                        }} else {{
+                            action[key] = value;
+                        }}
+                    }}
+                }}
+                
+                // Remove x/y if action is 'wait'
+                if (action.action === 'wait') {{
+                    delete action.x;
+                    delete action.y;
+                }}
+                
+                try {{
+                    const response = await fetch('/web/step', {{
+                        method: 'POST',
+                        headers: {{ 'Content-Type': 'application/json' }},
+                        body: JSON.stringify({{ action }})
+                    }});
+                    
+                    if (!response.ok) {{
+                        throw new Error(`HTTP error! status: ${{response.status}}`);
+                    }}
+                    
+                    const result = await response.json();
+                    console.log('Step result:', result);
+                }} catch (error) {{
+                    console.error('Error submitting action:', error);
+                    alert('Error submitting action: ' + error.message);
+                }}
+            }}
+            
+            async resetEnvironment() {{
+                try {{
+                    const response = await fetch('/web/reset', {{
+                        method: 'POST',
+                        headers: {{ 'Content-Type': 'application/json' }}
+                    }});
+                    
+                    if (!response.ok) {{
+                        throw new Error(`HTTP error! status: ${{response.status}}`);
+                    }}
+                    
+                    const result = await response.json();
+                    console.log('Reset result:', result);
+                    console.log('Reset observation:', result.observation);
+                    
+                    // Render grid immediately after reset
+                    if (result.observation && result.observation.grid) {{
+                        const obs = result.observation;
+                        console.log('Grid data:', obs.grid);
+                        console.log('Grid dimensions:', obs.width, 'x', obs.height);
+                        if (obs.grid && Array.isArray(obs.grid) && obs.width && obs.height) {{
+                            console.log('Rendering grid from reset...');
+                            this.renderGrid(obs.grid, obs.width, obs.height);
+                        }} else {{
+                            console.warn('Grid data invalid:', {{
+                                gridIsArray: Array.isArray(obs.grid),
+                                width: obs.width,
+                                height: obs.height
+                            }});
+                        }}
+                    }} else {{
+                        console.warn('No grid data in reset result:', result);
+                    }}
+                }} catch (error) {{
+                    console.error('Error resetting environment:', error);
+                    alert('Error resetting environment: ' + error.message);
+                }}
+            }}
+            
+            async getState() {{
+                try {{
+                    const response = await fetch('/web/state');
+                    const state = await response.json();
+                    console.log('Current state:', state);
+                    alert('Current state: ' + JSON.stringify(state, null, 2));
+                }} catch (error) {{
+                    console.error('Error getting state:', error);
+                    alert('Error getting state: ' + error.message);
+                }}
+            }}
+            
+            updateConnectionStatus(connected) {{
+                const indicator = document.getElementById('connection-status');
+                if (connected) {{
+                    indicator.className = 'status-indicator status-connected';
+                }} else {{
+                    indicator.className = 'status-indicator status-disconnected';
+                }}
+            }}
+            
+            updateUI(episodeState) {{
+                // Update state display
+                document.getElementById('env-status').textContent = 
+                    episodeState.is_reset ? 'Reset' : 'Running';
+                document.getElementById('episode-id').textContent = 
+                    episodeState.episode_id || '-';
+                document.getElementById('step-count').textContent = 
+                    episodeState.step_count.toString();
+                
+                // Update observation if available
+                if (episodeState.current_observation) {{
+                    const obs = episodeState.current_observation;
+                    
+                    // Update stats
+                    document.getElementById('water-remaining').textContent = 
+                        obs.remaining_water !== undefined ? obs.remaining_water : '-';
+                    document.getElementById('breaks-remaining').textContent = 
+                        obs.remaining_breaks !== undefined ? obs.remaining_breaks : '-';
+                    document.getElementById('burning-count').textContent = 
+                        obs.burning_count !== undefined ? obs.burning_count : '-';
+                    document.getElementById('wind-dir').textContent = 
+                        obs.wind_dir || '-';
+                    document.getElementById('humidity').textContent = 
+                        obs.humidity !== undefined ? obs.humidity.toFixed(2) : '-';
+                    
+                    // Update grid visualization - handle both array and list formats
+                    let gridData = obs.grid;
+                    let gridWidth = obs.width;
+                    let gridHeight = obs.height;
+                    
+                    console.log('Updating grid from observation:', {{
+                        hasGrid: !!gridData,
+                        gridType: typeof gridData,
+                        isArray: Array.isArray(gridData),
+                        width: gridWidth,
+                        height: gridHeight
+                    }});
+                    
+                    // Convert grid to array if it's not already
+                    if (gridData && !Array.isArray(gridData)) {{
+                        if (typeof gridData === 'string') {{
+                            try {{
+                                gridData = JSON.parse(gridData);
+                                console.log('Parsed grid from string');
+                            }} catch (e) {{
+                                console.error('Error parsing grid data:', e);
+                                gridData = null;
+                            }}
+                        }}
+                    }}
+                    
+                    // Ensure we have valid grid data
+                    if (gridData && Array.isArray(gridData) && gridWidth && gridHeight) {{
+                        console.log('Rendering grid from WebSocket update:', gridWidth, 'x', gridHeight, 'cells:', gridData.length);
+                        this.renderGrid(gridData, gridWidth, gridHeight);
+                    }} else {{
+                        console.warn('Invalid grid data in WebSocket update:', {{ 
+                            grid: gridData, 
+                            gridLength: gridData ? (Array.isArray(gridData) ? gridData.length : 'not array') : 'null',
+                            width: gridWidth, 
+                            height: gridHeight 
+                        }});
+                    }}
+                }}
+                
+                // Update action logs
+                const logsDiv = document.getElementById('action-logs');
+                if (episodeState.action_logs.length === 0) {{
+                    logsDiv.innerHTML = 'No actions taken yet';
+                }} else {{
+                    logsDiv.innerHTML = episodeState.action_logs.map(log => `
+                        <div class="log-entry">
+                            <div class="log-timestamp">${{log.timestamp}} (Step ${{log.step_count}})</div>
+                            <div class="log-action">Action: ${{JSON.stringify(log.action, null, 2)}}</div>
+                            <div>
+                                <span class="log-reward">Reward: ${{log.reward !== null ? log.reward.toFixed(2) : 'None'}}</span>
+                                ${{log.done ? '<span class="log-done">DONE</span>' : ''}}
+                            </div>
+                        </div>
+                    `).join('');
+                }}
+            }}
+            
+            renderGrid(grid, width, height) {{
+                this.gridWidth = width;
+                this.gridHeight = height;
+                this.currentGrid = grid;
+                
+                const gridContainer = document.getElementById('fire-grid');
+                const gridStatus = document.getElementById('grid-status');
+                
+                if (!gridContainer) {{
+                    console.error('Grid container not found!');
+                    return;
+                }}
+                
+                // Validate grid dimensions
+                if (!width || !height || !grid || !Array.isArray(grid)) {{
+                    console.error('Invalid grid parameters:', {{ width, height, grid }});
+                    if (gridStatus) {{
+                        gridStatus.innerHTML = '<span style="color: red;">Error: Invalid grid data</span>';
+                    }}
+                    gridContainer.innerHTML = '<p style="color: red;">Error: Invalid grid data</p>';
+                    return;
+                }}
+                
+                // Calculate grid size once
+                const gridSize = grid.length;
+                const expectedSize = width * height;
+                
+                // Update status
+                if (gridStatus) {{
+                    gridStatus.innerHTML = `Grid: ${{width}}×${{height}} (${{gridSize}} cells)`;
+                }}
+                
+                // Check if grid size matches expected dimensions
+                if (gridSize !== expectedSize) {{
+                    console.warn(`Grid size mismatch: expected ${{expectedSize}}, got ${{gridSize}}`);
+                }}
+                
+                gridContainer.style.gridTemplateColumns = `repeat(${{width}}, 20px)`;
+                gridContainer.innerHTML = '';
+                
+                // Grid encoding: 0=ash, 1=fuel, 2=burning, 3=firebreak, 4=watered
+                const cellClasses = ['ash', 'fuel', 'burning', 'firebreak', 'watered'];
+                const cellLabels = ['Ash', 'Fuel', 'Burning', 'Firebreak', 'Watered'];
+                
+                console.log(`Rendering grid: ${{width}}x${{height}}, ${{gridSize}} cells`);
+                
+                let renderedCells = 0;
+                for (let y = 0; y < height; y++) {{
+                    for (let x = 0; x < width; x++) {{
+                        const index = y * width + x;
+                        const cellValue = (grid[index] !== undefined && grid[index] !== null) ? grid[index] : 0;
+                        const cellClass = cellClasses[cellValue] || 'ash';
+                        const cellLabel = cellLabels[cellValue] || 'Unknown';
+                        
+                        const cell = document.createElement('div');
+                        cell.className = `cell ${{cellClass}}`;
+                        cell.title = `(${{x}}, ${{y}}): ${{cellLabel}} (value: ${{cellValue}})`;
+                        cell.dataset.x = x;
+                        cell.dataset.y = y;
+                        cell.dataset.value = cellValue;
+                        
+                        // Click to set coordinates
+                        cell.addEventListener('click', () => {{
+                            const xInput = document.getElementById('x');
+                            const yInput = document.getElementById('y');
+                            if (xInput) xInput.value = x;
+                            if (yInput) yInput.value = y;
+                        }});
+                        
+                        gridContainer.appendChild(cell);
+                        renderedCells++;
+                    }}
+                }}
+                
+                console.log(`Grid rendered: ${{width}}x${{height}} = ${{renderedCells}} cells`);
+                
+                // Verify grid is visible
+                if (gridStatus) {{
+                    gridStatus.innerHTML = `Grid: ${{width}}×${{height}} (${{renderedCells}} cells rendered) ✅`;
+                    gridStatus.style.color = '#28a745';
+                }}
+            }}
+        }}
+        
+        // Initialize the web interface when the page loads
+        document.addEventListener('DOMContentLoaded', () => {{
+            new WildfireWebInterface();
+        }});
+    </script>
+</body>
+</html>
+    """.replace('{_generate_instructions_section(instructions_html, metadata)}', 
+                _generate_instructions_section(instructions_html, metadata))
+
+
+def _generate_instructions_section(instructions_html: str, metadata: Optional[EnvironmentMetadata]) -> str:
+    """Generate the instructions section."""
+    if not instructions_html or not metadata:
+        return ''
+    
+    return f'''
+                <!-- Instructions Section -->
+                <div class="instructions-section">
+                    <div class="instructions-header">
+                        <h3 class="instructions-title">{metadata.name if metadata else "Wildfire Environment"}</h3>
+                        <button class="instructions-toggle" id="instructions-toggle">Show Instructions</button>
+                    </div>
+                    <div class="instructions-content" id="instructions-content">
+                        <div class="instructions-readme">
+                            <!-- Client-side rendered markdown target -->
+                            <div id="instructions-markdown"></div>
+                            <!-- Fallback (very simple conversion) -->
+                            <noscript>
+                                {instructions_html}
+                            </noscript>
+                        </div>
+                    </div>
+                </div>
+    '''
+
+
+def _markdown_to_html_simple(markdown: str) -> str:
+    """Convert basic markdown to HTML."""
+    import html
+    import re
+    
+    # Escape HTML first
+    html_content = html.escape(markdown)
+    
+    # Convert headers
+    html_content = re.sub(r'^# (.*?)$', r'<h1>\1</h1>', html_content, flags=re.MULTILINE)
+    html_content = re.sub(r'^## (.*?)$', r'<h2>\1</h2>', html_content, flags=re.MULTILINE)
+    html_content = re.sub(r'^### (.*?)$', r'<h3>\1</h3>', html_content, flags=re.MULTILINE)
+    
+    # Convert code blocks
+    html_content = re.sub(r'```(.*?)\n(.*?)\n```', r'<pre><code>\2</code></pre>', html_content, flags=re.DOTALL)
+    html_content = re.sub(r'`([^`]+)`', r'<code>\1</code>', html_content)
+    
+    # Convert bold and italic
+    html_content = re.sub(r'\*\*(.*?)\*\*', r'<strong>\1</strong>', html_content)
+    html_content = re.sub(r'\*(.*?)\*', r'<em>\1</em>', html_content)
+    
+    # Convert lists
+    html_content = re.sub(r'^- (.*?)$', r'<li>\1</li>', html_content, flags=re.MULTILINE)
+    html_content = re.sub(r'(<li>.*</li>)', r'<ul>\1</ul>', html_content, flags=re.DOTALL)
+    
+    # Convert line breaks
+    html_content = html_content.replace('\n', '<br>')
+    
+    return html_content
+