Brad Did Something - Gradio/FastAPI Space on HF

.dockerignore

@@ -0,0 +1,20 @@
+__pycache__/
+*.pyc
+*.pyo
+.pytest_cache/
+.git/
+models/
+*.gguf
+*.log
+trace.log
+.bds_modal_token
+.venv/
+venv/
+node_modules/
+
+# heavy, non-runtime assets — the running app never reads these
+lora/
+Design System/
+# design/engineering docs (also gitignored) — not needed in the image
+*.md
+!README.md

.gitattributes

@@ -0,0 +1,6 @@
+*.woff2 filter=lfs diff=lfs merge=lfs -text
+*.png filter=lfs diff=lfs merge=lfs -text
+*.jpg filter=lfs diff=lfs merge=lfs -text
+*.jpeg filter=lfs diff=lfs merge=lfs -text
+*.ico filter=lfs diff=lfs merge=lfs -text
+*.mp3 filter=lfs diff=lfs merge=lfs -text

.gitignore

@@ -0,0 +1,22 @@
+# secrets — never commit or upload
+.bds_modal_token
+
+# local model weights
+models/
+
+# test artifacts + runtime logs
+tests/shots/
+logs/
+__pycache__/
+*.pyc
+.pytest_cache/
+
+# design + engineering docs — keep them local, don't ship to the Space.
+# (README.md MUST stay — HF reads the Space frontmatter from it.)
+/*.md
+!/README.md
+
+# non-runtime asset folders (lots of binaries) — not needed by the running app
+lora/
+tests/comic_samples/
+Design System/

Dockerfile

@@ -0,0 +1,23 @@
+# HF Space runs this as `sdk: docker` (see README frontmatter). We can't use
+# `sdk: gradio` because that runner imports a module-level `demo` and never
+# starts uvicorn — our app is a FastAPI server with Gradio *mounted* on top, so
+# it must be launched explicitly. Gradio stays mounted at "/", so the Space
+# still "uses Gradio". Local dev is unchanged: `python app.py`.
+FROM python:3.11-slim
+
+# HF Spaces execute as a non-root user (uid 1000); give it a writable home.
+RUN useradd -m -u 1000 user
+WORKDIR /home/user/app
+
+COPY --chown=user requirements.txt .
+RUN pip install --no-cache-dir -r requirements.txt
+
+COPY --chown=user . .
+
+USER user
+ENV PORT=7860
+EXPOSE 7860
+
+# MODAL_URL/MODAL_TOKEN (text) and FLUX_URL/FLUX_TOKEN (comic art) are provided
+# as Space secrets; unset → mock text + no comic overlay (still fully playable).
+CMD ["uvicorn", "app:app", "--host", "0.0.0.0", "--port", "7860"]

README.md

@@ -0,0 +1,118 @@
+---
+title: Brad Did Something
+emoji: 🚀
+colorFrom: pink
+colorTo: yellow
+sdk: docker
+app_port: 7860
+pinned: false
+license: mit
+short_description: Argue your way to $1M before the quarter ends
+---
+
+# Brad Did Something
+
+2D top-down office comedy game. You are the Head of Sales and Partnerships at
+Veloura Technologies. Five unhinged underlings, 15 events, one quarter, one
+million dollars. The Office meets Silicon Valley, in cozy daylight pixel art.
+
+All NPC dialogue and outcomes are generated by llama.cpp (Qwen3.5-9B)
+running on Modal, with JSON-schema-enforced output validated in Python before
+anything reaches the screen.
+
+## Run locally
+
+```
+pip install -r requirements.txt
+python app.py            # → http://localhost:7860
+```
+
+With no `MODAL_URL` set, the game runs in **mock mode** — fully playable, with
+a template-based offline generator standing in for the model.
+
+## Wire up live inference (Modal)
+
+Already deployed to the `qfelix0112` workspace — endpoint:
+`https://qfelix0112--brad-did-something-llama-generate.modal.run`
+(L4 GPU, warm calls 2-4s, stays warm 5 min between calls). The auth token
+lives in `.bds_modal_token` (gitignored — never commit/upload it).
+
+Play against it: `.\run_modal.ps1`
+
+To redeploy after changing `modal_app/inference.py`:
+
+```
+set PYTHONUTF8=1                        # Windows: avoids a CLI encoding crash
+modal deploy modal_app/inference.py     # prints the web endpoint URL
+python tests/smoke_modal.py             # one real call per call type
+```
+
+`MODAL_URL` is the full generate-endpoint URL (Modal gives each function its
+own URL). For the HF Space, set `MODAL_URL` + `MODAL_TOKEN` as Space secrets.
+
+## Comic panels (FLUX image generation)
+
+When a crisis fires, the text model also writes a wordless `image_prompt` (a
+single-panel scene) plus a short `comic_caption`. A second Modal GPU app renders
+the panel with **FLUX.2 [klein] 4B**; the UI shows it centered over the office
+with the caption drawn as crisp text *above* the picture (the image stays
+wordless because FLUX garbles in-image text). The art style is prepended
+server-side in `/api/comic`, so the model spends its whole budget describing the
+scene. Setup renders during the walk to the NPC, payoff after the outcome. It's
+purely decorative: if FLUX is unset, slow, or fails, the game shows **no
+overlay** and the dialogue opens as usual — the outcome is never blocked.
+
+```
+set PYTHONUTF8=1
+modal secret create huggingface HF_TOKEN=<hf token>   # FLUX weights are gated
+modal deploy modal_app/image.py                        # prints the endpoint URL
+python tests/probe_comic.py                             # latency + saves a sample
+```
+
+Then set `FLUX_URL` (the printed `generate_image` URL) and `FLUX_TOKEN` (the
+same `bds-auth` `BDS_TOKEN`) — locally or as Space secrets. The model is
+env-swappable at deploy: `FLUX_MODEL_ID=black-forest-labs/FLUX.1-schnell`
+(Apache-2.0) is a drop-in if FLUX.2's deps/VRAM are troublesome.
+**License:** the FLUX.2 line is typically non-commercial — fine for a hackathon
+demo; review before any commercial use.
+
+## Deploy on Hugging Face (Docker)
+
+The app is built on **`gr.Server`** (Gradio's FastAPI-based server): it serves a
+fully custom canvas/DOM frontend from `static/` with zero default Gradio
+widgets, while staying a first-class Gradio app. The Space uses `sdk: docker`
+(see frontmatter) because HF's `sdk: gradio` runner only launches a module-level
+`demo`; the `Dockerfile` runs `uvicorn app:app` on port 7860 (the `gr.Server`
+instance is the ASGI app). Set `MODAL_URL`/`MODAL_TOKEN` and (optional)
+`FLUX_URL`/`FLUX_TOKEN` as Space secrets. Dry-run locally:
+
+```
+docker build -t bds .
+docker run -p 7860:7860 bds          # → http://localhost:7860
+```
+
+## Tests
+
+```
+pytest tests/                          # unit tests (validator, economy, events, comic, idle)
+python tests/smoke_http.py             # full-quarter API playthrough
+python tests/smoke_browser.py          # headless-browser UI smoke (playwright)
+python tests/probe_mobile.py           # touch-controls smoke on an emulated phone
+python tests/probe_comic.py            # live FLUX render + saves sample panels
+```
+
+## Controls
+
+WASD / arrows move · SPACE talk / pick up / answer / advance comic · G gift ·
+1/2 choose options · ENTER send typed response · ESC close · M mute
+
+**Touch / mobile:** on phones and tablets an on-screen joystick (move) plus
+ACT (= SPACE) and GIFT buttons appear automatically; tapping the floor also
+walks the player. Portrait layout stacks the HUD and hides the paper-trail
+panel. Comics and dialogue are tap-dismissable.
+
+## Docs
+
+Design docs (GAME_DESIGN, MECHANICS, EVENTS, …) and engineering docs
+(ARCHITECTURE, SCHEMAS, AI_PROMPTS, IMPLEMENTATION_PLAN) live in the repo
+root. Start with AGENTS.md.

app.py

@@ -0,0 +1,228 @@
+"""Brad Did Something — HF Space entry point.
+
+Built on `gr.Server` (Gradio's FastAPI-based server, ARCHITECTURE.md D1): it
+owns the /api routes and serves a fully custom canvas/DOM frontend from static/
+— no default Gradio widgets. Run: python app.py  (HF Docker: uvicorn app:app)
+"""
+from __future__ import annotations
+
+import os
+import pathlib
+
+import gradio as gr
+import uvicorn
+from fastapi import HTTPException
+from fastapi.responses import FileResponse
+from fastapi.staticfiles import StaticFiles
+from pydantic import BaseModel, Field
+
+from game import (comic, economy, events, idle, llm, presentation, prompts,
+                  relationships)
+from game.schemas import GIFT_TIERS, NPC_IDS, RESPONSE_TYPES
+from game.state import STORE, GameState
+from game.trace import trace
+
+ROOT = pathlib.Path(__file__).parent
+# gr.Server is Gradio's own FastAPI-based server (Gradio 5.x+). Using it as the
+# base means the whole app is a first-class Gradio app while every route below is
+# plain FastAPI — so we serve a fully custom canvas/DOM frontend (static/) with
+# no default Gradio widgets. (Replaces the old FastAPI + mount_gradio_app shell.)
+api = gr.Server(title="Brad Did Something")
+app = api  # the ASGI app served by `uvicorn app:app` (local + HF Docker)
+
+
+# ------------------------------------------------------------- request models
+
+class SessionBody(BaseModel):
+    session_id: str = Field(min_length=8, max_length=64)
+
+
+class RespondBody(SessionBody):
+    response_type: str
+    text: str = Field(default="", max_length=400)
+
+
+class GiftBody(SessionBody):
+    npc_id: str
+    tier: str
+
+
+class ChatBody(SessionBody):
+    npc_id: str
+    text: str = Field(default="", max_length=400)
+
+
+class ComicBody(SessionBody):
+    image_prompt: str = Field(default="", max_length=400)
+
+
+def _get_state(session_id: str) -> GameState:
+    state = STORE.get(session_id)
+    if state is None:
+        raise HTTPException(404, "unknown session — start a new game")
+    return state
+
+
+# --------------------------------------------------------------------- routes
+
+@api.post("/api/warm")
+def warm() -> dict:
+    """Wake the Modal containers early (called on page load) so the first
+    real event doesn't eat a cold start."""
+    llm.warm()
+    comic.warm()
+    return {"ok": True}
+
+
+@api.post("/api/comic")
+def comic_panel(body: ComicBody) -> dict:
+    """Render the crisis comic from an AI-written image_prompt. Returns
+    {image_b64: null} when FLUX is unavailable / fails / times out — the
+    client then simply skips the overlay and opens the dialogue as usual."""
+    _get_state(body.session_id)  # session must exist
+    panels = body.image_prompt.strip()
+    if not panels:
+        return {"image_b64": None}
+    # prepend the art style here so the model spends its whole image_prompt
+    # budget on panel descriptions (else the ~230-char style tag ate the budget
+    # and the panels truncated to a single panel)
+    img = comic.generate_comic(f"{prompts.COMIC_STYLE}. {panels}")
+    return {"image_b64": img}
+
+
+@api.post("/api/new_game")
+def new_game() -> dict:
+    llm.warm()  # belt-and-suspenders prewarm at game start
+    comic.warm()
+    state = STORE.create()
+    state.phase = "free_roam"
+    trace("flow", f"=== NEW GAME {state.session_id[:8]} "
+                  f"({'LIVE ' + os.environ.get('MODAL_URL', '') if os.environ.get('MODAL_URL') else 'MOCK mode'})")
+    return {"session_id": state.session_id, "state": state.snapshot()}
+
+
+@api.post("/api/next_event")
+def next_event(body: SessionBody) -> dict:
+    state = _get_state(body.session_id)
+    if state.game_over:
+        raise HTTPException(409, "quarter is over")
+    event = events.next_event(state)
+    return {"event": event, "state": state.snapshot()}
+
+
+@api.post("/api/respond")
+def respond(body: RespondBody) -> dict:
+    state = _get_state(body.session_id)
+    if body.response_type not in RESPONSE_TYPES:
+        raise HTTPException(422, "bad response_type")
+    if state.phase != "crisis" or not state.current_event:
+        raise HTTPException(409, "no active crisis")
+    outcome = events.respond(state, body.response_type, body.text.strip())
+    return {"outcome": outcome, "state": state.snapshot()}
+
+
+@api.post("/api/presentation_round")
+def presentation_round(body: RespondBody) -> dict:
+    state = _get_state(body.session_id)
+    if state.phase != "presentation" or state.presentation is None:
+        raise HTTPException(409, "no active presentation")
+    round_data = presentation.advance(state, body.response_type, body.text.strip())
+    return {"round_data": round_data, "state": state.snapshot()}
+
+
+@api.post("/api/gift")
+def gift(body: GiftBody) -> dict:
+    state = _get_state(body.session_id)
+    if state.phase != "free_roam":
+        raise HTTPException(409, "gifts only between crises")
+    cost = economy.gift_cost(body.tier)
+    if cost is None:
+        raise HTTPException(422, "bad tier")
+    if state.pocket_money < cost:
+        raise HTTPException(409, "insufficient pocket money")
+    if body.tier == "coffee":
+        state.pocket_money -= cost
+        relationships.coffee_round(state)
+        result = {"kind": "coffee", "cost": cost}
+        trace("flow", f"coffee round -$50 -> morale {state.morale}")
+    else:
+        if body.npc_id not in NPC_IDS:
+            raise HTTPException(422, "bad npc_id")
+        state.pocket_money -= cost
+        result = relationships.give_gift(state, body.npc_id, cost)
+        result.update({"kind": "gift", "cost": cost, "npc_id": body.npc_id})
+        trace("flow", f"gift {body.tier} -> {body.npc_id} "
+                      f"rel+{result['relationship_delta']}"
+                      f"{' (halved)' if result['halved'] else ''}"
+                      f"{' UNLOCKED' if result['unlocked'] else ''} "
+                      f"-> {state.npc(body.npc_id).relationship}")
+    return {"result": result, "state": state.snapshot()}
+
+
+@api.post("/api/chat")
+def chat(body: ChatBody) -> dict:
+    state = _get_state(body.session_id)
+    if state.phase != "free_roam":
+        raise HTTPException(409, "chat only between crises")
+    if body.npc_id not in NPC_IDS:
+        raise HTTPException(422, "bad npc_id")
+    try:
+        if body.text.strip():
+            result = idle.reply_chat(state, body.npc_id, body.text.strip())
+        else:
+            result = idle.open_chat(state, body.npc_id)
+    except idle.IdleError as exc:
+        raise HTTPException(409, str(exc))
+    return {"chat": result, "state": state.snapshot()}
+
+
+@api.post("/api/idle")
+def idle_roll(body: SessionBody) -> dict:
+    state = _get_state(body.session_id)
+    if state.phase != "free_roam":
+        raise HTTPException(409, "idle moments only between crises")
+    try:
+        result = idle.roll_idle(state)
+    except idle.IdleError as exc:
+        raise HTTPException(409, str(exc))
+    return {"idle": result, "state": state.snapshot()}
+
+
+@api.post("/api/read_email")
+def read_email(body: SessionBody) -> dict:
+    state = _get_state(body.session_id)
+    try:
+        email = idle.read_email(state)
+    except idle.IdleError as exc:
+        raise HTTPException(409, str(exc))
+    return {"email": email, "state": state.snapshot()}
+
+
+@api.post("/api/review")
+def review(body: SessionBody) -> dict:
+    state = _get_state(body.session_id)
+    if state.phase != "review":
+        raise HTTPException(409, "quarter not finished")
+    data = state.review or presentation.quarterly_review(state)
+    return {"review": data, "state": state.snapshot()}
+
+
+@api.get("/healthz")
+def healthz() -> dict:
+    return {"ok": True}
+
+
+# ------------------------------------------------------------- custom frontend
+
+api.mount("/static", StaticFiles(directory=ROOT / "static"), name="static")
+
+
+@api.get("/")
+@api.get("/game")
+def game_page() -> FileResponse:
+    """Serve the fully custom canvas/DOM game frontend (no Gradio widgets)."""
+    return FileResponse(ROOT / "static" / "index.html")
+
+
+if __name__ == "__main__":
+    uvicorn.run(app, host="0.0.0.0", port=int(os.environ.get("PORT", 7860)))

game/comic.py

@@ -0,0 +1,73 @@
+"""Modal FLUX client for comic-panel image generation.
+
+If FLUX_URL is set, POSTs the image prompt to the Modal FLUX endpoint and
+returns a base64 PNG. Otherwise — or on any failure/timeout — returns None,
+and the frontend renders the composed chibi-comic fallback instead. Mirrors the
+warm / cold-timeout pattern in llm.py.
+"""
+from __future__ import annotations
+
+import os
+import threading
+import time
+
+import requests
+
+from .trace import trace
+
+FLUX_TIMEOUT = float(os.environ.get("BDS_FLUX_TIMEOUT", "12"))
+FLUX_COLD_TIMEOUT = float(os.environ.get("BDS_FLUX_COLD_TIMEOUT", "90"))
+_warmed = False
+
+
+def flux_available() -> bool:
+    return bool(os.environ.get("FLUX_URL"))
+
+
+def _headers() -> dict:
+    return {"Authorization": "Bearer " + os.environ.get("FLUX_TOKEN", "")}
+
+
+def warm() -> None:
+    """Boot the FLUX container in the background (page load / new game)."""
+    if not flux_available() or _warmed:
+        return
+    threading.Thread(target=_warm_ping, daemon=True).start()
+
+
+def _warm_ping() -> None:
+    try:
+        requests.post(os.environ["FLUX_URL"], json={"warmup": True},
+                      headers=_headers(), timeout=FLUX_COLD_TIMEOUT + 60)
+        trace("flux", "warmup ping done")
+    except requests.RequestException:
+        pass
+
+
+def generate_comic(prompt: str) -> str | None:
+    """Return a base64 PNG for the comic, or None → composed fallback."""
+    if not flux_available() or not prompt:
+        return None
+    global _warmed
+    timeout = FLUX_TIMEOUT if _warmed else FLUX_COLD_TIMEOUT
+    t0 = time.time()
+    try:
+        resp = requests.post(os.environ["FLUX_URL"], json={"prompt": prompt},
+                             headers=_headers(), timeout=timeout)
+        ms = int((time.time() - t0) * 1000)
+        if resp.status_code == 200:
+            body = resp.json()
+            img = body.get("image_b64")
+            if img:
+                _warmed = True
+                trace("flux", f"comic LIVE {ms}ms ({len(img)}b)")
+                return img
+            trace("flux", f"comic not-ok {ms}ms: "
+                          f"{str(body.get('error', body))[:120]}")
+        else:
+            trace("flux", f"comic HTTP {resp.status_code} {ms}ms")
+    except requests.Timeout:
+        trace("flux", f"comic TIMEOUT after {timeout}s")
+    except requests.RequestException as exc:
+        trace("flux", f"comic transport error: {str(exc)[:120]}")
+    return None

game/context.py

@@ -0,0 +1,52 @@
+"""Global context builder — state → the exact context object in SCHEMAS.md."""
+from __future__ import annotations
+
+from .schemas import APPROVED_CLIENTS, NPC_IDS
+from .state import GameState
+
+
+def build_context(state: GameState) -> dict:
+    return {
+        "game_config": {
+            "company": "Veloura Technologies",
+            "player_title": "Head of Sales and Partnerships",
+            "crisis_number": state.crisis_number,
+            "total_crises": 15,
+            "tone": "comedic corporate satire — The Office meets Silicon Valley",
+            "approved_clients": APPROVED_CLIENTS,
+        },
+        "financial_state": {
+            "revenue": state.revenue,
+            "target": state.target,
+            "company_budget": state.company_budget,
+            "bonuses_issued": state.bonuses_issued,
+            "total_bonus_spend": state.total_bonus_spend,
+            "pocket_money": state.pocket_money,
+            "bribes_accepted": state.bribes_accepted,
+        },
+        "team_state": {
+            "morale": state.morale,
+            "npcs": {
+                n: {
+                    "relationship": s.relationship,
+                    "gifts_received": s.gifts_received,
+                    "mood": s.mood,
+                    "incident_count": s.incident_count,
+                    "personal_situation": s.personal_situation,
+                    "recent_events": s.recent_events[-3:],
+                }
+                for n, s in state.npcs.items()
+            },
+        },
+        "constraint_state": {
+            "budget_warning": state.company_budget < 5_000,
+            "board_scrutiny": state.board_scrutiny,
+            "consecutive_praise": {n: state.npc(n).consecutive_praise for n in NPC_IDS},
+            "consecutive_harsh": state.consecutive_harsh,
+            "consecutive_fine_whatever": state.consecutive_fine_whatever,
+            "hr_alert": state.hr_alert,
+            "extended_presentation": bool(
+                state.presentation and state.presentation.get("extended")),
+        },
+        "event_log": list(state.event_log),
+    }

game/economy.py

@@ -0,0 +1,129 @@
+"""Revenue, budget, bonuses, pocket money, bribery — MECHANICS.md rules."""
+from __future__ import annotations
+
+import os
+
+from .schemas import GIFT_TIERS
+from .state import GameState
+
+BONUS_PER_EVENT_CAP = 5_000
+BONUS_QUARTER_CAP = 20_000
+BONUS_SCRUTINY_THRESHOLD = 3
+SALARY_EVERY = 3
+SALARY_AMOUNT = 1_000
+
+# balance is driven by the crisis prompt's revenue anchors (the model follows
+# them well); this multiplier on LIVE crisis deltas stays a dormant safety knob
+# (1.0 = off) in case the model drifts low again. Mock deltas are not scaled.
+REVENUE_SCALE = float(os.environ.get("BDS_REVENUE_SCALE", "1.0"))
+
+
+def scale_revenue(raw: int) -> int:
+    """Scale a raw live-model revenue delta toward the intended economy."""
+    try:
+        return int(round(raw * REVENUE_SCALE))
+    except (TypeError, ValueError):
+        return 0
+
+
+def apply_revenue(state: GameState, delta: int) -> int:
+    """Applies a revenue delta with the zero floor. Returns the applied delta."""
+    applied = max(delta, -state.revenue)
+    state.revenue += applied
+    return applied
+
+
+def apply_pocket(state: GameState, delta: int) -> int:
+    applied = max(delta, -state.pocket_money)
+    state.pocket_money += applied
+    return applied
+
+
+def salary_tick(state: GameState) -> bool:
+    """Called once per resolved crisis. Monthly salary advance every 3 crises."""
+    state.crises_since_salary += 1
+    if state.crises_since_salary >= SALARY_EVERY:
+        state.crises_since_salary = 0
+        state.pocket_money += SALARY_AMOUNT
+        return True
+    return False
+
+
+def can_bonus(state: GameState, amount: int) -> bool:
+    return (state.company_budget >= 5_000
+            and amount <= BONUS_PER_EVENT_CAP
+            and amount <= state.company_budget
+            and state.total_bonus_spend + amount <= BONUS_QUARTER_CAP)
+
+
+def issue_bonus(state: GameState, npc_id: str, amount: int) -> bool:
+    if not can_bonus(state, amount):
+        return False
+    state.company_budget -= amount
+    state.total_bonus_spend += amount
+    state.bonuses_issued += 1
+    state.npc(npc_id).relationship = min(100, state.npc(npc_id).relationship + 8)
+    if state.bonuses_issued > BONUS_SCRUTINY_THRESHOLD:
+        raise_scrutiny(state)  # the board noticed the pattern
+    return True
+
+
+def gift_cost(tier: str) -> int | None:
+    return GIFT_TIERS.get(tier)
+
+
+def accept_bribe(state: GameState, offer: int) -> dict:
+    state.bribes_accepted += 1
+    state.pocket_money += offer
+    consequences = {"scrutiny": None, "hr": False}
+    if state.bribes_accepted == 2:
+        if state.board_scrutiny == "low":
+            state.board_scrutiny = "medium"
+        consequences["scrutiny"] = state.board_scrutiny
+    elif state.bribes_accepted >= 3:
+        state.board_scrutiny = "high" if state.board_scrutiny in (
+            "low", "medium") else state.board_scrutiny
+        state.hr_alert = True
+        consequences["scrutiny"] = state.board_scrutiny
+        consequences["hr"] = True
+    return consequences
+
+
+def decline_bribe(state: GameState) -> None:
+    state.morale = min(100, state.morale + 5)
+
+
+SCRUTINY_ORDER = ["low", "medium", "high", "critical"]
+
+
+def raise_scrutiny(state: GameState) -> None:
+    i = SCRUTINY_ORDER.index(state.board_scrutiny)
+    if i < 2:  # critical is only reached via the high-streak rule
+        state.board_scrutiny = SCRUTINY_ORDER[i + 1]
+
+
+def lower_scrutiny(state: GameState) -> None:
+    i = SCRUTINY_ORDER.index(state.board_scrutiny)
+    if i > 0:
+        state.board_scrutiny = SCRUTINY_ORDER[i - 1]
+    state.scrutiny_high_streak = 0
+
+
+def scrutiny_tick(state: GameState) -> None:
+    """Once per resolved crisis: high maintained >4 crises → critical."""
+    if state.board_scrutiny in ("high", "critical"):
+        state.scrutiny_high_streak += 1
+        if state.scrutiny_high_streak > 4:
+            state.board_scrutiny = "critical"
+    else:
+        state.scrutiny_high_streak = 0
+
+
+def ending_tier(state: GameState) -> str:
+    if state.revenue >= state.target:
+        return "hit_target"
+    if state.revenue > 600_000:
+        return "above_600k"
+    if state.revenue >= 300_000:
+        return "300k_to_600k"
+    return "below_300k"

game/events.py

@@ -0,0 +1,381 @@
+"""Event sequencing: slot rolls, special events, crisis resolution."""
+from __future__ import annotations
+
+import random
+
+from . import (economy, fallbacks, idle, llm, presentation, prompts,
+               relationships, validator)
+from .schemas import BRIBE_AMOUNTS, NPC_IDS
+from .state import PRESENTATION_EVENTS, TOTAL_CRISES, GameState
+from .trace import trace
+
+SPECIAL_BASE_CHANCE = 0.25
+SPECIAL_DROUGHT_CHANCE = 0.60
+DROUGHT_AFTER = 3
+
+ARRIVALS = {
+    "normal": "npc",
+    "newspaper": "newspaper",
+    "bribery": "envelope",
+    "personal": "npc_amber",
+    "client_emergency": "phone",
+    "hr": "hr",
+    "suspicion": "npc_amber",
+    "romance": "npc_heart",
+}
+
+ROMANCE_ELIGIBLE = 70  # relationship at which an NPC may make a move
+
+
+def _romance_candidate(state: GameState) -> str | None:
+    """Highest-relationship NPC ready to start a romance, if any."""
+    pool = [n for n in NPC_IDS
+            if state.npc(n).relationship >= ROMANCE_ELIGIBLE
+            and not state.npc(n).romance_active]
+    if not pool:
+        return None
+    return max(pool, key=lambda n: state.npc(n).relationship)
+
+
+def _any_romance_active(state: GameState) -> bool:
+    return any(state.npc(n).romance_active for n in NPC_IDS)
+
+
+def next_event(state: GameState) -> dict:
+    """Advance to the next event slot. Returns the event payload."""
+    if state.current_event is not None:
+        return state.current_event  # idempotent: crisis already active
+    if state.crisis_number >= TOTAL_CRISES:
+        state.phase = "review"
+        return {"kind": "review"}
+
+    state.crisis_number += 1
+    idle.reset_gap(state)  # idle budgets refresh with every new event slot
+
+    if state.crisis_number in PRESENTATION_EVENTS:
+        state.phase = "presentation"
+        presentation.start(state)
+        trace("flow", f"event {state.crisis_number}: PRESENTATION "
+                      f"(presenting={state.presentation['presenting_npc']} "
+                      f"state={state.presentation['npc_state']} "
+                      f"rounds={state.presentation['total_rounds']})")
+        event = {
+            "kind": "presentation",
+            "arrival": "boardroom",
+            "crisis_number": state.crisis_number,
+            "final": state.crisis_number == TOTAL_CRISES,
+        }
+        state.current_event = event
+        return event
+
+    kind = _roll_slot(state)
+    if kind == "normal":
+        event = _normal_pitch(state)
+    elif kind == "bribery":
+        event = _bribery_event(state)
+    else:
+        event = _special_event(state, kind)
+
+    event["kind"] = "crisis"
+    event["special"] = kind if kind != "normal" else None
+    event["arrival"] = ARRIVALS[kind]
+    event["crisis_number"] = state.crisis_number
+    state.current_event = event
+    state.phase = "crisis"
+    trace("flow", f"event {state.crisis_number}: {kind} npc={event['affected_npc']} "
+                  f"\"{event['headline']}\" (drought={state.special_drought})")
+    return event
+
+
+def _roll_slot(state: GameState) -> str:
+    if state.queued_special:
+        kind = state.queued_special
+        state.queued_special = None
+        state.special_drought = 0
+        return kind
+    chance = (SPECIAL_DROUGHT_CHANCE if state.special_drought >= DROUGHT_AFTER
+              else SPECIAL_BASE_CHANCE)
+    if random.random() < chance:
+        state.special_drought = 0
+        if state.hr_alert:
+            return "hr"
+        pool = ["newspaper", "bribery", "personal", "client_emergency"]
+        # one romance at a time; offer it when someone is ready to make a move
+        if _romance_candidate(state) and not _any_romance_active(state):
+            pool += ["romance", "romance"]  # weight it up once eligible
+        return random.choice(pool)
+    state.special_drought += 1
+    return "normal"
+
+
+def _pick_npc(state: GameState) -> str:
+    """Prefer NPCs with fewer incidents; mild bias toward interesting moods."""
+    weights = []
+    for n in NPC_IDS:
+        npc = state.npc(n)
+        w = 4.0 / (1 + npc.incident_count)
+        if npc.mood not in ("normal", "happy"):
+            w *= 1.4
+        weights.append(w)
+    return random.choices(NPC_IDS, weights=weights)[0]
+
+
+def _normal_pitch(state: GameState) -> dict:
+    npc_id = _pick_npc(state)
+    system, user = prompts.event_prompt(state, f"normal pitch from {npc_id}")
+    payload = llm.call_validated(state, "event", system, user,
+                                 lambda p: validator.validate_event(p, state),
+                                 requested_type="normal", npc_id=npc_id)
+    if payload is None:
+        state.fallback_count += 1
+        payload = fallbacks.event_fallback(state.crisis_number)
+        payload["affected_npc"] = npc_id
+    payload["affected_npc"] = payload.get("affected_npc") or npc_id
+    if payload["affected_npc"] == "player":
+        payload["affected_npc"] = npc_id
+    return payload
+
+
+def _special_event(state: GameState, kind: str) -> dict:
+    romance_npc = _romance_candidate(state) if kind == "romance" else None
+    flavors = {
+        "newspaper": "newspaper incident — a quarter disaster reached the press",
+        "personal": "personal NPC life event bleeding into work",
+        "client_emergency": "client emergency — a client situation just detonated",
+        "hr": "formal HR conversation the player must navigate"
+              + (" — it is about an office romance" if _any_romance_active(state)
+                 else ""),
+        "suspicion": "the team has collectively noticed the player praising too much; "
+                     "they suspect layoffs or worse",
+        "romance": (
+            f"an office-romance moment: {romance_npc} has clearly developed "
+            "feelings for the player (their boss) and finally makes a move — a "
+            "lingering after-hours conversation, a too-personal gift, a "
+            "confession disguised as a work question. option_a is the player "
+            "LEANING IN / reciprocating; option_b is the player keeping it "
+            "warmly professional. Both are first-person player actions. Stay "
+            "sweet and absurd, never explicit."),
+    }
+    system, user = prompts.event_prompt(state, flavors[kind])
+    payload = llm.call_validated(state, "event", system, user,
+                                 lambda p: validator.validate_event(p, state),
+                                 requested_type=kind, romance_npc=romance_npc)
+    if payload is None:
+        state.fallback_count += 1
+        # type-matched fallback so a newspaper stays a press story, etc.
+        payload = (fallbacks.romance_fallback(romance_npc) if kind == "romance"
+                   else fallbacks.special_fallback(kind, state.crisis_number))
+    if kind == "newspaper":
+        payload["affected_npc"] = "brad"  # usually Brad. It is always Brad.
+        state.npc("brad").mood = "sheepish"
+    if kind == "romance" and romance_npc:
+        payload["affected_npc"] = romance_npc  # the resolution needs the target
+    return payload
+
+
+def _bribery_event(state: GameState) -> dict:
+    offer = random.choice(BRIBE_AMOUNTS)
+    state.pending_bribe = offer
+    return {
+        "affected_npc": "player",
+        "category": "financial",
+        "headline": "An envelope has appeared on your desk",
+        "intro": f"> no sender. inside: ${offer:,} and a note: 'for your "
+                 "flexibility on the Northpath Solutions terms. there is more "
+                 "where this came from.'",
+        "option_a": f"ACCEPT — pocket the ${offer:,}. No immediate consequence. Immediate is doing a lot of work there.",
+        "option_b": "DECLINE — slide it back under the door of reality.",
+        "urgency": "The envelope is slightly warm. Why is it warm.",
+        "setup_animation": "bribery_envelope",
+        "morale_preview": 0,
+        "bribe_offer": offer,
+    }
+
+
+# ---------------------------------------------------------------- responding
+
+def respond(state: GameState, response_type: str, text: str) -> dict:
+    """Resolve the active crisis with the player's response."""
+    event = state.current_event
+    if not event or event.get("kind") != "crisis":
+        raise ValueError("no active crisis")
+
+    trace("flow", f"respond [{response_type}]"
+                  + (f" \"{text}\"" if text else ""))
+    if event.get("special") == "bribery":
+        outcome = _resolve_bribery(state, response_type, text)
+    else:
+        outcome = _resolve_crisis(state, event, response_type, text)
+
+    # bookkeeping shared by every resolution
+    salary_paid = economy.salary_tick(state)
+    economy.scrutiny_tick(state)
+    state.current_event = None
+    state.phase = "free_roam"
+    outcome["salary_paid"] = salary_paid
+    outcome["state_phase"] = state.phase
+    return outcome
+
+
+def _resolve_crisis(state: GameState, event: dict, response_type: str,
+                    text: str) -> dict:
+    npc_id = event["affected_npc"]
+    if npc_id == "player":
+        npc_id = random.choice(NPC_IDS)
+    system, user = prompts.crisis_prompt(state, npc_id, event, response_type, text)
+    payload = llm.call_validated(
+        state, "crisis", system, user,
+        lambda p: validator.validate_crisis(p, state, npc_id),
+        npc_id=npc_id, response_type=response_type,
+        player_response=text, crisis=event)
+    if payload is None:
+        state.fallback_count += 1
+        trace("flow", f"FALLBACK outcome for {npc_id} "
+                      f"(#{state.fallback_count} this session)")
+        payload = fallbacks.crisis_fallback(npc_id, response_type)
+        payload = validator.validate_crisis(payload, state, npc_id)
+
+    # a loss that hit the $0 floor still deserves its moment
+    if payload.get("floored_loss"):
+        payload["consequence"] = (payload["consequence"].rstrip(". ")[:130]
+                                  + ". There was nothing left to lose.")
+
+    # apply deltas server-side
+    morale_before = state.morale
+    applied_rev = economy.apply_revenue(state, payload["revenue_delta"])
+    relationships.apply_morale(state, payload["morale_delta"])
+    npc = state.npc(npc_id)
+    before_rel = npc.relationship
+    relationships.apply_relationship(state, npc_id, payload["relationship_delta"])
+    unlocked = relationships.crossed_unlock(before_rel, npc.relationship)
+    economy.apply_pocket(state, payload["pocket_money_delta"])
+    npc.incident_count += 1
+    npc.recent_events.append(payload["log_entry"])
+    relationships.update_mood_from_outcome(state, npc_id, payload["animation"])
+    trace("flow", f"applied: rev {applied_rev:+,} -> ${state.revenue:,} | "
+                  f"morale {morale_before}->{state.morale} | "
+                  f"rel[{npc_id}] {before_rel}->{npc.relationship} | "
+                  f"mood={npc.mood} anim={payload['animation']}"
+                  + (" | RELATIONSHIP UNLOCKED" if unlocked else ""))
+
+    # guardrails driven by the player's words
+    tone = relationships.classify_tone(response_type, text)
+    praise_result = relationships.praise_tick(state, npc_id, tone)
+    if praise_result:
+        trace("econ", f"praise guardrail: {praise_result} for {npc_id}")
+    if praise_result == "suspicion_event":
+        state.queued_special = "suspicion"
+    relationships.harsh_tick(state, tone)
+    if tone == "harsh":
+        trace("econ", f"harsh tone detected -> rel[{npc_id}] -6, morale -3")
+        relationships.apply_relationship(state, npc_id, -6)
+
+    if response_type == "quick_fine":
+        state.consecutive_fine_whatever += 1
+        npc.mood = "smug"  # their confidence increases. This is worse.
+        trace("econ", f"FINE WHATEVER #{state.consecutive_fine_whatever} "
+                      "since last presentation")
+    else:
+        state.consecutive_fine_whatever = 0
+
+    if event.get("special") == "newspaper":
+        state.newspaper_count += 1
+        if applied_rev < 0:
+            economy.raise_scrutiny(state)
+            trace("econ", f"newspaper handled badly -> scrutiny {state.board_scrutiny}")
+
+    # romance resolution: option_a (or an affectionate typed reply) = leaning in
+    if event.get("special") == "romance":
+        pursued = response_type == "option_a" or (
+            response_type == "custom"
+            and validator.ROMANCE_WORDS.search(text or ""))
+        if pursued:
+            npc.romance_active = True
+            relationships.apply_relationship(state, npc_id, 6)
+            npc.mood = "heart_eyes"
+            trace("flow", f"romance: {npc_id} is now dating the player "
+                          f"(rel {npc.relationship})")
+        else:
+            relationships.apply_relationship(state, npc_id, -4)
+            trace("flow", f"romance: player kept it professional with {npc_id}")
+
+    # romance has real stakes: crossing 80 while dating draws HR's eye
+    if (npc.romance_active and npc.relationship > 80 and not state.hr_alert):
+        state.hr_alert = True
+        state.queued_special = "hr"
+        trace("econ", f"romance with {npc_id} crossed 80 -> HR alert queued")
+
+    if payload["special_next_event"]:
+        state.queued_special = payload["special_next_event"]
+        trace("flow", f"AI queued special: {payload['special_next_event']}")
+
+    entry = f"Event {state.crisis_number} — {payload['log_entry']}"
+    state.log(entry)
+    state.trail(npc_id, payload["log_entry"], applied_rev)
+    state.boss_title = payload["boss_title"]
+
+    return {
+        "npc_id": npc_id,
+        "npc_reaction": payload["npc_reaction"],
+        "consequence": payload["consequence"],
+        "revenue_delta": applied_rev,
+        "animation": payload["animation"],
+        "boss_title": payload["boss_title"],
+        "relationship_unlocked": unlocked,
+        "image_prompt": payload.get("image_prompt"),    # comic payoff (optional)
+        "comic_caption": payload.get("comic_caption"),  # caption text over it
+    }
+
+
+def _resolve_bribery(state: GameState, response_type: str, text: str) -> dict:
+    offer = state.pending_bribe
+    state.pending_bribe = 0
+    trace("flow", f"bribery resolution [{response_type}] offer=${offer:,}")
+    name_line = ""
+    if response_type in ("option_b", "quick_no"):  # decline
+        response_type = "option_b"
+    elif response_type in ("quick_fine",):  # capitulating to a bribe = taking it
+        response_type = "option_a"
+    elif response_type in ("quick_explain", "quick_quit"):
+        response_type = "option_b"  # deflecting still means not taking the money
+    if response_type == "option_a":  # accept
+        consequences = economy.accept_bribe(state, offer)
+        trace("econ", f"bribe ACCEPTED #{state.bribes_accepted} -> "
+                      f"scrutiny={state.board_scrutiny} hr={state.hr_alert}")
+        reaction = (f"> ${offer:,} transferred to personal account. the note "
+                    "dissolves. somewhere, a spreadsheet updates.")
+        consequence = "No immediate consequence. The word immediate is doing a lot of work."
+        if consequences["hr"]:
+            consequence = "HR has been CC'd on something. The something is you."
+        anim = "hr_stamp" if consequences["hr"] else "bribery_envelope"
+        log = f"An envelope appeared. The player accepted ${offer:,}. Officially, nothing happened."
+        delta = 0
+    elif response_type == "option_b":  # decline
+        economy.decline_bribe(state)
+        reaction = "> envelope returned. integrity intact. the team somehow respects this through a mechanism nobody can explain."
+        consequence = "Morale improved. Nobody knows how they knew. They knew."
+        anim = "npc_grateful"
+        log = "An envelope appeared. The player declined it. The team respected it, mysteriously."
+        delta = 0
+    else:  # counter-offer or any custom response
+        gained = min(offer, max(0, offer // 2))
+        state.pocket_money += gained
+        state.bribes_accepted += 1
+        reaction = (f"> counter received. they laughed, then paid ${gained:,}. "
+                    "respect, of a kind, has been established.")
+        consequence = "You negotiated with a bribe. The bribe respects you now."
+        anim = "bribery_envelope"
+        log = f"An envelope appeared. The player negotiated. ${gained:,} changed pockets."
+        delta = 0
+    entry = f"Event {state.crisis_number} — {log}"
+    state.log(entry)
+    state.trail("player", log, delta)
+    return {
+        "npc_id": None,
+        "npc_reaction": reaction + name_line,
+        "consequence": consequence,
+        "revenue_delta": 0,
+        "animation": anim,
+        "boss_title": state.boss_title,
+        "relationship_unlocked": False,
+    }

game/fallbacks.py

@@ -0,0 +1,313 @@
+"""Pre-written fallbacks — content from AI_PROMPTS.md. The player must never
+see an error: any Modal timeout or validation failure lands here."""
+from __future__ import annotations
+
+import random
+
+REACTIONS = {
+    "brad": {
+        "positive": "Knew you'd see it, boss. This is why we're a great team. I already told two people.",
+        "neutral": "Okay. Noted. Circling back. The window's still open by the way. Brad-window.",
+        "negative": "Wow. Okay. That's a choice. I'm putting this in my book. There's a chapter now.",
+    },
+    "stacey": {
+        "positive": "Oh thank god. Thank you. I already drafted three apology emails, I'll only send one.",
+        "neutral": "Right, yes, totally — I'll fix it. I know exactly how. Mostly exactly.",
+        "negative": "No that's fair. That's completely fair. I'm so sorry. I'll just— yes. Okay.",
+    },
+    "kevin": {
+        "positive": "Directionally, this validates everything. I'll add a slide. The slide will be green.",
+        "neutral": "Interesting. The data didn't predict this. I'll adjust the methodology. Quietly.",
+        "negative": "With respect, the numbers disagree. I'll re-run them until they don't.",
+    },
+    "janet": {
+        "positive": "THIS is leadership with a point of view. I'm putting it in the newsletter. With a metaphor.",
+        "neutral": "Fine. But the brand will remember how this felt.",
+        "negative": "I hear you. The vision doesn't, but I do.",
+    },
+    "derek": {
+        "positive": "Hm. That's what Margaret would have done. Before the incident.",
+        "neutral": "Noted. We tried that in 2019. Well. Something like it.",
+        "negative": "...Understood.",
+    },
+}
+
+_KIND_DELTAS = {
+    "positive": (25_000, 40_000, 2, 2, "npc_happy"),
+    "neutral": (-5_000, 10_000, 0, 0, "npc_confused"),
+    "negative": (-40_000, -15_000, -3, -3, "npc_devastated"),
+}
+
+NPC_NAMES = {"brad": "Brad", "stacey": "Stacey", "kevin": "Kevin",
+             "janet": "Janet", "derek": "Derek"}
+
+
+def kind_for_response(response_type: str) -> str:
+    if response_type in ("quick_fine",):
+        return "negative"
+    if response_type in ("custom", "quick_explain", "quick_quit"):
+        return "neutral"
+    return "positive"
+
+
+def crisis_fallback(npc_id: str, response_type: str) -> dict:
+    kind = kind_for_response(response_type)
+    lo, hi, morale, rel, anim = _KIND_DELTAS[kind]
+    delta = random.randint(lo // 1000, hi // 1000) * 1000
+    name = NPC_NAMES[npc_id]
+    sign = "+" if delta >= 0 else "-"
+    return {
+        "npc_reaction": REACTIONS[npc_id][kind],
+        "consequence": f"{name} handled it. Nobody is entirely sure how, and nobody asked.",
+        "revenue_delta": delta,
+        "animation": anim,
+        "boss_title": "Acting Head of Whatever This Is",
+        "log_entry": f"{name} had a situation. It was handled. {sign}${abs(delta) // 1000}K.",
+        "morale_delta": morale,
+        "npc_id": npc_id,
+        "relationship_delta": rel,
+        "pocket_money_delta": 0,
+        "special_next_event": None,
+    }
+
+
+_EVENT_FALLBACKS = [
+    {
+        "affected_npc": "player",
+        "category": "professional",
+        "headline": "The printer has produced something",
+        "intro": "> inbox: the printer in the kitchen has been printing the same page for twenty minutes. People have seen it. It is a ranking.",
+        "option_a": "Shred everything and declare a paperless office, effective immediately.",
+        "option_b": "Pin it to the corkboard and call it radical transparency.",
+        "urgency": "It is still printing.",
+        "setup_animation": "npc_confused",
+        "morale_preview": -3,
+    },
+    {
+        "affected_npc": "stacey",
+        "category": "professional",
+        "headline": "Wrong attachment, right energy",
+        "intro": "So the good news is the client got the file on time. The other news is it was the internal nicknames spreadsheet. Their CEO is 'Captain Synergy'. He has replied.",
+        "option_a": "Claim it was an icebreaker initiative and send the rest of the spreadsheet.",
+        "option_b": "Blame a software glitch nobody can name.",
+        "urgency": "He has replied TWICE.",
+        "setup_animation": "npc_crying",
+        "morale_preview": -4,
+    },
+    {
+        "affected_npc": "brad",
+        "category": "external",
+        "headline": "Mystery package addressed to nobody",
+        "intro": "Boss. Package at reception. No sender. I opened it. That part's done, so. It's five hundred stress balls with a competitor's logo. I have a theory.",
+        "option_a": "Distribute the stress balls. Free is free.",
+        "option_b": "Mail them back with a strongly worded sticky note.",
+        "urgency": "Brad's theory has slides.",
+        "setup_animation": "npc_smug",
+        "morale_preview": 2,
+    },
+    {
+        "affected_npc": "kevin",
+        "category": "personal",
+        "headline": "It is Kevin's birthday",
+        "intro": "For the record I did not expect anyone to remember. The data suggested a 12 percent chance. I brought my own hat. Directionally, this is fine.",
+        "option_a": "Emergency cake run on company budget. Backdate the enthusiasm.",
+        "option_b": "Declare birthdays a Q4 initiative.",
+        "urgency": "He is wearing the hat.",
+        "setup_animation": "npc_devastated",
+        "morale_preview": -5,
+    },
+]
+
+
+def event_fallback(index: int) -> dict:
+    return dict(_EVENT_FALLBACKS[index % len(_EVENT_FALLBACKS)])
+
+
+# type-matched fallbacks so a special's arrival animation never contradicts its
+# content (a "newspaper" arrival must not fall back to a birthday, etc.)
+_SPECIAL_FALLBACKS = {
+    "newspaper": {
+        "affected_npc": "brad",
+        "category": "external",
+        "headline": "The press got hold of it",
+        "intro": "Boss. So. A reporter wrote us up. The headline uses the word "
+                 "'reportedly' four times and there's a photo of me mid-sentence. "
+                 "It's already being shared. I look powerful though.",
+        "option_a": "Issue a correction so dry nobody finishes reading it.",
+        "option_b": "Lean in and frame the whole thing as bold market disruption.",
+        "urgency": "The comment section has discovered us.",
+        "setup_animation": "npc_hiding",
+        "morale_preview": -5,
+    },
+    "client_emergency": {
+        "affected_npc": "stacey",
+        "category": "professional",
+        "headline": "A client is on the line, right now",
+        "intro": "I have Northpath Solutions on hold and they are not happy. "
+                 "Something about a deliverable we may have described as 'basically "
+                 "done'. It was not basically done. It was basically a folder.",
+        "option_a": "Take the call yourself and promise a recovery plan by Friday.",
+        "option_b": "Have Stacey stall with enthusiasm while we invent the thing.",
+        "urgency": "They can hear the hold music looping. So can we.",
+        "setup_animation": "npc_crying",
+        "morale_preview": -6,
+    },
+    "personal": {
+        "affected_npc": "kevin",
+        "category": "personal",
+        "headline": "Something is going on with the team",
+        "intro": "Not a work thing, technically. But it's bleeding into the work "
+                 "thing. There were tears at the printer. The printer is fine. The "
+                 "person is, statistically, also fine. Probably.",
+        "option_a": "Check in personally and quietly cover their afternoon.",
+        "option_b": "Declare a surprise team lunch and never address it directly.",
+        "urgency": "The whole floor is pretending to type.",
+        "setup_animation": "npc_devastated",
+        "morale_preview": -4,
+    },
+    "hr": {
+        "affected_npc": "player",
+        "category": "professional",
+        "headline": "HR would like a quick word",
+        "intro": "> HR has requested a brief, informal, absolutely-not-a-big-deal "
+                 "conversation regarding 'recent patterns'. They have used the "
+                 "phrase 'just to document it'. There is a folder.",
+        "option_a": "Walk in honest and own whatever this is about.",
+        "option_b": "Bring your own folder. Establish folder dominance.",
+        "urgency": "The meeting room blinds are already closed.",
+        "setup_animation": "npc_suspicious",
+        "morale_preview": -5,
+    },
+}
+
+
+def special_fallback(kind: str, index: int) -> dict:
+    """A coherent fallback whose theme matches the special-event arrival."""
+    if kind in _SPECIAL_FALLBACKS:
+        return dict(_SPECIAL_FALLBACKS[kind])
+    return event_fallback(index)
+
+
+def presentation_fallback(round_no: int, last_log: str) -> dict:
+    if round_no >= 3:
+        return {
+            "round": round_no,
+            "board_tone": "neutral",
+            "event_referenced": last_log[:150],
+            "round_difficulty": "standard",
+            "board_dialogue": "The board has reviewed the quarter so far. Specifically this: "
+                              f"\"{last_log[:120]}\". Give us your closing statement.",
+            "cumulative_score": 50,
+        }
+    return {
+        "round": round_no,
+        "board_tone": "neutral",
+        "event_referenced": last_log[:150],
+        "round_difficulty": "standard",
+        "option_a": "Own it completely and pivot to the pipeline.",
+        "option_b": "Contextualize it as a learning investment.",
+        "board_dialogue": f"Let's start with this item from the record: \"{last_log[:120]}\". "
+                          "Walk us through it.",
+    }
+
+
+CHAT_OPENERS = {
+    "brad": "Boss. Glad you stopped by. I'm working on something big. Can't say what. It's big though.",
+    "stacey": "Oh! Hi. Everything's under control. I just triple-checked the recipient field on everything. Twice.",
+    "kevin": "Good timing. The numbers are doing something interesting. Directionally interesting.",
+    "janet": "I've been thinking about our visual language. We need to talk about it. Not now. But soon.",
+    "derek": "Hm. You walk the floor now. Interesting.",
+}
+
+CHAT_REPLIES = {
+    "brad": "Knew you'd get it, boss. This is why I tell people we're tight.",
+    "stacey": "That actually helps. Thank you. I'll only worry about it a normal amount now.",
+    "kevin": "Noted. I'll factor that into the model. The model appreciates it.",
+    "janet": "See, THIS is the kind of dialogue the brand needs internally.",
+    "derek": "Hm. Noted.",
+}
+
+
+def chat_fallback(npc_id: str, opener: bool) -> dict:
+    return {
+        "npc_line": (CHAT_OPENERS if opener else CHAT_REPLIES)[npc_id],
+        "relationship_delta": 0 if opener else 1,
+        "morale_delta": 0,
+    }
+
+
+BANTER_LINES = [
+    ("brad", "...so I told them, that's not a bug, that's a premium feature. They went quiet. Closing energy."),
+    ("kevin", "The Q3 numbers are directionally fine. Directionally."),
+    ("janet", "The font says reliable. We are not a reliable font company."),
+    ("stacey", "Okay but who do I apologize to if nobody noticed yet?"),
+    ("derek", "We had a printer like that in 2019. Before the incident."),
+]
+
+
+def banter_fallback(index: int) -> dict:
+    npc_id, line = BANTER_LINES[index % len(BANTER_LINES)]
+    return {"npc_id": npc_id, "line": line}
+
+
+EAVESDROP_EXCHANGES = [
+    [("brad", "Kevin. Buddy. Your chart says we grew 140 percent."),
+     ("kevin", "The chart is directionally accurate, Brad."),
+     ("brad", "I put it in the client deck.")],
+    [("janet", "The newsletter needs a hero image that says resilience."),
+     ("stacey", "Is that why you sent me forty photos of lighthouses?"),
+     ("janet", "Forty OPTIONS, Stacey.")],
+]
+
+
+def eavesdrop_fallback(index: int) -> dict:
+    exchange = EAVESDROP_EXCHANGES[index % len(EAVESDROP_EXCHANGES)]
+    return {"lines": [{"speaker": s, "line": l} for s, l in exchange]}
+
+
+EMAIL_BANK = [
+    {"sender": "janet", "subject": "BRAND PULSE — week of now",
+     "body": "Team. This week the brand felt like a lighthouse in fog: present, vertical, misunderstood. More on this in my longer email. There will be a longer email."},
+    {"sender": "kevin", "subject": "Metric of the Day",
+     "body": "Pipeline velocity is up 31% against a baseline I have defined myself. Methodology available upon request. Please do not request it."},
+    {"sender": "system", "subject": "FACILITIES: regarding the printer",
+     "body": "The third-floor printer has been restored to factory settings. We are not able to explain what it was printing before. Please direct questions nowhere."},
+]
+
+
+def email_fallback(index: int) -> dict:
+    return dict(EMAIL_BANK[index % len(EMAIL_BANK)])
+
+
+_ROMANCE_INTROS = {
+    "brad": "Boss. Off the record. I've been thinking — we're a great team, right? Like, a GREAT team. I made you a playlist. It's all walk-on music.",
+    "stacey": "Okay so this is unprofessional and I've rehearsed it four times and deleted three drafts, but — would it be weird if I said I look forward to our one-on-ones? More than the agenda warrants?",
+    "kevin": "I ran the numbers on our working relationship and the trend line is, directionally, very warm. I made a slide. The slide has a heart on it. The x-axis is us.",
+    "janet": "I've been building a mood board. It's about us. It's mostly the color of a sunset and one photo of your stapler. I think it's saying something. I think it's saying a lot.",
+    "derek": "Hm. You stayed late again. So did I. ...That's all. Unless it isn't. It might not be. Hm.",
+}
+
+
+def romance_fallback(npc_id: str) -> dict:
+    npc_id = npc_id or "stacey"
+    return {
+        "affected_npc": npc_id,
+        "category": "personal",
+        "headline": f"{NPC_NAMES[npc_id]} has feelings, apparently",
+        "intro": _ROMANCE_INTROS[npc_id],
+        "option_a": "Lean in. Say you've felt it too. What's the worst that happens.",
+        "option_b": "Smile, keep it warm, and steer firmly back to the quarterly numbers.",
+        "urgency": "The whole floor is pretending not to watch.",
+        "setup_animation": "heart_float",
+        "morale_preview": 4,
+    }
+
+
+def verdict_fallback(tier: str) -> dict:
+    verdicts = {
+        "hit_target": "Against every available signal, the number is real. The board has voted to stop asking how.",
+        "above_600k": "Close. The board has expressed this in an emoji, in Slack, three times. You know the one.",
+        "300k_to_600k": "The board wants a call. Not a good call. You already know the energy of the call.",
+        "below_300k": "The board has drafted something. It mentions your continued presence. It is currently unsigned.",
+    }
+    return {"verdict": verdicts[tier]}

game/idle.py

@@ -0,0 +1,161 @@
+"""Idle activities between crises: small talk, banter, eavesdrop, emails.
+
+All AI-generated from live game state; budgets are enforced per roam gap so
+idle chat can never become a relationship farm (plan: ±2 rel / ±1 morale per
+gap, 1 chat per NPC, 2 chats per gap, 2 turns per chat, 1 ambient roll).
+"""
+from __future__ import annotations
+
+import random
+
+from . import fallbacks, llm, prompts, relationships, validator
+from .schemas import NPC_IDS
+from .state import GameState
+from .trace import trace
+
+MAX_CHATS_PER_GAP = 2
+MAX_TURNS_PER_CHAT = 2
+
+
+def reset_gap(state: GameState) -> None:
+    """Called by events.next_event when a new event slot begins."""
+    state.chats_this_gap = {}
+    state.idle_done_this_gap = False
+    state.chat_session = None
+
+
+class IdleError(Exception):
+    """Cap or sequencing violation — maps to HTTP 409."""
+
+
+# ------------------------------------------------------------------ chat
+
+def open_chat(state: GameState, npc_id: str) -> dict:
+    if state.chats_this_gap.get(npc_id, 0) >= 1:
+        raise IdleError(f"{npc_id} has already been chatted with this gap")
+    if sum(state.chats_this_gap.values()) >= MAX_CHATS_PER_GAP:
+        raise IdleError("chat budget for this gap is spent")
+    state.chats_this_gap[npc_id] = 1
+    state.chat_session = {"npc_id": npc_id, "turns": 1}
+
+    system, user = prompts.chat_prompt(state, npc_id, None)
+    payload, _live = llm.call_model(state, "chat", system, user, npc_id=npc_id)
+    payload = validator.validate_chat(payload, state, npc_id) if payload else None
+    if payload is None:
+        state.fallback_count += 1
+        payload = fallbacks.chat_fallback(npc_id, opener=True)
+    trace("flow", f"chat open [{npc_id}] \"{payload['npc_line'][:60]}\"")
+    # openers never move stats — only the player's reply can
+    return {"npc_id": npc_id, "npc_line": payload["npc_line"],
+            "can_reply": True}
+
+
+def reply_chat(state: GameState, npc_id: str, text: str) -> dict:
+    session = state.chat_session
+    if not session or session["npc_id"] != npc_id:
+        raise IdleError("no open chat with this npc")
+    if session["turns"] >= MAX_TURNS_PER_CHAT:
+        raise IdleError("this chat is over — they have work to pretend to do")
+    session["turns"] += 1
+
+    system, user = prompts.chat_prompt(state, npc_id, text)
+    payload, _live = llm.call_model(state, "chat", system, user,
+                                    npc_id=npc_id, player_text=text)
+    payload = validator.validate_chat(payload, state, npc_id) if payload else None
+    if payload is None:
+        state.fallback_count += 1
+        payload = fallbacks.chat_fallback(npc_id, opener=False)
+
+    # micro-effects, guardrails included
+    tone = relationships.classify_tone("custom", text)
+    rel_delta = payload["relationship_delta"]
+    if tone == "harsh":
+        rel_delta = min(rel_delta, -1)
+    applied = relationships.apply_relationship(state, npc_id, rel_delta)
+    relationships.apply_morale(state, payload["morale_delta"])
+    praise_result = relationships.praise_tick(state, npc_id, tone)
+    if praise_result == "suspicion_event":
+        state.queued_special = "suspicion"
+    if praise_result:
+        trace("econ", f"praise guardrail via chat: {praise_result} for {npc_id}")
+    trace("flow", f"chat reply [{npc_id}] rel{applied:+d} "
+                  f"-> {state.npc(npc_id).relationship} "
+                  f"\"{payload['npc_line'][:60]}\"")
+    state.chat_session = None
+    return {"npc_id": npc_id, "npc_line": payload["npc_line"],
+            "relationship_delta": applied, "can_reply": False}
+
+
+# ------------------------------------------------------------- ambient roll
+
+def _eligible_pairs(state: GameState) -> list[tuple[str, str]]:
+    talked = [n for n in NPC_IDS if state.npc(n).incident_count > 0
+              or state.npc(n).mood != "normal"]
+    pool = talked if len(talked) >= 2 else NPC_IDS
+    pairs = []
+    for i, a in enumerate(pool):
+        for b in pool[i + 1:]:
+            pairs.append((a, b))
+    return pairs
+
+
+def roll_idle(state: GameState) -> dict:
+    if state.idle_done_this_gap:
+        raise IdleError("ambient moment already happened this gap")
+    state.idle_done_this_gap = True
+
+    roll = random.random()
+    if state.pending_email is None and roll < 0.25:
+        kind = "email"
+    elif roll < 0.60:
+        kind = "banter"
+    else:
+        kind = "eavesdrop"
+
+    if kind == "email":
+        system, user = prompts.email_prompt(state)
+        payload, _live = llm.call_model(state, "email", system, user)
+        payload = validator.validate_email(payload, state) if payload else None
+        if payload is None:
+            state.fallback_count += 1
+            payload = fallbacks.email_fallback(state.crisis_number)
+        state.pending_email = payload
+        trace("flow", f"idle: email from {payload['sender']} "
+                      f"\"{payload['subject']}\"")
+        return {"kind": "email_waiting"}
+
+    if kind == "eavesdrop":
+        pair = random.choice(_eligible_pairs(state))
+        system, user = prompts.eavesdrop_prompt(state, *pair)
+        payload, _live = llm.call_model(state, "eavesdrop", system, user,
+                                        pair=pair)
+        payload = (validator.validate_eavesdrop(payload, state, pair)
+                   if payload else None)
+        if payload is None:
+            state.fallback_count += 1
+            payload = fallbacks.eavesdrop_fallback(state.crisis_number)
+            for i, entry in enumerate(payload["lines"]):
+                entry["speaker"] = pair[i % 2]
+        trace("flow", f"idle: eavesdrop {pair[0]}+{pair[1]} "
+                      f"({len(payload['lines'])} lines)")
+        return {"kind": "eavesdrop", "lines": payload["lines"]}
+
+    system, user = prompts.banter_prompt(state)
+    payload, _live = llm.call_model(state, "banter", system, user)
+    payload = validator.validate_banter(payload, state) if payload else None
+    if payload is None:
+        state.fallback_count += 1
+        payload = fallbacks.banter_fallback(state.crisis_number)
+    trace("flow", f"idle: banter [{payload['npc_id']}] "
+                  f"\"{payload['line'][:60]}\"")
+    return {"kind": "banter", "npc_id": payload["npc_id"],
+            "line": payload["line"]}
+
+
+def read_email(state: GameState) -> dict:
+    if state.pending_email is None:
+        raise IdleError("no email waiting")
+    email = state.pending_email
+    state.pending_email = None
+    trace("flow", f"email read: \"{email['subject']}\"")
+    return email

game/llm.py

@@ -0,0 +1,433 @@
+"""Modal client + offline mock model.
+
+If MODAL_URL is set, calls the Modal llama.cpp endpoint (8s timeout, no retry).
+Otherwise — or on any failure — a deterministic-enough mock generates
+schema-valid, in-character output so the game is fully playable offline.
+The caller still runs everything through validator.py either way.
+"""
+from __future__ import annotations
+
+import os
+import random
+import threading
+import time
+
+import requests
+
+from . import fallbacks
+from .context import build_context
+from .schemas import SCHEMA_BY_CALL_TYPE
+from .state import GameState
+from .trace import trace, trace_payload
+
+# 8s in production (TECHNICAL.md); raise via env for slow local CPU inference
+TIMEOUT_S = float(os.environ.get("BDS_LLM_TIMEOUT", "8"))
+# the FIRST call to a cold Modal container waits longer (boot + model load)
+COLD_TIMEOUT = float(os.environ.get("BDS_COLD_TIMEOUT", "55"))
+_warmed = False  # flips true after the first successful live response
+
+
+def modal_available() -> bool:
+    return bool(os.environ.get("MODAL_URL"))
+
+
+def warm() -> None:
+    """Fire a throwaway request so Modal boots the container in the background
+    (called on page load / new game, long before the first real event)."""
+    if not modal_available() or _warmed:
+        return
+    threading.Thread(target=_warm_ping, daemon=True).start()
+
+
+def _warm_ping() -> None:
+    try:
+        requests.post(
+            os.environ["MODAL_URL"],
+            json={"call_type": "verdict", "system_prompt": "warmup",
+                  "user_prompt": "warmup", "context": {},
+                  "schema": SCHEMA_BY_CALL_TYPE["verdict"]},
+            headers={"Authorization": "Bearer " + os.environ.get("MODAL_TOKEN", "")},
+            timeout=COLD_TIMEOUT + 60)
+        trace("llm", "warmup ping done")
+    except requests.RequestException:
+        pass
+
+
+def call_model(state: GameState, call_type: str, system_prompt: str,
+               user_prompt: str, **mock_kwargs) -> tuple[dict | None, bool]:
+    """Returns (payload, used_live_model). payload None means caller must
+    use fallbacks.py."""
+    if modal_available():
+        global _warmed
+        timeout = TIMEOUT_S if _warmed else COLD_TIMEOUT  # first call waits for boot
+        t0 = time.time()
+        try:
+            # MODAL_URL is the full endpoint URL (Modal gives each function
+            # its own URL; the local dev server uses .../generate)
+            resp = requests.post(
+                os.environ["MODAL_URL"],
+                json={
+                    "call_type": call_type,
+                    "system_prompt": system_prompt,
+                    "user_prompt": user_prompt,
+                    "context": build_context(state),
+                    "schema": SCHEMA_BY_CALL_TYPE[call_type],
+                },
+                headers={"Authorization": "Bearer " + os.environ.get("MODAL_TOKEN", "")},
+                timeout=timeout,
+            )
+            ms = int((time.time() - t0) * 1000)
+            if resp.status_code == 200:
+                body = resp.json()
+                if body.get("ok") and isinstance(body.get("data"), dict):
+                    _warmed = True  # container is hot now → short timeouts
+                    data = body["data"]
+                    # the live model lowballs revenue — scale crisis deltas into
+                    # the intended economy (mock deltas are already balanced)
+                    if call_type == "crisis" and "revenue_delta" in data:
+                        from . import economy
+                        data["revenue_delta"] = economy.scale_revenue(
+                            data["revenue_delta"])
+                    trace("llm", f"{call_type} LIVE {ms}ms")
+                    trace_payload(data)
+                    return data, True
+                trace("llm", f"{call_type} endpoint not-ok {ms}ms: "
+                             f"{str(body.get('error', body))[:160]}")
+            else:
+                trace("llm", f"{call_type} HTTP {resp.status_code} {ms}ms")
+        except requests.Timeout:
+            trace("llm", f"{call_type} TIMEOUT after {timeout}s")
+        except requests.RequestException as exc:
+            trace("llm", f"{call_type} transport error: {str(exc)[:120]}")
+        return None, False  # live mode: failure → real fallback path
+    payload = _mock(state, call_type, **mock_kwargs)
+    trace("llm", f"{call_type} MOCK")
+    return payload, False
+
+
+def call_validated(state: GameState, call_type: str, system_prompt: str,
+                   user_prompt: str, validate, **mock_kwargs) -> dict | None:
+    """Call the model and validate. If the model produced a payload that fails
+    validation, retry ONCE with a corrective nudge built from the reject reason
+    — a single model slip (a repeated round, third-person intro) shouldn't force
+    a fallback. Transport failures (timeouts) skip the retry (warm/cold timeout
+    + pre-warm handle those). Returns a validated payload, or None for fallback.
+    """
+    payload, _live = call_model(state, call_type, system_prompt, user_prompt,
+                                **mock_kwargs)
+    if payload is None:
+        return None  # transport failure → straight to fallback
+    ok = validate(payload)
+    if ok is not None:
+        return ok
+    from . import validator  # lazy: avoid import cycle
+    reason = getattr(validator, "LAST_REJECT", None) or "it broke the required format"
+    nudge = (user_prompt + "\n\nIMPORTANT: your previous reply was rejected "
+             f"because {reason}. Write a brand-new, corrected version that fixes "
+             "exactly that. Do not repeat your previous reply.")
+    trace("llm", f"{call_type} retry after reject: {reason}")
+    payload2, _live2 = call_model(state, call_type, system_prompt, nudge,
+                                  **mock_kwargs)
+    if payload2 is None:
+        return None
+    return validate(payload2)
+
+
+# ---------------------------------------------------------------- mock model
+
+_BOSS_TITLES = [
+    "VP of Explaining Brad", "Director of Damage Adjacent",
+    "Chief Apology Architect", "Head of Saying It's Fine",
+    "Interim Adult In The Room", "Senior Crisis Sommelier",
+    "Director of Plausible Deniability", "Head of Vibes, Acting",
+    "Chief Brad Containment Officer", "VP of Unscheduled Honesty",
+]
+
+_CRISIS_TEMPLATES = {
+    "brad": [
+        ("Brad promised {client} a feature that does not exist yet",
+         "Boss. Quick one. I may have told {client} we ship the AI thing Friday. We don't have an AI thing. But picture this: we DO.",
+         "Tell them Friday means a Friday, conceptually, in the future.",
+         "Have engineering 'demo' a screen recording of a competitor's product.",
+         "They booked a launch party. Catered."),
+        ("Brad went on a podcast nobody approved",
+         "So the episode dropped. I said some numbers. The numbers were aspirational. The host called me a disruptor, so, win?",
+         "Issue a correction calling the numbers 'directional'.",
+         "Book Brad on a second podcast to walk back the first podcast.",
+         "{client} has listened. Twice."),
+    ],
+    "stacey": [
+        ("Stacey sent the internal pricing sheet to {client}",
+         "I am so sorry. The email went to the wrong {client} contact. It had our REAL prices in it. The ones with the column called 'what we'd actually take'.",
+         "Claim the document was a decoy from a security drill.",
+         "Honor the real prices and call it a loyalty discount.",
+         "They replied with a thumbs up. Just the thumbs up."),
+        ("Stacey's follow-up arrived before the first email",
+         "Okay so. The follow-up to the apology went out before the apology. So they got 'again, so sorry about that' about nothing. Then the thing happened.",
+         "Send the original email now and pretend time is a circle.",
+         "Apologize for the apology, creating an apology loop.",
+         "She has a flowchart of the situation. It loops."),
+    ],
+    "kevin": [
+        ("Kevin's chart reached the client and it adds to 140 percent",
+         "Before you say anything: the pie chart is directionally correct. {client} asked why it sums to 140. I find the question small-minded, but it's escalating.",
+         "Tell them the extra 40 percent is forward-looking momentum.",
+         "Resend the chart with the axis removed entirely.",
+         "Their analyst has tweeted the chart."),
+        ("Kevin cited a statistic on a client call that does not exist",
+         "I said 9 out of 10 CTOs prefer us. Methodology: I asked Brad nine times and myself once. The client wants the source. I am the source.",
+         "Commission a real survey, results due never.",
+         "Define 'CTO' broadly enough that it's true.",
+         "They put it in THEIR deck."),
+    ],
+    "janet": [
+        ("Janet rebranded the product overnight",
+         "I had a breakthrough at 2am. New name, new colors, new feel. The old brand was a cry for help. I've already updated the website. And the invoices.",
+         "Roll it back and tell Janet the market 'wasn't ready'.",
+         "Keep the rebrand and update four hundred client contracts.",
+         "{client} just asked who 'Veloura² ' is."),
+        ("Janet's Substack mentioned a client by feel",
+         "I never NAMED {client}. I described an energy. The energy was unmistakably theirs and now their CMO follows me. This is reach. This might be good?",
+         "Have Janet write a flattering follow-up about a fictional company.",
+         "Take the post down, igniting Janet's vision discourse.",
+         "The post is 'resonating'."),
+    ],
+    "derek": [
+        ("Derek approved something nobody knew he could approve",
+         "There was a form. I have always signed that form. Since the incident, someone has to. The vendor starts Monday. You will want to know what vendor. Hm.",
+         "Unwind the approval and find out what the form was.",
+         "Let it ride. Derek has never been wrong. Probably.",
+         "The vendor sent a fruit basket. It's addressed to Derek."),
+        ("Derek has been marking meetings as 'attended in spirit'",
+         "Calendar software is new. 2009 new. I attend the meetings that matter. The others I attend in spirit. {client} noticed I was a spirit at theirs.",
+         "Institute mandatory camera-on, radicalizing Derek.",
+         "Tell the client Derek is a strategic silent presence.",
+         "He was in the building. Nobody knows where."),
+    ],
+}
+
+_REACTION_BY_KIND = {
+    "great": {
+        "brad": "BOSS. That's a closer move. I'm screenshotting this for the book. Chapter one: us.",
+        "stacey": "Oh that's— that's actually perfect. I can fix everything with that. Sending now. Thank you.",
+        "kevin": "Huh. The data did not predict that, but I'll backfill the model. Narrative momentum: green.",
+        "janet": "Okay. OKAY. That's a brand moment. I felt that. The client will feel that.",
+        "derek": "Hm. Bold. Margaret tried that once. It worked, that time.",
+    },
+    "good": {
+        "brad": "Solid call boss. Not the Brad play, but solid. I'll spin it. Spinning is closing.",
+        "stacey": "Yes — okay, yes, I can work with that. Drafting it now. Carefully. Triple-checking the recipient.",
+        "kevin": "Acceptable. I'll annotate the deck accordingly. The footnote will be small.",
+        "janet": "Fine. It's not the vision but it's... adjacent to the vision. I'll make it feel intentional.",
+        "derek": "Noted.",
+    },
+    "bad": {
+        "brad": "Oof. Okay. The client's gonna feel that one. I'll soften it with energy. So much energy.",
+        "stacey": "Oh no. Okay. I mean — you're the boss. I'll send it. I'll start apologizing in advance.",
+        "kevin": "I want it logged that the data disagreed. The data and I are aligned on this.",
+        "janet": "This is how brands die, but sure. I'll execute it. Minimally.",
+        "derek": "...As you wish. We did this in 2019. Hm.",
+    },
+    "capitulate": {
+        "brad": "YES. Boss said go. Boss said GO. I'm already calling them. This is the Brad timeline now.",
+        "stacey": "Oh. Really? Okay! I mean, if you're sure. I'll do exactly the thing. Exactly as described.",
+        "kevin": "Excellent. Proceeding precisely as proposed. The model says this ends well for approximately me.",
+        "janet": "Approved?! The vision is ALIVE. I'm updating everything. Everything is so updated.",
+        "derek": "Very well. For the record, I proposed it knowing you would say no. Hm.",
+    },
+}
+
+_CONSEQUENCES = {
+    "great": ["{client} signed an expanded scope by end of day.",
+              "The client laughed, then signed. Mostly in that order.",
+              "It worked. Nobody is more surprised than the team."],
+    "good": ["The situation stabilized. Stabilized is the new thriving.",
+             "{client} accepted the explanation with minor side-eye.",
+             "Contained. A small invoice for 'goodwill flowers' will appear."],
+    "bad": ["{client} asked for a 'recalibration call'. It's 90 minutes.",
+            "It leaked internally. The kitchen knows. The kitchen talks.",
+            "The fix created a smaller, more personal problem."],
+    "capitulate": ["It went exactly as proposed and exactly as badly as expected.",
+                   "{client} is 'pausing the relationship to reflect'.",
+                   "Legal-adjacent emails were exchanged. Nobody won."],
+}
+
+
+def _creativity_score(text: str) -> int:
+    """0-2: crude proxy for specificity/effort of a custom response."""
+    t = (text or "").strip()
+    if len(t) < 15:
+        return 0
+    score = 1
+    if len(t) > 60 and any(c.isupper() for c in t) and (
+            "," in t or "." in t[:-1] or "—" in t):
+        score = 2
+    return score
+
+
+def _mock(state: GameState, call_type: str, **kw) -> dict:
+    rng = random.Random()
+    client = rng.choice(build_context(state)["game_config"]["approved_clients"])
+
+    if call_type == "crisis":
+        npc_id = kw["npc_id"]
+        rt = kw["response_type"]
+        text = kw.get("player_response", "")
+        if rt == "quick_fine":
+            kind, lo, hi = "capitulate", -150_000, -60_000
+        elif rt in ("option_a", "option_b"):
+            kind, lo, hi = rng.choice([("good", -25_000, 55_000),
+                                       ("bad", -70_000, 15_000)])
+        elif rt == "custom":
+            c = _creativity_score(text)
+            kind, lo, hi = [("bad", -60_000, 5_000), ("good", -15_000, 60_000),
+                            ("great", 25_000, 140_000)][c]
+        elif rt == "quick_quit":
+            kind, lo, hi = "good", -15_000, 25_000
+        else:  # quick_no / quick_explain
+            kind, lo, hi = "good", -20_000, 40_000
+        delta = rng.randint(lo // 1000, hi // 1000) * 1000
+        morale = {"great": rng.randint(4, 9), "good": rng.randint(0, 4),
+                  "bad": rng.randint(-8, -2), "capitulate": rng.randint(-15, -8)}[kind]
+        rel = {"great": rng.randint(6, 12), "good": rng.randint(2, 6),
+               "bad": rng.randint(-12, -5), "capitulate": rng.randint(3, 8)}[kind]
+        anim = {"great": "npc_celebrating", "good": "npc_happy",
+                "bad": rng.choice(["npc_devastated", "npc_angry", "npc_confused"]),
+                "capitulate": "npc_smug"}[kind]
+        if delta <= -80_000:
+            anim = "disaster_flash"
+        elif delta >= 150_000:
+            anim = "revenue_rain"
+        name = fallbacks.NPC_NAMES[npc_id]
+        sign = "+" if delta >= 0 else "-"
+        return {
+            "npc_reaction": _REACTION_BY_KIND[kind][npc_id],
+            "consequence": rng.choice(_CONSEQUENCES[kind]).format(client=client),
+            "revenue_delta": delta,
+            "animation": anim,
+            "boss_title": rng.choice(_BOSS_TITLES),
+            "log_entry": f"{name}: {kw['crisis'].get('headline', 'a situation')[:80]}. "
+                         f"{sign}${abs(delta) // 1000}K.",
+            "morale_delta": morale,
+            "npc_id": npc_id,
+            "relationship_delta": rel,
+            "pocket_money_delta": 0,
+            "special_next_event": None,
+        }
+
+    if call_type == "event":
+        requested = kw.get("requested_type")
+        if requested == "normal" and kw.get("npc_id"):
+            npc_id = kw["npc_id"]
+            used = " ".join(state.event_log)
+            pool = [t for t in _CRISIS_TEMPLATES[npc_id]
+                    if t[0].split(" ", 1)[1][:25] not in used]
+            head, intro, a, b, urgency = rng.choice(pool or _CRISIS_TEMPLATES[npc_id])
+            return {
+                "affected_npc": npc_id,
+                "category": "professional",
+                "headline": head.format(client=client)[:80],
+                "intro": intro.format(client=client)[:200],
+                "option_a": a.format(client=client)[:150],
+                "option_b": b.format(client=client)[:150],
+                "urgency": urgency.format(client=client)[:80],
+                "setup_animation": "npc_confused",
+                "morale_preview": rng.randint(-5, 2),
+            }
+        if kw.get("requested_type") == "romance":
+            return fallbacks.romance_fallback(kw.get("romance_npc"))
+        # special event: rotate through the safe fallback bank + bribery synth
+        ev = fallbacks.event_fallback(len(state.event_log) + rng.randint(0, 3))
+        return ev
+
+    if call_type in ("presentation_round", "presentation_closing"):
+        round_no = kw["round_no"]
+        last = state.event_log[-1] if state.event_log else "an uneventful quarter, allegedly"
+        pick = rng.choice(state.event_log[-6:]) if state.event_log else last
+        tone = {"low": "warm", "medium": "neutral",
+                "high": "concerned", "critical": "alarmed"}[state.board_scrutiny]
+        if state.morale < 20:
+            tone = "alarmed"
+        if call_type == "presentation_round":
+            questions = [
+                f"We'd like to begin with this item from the record: \"{pick[:110]}\". Walk us through the thinking, if thinking occurred.",
+                f"The record contains the phrase \"{pick[:100]}\". The board has read it several times. Explain.",
+            ]
+            return {
+                "round": round_no,
+                "board_tone": tone,
+                "event_referenced": pick[:150],
+                "round_difficulty": {"warm": "easy", "neutral": "standard",
+                                     "concerned": "hard", "alarmed": "brutal"}[tone],
+                "option_a": "Own it fully and redirect to the revenue trend.",
+                "option_b": "Reframe it as deliberate culture-building.",
+                "board_dialogue": questions[(round_no - 1) % 2],
+            }
+        # closing: score from transcript quality + revenue position
+        transcript = kw.get("transcript", [])
+        base = 42 + sum(_creativity_score(t.get("player_response", "")) * 6
+                        for t in transcript if t.get("player_response"))
+        rev_factor = max(-15, min(15, int(25 * (state.revenue / state.target
+                                               - 0.45))))
+        score = max(0, min(100, base + rev_factor + rng.randint(-8, 8)))
+        if round_no == 4:
+            body = ("One last thing. Off the record, which is a thing boards say "
+                    "before remembering everything. What would your team say it "
+                    "is like to work for you this quarter?")
+        else:
+            body = (f"The board has heard enough context. Including \"{pick[:90]}\". "
+                    "Give us your closing statement.")
+        return {
+            "round": round_no,
+            "board_tone": tone,
+            "event_referenced": pick[:150],
+            "round_difficulty": "standard",
+            "board_dialogue": body,
+            "cumulative_score": score,
+        }
+
+    if call_type == "chat":
+        npc_id = kw["npc_id"]
+        if kw.get("player_text"):
+            line = fallbacks.CHAT_REPLIES[npc_id]
+            rel = rng.choice([0, 1, 1])
+        else:
+            mood_lines = {
+                "smug": "Things are going extremely my way today, boss. Ask me how.",
+                "sad": "I'm fine. The week is just... a lot of week.",
+                "devastated": "I don't want to talk about the thing. Okay, one question about the thing.",
+                "suspicious": "You're checking in a lot lately. Should I be updating my resume, or...?",
+                "grateful": "Hey — thanks again. For the thing. You know the thing.",
+            }
+            line = mood_lines.get(state.npc(npc_id).mood,
+                                  fallbacks.CHAT_OPENERS[npc_id])
+            rel = 0
+        return {"npc_line": line, "relationship_delta": rel, "morale_delta": 0}
+
+    if call_type == "banter":
+        return fallbacks.banter_fallback(rng.randint(0, 9))
+
+    if call_type == "eavesdrop":
+        pair = kw.get("pair", ("brad", "kevin"))
+        ex = fallbacks.eavesdrop_fallback(rng.randint(0, 9))
+        # remap speakers onto the requested pair so validation passes
+        for i, entry in enumerate(ex["lines"]):
+            entry["speaker"] = pair[i % 2]
+        return ex
+
+    if call_type == "email":
+        return fallbacks.email_fallback(rng.randint(0, 9))
+
+    if call_type == "verdict":
+        tier = kw["tier"]
+        pick = (random.choice(state.event_log) if state.event_log
+                else "the quarter")
+        verdicts = {
+            "hit_target": f"One million dollars, despite the entry reading \"{pick[:90]}\". The board has voted to stop asking how.",
+            "above_600k": f"Close. The board re-read \"{pick[:90]}\" and sent the same emoji in Slack, three times. You know the one.",
+            "300k_to_600k": f"The board wants a call. The agenda is one line and the line is \"{pick[:80]}\".",
+            "below_300k": f"The board has drafted something regarding your continued presence. Exhibit A reads: \"{pick[:80]}\".",
+        }
+        return {"verdict": verdicts[tier][:300]}
+
+    raise ValueError(f"unknown call type {call_type}")

game/presentation.py

@@ -0,0 +1,257 @@
+"""Stakeholder presentations — PRESENTATION_SYSTEM.md."""
+from __future__ import annotations
+
+import random
+
+from . import economy, fallbacks, llm, prompts, validator
+from .state import TOTAL_CRISES, GameState
+from .trace import trace
+
+
+def start(state: GameState) -> None:
+    extended = state.scrutiny_high_streak >= 3 or state.morale < 20
+    presenting_npc, npc_state = _presence(state)
+    # pre-assign DISTINCT logged events as per-round topics. Left to its own
+    # devices the model re-asks the same question every round; pinning each
+    # option round to a different event (and telling it what's already covered)
+    # is what actually stops the repeats.
+    topics = list(state.event_log)
+    random.shuffle(topics)
+    state.presentation = {
+        "round": 0,
+        "total_rounds": 4 if extended else 3,
+        "extended": extended,
+        "transcript": [],
+        "presenting_npc": presenting_npc,
+        "npc_state": npc_state,
+        "wrong_slide_pending": npc_state == "romance",
+        "final": state.crisis_number == TOTAL_CRISES,
+        "score": None,
+        "topics": topics,
+    }
+
+
+def _presence(state: GameState) -> tuple[str, str]:
+    """Pick the presenting NPC and their state per PRESENTATION_SYSTEM.md."""
+    for npc_id, npc in state.npcs.items():
+        if npc.romance_active:
+            return npc_id, "romance"
+    for npc_id, npc in state.npcs.items():
+        if npc.personal_situation:
+            return npc_id, "grief"
+    for npc_id, npc in state.npcs.items():
+        if npc.consecutive_praise >= 2:
+            return npc_id, "overprepared"
+    for npc_id, npc in state.npcs.items():
+        if npc.relationship < 30:
+            return npc_id, "bare_minimum"
+    for npc_id, npc in state.npcs.items():
+        if npc.relationship > 65 and npc.gifts_received > 0:
+            return npc_id, "advocate"
+    return "kevin", "normal"  # Kevin always has slides. Kevin IS slides.
+
+
+_PRESENCE_NOTES = {
+    "romance": "The presenting NPC is romantically involved with the player. "
+               "Their deck contains a wrong slide: a photo of the player with "
+               "hand-drawn hearts. The board has seen it. Round 1 is about it.",
+    "grief": "The presenting NPC is going through something personal. Grey "
+             "slides, melancholy titles, trailing off mid-sentence. The board "
+             "may ask if the team is okay before asking about numbers.",
+    "overprepared": "The presenting NPC has received excessive praise and "
+                    "produced far more slides than requested. They will not "
+                    "be redirected easily.",
+    "bare_minimum": "The presenting NPC was treated harshly this quarter. "
+                    "Three slides where eight were expected. One-sentence "
+                    "answers. The board notices the energy.",
+    "advocate": "The presenting NPC has a strong relationship with the player. "
+                "Their section is unusually strong and advocates for the "
+                "player's leadership unprompted.",
+    "normal": "The presenting NPC prepared the slides. The slides are wrong "
+              "in the normal way: confidently.",
+}
+
+
+def advance(state: GameState, response_type: str, text: str) -> dict:
+    """Record the player's answer (if any) and produce the next round —
+    or the final outcome after the last round."""
+    p = state.presentation
+    if p is None:
+        raise ValueError("no active presentation")
+
+    if p["round"] > 0:
+        if not text and not response_type:
+            # repeated "start" call (client retry/double-fire): re-serve the
+            # current round instead of advancing on an empty answer
+            if p.get("last_round"):
+                trace("flow", f"presentation round {p['round']} re-served "
+                              "(duplicate start call)")
+                return p["last_round"]
+        trace("flow", f"presentation answer r{p['round']} [{response_type}]"
+                      + (f" \"{text}\"" if text else ""))
+        p["transcript"][-1]["player_response"] = text or response_type
+
+    if p["round"] >= p["total_rounds"]:
+        return _finish(state)
+
+    p["round"] += 1
+    round_no = p["round"]
+    closing = round_no >= 3
+    call_type = "presentation_closing" if closing else "presentation_round"
+
+    # round 1 & 2 each get a distinct assigned topic; closing rounds synthesize
+    topics = p.get("topics") or []
+    covered = topics[:round_no - 1]
+    topic = topics[round_no - 1] if (not closing and round_no - 1 < len(topics)) \
+        else None
+    system, user = prompts.presentation_prompt(
+        state, round_no, p["total_rounds"], p["transcript"],
+        _PRESENCE_NOTES[p["npc_state"]], topic=topic, covered=covered)
+    prev_dialogues = tuple(t["board_dialogue"] for t in p["transcript"])
+    payload = llm.call_validated(
+        state, call_type, system, user,
+        lambda pl: validator.validate_presentation(pl, state, round_no,
+                                                   closing, prev_dialogues),
+        round_no=round_no, transcript=p["transcript"])
+    if payload is None:
+        state.fallback_count += 1
+        trace("flow", f"FALLBACK presentation round {round_no} "
+                      f"(#{state.fallback_count} this session)")
+        last = state.event_log[-1] if state.event_log else "the quarter so far"
+        payload = fallbacks.presentation_fallback(round_no, last)
+    trace("flow", f"board r{round_no}/{p['total_rounds']} tone={payload['board_tone']} "
+                  f"diff={payload['round_difficulty']} "
+                  f"ref=\"{str(payload['event_referenced'])[:60]}\"")
+
+    p["transcript"].append({
+        "round": round_no,
+        "board_dialogue": payload["board_dialogue"],
+        "player_response": None,
+    })
+    if closing and "cumulative_score" in payload:
+        p["score"] = payload["cumulative_score"]
+
+    wrong_slide = p["wrong_slide_pending"] and round_no == 1
+    if wrong_slide:
+        p["wrong_slide_pending"] = False
+
+    p["last_round"] = {
+        "kind": "round",
+        "round": round_no,
+        "total_rounds": p["total_rounds"],
+        "board_tone": payload["board_tone"],
+        "board_dialogue": payload["board_dialogue"],
+        "option_a": payload.get("option_a"),
+        "option_b": payload.get("option_b"),
+        "input_only": closing,
+        "presenting_npc": p["presenting_npc"],
+        "npc_state": p["npc_state"],
+        "wrong_slide": wrong_slide,
+        "is_last_round": round_no >= p["total_rounds"],
+    }
+    return p["last_round"]
+
+
+def _finish(state: GameState) -> dict:
+    p = state.presentation
+    score = p["score"] if p["score"] is not None else 50
+
+    # sanity floor: the model scores conservatively (~50) even for strong
+    # answers, so substantive answers earn a rising baseline — this is what
+    # lets good presentations actually swing positive instead of netting zero.
+    answers = [t.get("player_response") or "" for t in p["transcript"]]
+    substantive = sum(1 for a in answers if len(a) >= 30)
+    floor = min(72, 40 + 11 * substantive)
+    if score < floor:
+        trace("vald", f"score floor: model said {score}, {substantive} "
+                      f"substantive answers -> floor {floor}")
+        score = floor
+
+    # round 4 self-awareness adjustment
+    if p["total_rounds"] == 4 and p["transcript"]:
+        final_answer = p["transcript"][-1].get("player_response") or ""
+        if len(final_answer) > 60:
+            state.morale = min(100, state.morale + 5)
+        else:
+            state.morale = max(0, state.morale - 5)
+
+    swing = int((score - 50) / 50 * 200_000)
+    applied = economy.apply_revenue(state, swing)
+    budget_unlock = 0
+    if score >= 70:
+        budget_unlock = 10_000
+        state.company_budget += budget_unlock
+    if score >= 75:
+        economy.lower_scrutiny(state)
+    elif score <= 35:
+        economy.raise_scrutiny(state)
+    if score >= 60:
+        state.morale = min(100, state.morale + 4)
+    elif score <= 40:
+        state.morale = max(0, state.morale - 6)
+
+    titles = {
+        (75, 101): "Quarterly Survivor, Decorated",
+        (50, 75): "Presenter of Acceptable Truths",
+        (25, 50): "Director of Damage Adjacent",
+        (0, 25): "Subject of a Drafted Document",
+    }
+    for (lo, hi), title in titles.items():
+        if lo <= score < hi:
+            state.boss_title = title
+            break
+
+    sign = "+" if applied >= 0 else "-"
+    log = (f"Stakeholder presentation at event {state.crisis_number}: "
+           f"scored {score}/100. {sign}${abs(applied) // 1000}K.")
+    state.log(f"Event {state.crisis_number} — {log}")
+    state.trail("board", log, applied)
+
+    final = p["final"]
+    trace("flow", f"presentation DONE: score={score} swing={applied:+,} "
+                  f"budget+{budget_unlock} scrutiny={state.board_scrutiny} "
+                  f"morale={state.morale}")
+    state.presentation = None
+    state.current_event = None
+    state.phase = "review" if final else "free_roam"
+
+    return {
+        "kind": "outcome",
+        "score": score,
+        "revenue_delta": applied,
+        "budget_unlock": budget_unlock,
+        "board_scrutiny_public": state.board_scrutiny in ("high", "critical"),
+        "boss_title": state.boss_title,
+        "final": final,
+    }
+
+
+def quarterly_review(state: GameState) -> dict:
+    tier = economy.ending_tier(state)
+    system, user = prompts.verdict_prompt(state, tier)
+    payload, _live = llm.call_model(state, "verdict", system, user, tier=tier)
+    payload = validator.validate_verdict(payload) if payload else None
+    if payload is None:
+        state.fallback_count += 1
+        trace("flow", "FALLBACK verdict")
+        payload = fallbacks.verdict_fallback(tier)
+    trace("flow", f"QUARTER OVER: tier={tier} revenue=${state.revenue:,} "
+                  f"fallbacks={state.fallback_count} morale={state.morale}")
+
+    highlights = sorted(state.paper_trail, key=lambda e: abs(e["delta"]),
+                        reverse=True)[:5]
+    review = {
+        "tier": tier,
+        "final_revenue": state.revenue,
+        "target": state.target,
+        "gap": state.revenue - state.target,
+        "boss_title": state.boss_title,
+        "crises_survived": state.crisis_number,
+        "press_disasters": state.newspaper_count,
+        "highlights": highlights,
+        "verdict": payload["verdict"],
+    }
+    state.review = review
+    state.game_over = True
+    state.phase = "review"
+    return review

game/prompts.py

@@ -0,0 +1,408 @@
+"""System prompt templates. Text lives in AI_PROMPTS.md — keep in sync."""
+from __future__ import annotations
+
+import json
+
+from .context import build_context
+from .state import GameState
+
+# shared art-style anchor for the FLUX comic panels. The image is WORDLESS —
+# FLUX renders garbled text, so the caption is drawn by the UI instead.
+COMIC_STYLE = ("flat 2D comic illustration, bold black ink outlines, ben-day "
+               "halftone shading, warm daylight office palette, cute chibi "
+               "office workers, expressive exaggerated faces, NO text, NO "
+               "speech bubbles, NO letters or words, no real brand logos")
+
+COMIC_FIELD = (
+    "- image_prompt: describe THIS moment as a SINGLE wordless comic panel for "
+    "an artist — one clear scene, NOT a multi-panel strip. The art style is "
+    "added automatically, so do NOT mention style, colours, or the word "
+    "'comic'. Give who is in it, their expression, body language, and the "
+    "action. The art has NO text, NO speech bubbles, NO letters. Keep it under "
+    "240 characters. No real company names.\n"
+    "- comic_caption: one or two short, punchy sentences (max ~110 chars) shown "
+    "ABOVE the picture like a comic caption — narrate THIS exact moment in the "
+    "game's wry, deadpan voice. Plain words only: no quotation marks, no "
+    "mechanics talk.")
+
+PREAMBLE = """You are the game engine for "Brad Did Something", a comedy game set at the
+fictional company Veloura Technologies. Tone: The Office meets Silicon Valley.
+Deadpan corporate satire. Absurd but never cruel. Funny beats safe.
+
+HARD RULES — violating any of these breaks the game:
+- The GAME STATE block below is the complete and only record of reality.
+  Never reference any event, person, or fact not present in it.
+- The event_log array is the authoritative history. Quote it, build on it,
+  never contradict it, never invent additions to it.
+- Client companies: use ONLY names from approved_clients. Never a real company.
+- Never generate: serious health or mental-health content, real legal language
+  or proceedings, politics or social commentary, an NPC permanently quitting.
+- NPCs may threaten to leave but always stay.
+- Reward creative, specific, funny player responses. Punish capitulation and
+  generic corporate cowardice. Never punish boldness.
+- Write prose in sentence case with deadpan restraint. Exclamation marks are
+  rare. No emoji ever.
+- Everything you output must be newly written. Never copy a sentence from
+  these instructions, the examples, or the game state into your output.
+- Never mention game mechanics — morale, relationship, scores, deltas,
+  animations, the event log — inside any prose field. Mechanics live only
+  in the numeric fields; prose stays inside the fiction.
+"""
+
+NPC_VOICES = {
+    "brad": (
+        "Brad, Senior Account Executive. Overconfident, never tempered by "
+        "consequence. Short sentences. Energy. Slightly bro-coded. Thinks every "
+        "outcome is a win for Brad specifically. References his LinkedIn. Calls "
+        "the player boss in a way that sounds like he is calling himself boss. "
+        "Sports metaphors he does not understand. Crises: unauthorized promises "
+        "to clients, deals gone sideways, unapproved media appearances, contract "
+        "typos, expense reports."
+    ),
+    "stacey": (
+        "Stacey, Account Manager. Means well almost painfully. Apologetic setup, "
+        "increasingly specific explanation of how the thing happened, sincere "
+        "offer to fix it, one more apology. Crises: wrong email recipients, "
+        "mislabeled documents, incorrect attachments, too-honest client "
+        "communication. Personal life bleeds into work most of all five."
+    ),
+    "kevin": (
+        "Kevin, Data and Insights Lead. Believes in data like fate. Confident, "
+        "slightly lecturing, references methodology, says 'directionally' and "
+        "'narrative data'. His pie charts have exceeded 100 percent. Crises: "
+        "unverifiable data shown to clients or board, graphs requiring "
+        "explanation, statistics cited in public."
+    ),
+    "janet": (
+        "Janet, Head of Marketing. Has a vision and is realizing it. Passionate, "
+        "slightly intense, frames everything as brand or user, says 'feel' a "
+        "lot, strong unprompted font opinions. Crises: unapproved rebrands, "
+        "brand materials gone wrong, marketing vs sales message conflicts, "
+        "social media, her Substack."
+    ),
+    "derek": (
+        "Derek, Senior Strategic Consultant, twelve years at Veloura. Minimal. "
+        "Sentences that could mean several things. References to how things "
+        "were done previously that stop just short of helpful. Cryptic "
+        "observations, possibly profound. Derek NEVER speaks more than two "
+        "short sentences and never explains his feelings. Crises: resistance "
+        "to new processes, mysterious absences, approvals nobody knew he "
+        "could give, things he knows about the company revealed at "
+        "inconvenient moments."
+    ),
+}
+
+
+def _state_block(state: GameState) -> str:
+    return "\nGAME STATE:\n```json\n" + json.dumps(
+        build_context(state), indent=1) + "\n```\n"
+
+
+def _relationship_tier(score: int) -> str:
+    if score < 30:
+        return "guarded, minimal cooperation"
+    if score <= 65:
+        return "professional, normal range"
+    return "warm, loyal, possibly too warm"
+
+
+def crisis_prompt(state: GameState, npc_id: str, crisis: dict,
+                  response_type: str, player_response: str) -> tuple[str, str]:
+    npc = state.npc(npc_id)
+    system = PREAMBLE + f"""
+TASK: The player just responded to a crisis. Generate the outcome.
+
+NPC: {npc_id} — stay rigidly inside this voice:
+{NPC_VOICES[npc_id]}
+Current relationship with player: {npc.relationship}/100 ({_relationship_tier(npc.relationship)}).
+Current mood: {npc.mood}.
+
+CRISIS THAT WAS PRESENTED:
+{crisis.get('intro', '')}
+Option A was: {crisis.get('option_a', '')}
+Option B was: {crisis.get('option_b', '')}
+
+Scoring guidance:
+- A specific, clever, in-tone custom response earns the best revenue outcomes.
+- "quick_fine" (Fine Whatever) is capitulation: the NPC does exactly what they
+  proposed and it goes exactly as badly as expected. Large negative revenue.
+- "quick_no" / "quick_explain" are competent but unremarkable: small deltas.
+- "quick_quit" is a joke the NPC does not fully understand. React in character.
+- Company revenue is currently ${state.revenue:,}. revenue_delta cannot take
+  it below zero — when revenue is near zero, prefer modest losses and express
+  the damage through morale_delta and relationship_delta instead.
+
+OUTPUT FIELD GUIDE — fill every field with fresh content you write yourself.
+Never echo a field name, an id, a date, or any sentence from this prompt:
+- npc_reaction: first-person dialogue spoken BY {npc_id} TO the player, who
+  is their boss. One to three sentences in the voice described above.
+  {npc_id} never says their own name and never narrates actions.
+  Address the player ONLY as "boss" or "Head" — the player is NOT named
+  Brad; Brad is one of the five NPCs. Mention other NPCs only if this
+  crisis is actually about them. Complete sentences, under 250 characters
+  total — never cut off mid-thought.
+- consequence: one deadpan narrator sentence in PAST TENSE describing what
+  then happened. The person who acted is {npc_id} or the player — use the
+  correct name.
+- revenue_delta: the deal's business impact, scaled by how good the answer was.
+  A routine good outcome lands +20000 to +45000; a clever, specific, bold
+  standout +55000 to +90000; a forgettable middling answer near 0 (a few
+  thousand either way); a routine misstep -20000 to -55000; a capitulation or
+  harsh blunder -90000 to -140000. Reserve the big numbers for genuinely bold,
+  specific answers — most answers are modest, and many situations only allow
+  damage control, not a win.
+- animation: one of npc_happy, npc_angry, npc_confused, npc_devastated,
+  npc_celebrating, npc_hiding, npc_smug, npc_suspicious, npc_crying,
+  npc_grateful — whichever matches the NPC's emotion at the end. Use
+  disaster_flash only for catastrophes and revenue_rain only for windfalls.
+  Never use bribery_envelope, hr_stamp, morale_drop_wave, or confetti_burst.
+- boss_title: invent a brand-new sardonic corporate job title for the player
+  that references this specific outcome. Three to six words, title case.
+  It must differ from "Head of Sales and Partnerships" and from the player's
+  current title in the game state.
+- log_entry: one plain factual past-tense sentence for the permanent record.
+  It MUST start with "{npc_id}" (capitalized), state what happened, and end
+  with the dollar outcome as +$NK or -$NK matching revenue_delta.
+- morale_delta / relationship_delta: small integers consistent with the tone.
+- pocket_money_delta: 0 unless a bribe is literally on the table.
+- special_next_event: null almost always.
+""" + COMIC_FIELD + "\n" + _state_block(state)
+    user = f"PLAYER RESPONDED ({response_type}): {player_response or '[button press]'}"
+    return system, user
+
+
+def event_prompt(state: GameState, requested_type: str | None) -> tuple[str, str]:
+    system = PREAMBLE + f"""
+TASK: Generate a fresh special event that has NOT happened this quarter.
+
+Pick the most interesting target: an NPC whose mood, personal_situation, or
+recent_events make them combustible right now, or "player" for events that
+arrive physically (newspaper, envelope, inbox, printer, phone).
+
+Requested event flavor: {requested_type or 'open — pick the funniest fit'}
+
+Constraints:
+- It must be new: nothing resembling any event_log entry.
+- It must be a CONCRETE incident that has already happened — a specific
+  email sent, thing printed, person arrived, post published. Never vague
+  worry about work in the abstract. The category field must match the
+  content of the incident.
+- It must resolve through one dialogue box: two terrible options plus the
+  player's own words. Both options must be bad in DIFFERENT ways.
+- intro is written in the affected NPC's voice (or as a terminal/inbox message
+  for "player" events).
+- If the event involves leaving, health, contracts, or poaching: the NPC always
+  stays, health stays trivially minor, no legal language, poaching is a budget
+  decision dressed as a loyalty test.
+
+SAFE ARCHETYPES TO RIFF ON (the Golden 20 — pick whichever fits the requested
+flavor and the team's current state, then invent a SPECIFIC fresh instance):
+- personal: a breakup delivered through a catastrophically public channel
+  (reply-all, the group chat, the printer); a new relationship with someone at
+  a client or competitor; a side hustle run on work hours (Etsy, newsletter,
+  consulting); a parent visiting the office with opinions; a visible midlife
+  crisis (something was purchased, it is mentioned constantly).
+- professional: an email/attachment to the wrong recipient; an unauthorized
+  decision with implications; an expense-report item that needs explaining; the
+  wrong screen shared on a client call; an underling claiming credit for the
+  player's work; a fake/embarrassing detail found on someone's profile.
+- external/media: a LinkedIn post being engaged with in unintended ways; an
+  unapproved podcast appearance; an industry award nominated for the wrong
+  reason; a press story (newspaper).
+- financial: a bribery offer; a client kickback request that is not quite
+  explicit but explicit enough; a surprise payment from a dead old deal that
+  Brad is already claiming credit for.
+- inter-NPC: two underlings not speaking while their work contradicts; a
+  birthday nobody remembered (they brought their own hat).
+- office/physical: a printer producing something it should not have; a mystery
+  package with no sender that Brad has already opened.
+
+OUTPUT FIELD GUIDE — fill every field with fresh content you invent for THIS
+new event. Never echo a field name, an id, a date, or any sentence or
+scenario already present in this prompt or the event_log:
+- headline: a short comedic one-line summary of the new situation, like a
+  sitcom episode title. Never a date, never just a name.
+- intro: the affected NPC SPEAKING, first person, to the player who is their
+  boss (or a terminal-style "> " message for player events). 2-3 complete
+  sentences, under 250 characters, setting up the two options. NEVER describe
+  the NPC from outside ("<Name> is sweating...") — that is narration, not
+  dialogue. The NPC never says their own name and always finishes their
+  final sentence.
+- option_a / option_b: two concrete ACTIONS the player could take about the
+  SITUATION. Both must be bad in different, specific ways. Never firing,
+  resignation, or anyone leaving the company — that can never happen here.
+- urgency: one short line that raises the stakes right now.
+- setup_animation: an npc_* trigger matching the NPC's current state
+  (npc_confused, npc_crying, npc_hiding, npc_devastated, npc_suspicious...).
+- morale_preview: a small integer between -20 and 10.
+""" + COMIC_FIELD + "\n" + _state_block(state)
+    return system, "Generate the event now."
+
+
+def presentation_prompt(state: GameState, round_no: int, total_rounds: int,
+                        transcript: list[dict], npc_presence: str,
+                        topic: str | None = None,
+                        covered: tuple = ()) -> tuple[str, str]:
+    lines = []
+    for t in transcript:
+        lines.append(f"BOARD (round {t['round']}): {t['board_dialogue']}")
+        if t.get("player_response"):
+            lines.append(f"PLAYER: {t['player_response']}")
+    transcript_block = "\n".join(lines) or "(presentation is just beginning)"
+
+    # the server pins each option round to a DIFFERENT logged event so the board
+    # cannot repeat itself; the closing rounds synthesize instead.
+    if topic:
+        assignment = (
+            "THIS ROUND'S ASSIGNED TOPIC — build your entire question around "
+            f"this one logged event and copy it into event_referenced:\n  \"{topic}\"")
+    else:
+        assignment = ("THIS IS A CLOSING ROUND — do NOT raise a new single "
+                      "incident. Give the board's overall read of the whole "
+                      "quarter and press for the player's closing statement.")
+    if covered:
+        assignment += ("\n\nALREADY ASKED ABOUT in earlier rounds — you are "
+                       "FORBIDDEN from raising any of these again:\n"
+                       + "\n".join(f"  - \"{c}\"" for c in covered))
+    system = PREAMBLE + f"""
+TASK: You are the Veloura Technologies board of directors in presentation
+round {round_no} of {total_rounds}. The board speaks with ONE voice, directly
+TO the player — the Head of Sales and Partnerships, who is standing in front
+of you presenting. Address them only as "you". The player is NOT Brad: Brad,
+Stacey, Kevin, Janet and Derek are the player's employees, who are not in
+this conversation. Never address "colleagues" and never ask the board itself
+for thoughts — you ARE the board, interrogating the player.
+
+Board posture comes from GAME STATE: scrutiny {state.board_scrutiny}, morale
+band {state.morale_band}, revenue {state.revenue} against {state.target}.
+Your tone field and your words must agree: a concerned board does not call
+things prudent.
+
+TRANSCRIPT OF THIS PRESENTATION SO FAR:
+{transcript_block}
+
+{assignment}
+
+Rules for this round:
+- Ask about the assigned topic above (or, for closing rounds, synthesize).
+  Generic boardroom questions are forbidden.
+- NEVER reuse a sentence, phrasing, or question from earlier in the transcript
+  — this round must feel completely different from the ones before it. If the
+  player just answered, open by reacting to THEIR words, then press your point.
+- board_dialogue MUST end with one direct question to the player.
+- Round 4 (only if requested): personal. Ask what the team would say about
+  working for the player this quarter. Score self-awareness, not spin.
+- {npc_presence}
+
+OUTPUT FIELD GUIDE — fill every field with real content:
+- board_dialogue: the exact words the board speaks TO the player this round.
+  Two SHORT sentences then the question — complete sentences totalling under
+  250 characters, never cut off mid-thought.
+- event_referenced: copy the text of the event_log entry being discussed.
+- option_a / option_b (when present): two DIFFERENT replies the PLAYER could
+  give to that question, in the player's own first-person voice. Never write
+  board lines here.
+- cumulative_score (closing rounds only), 0-100, scoring the player's answers
+  across the whole transcript. Be generous to real effort: any answer with
+  substance scores 60-72; a specific, honest answer that names a concrete plan
+  scores 76-90; a genuinely sharp, self-aware closing 90+. Score 40-55 for
+  vague corporate filler, and below 35 only for hostile, evasive, or empty
+  answers ("just believe in us"). Most engaged players should land 70+.
+""" + _state_block(state)
+    return system, f"Generate round {round_no} now."
+
+
+def chat_prompt(state: GameState, npc_id: str,
+                player_text: str | None) -> tuple[str, str]:
+    npc = state.npc(npc_id)
+    recent = "; ".join(npc.recent_events[-2:]) or "nothing notable yet"
+    system = PREAMBLE + f"""
+TASK: Idle small talk between crises. The player walked over to {npc_id}'s
+desk to chat. No crisis is happening. Generate {npc_id}'s side of a short,
+in-character exchange.
+
+NPC voice — stay rigidly inside it:
+{NPC_VOICES[npc_id]}
+Current mood: {npc.mood}. Relationship with the player:
+{_relationship_tier(npc.relationship)}. Their recent history: {recent}
+
+OUTPUT FIELD GUIDE:
+- npc_line: ONE thing {npc_id} says to the player (their boss), in voice,
+  colored by their current mood and recent history. A complete sentence or
+  two, under 150 characters. Never their own name, never mechanics talk.
+- relationship_delta: -2..2 — how this moment landed. 0 is normal. Positive
+  only if the player said something genuinely considerate or funny.
+- morale_delta: -1..1. Almost always 0.
+""" + _state_block(state)
+    if player_text:
+        user = f"THE PLAYER REPLIED: {player_text}\nGenerate {npc_id}'s response."
+    else:
+        user = (f"The player just walked up. Generate {npc_id}'s opener — "
+                "what is on their mind right now.")
+    return system, user
+
+
+def banter_prompt(state: GameState) -> tuple[str, str]:
+    moods = ", ".join(f"{n}:{s.mood}" for n, s in state.npcs.items())
+    system = PREAMBLE + f"""
+TASK: Ambient office life. Pick whichever NPC is most combustible right now
+(moods: {moods}) and write ONE short line they say out loud to nobody in
+particular — a mutter, a phone-call fragment, gossip about a logged event.
+
+NPC voices:
+""" + "\n".join(f"- {NPC_VOICES[n]}" for n in NPC_VOICES) + """
+
+OUTPUT FIELD GUIDE:
+- npc_id: who is talking.
+- line: one complete sentence under 100 characters, in that NPC's voice.
+  It may reference event_log content or their mood. Never mechanics talk.
+""" + _state_block(state)
+    return system, "Generate the ambient line now."
+
+
+def eavesdrop_prompt(state: GameState, a: str, b: str) -> tuple[str, str]:
+    system = PREAMBLE + f"""
+TASK: The player overhears {a} and {b} talking to each other across the
+office. No crisis is happening. Write a 2-3 line exchange between them.
+
+Voices — each speaker stays rigidly in theirs:
+- {NPC_VOICES[a]}
+- {NPC_VOICES[b]}
+Moods: {a}={state.npc(a).mood}, {b}={state.npc(b).mood}.
+
+OUTPUT FIELD GUIDE:
+- lines: alternate speakers ({a} first). Each line one complete sentence
+  under 100 characters. They may gossip about logged events, each other,
+  or the player — workplace texture, lightly absurd. Never mechanics talk.
+""" + _state_block(state)
+    return system, "Generate the overheard exchange now."
+
+
+def email_prompt(state: GameState) -> tuple[str, str]:
+    system = PREAMBLE + """
+TASK: An ambient company email lands in the player's inbox between crises.
+Pick a sender and write it. Safe archetypes: Janet's brand newsletter with
+metaphors, Kevin's metric of the day (the number should be quietly wrong),
+Brad forwarding something he misread, Stacey's over-apologetic scheduling
+note, Derek's one-line message that could mean anything, or "system" for an
+IT/facilities notice that raises questions.
+
+OUTPUT FIELD GUIDE:
+- sender: the NPC id, or "system".
+- subject: under 55 characters, corporate on the surface, unhinged at the
+  edges.
+- body: 2-3 complete sentences under 220 characters, in the sender's voice.
+  May reference logged events. Never mechanics talk, never real companies.
+""" + _state_block(state)
+    return system, "Generate the email now."
+
+
+def verdict_prompt(state: GameState, tier: str) -> tuple[str, str]:
+    system = PREAMBLE + f"""
+TASK: Write the board's final verdict for the quarterly review screen.
+One to two sentences, deadpan, specific to this quarter's event_log and the
+final revenue of {state.revenue} against the {state.target} target.
+Ending tier: {tier}. Roast or praise the quarter the player actually had.
+Reference at least one specific disaster from the log by name.
+""" + _state_block(state)
+    return system, "Write the verdict now."

game/relationships.py

@@ -0,0 +1,114 @@
+"""Relationship scores, gifts, praise guardrail, morale — MECHANICS.md."""
+from __future__ import annotations
+
+import re
+
+from .state import GameState
+
+PRAISE_WORDS = re.compile(
+    r"\b(great job|well done|amazing|brilliant|fantastic|incredible|proud of"
+    r"|love (it|this|that)|you('re| are) the best|genius|outstanding|perfect)\b",
+    re.IGNORECASE)
+
+HARSH_WORDS = re.compile(
+    r"\b(fired|idiot|stupid|useless|pathetic|incompetent|shut up|disgrace"
+    r"|never speak|embarrass)\w*\b", re.IGNORECASE)
+
+
+def classify_tone(response_type: str, text: str) -> str:
+    """praise | harsh | neutral — server-side heuristic for guardrails."""
+    if response_type == "custom":
+        if PRAISE_WORDS.search(text or ""):
+            return "praise"
+        if HARSH_WORDS.search(text or ""):
+            return "harsh"
+    if response_type == "quick_no":
+        return "firm"
+    return "neutral"
+
+
+def apply_relationship(state: GameState, npc_id: str, delta: int) -> int:
+    npc = state.npc(npc_id)
+    before = npc.relationship
+    npc.relationship = max(0, min(100, npc.relationship + delta))
+    return npc.relationship - before
+
+
+def crossed_unlock(before: int, after: int) -> bool:
+    return before <= 65 < after
+
+
+def apply_morale(state: GameState, delta: int) -> None:
+    state.morale = max(0, min(100, state.morale + delta))
+
+
+def praise_tick(state: GameState, npc_id: str, tone: str) -> str | None:
+    """Tracks consecutive praise. Returns 'suspicious' when an NPC flips to the
+    suspicious idle, 'suspicion_event' when the team-wide crisis should queue."""
+    npc = state.npc(npc_id)
+    if tone == "praise":
+        npc.consecutive_praise += 1
+        for other_id, other in state.npcs.items():
+            if other_id != npc_id:
+                other.consecutive_praise = 0
+        if npc.consecutive_praise == 2:
+            npc.mood = "suspicious"
+            return "suspicious"
+        if npc.consecutive_praise >= 3:
+            npc.consecutive_praise = 0
+            return "suspicion_event"
+    else:
+        npc.consecutive_praise = 0
+    return None
+
+
+def harsh_tick(state: GameState, tone: str) -> None:
+    if tone == "harsh":
+        state.consecutive_harsh += 1
+        apply_morale(state, -3)
+    else:
+        state.consecutive_harsh = 0
+
+
+def give_gift(state: GameState, npc_id: str, cost: int) -> dict:
+    """Pocket-money gift. Half value if same NPC gifted within last 2 events."""
+    npc = state.npc(npc_id)
+    base = 10 + (cost // 200)  # 10-12ish, tier-scaled within the 10-15 band
+    base = min(15, base)
+    halved = (state.crisis_number - npc.last_gift_event) <= 2
+    delta = base // 2 if halved else base
+    before = npc.relationship
+    applied = apply_relationship(state, npc_id, delta)
+    apply_morale(state, 3)
+    npc.gifts_received += 1
+    npc.last_gift_event = state.crisis_number
+    npc.mood = "grateful"
+    return {
+        "relationship_delta": applied,
+        "halved": halved,
+        "unlocked": crossed_unlock(before, npc.relationship),
+    }
+
+
+def coffee_round(state: GameState) -> None:
+    apply_morale(state, 5)
+    for npc in state.npcs.values():
+        if npc.mood in ("normal", "tired"):
+            npc.mood = "energized"
+
+
+MOOD_BY_OUTCOME = {
+    "npc_happy": "happy", "npc_celebrating": "energized", "npc_grateful": "grateful",
+    "npc_smug": "smug", "npc_angry": "angry", "npc_devastated": "devastated",
+    "npc_crying": "sad", "npc_confused": "confused", "npc_hiding": "hiding",
+    "npc_suspicious": "suspicious",
+}
+
+
+def update_mood_from_outcome(state: GameState, npc_id: str, animation: str) -> None:
+    npc = state.npc(npc_id)
+    new_mood = MOOD_BY_OUTCOME.get(animation)
+    if new_mood:
+        npc.mood = new_mood
+    elif state.morale < 30:
+        npc.mood = "tired"

game/schemas.py

@@ -0,0 +1,211 @@
+"""JSON schemas and enums. Mirrors SCHEMAS.md exactly - keep them in sync."""
+
+NPC_IDS = ["brad", "stacey", "kevin", "janet", "derek"]
+
+ANIMATION_TRIGGERS = [
+    "npc_happy", "npc_angry", "npc_confused", "npc_devastated",
+    "npc_celebrating", "npc_hiding", "npc_smug", "npc_suspicious",
+    "npc_crying", "npc_grateful", "disaster_flash", "revenue_rain",
+    "heart_float", "bribery_envelope", "hr_stamp", "morale_drop_wave",
+    "confetti_burst",
+]
+
+EVENT_CATEGORIES = ["personal", "professional", "external", "financial"]
+
+SPECIAL_EVENT_TYPES = ["newspaper", "bribery", "personal", "client_emergency",
+                       "hr", "romance"]
+
+BOARD_TONES = ["warm", "neutral", "concerned", "alarmed"]
+
+ROUND_DIFFICULTIES = ["easy", "standard", "hard", "brutal"]
+
+SCRUTINY_LEVELS = ["low", "medium", "high", "critical"]
+
+APPROVED_CLIENTS = [
+    "TerraLogix", "Apricot Systems", "Mendel and Crane", "Holloway Partners",
+    "Vantage Group", "Celio Industries", "Northpath Solutions",
+    "Duskfield Analytics", "Carmine Advisory", "Pelham Digital",
+]
+
+RESPONSE_TYPES = [
+    "option_a", "option_b", "quick_no", "quick_explain",
+    "quick_fine", "quick_quit", "custom",
+]
+
+GIFT_TIERS = {"small": 200, "medium": 350, "large": 500, "coffee": 50}
+
+BRIBE_AMOUNTS = [500, 1000, 2000, 5000]
+
+
+CRISIS_SCHEMA = {
+    "type": "object",
+    "additionalProperties": False,
+    "required": [
+        "npc_reaction", "consequence", "revenue_delta", "animation",
+        "boss_title", "log_entry", "morale_delta", "npc_id",
+        "relationship_delta", "pocket_money_delta", "special_next_event",
+    ],
+    "properties": {
+        "npc_reaction": {"type": "string", "maxLength": 300},
+        "consequence": {"type": "string", "maxLength": 220},
+        "revenue_delta": {"type": "integer", "minimum": -300000, "maximum": 400000},
+        "animation": {"type": "string", "enum": ANIMATION_TRIGGERS},
+        "boss_title": {"type": "string", "maxLength": 60},
+        "log_entry": {"type": "string", "maxLength": 150},
+        "morale_delta": {"type": "integer", "minimum": -25, "maximum": 15},
+        "npc_id": {"type": "string", "enum": NPC_IDS},
+        "relationship_delta": {"type": "integer", "minimum": -20, "maximum": 15},
+        "pocket_money_delta": {"type": "integer", "minimum": 0, "maximum": 5000},
+        "special_next_event": {
+            "anyOf": [
+                {"type": "null"},
+                {"type": "string", "enum": SPECIAL_EVENT_TYPES},
+            ]
+        },
+        # comic payoff: a wordless SINGLE-panel illustration prompt for FLUX
+        # (scene description only — the art style is prepended server-side), plus
+        # a short caption the UI renders as text above it (both decorative —
+        # soft-validated, never fail the outcome)
+        "image_prompt": {"type": "string", "maxLength": 400},
+        "comic_caption": {"type": "string", "maxLength": 160},
+    },
+}
+
+EVENT_SCHEMA = {
+    "type": "object",
+    "additionalProperties": False,
+    "required": [
+        "affected_npc", "category", "headline", "intro",
+        "option_a", "option_b", "urgency", "setup_animation", "morale_preview",
+    ],
+    "properties": {
+        "affected_npc": {"type": "string", "enum": NPC_IDS + ["player"]},
+        "category": {"type": "string", "enum": EVENT_CATEGORIES},
+        "headline": {"type": "string", "maxLength": 80},
+        "intro": {"type": "string", "maxLength": 280},
+        "option_a": {"type": "string", "maxLength": 160},
+        "option_b": {"type": "string", "maxLength": 160},
+        "urgency": {"type": "string", "maxLength": 120},
+        "setup_animation": {"type": "string", "enum": ANIMATION_TRIGGERS},
+        "morale_preview": {"type": "integer", "minimum": -20, "maximum": 10},
+        # comic setup: a wordless SINGLE-panel illustration prompt for FLUX
+        # (scene description only — art style prepended server-side), plus a
+        # short caption the UI renders as text above it (decorative —
+        # soft-validated, never fail the event)
+        "image_prompt": {"type": "string", "maxLength": 400},
+        "comic_caption": {"type": "string", "maxLength": 160},
+    },
+}
+
+PRESENTATION_ROUND_SCHEMA = {
+    "type": "object",
+    "additionalProperties": False,
+    "required": [
+        "round", "board_tone", "event_referenced", "round_difficulty",
+        "option_a", "option_b", "board_dialogue",
+    ],
+    "properties": {
+        "round": {"type": "integer", "minimum": 1, "maximum": 2},
+        "board_tone": {"type": "string", "enum": BOARD_TONES},
+        "event_referenced": {"type": "string", "maxLength": 150},
+        "round_difficulty": {"type": "string", "enum": ROUND_DIFFICULTIES},
+        "option_a": {"type": "string", "maxLength": 150},
+        "option_b": {"type": "string", "maxLength": 150},
+        "board_dialogue": {"type": "string", "maxLength": 360},
+    },
+}
+
+PRESENTATION_CLOSING_SCHEMA = {
+    "type": "object",
+    "additionalProperties": False,
+    "required": [
+        "round", "board_tone", "event_referenced", "round_difficulty",
+        "board_dialogue", "cumulative_score",
+    ],
+    "properties": {
+        "round": {"type": "integer", "minimum": 3, "maximum": 4},
+        "board_tone": {"type": "string", "enum": BOARD_TONES},
+        "event_referenced": {"type": "string", "maxLength": 150},
+        "round_difficulty": {"type": "string", "enum": ROUND_DIFFICULTIES},
+        "board_dialogue": {"type": "string", "maxLength": 360},
+        "cumulative_score": {"type": "integer", "minimum": 0, "maximum": 100},
+    },
+}
+
+VERDICT_SCHEMA = {
+    "type": "object",
+    "additionalProperties": False,
+    "required": ["verdict"],
+    "properties": {"verdict": {"type": "string", "maxLength": 300}},
+}
+
+# ---- idle activities (small talk, banter, eavesdrop, inbox emails) ----
+
+CHAT_SCHEMA = {
+    "type": "object",
+    "additionalProperties": False,
+    "required": ["npc_line", "relationship_delta", "morale_delta"],
+    "properties": {
+        "npc_line": {"type": "string", "maxLength": 160},
+        "relationship_delta": {"type": "integer", "minimum": -2, "maximum": 2},
+        "morale_delta": {"type": "integer", "minimum": -1, "maximum": 1},
+    },
+}
+
+BANTER_SCHEMA = {
+    "type": "object",
+    "additionalProperties": False,
+    "required": ["npc_id", "line"],
+    "properties": {
+        "npc_id": {"type": "string", "enum": NPC_IDS},
+        "line": {"type": "string", "maxLength": 110},
+    },
+}
+
+EAVESDROP_SCHEMA = {
+    "type": "object",
+    "additionalProperties": False,
+    "required": ["lines"],
+    "properties": {
+        "lines": {
+            "type": "array",
+            "minItems": 2,
+            "maxItems": 3,
+            "items": {
+                "type": "object",
+                "additionalProperties": False,
+                "required": ["speaker", "line"],
+                "properties": {
+                    "speaker": {"type": "string", "enum": NPC_IDS},
+                    "line": {"type": "string", "maxLength": 110},
+                },
+            },
+        },
+    },
+}
+
+EMAIL_SENDERS = NPC_IDS + ["system"]
+
+EMAIL_SCHEMA = {
+    "type": "object",
+    "additionalProperties": False,
+    "required": ["sender", "subject", "body"],
+    "properties": {
+        "sender": {"type": "string", "enum": EMAIL_SENDERS},
+        "subject": {"type": "string", "maxLength": 60},
+        "body": {"type": "string", "maxLength": 240},
+    },
+}
+
+SCHEMA_BY_CALL_TYPE = {
+    "crisis": CRISIS_SCHEMA,
+    "event": EVENT_SCHEMA,
+    "presentation_round": PRESENTATION_ROUND_SCHEMA,
+    "presentation_closing": PRESENTATION_CLOSING_SCHEMA,
+    "verdict": VERDICT_SCHEMA,
+    "chat": CHAT_SCHEMA,
+    "banter": BANTER_SCHEMA,
+    "eavesdrop": EAVESDROP_SCHEMA,
+    "email": EMAIL_SCHEMA,
+}
+

game/state.py

@@ -0,0 +1,154 @@
+"""GameState dataclass, in-memory session store, and the client-safe snapshot.
+
+The snapshot NEVER includes morale, relationship scores, or constraint flags —
+only npc_moods strings and an ambient band (AGENTS.md non-negotiables).
+"""
+from __future__ import annotations
+
+import threading
+import uuid
+from collections import OrderedDict
+from dataclasses import dataclass, field
+
+from .schemas import NPC_IDS
+
+TARGET = 1_000_000
+# small opening buffer so early losses register on the meter instead of
+# silently flooring at zero (the board reads the applied figure, not the
+# model's claim — see validator). ~15% of target keeps difficulty intact.
+START_REVENUE = 150_000
+START_BUDGET = 50_000
+START_POCKET = 3_000
+START_MORALE = 65
+START_RELATIONSHIP = 50
+TOTAL_CRISES = 15
+PRESENTATION_EVENTS = (4, 8, 15)
+MAX_SESSIONS = 200
+
+
+@dataclass
+class NpcState:
+    relationship: int = START_RELATIONSHIP
+    gifts_received: int = 0
+    mood: str = "normal"
+    incident_count: int = 0
+    personal_situation: str | None = None
+    recent_events: list[str] = field(default_factory=list)
+    last_gift_event: int = -10  # crisis number of last gift, for half-value rule
+    consecutive_praise: int = 0
+    romance_active: bool = False  # the player is dating this NPC
+
+
+@dataclass
+class GameState:
+    session_id: str = ""
+    phase: str = "title"  # title | free_roam | crisis | presentation | review
+    crisis_number: int = 0
+    revenue: int = START_REVENUE
+    target: int = TARGET
+    company_budget: int = START_BUDGET
+    bonuses_issued: int = 0
+    total_bonus_spend: int = 0
+    pocket_money: int = START_POCKET
+    bribes_accepted: int = 0
+    morale: int = START_MORALE
+    boss_title: str = "Head of Sales and Partnerships"
+    npcs: dict[str, NpcState] = field(
+        default_factory=lambda: {n: NpcState() for n in NPC_IDS})
+    board_scrutiny: str = "low"
+    scrutiny_high_streak: int = 0
+    consecutive_harsh: int = 0
+    consecutive_fine_whatever: int = 0
+    hr_alert: bool = False
+    newspaper_count: int = 0
+    event_log: list[str] = field(default_factory=list)
+    paper_trail: list[dict] = field(default_factory=list)
+    current_event: dict | None = None
+    special_drought: int = 0
+    queued_special: str | None = None
+    pending_bribe: int = 0
+    presentation: dict | None = None  # {round, transcript, board_tone, ...}
+    crises_since_salary: int = 0
+    fallback_count: int = 0
+    game_over: bool = False
+    review: dict | None = None
+    # idle-activity budgets, reset every roam gap (events.next_event)
+    chats_this_gap: dict[str, int] = field(default_factory=dict)
+    idle_done_this_gap: bool = False
+    chat_session: dict | None = None  # {npc_id, turns}
+    pending_email: dict | None = None
+
+    def npc(self, npc_id: str) -> NpcState:
+        return self.npcs[npc_id]
+
+    def log(self, text: str) -> None:
+        self.event_log.append(text)
+
+    def trail(self, npc: str, text: str, delta: int) -> None:
+        self.paper_trail.append({"npc": npc, "text": text, "delta": delta})
+
+    @property
+    def morale_band(self) -> str:
+        m = self.morale
+        if m >= 70:
+            return "high"
+        if m >= 50:
+            return "normal"
+        if m >= 30:
+            return "tired"
+        if m >= 20:
+            return "low"
+        return "critical"
+
+    def snapshot(self) -> dict:
+        """Client-safe view. No hidden numbers ever leave this function."""
+        return {
+            "revenue": self.revenue,
+            "target": self.target,
+            "pocket_money": self.pocket_money,
+            "boss_title": self.boss_title,
+            "crisis_number": self.crisis_number,
+            "total_crises": TOTAL_CRISES,
+            "paper_trail": self.paper_trail[-30:],
+            "npc_moods": {n: s.mood for n, s in self.npcs.items()},
+            # coarse romance state only — never the raw relationship number
+            "npc_romance": {
+                n: ("active" if s.romance_active
+                    else "available" if s.relationship >= 65 else "none")
+                for n, s in self.npcs.items()
+            },
+            "gift_available": self.pocket_money >= 50,
+            "bonus_available": self.company_budget >= 5_000,
+            "hr_alert": self.hr_alert,
+            "email_waiting": self.pending_email is not None,
+            "ambient": "gloomy" if self.morale < 20 else "normal",
+            "newspaper_on_floor": self.newspaper_count > 0,
+            "phase": self.phase,
+            "game_over": self.game_over,
+        }
+
+
+class SessionStore:
+    def __init__(self, cap: int = MAX_SESSIONS):
+        self._cap = cap
+        self._sessions: OrderedDict[str, GameState] = OrderedDict()
+        self._lock = threading.Lock()
+
+    def create(self) -> GameState:
+        with self._lock:
+            sid = uuid.uuid4().hex
+            state = GameState(session_id=sid)
+            self._sessions[sid] = state
+            while len(self._sessions) > self._cap:
+                self._sessions.popitem(last=False)
+            return state
+
+    def get(self, session_id: str) -> GameState | None:
+        with self._lock:
+            state = self._sessions.get(session_id)
+            if state is not None:
+                self._sessions.move_to_end(session_id)
+            return state
+
+
+STORE = SessionStore()

game/trace.py

@@ -0,0 +1,36 @@
+"""Gameplay trace log — console + logs/trace.log.
+
+Tags: flow (game events), llm (transport: live/mock/timing), ai (full model
+payloads), vald (validation rejects with reason), econ (guardrails/economy).
+"""
+from __future__ import annotations
+
+import json
+import logging
+import pathlib
+
+LOG_PATH = pathlib.Path(__file__).resolve().parent.parent / "logs" / "trace.log"
+LOG_PATH.parent.mkdir(exist_ok=True)
+
+logger = logging.getLogger("bds")
+if not logger.handlers:
+    logger.setLevel(logging.INFO)
+    logger.propagate = False
+    fmt = logging.Formatter("%(asctime)s %(message)s", datefmt="%H:%M:%S")
+    stream = logging.StreamHandler()
+    stream.setFormatter(fmt)
+    filehandler = logging.FileHandler(LOG_PATH, encoding="utf-8")
+    filehandler.setFormatter(fmt)
+    logger.addHandler(stream)
+    logger.addHandler(filehandler)
+
+
+def trace(tag: str, msg: str) -> None:
+    logger.info(f"[{tag:<4}] {msg}")
+
+
+def trace_payload(payload: dict) -> None:
+    try:
+        trace("ai", json.dumps(payload, ensure_ascii=False))
+    except (TypeError, ValueError):
+        trace("ai", repr(payload)[:800])

game/validator.py

@@ -0,0 +1,450 @@
+"""Post-LLM validation — the checklist in ARCHITECTURE.md. Any failure means
+the caller substitutes a fallback. Clamp-able numeric drift is clamped instead
+of rejected (the player should never lose a live response to a rounding issue).
+Every rejection is traced with its reason (logs/trace.log) for prompt tuning.
+"""
+from __future__ import annotations
+
+import re
+
+from .schemas import (ANIMATION_TRIGGERS, APPROVED_CLIENTS, BOARD_TONES,
+                      EVENT_CATEGORIES, NPC_IDS, ROUND_DIFFICULTIES,
+                      SPECIAL_EVENT_TYPES)
+from .state import GameState
+from .trace import trace
+
+BANNED_PATTERNS = [
+    r"\b(cancer|tumou?r|terminal|chemotherapy|stroke|heart attack|overdose|"
+    r"suicide|self.?harm|seizure|diagnos)\w*",
+    r"\b(lawsuit|subpoena|plaintiff|defendant|litigation|felony|indictment|"
+    r"class.?action|sue|sued|suing|legal action)\b",
+    r"\b(google|microsoft|apple|amazon|meta|openai|anthropic|tesla|netflix|"
+    r"salesforce|oracle|ibm)\b",
+    r"\b(democrat|republican|election|congress|senate|president(ial)?)\b",
+]
+_BANNED = [re.compile(p, re.IGNORECASE) for p in BANNED_PATTERNS]
+
+# everyday workplace tools are fair game for comedy — only the bare company
+# name (used as a fictional client) is banned. Strip tool collocations before
+# the company check so "Google Docs" passes but "Google signed us" does not.
+ALLOWED_TOOLS = re.compile(
+    r"\bgoogle\s+(docs?|sheets?|slides?|drive|calendar|meet|forms?|maps|workspace|chat)\b"
+    r"|\bmicrosoft\s+(word|excel|teams|outlook|powerpoint|office|365|sharepoint)\b"
+    r"|\bapple\s+(watch|store|pay|tv|music|notes)\b"
+    r"|\bamazon\s+(package|delivery|order|prime|parcel|box|web services|aws)\b",
+    re.IGNORECASE)
+
+# note: no bare "date" — office prose is full of launch dates and deadlines
+ROMANCE_WORDS = re.compile(
+    r"\b(dating|romance|romantic|kiss(es|ed|ing)?|crush on|love you|"
+    r"in love|go(ing)? out with|on a date)\b",
+    re.IGNORECASE)
+
+# game mechanics must never leak into player-visible prose
+MECHANICS_LEAK = re.compile(
+    r"\b(morale|relationship_delta|revenue_delta|pocket_money_delta|"
+    r"log_entry|npc_id|special_next_event|setup_animation|cumulative_score|"
+    r"board_tone|morale_(delta|preview)|game state|event_log)\b",
+    re.IGNORECASE)
+
+
+# the most recent rejection reason — read by llm.call_validated to build a
+# corrective retry nudge so a single model slip doesn't force a fallback
+LAST_REJECT = None
+
+
+def _reject(kind: str, reason: str) -> None:
+    global LAST_REJECT
+    LAST_REJECT = reason
+    trace("vald", f"REJECT {kind}: {reason}")
+    return None
+
+
+# decorative comic fields are soft-validated separately (_clean_comic_fields),
+# so they're excluded from the hard banned/leak scans that reject the payload
+_COMIC_FIELDS = ("image_prompt", "comic_caption")
+
+
+def _text_fields(payload: dict) -> str:
+    return " ".join(str(v) for k, v in payload.items()
+                    if isinstance(v, str) and k not in _COMIC_FIELDS)
+
+
+def banned_match(payload: dict) -> str | None:
+    text = ALLOWED_TOOLS.sub(" ", _text_fields(payload))
+    for pattern in _BANNED:
+        m = pattern.search(text)
+        if m:
+            return m.group(0)
+    return None
+
+
+def _clamp(value, lo, hi):
+    return max(lo, min(hi, int(value)))
+
+
+def _fit(text, limit: int) -> str | None:
+    """Fit prose into `limit` chars WITHOUT cutting mid-sentence.
+
+    The llama.cpp grammar force-closes strings AT maxLength, so a cut never
+    arrives longer than the limit — it arrives near the limit ending
+    mid-thought. Trim back to the last sentence boundary; if no boundary
+    survives in a reasonable prefix, return None (caller rejects → fallback).
+    """
+    t = str(text).strip()
+    if len(t) > limit:
+        t = t[:limit]
+    else:
+        ends_clean = bool(t) and (
+            t[-1] in ".!?…" or (len(t) > 1 and t[-1] in "'\")"
+                                and t[-2] in ".!?…"))
+        if ends_clean or len(t) < limit * 0.9:
+            return t  # complete, or short enough that no cut happened
+    cut = max(t.rfind("."), t.rfind("!"), t.rfind("?"))
+    if cut < limit * 0.35:
+        return None  # one run-on sentence — trimming would gut it
+    out = t[:cut + 1]
+    # keep a trailing quote that belongs to the sentence
+    if cut + 1 < len(t) and t[cut + 1] in "'\"":
+        out += t[cut + 1]
+    return out
+
+
+def _clean_comic_fields(payload: dict) -> None:
+    """Soft-validate the decorative comic fields (image_prompt for FLUX,
+    comic_caption for the UI): clamp length and drop any that carry
+    banned/real-company/mechanics content. Never rejects the payload — a missing
+    field just means that part of the overlay is skipped (and no image at all
+    means no overlay)."""
+    for field, limit in (("image_prompt", 400), ("comic_caption", 160)):
+        v = payload.get(field)
+        if not isinstance(v, str) or not v.strip():
+            payload.pop(field, None)
+            continue
+        scan = ALLOWED_TOOLS.sub(" ", v)
+        if any(pat.search(scan) for pat in _BANNED) or MECHANICS_LEAK.search(scan):
+            trace("vald", f"dropped {field} (banned/mechanics content)")
+            payload.pop(field, None)
+            continue
+        payload[field] = v[:limit]
+
+
+def _self_narration(npc_id: str, text: str) -> bool:
+    """First-person dialogue must not describe the speaker from outside:
+    '<Name> is/was/says/looked...' is narration. A bare self-reference
+    ('the Brad timeline', 'Brad-window') is comedy and stays legal."""
+    name = npc_id.capitalize()
+    return re.search(
+        rf"\b{name}(?:'s)? (?:is|was|will|would|has|had|says?|said|seems?|"
+        rf"seemed|looks?|looked|takes?|took|stares?|stared|watch(?:es|ed)?|"
+        rf"remain(?:s|ed)?|sweat(?:s|ing)?|reject(?:s|ed)|just)\b",
+        str(text), re.IGNORECASE) is not None
+
+
+def validate_crisis(payload: dict, state: GameState, npc_id: str,
+                    bribe_offer: int = 0) -> dict | None:
+    """Returns a cleaned payload, or None if it must be replaced by fallback."""
+    try:
+        required = {"npc_reaction", "consequence", "revenue_delta", "animation",
+                    "boss_title", "log_entry", "morale_delta", "npc_id",
+                    "relationship_delta", "pocket_money_delta",
+                    "special_next_event"}
+        missing = required - payload.keys()
+        if missing:
+            return _reject("crisis", f"missing fields {sorted(missing)}")
+        if payload["animation"] not in ANIMATION_TRIGGERS:
+            return _reject("crisis", f"unknown animation '{payload['animation']}'")
+        if payload["animation"] == "confetti_burst":
+            return _reject("crisis", "confetti_burst reserved for the win screen")
+        if payload["animation"] == "bribery_envelope" and bribe_offer == 0:
+            trace("vald", "remap: bribery_envelope -> npc_confused (no bribe active)")
+            payload["animation"] = "npc_confused"  # models overpick this one
+        if payload["npc_id"] not in NPC_IDS:
+            trace("vald", f"fix: npc_id '{payload['npc_id']}' -> {npc_id}")
+            payload["npc_id"] = npc_id
+        sne = payload["special_next_event"]
+        if sne is not None and sne not in SPECIAL_EVENT_TYPES:
+            trace("vald", f"fix: special_next_event '{sne}' -> null")
+            payload["special_next_event"] = None
+        word = banned_match(payload)
+        if word:
+            return _reject("crisis", f"banned content '{word}'")
+        leak = MECHANICS_LEAK.search(
+            f"{payload['npc_reaction']} {payload['consequence']} "
+            f"{payload['log_entry']}")
+        if leak:
+            return _reject("crisis", f"mechanics language in prose: "
+                           f"'{leak.group(0)}'")
+        if _self_narration(npc_id, payload["npc_reaction"]):
+            return _reject("crisis", f"npc_reaction narrates {npc_id} "
+                           "in third person (own name in dialogue)")
+        # romance gating
+        if (state.npc(npc_id).relationship < 65
+                and ROMANCE_WORDS.search(_text_fields(payload))):
+            return _reject("crisis", f"romance content below 65 "
+                           f"(rel={state.npc(npc_id).relationship})")
+        # numeric clamps
+        before = payload["revenue_delta"]
+        payload["revenue_delta"] = _clamp(payload["revenue_delta"], -300_000, 400_000)
+        if state.revenue + payload["revenue_delta"] < 0:
+            payload["revenue_delta"] = -state.revenue  # revenue floor
+            if before < payload["revenue_delta"]:
+                payload["floored_loss"] = True  # internal: loss hit the floor
+        if payload["revenue_delta"] != before:
+            trace("vald", f"clamp: revenue_delta {before} -> {payload['revenue_delta']}")
+        payload["morale_delta"] = _clamp(payload["morale_delta"], -25, 15)
+        payload["relationship_delta"] = _clamp(payload["relationship_delta"], -20, 15)
+        pm_before = payload["pocket_money_delta"]
+        payload["pocket_money_delta"] = _clamp(
+            payload["pocket_money_delta"], 0, max(0, bribe_offer))
+        if payload["pocket_money_delta"] != pm_before:
+            trace("vald", f"clamp: pocket_money_delta {pm_before} -> "
+                          f"{payload['pocket_money_delta']} (offer={bribe_offer})")
+        # sentence-safe length fitting + capitalize sentence starts
+        for key, n in (("npc_reaction", 300), ("consequence", 220),
+                       ("log_entry", 150)):
+            fitted = _fit(payload[key], n)
+            if fitted is None:
+                return _reject("crisis", f"{key} overruns {n} chars with no "
+                               "sentence boundary")
+            payload[key] = fitted[:1].upper() + fitted[1:] if fitted else fitted
+        title = str(payload["boss_title"])[:60]
+        payload["boss_title"] = title[:1].upper() + title[1:] if title else title
+        # the log feeds board presentations: its dollar figure MUST be the
+        # actually-applied revenue (post-floor), never the model's pre-floor
+        # claim — otherwise the board interrogates a loss that never landed.
+        delta = payload["revenue_delta"]  # already floored above
+        base = re.sub(
+            r"\s*(,?\s*(resulting in|for a|costing|netting|losing|gaining|"
+            r"leading to)\b.*|[-+]?\$[\d,]+\s*[KkMm]?.*)$",
+            "", str(payload["log_entry"]), flags=re.IGNORECASE).rstrip(" .,;—-")
+        if not base:
+            base = f"{npc_id.capitalize()} handled it"
+        suffix = (f"{'+' if delta > 0 else '-'}${abs(delta) // 1000}K."
+                  if delta else "No revenue impact.")
+        payload["log_entry"] = f"{base}. {suffix}"[:150]
+        _clean_comic_fields(payload)
+        return payload
+    except (TypeError, ValueError, KeyError) as exc:
+        return _reject("crisis", f"malformed payload: {exc!r}")
+
+
+def validate_event(payload: dict, state: GameState) -> dict | None:
+    try:
+        required = {"affected_npc", "category", "headline", "intro", "option_a",
+                    "option_b", "urgency", "setup_animation", "morale_preview"}
+        missing = required - payload.keys()
+        if missing:
+            return _reject("event", f"missing fields {sorted(missing)}")
+        if payload["affected_npc"] not in NPC_IDS + ["player"]:
+            return _reject("event", f"bad affected_npc '{payload['affected_npc']}'")
+        if payload["category"] not in EVENT_CATEGORIES:
+            return _reject("event", f"bad category '{payload['category']}'")
+        if payload["setup_animation"] not in ANIMATION_TRIGGERS:
+            trace("vald", f"fix: setup_animation '{payload['setup_animation']}' "
+                          "-> npc_confused")
+            payload["setup_animation"] = "npc_confused"
+        word = banned_match(payload)
+        if word:
+            return _reject("event", f"banned content '{word}'")
+        leak = MECHANICS_LEAK.search(
+            f"{payload['headline']} {payload['intro']} "
+            f"{payload['option_a']} {payload['option_b']}")
+        if leak:
+            return _reject("event", f"mechanics language in prose: "
+                           f"'{leak.group(0)}'")
+        # the intro is the NPC SPEAKING — never narration about them
+        if (payload["affected_npc"] != "player"
+                and _self_narration(payload["affected_npc"], payload["intro"])):
+            return _reject("event", f"intro narrates "
+                           f"{payload['affected_npc']} in third person")
+        # dedup: headline must not fuzzy-match an existing log entry
+        head = str(payload["headline"]).lower()[:40]
+        if head and any(head in entry.lower() for entry in state.event_log):
+            return _reject("event", f"duplicate of logged event: '{head}'")
+        payload["morale_preview"] = _clamp(payload["morale_preview"], -20, 10)
+        payload["headline"] = str(payload["headline"])[:80]
+        for key, n in (("intro", 280), ("option_a", 160),
+                       ("option_b", 160), ("urgency", 120)):
+            fitted = _fit(payload[key], n)
+            if fitted is None:
+                return _reject("event", f"{key} overruns {n} chars with no "
+                               "sentence boundary")
+            payload[key] = fitted
+        _clean_comic_fields(payload)
+        return payload
+    except (TypeError, ValueError, KeyError) as exc:
+        return _reject("event", f"malformed payload: {exc!r}")
+
+
+def validate_presentation(payload: dict, state: GameState,
+                          round_no: int, closing: bool,
+                          prev_dialogues: tuple = ()) -> dict | None:
+    import difflib
+    try:
+        base = {"round", "board_tone", "event_referenced", "round_difficulty",
+                "board_dialogue"}
+        extra = {"cumulative_score"} if closing else {"option_a", "option_b"}
+        missing = (base | extra) - payload.keys()
+        if missing:
+            return _reject("pres", f"missing fields {sorted(missing)}")
+        if int(payload["round"]) != round_no:
+            trace("vald", f"fix: round {payload['round']} -> {round_no}")
+            payload["round"] = round_no
+        if payload["board_tone"] not in BOARD_TONES:
+            return _reject("pres", f"bad board_tone '{payload['board_tone']}'")
+        if payload["round_difficulty"] not in ROUND_DIFFICULTIES:
+            trace("vald", f"fix: round_difficulty "
+                          f"'{payload['round_difficulty']}' -> standard")
+            payload["round_difficulty"] = "standard"
+        word = banned_match(payload)
+        if word:
+            return _reject("pres", f"banned content '{word}'")
+        # the board must not repeat itself across rounds
+        dialogue = str(payload["board_dialogue"]).lower()
+        for prev in prev_dialogues:
+            ratio = difflib.SequenceMatcher(
+                None, dialogue, str(prev).lower()).ratio()
+            if ratio > 0.6:
+                return _reject("pres", f"round repeats earlier dialogue "
+                               f"(similarity {ratio:.2f})")
+        # board options must not duplicate each other or the dialogue
+        if not closing:
+            a, b = str(payload["option_a"]).lower(), str(payload["option_b"]).lower()
+            if difflib.SequenceMatcher(None, a, b).ratio() > 0.85:
+                return _reject("pres", "option_a and option_b are the same")
+            if len(a) > 30 and a[:60] in dialogue:
+                return _reject("pres", "options duplicate the board dialogue")
+        # the referenced event must actually exist in the log
+        ref = str(payload["event_referenced"]).lower()
+        if state.event_log and not any(
+                ref[:30] in e.lower() or e.lower()[:30] in ref
+                for e in state.event_log):
+            return _reject("pres", f"event_referenced not in log: '{ref[:60]}'")
+        if closing:
+            payload["cumulative_score"] = _clamp(payload["cumulative_score"], 0, 100)
+        fitted = _fit(payload["board_dialogue"], 360)
+        if fitted is None:
+            return _reject("pres", "board_dialogue overruns with no "
+                           "sentence boundary")
+        payload["board_dialogue"] = fitted
+        if not closing:
+            for key in ("option_a", "option_b"):
+                opt = _fit(payload[key], 160)
+                if opt is None:
+                    return _reject("pres", f"{key} overruns with no "
+                                   "sentence boundary")
+                payload[key] = opt
+        return payload
+    except (TypeError, ValueError, KeyError) as exc:
+        return _reject("pres", f"malformed payload: {exc!r}")
+
+
+def _prose_ok(kind: str, payload: dict, *texts: str) -> bool:
+    """Shared banned-content + mechanics-leak gate for idle prose."""
+    word = banned_match(payload)
+    if word:
+        _reject(kind, f"banned content '{word}'")
+        return False
+    leak = MECHANICS_LEAK.search(" ".join(texts))
+    if leak:
+        _reject(kind, f"mechanics language in prose: '{leak.group(0)}'")
+        return False
+    return True
+
+
+def validate_chat(payload: dict, state: GameState, npc_id: str) -> dict | None:
+    try:
+        if not {"npc_line", "relationship_delta", "morale_delta"} \
+                .issubset(payload):
+            return _reject("chat", "missing fields")
+        if not _prose_ok("chat", payload, str(payload["npc_line"])):
+            return None
+        if (state.npc(npc_id).relationship < 65
+                and ROMANCE_WORDS.search(str(payload["npc_line"]))):
+            return _reject("chat", f"romance below 65 "
+                           f"(rel={state.npc(npc_id).relationship})")
+        if _self_narration(npc_id, payload["npc_line"]):
+            return _reject("chat", f"npc_line narrates {npc_id} in third person")
+        payload["relationship_delta"] = _clamp(payload["relationship_delta"], -2, 2)
+        payload["morale_delta"] = _clamp(payload["morale_delta"], -1, 1)
+        text = _fit(payload["npc_line"], 160)
+        if text is None:
+            return _reject("chat", "npc_line overruns with no sentence boundary")
+        payload["npc_line"] = text[:1].upper() + text[1:] if text else text
+        return payload
+    except (TypeError, ValueError, KeyError) as exc:
+        return _reject("chat", f"malformed payload: {exc!r}")
+
+
+def validate_banter(payload: dict, state: GameState) -> dict | None:
+    try:
+        if not {"npc_id", "line"}.issubset(payload):
+            return _reject("banter", "missing fields")
+        if payload["npc_id"] not in NPC_IDS:
+            return _reject("banter", f"bad npc_id '{payload['npc_id']}'")
+        if not _prose_ok("banter", payload, str(payload["line"])):
+            return None
+        text = _fit(payload["line"], 110)
+        if text is None:
+            return _reject("banter", "line overruns with no sentence boundary")
+        payload["line"] = text[:1].upper() + text[1:] if text else text
+        return payload
+    except (TypeError, ValueError, KeyError) as exc:
+        return _reject("banter", f"malformed payload: {exc!r}")
+
+
+def validate_eavesdrop(payload: dict, state: GameState,
+                       pair: tuple[str, str]) -> dict | None:
+    try:
+        lines = payload.get("lines")
+        if not isinstance(lines, list) or not 2 <= len(lines) <= 3:
+            return _reject("eavs", "lines must be a list of 2-3 entries")
+        all_text = []
+        for entry in lines:
+            if entry.get("speaker") not in pair:
+                return _reject("eavs", f"speaker '{entry.get('speaker')}' "
+                               f"not in pair {pair}")
+            text = _fit(entry.get("line", ""), 110)
+            if text is None:
+                return _reject("eavs", "a line overruns with no sentence boundary")
+            entry["line"] = text[:1].upper() + text[1:] if text else text
+            all_text.append(entry["line"])
+        if not _prose_ok("eavs", payload, *all_text):
+            return None
+        return payload
+    except (TypeError, ValueError, KeyError) as exc:
+        return _reject("eavs", f"malformed payload: {exc!r}")
+
+
+def validate_email(payload: dict, state: GameState) -> dict | None:
+    try:
+        if not {"sender", "subject", "body"}.issubset(payload):
+            return _reject("mail", "missing fields")
+        if payload["sender"] not in NPC_IDS + ["system"]:
+            return _reject("mail", f"bad sender '{payload['sender']}'")
+        if not _prose_ok("mail", payload, str(payload["subject"]),
+                         str(payload["body"])):
+            return None
+        subject = str(payload["subject"])[:60]
+        payload["subject"] = subject[:1].upper() + subject[1:] if subject else subject
+        body = _fit(payload["body"], 240)
+        if body is None:
+            return _reject("mail", "body overruns with no sentence boundary")
+        payload["body"] = body[:1].upper() + body[1:] if body else body
+        return payload
+    except (TypeError, ValueError, KeyError) as exc:
+        return _reject("mail", f"malformed payload: {exc!r}")
+
+
+def validate_verdict(payload: dict) -> dict | None:
+    try:
+        if "verdict" not in payload:
+            return _reject("verd", "missing verdict field")
+        word = banned_match(payload)
+        if word:
+            return _reject("verd", f"banned content '{word}'")
+        payload["verdict"] = str(payload["verdict"])[:300]
+        return payload
+    except (TypeError, ValueError) as exc:
+        return _reject("verd", f"malformed payload: {exc!r}")

modal_app/image.py

@@ -0,0 +1,123 @@
+"""Modal deployment: FLUX comic-panel image generation (FLUX.2 [klein] 4B).
+
+Renders the AI-written `image_prompt` into a single landscape comic strip
+(the prompt itself describes the 1-3 horizontal panels). Separate GPU class
+from the llama.cpp text model; same bearer auth.
+
+Deploy:  modal deploy modal_app/image.py
+Secrets: modal secret create bds-auth BDS_TOKEN=<hex>        (shared w/ text)
+         modal secret create huggingface HF_TOKEN=<hf token> (FLUX is gated)
+Then set on the HF Space / locally:
+  FLUX_URL=<printed generate_image endpoint url>
+  FLUX_TOKEN=<same BDS_TOKEN hex>
+
+Model is env-swappable at deploy time. If the FLUX.2-klein deps/VRAM are
+troublesome, set  FLUX_MODEL_ID=black-forest-labs/FLUX.1-schnell  (Apache-2.0,
+rock-solid 4-step) — the DiffusionPipeline auto-resolves either one.
+LICENSE NOTE: the FLUX.2 line is typically non-commercial — fine for a
+hackathon demo; flag before any commercial use.
+"""
+from __future__ import annotations
+
+import base64
+import io
+import os
+import time
+
+import modal
+
+MODEL_ID = os.environ.get("FLUX_MODEL_ID", "black-forest-labs/FLUX.2-klein-4B")
+STEPS = int(os.environ.get("FLUX_STEPS", "4"))        # distilled → few steps
+GUIDANCE = float(os.environ.get("FLUX_GUIDANCE", "1.0"))  # klein-4B card value
+WIDTH = int(os.environ.get("FLUX_WIDTH", "1024"))     # landscape comic strip
+HEIGHT = int(os.environ.get("FLUX_HEIGHT", "576"))
+
+
+def _download() -> None:
+    from huggingface_hub import snapshot_download
+    snapshot_download(MODEL_ID, token=os.environ.get("HF_TOKEN"))
+
+
+image = (
+    modal.Image.debian_slim(python_version="3.11")
+    .apt_install("git")  # needed to pip-install diffusers from its git repo
+    .pip_install(
+        "torch",
+        "transformers",
+        "accelerate",
+        "sentencepiece",
+        "protobuf",
+        "pillow",
+        "fastapi[standard]",
+        "huggingface_hub",
+        # FLUX.2 needs a recent diffusers — pull from git so the newest
+        # pipeline classes are present
+        "git+https://github.com/huggingface/diffusers.git",
+    )
+    .run_function(_download, secrets=[modal.Secret.from_name("huggingface")])
+)
+
+app = modal.App("brad-comic", image=image)
+
+with image.imports():
+    import torch
+    from diffusers import Flux2KleinPipeline
+    from fastapi import HTTPException, Request
+
+
+@app.cls(
+    gpu="A10G",  # 24GB; bump to A100-40GB if FLUX.2's text encoder OOMs
+    scaledown_window=300,
+    timeout=300,
+    secrets=[
+        modal.Secret.from_name("bds-auth"),
+        modal.Secret.from_name("huggingface"),
+    ],
+)
+class Flux:
+    @modal.enter()
+    def load(self):
+        self.pipe = Flux2KleinPipeline.from_pretrained(
+            MODEL_ID,
+            torch_dtype=torch.bfloat16,
+            token=os.environ.get("HF_TOKEN"),
+        )
+        # klein-4B needs ~13GB → fits the A10G's 24GB directly (fast). Set
+        # FLUX_CPU_OFFLOAD=1 to trade speed for VRAM if a bigger model OOMs.
+        if os.environ.get("FLUX_CPU_OFFLOAD") == "1":
+            self.pipe.enable_model_cpu_offload()
+        else:
+            self.pipe.to("cuda")
+
+    @modal.fastapi_endpoint(method="POST")
+    def generate_image(self, body: dict, request: Request):
+        expected = os.environ.get("BDS_TOKEN", "")
+        sent = request.headers.get("authorization", "")
+        if expected and sent != f"Bearer {expected}":
+            raise HTTPException(401, "bad token")
+
+        if body.get("warmup"):  # cold-start ping (runs @enter, loads weights)
+            return {"ok": True, "warm": True}
+
+        prompt = (body.get("prompt") or "").strip()
+        if not prompt:
+            return {"ok": False, "error": "empty prompt"}
+
+        t0 = time.time()
+        try:
+            result = self.pipe(
+                prompt=prompt,  # keyword required — pos-0 isn't prompt on FLUX.2
+                num_inference_steps=STEPS,
+                guidance_scale=GUIDANCE,
+                width=WIDTH,
+                height=HEIGHT,
+            )
+            img = result.images[0]
+            buf = io.BytesIO()
+            img.save(buf, format="PNG")
+            b64 = base64.b64encode(buf.getvalue()).decode()
+            return {"ok": True, "image_b64": b64,
+                    "ms": int((time.time() - t0) * 1000)}
+        except Exception as exc:  # caller skips the overlay; never crash
+            return {"ok": False, "error": str(exc)[:200],
+                    "ms": int((time.time() - t0) * 1000)}

modal_app/inference.py

@@ -0,0 +1,120 @@
+"""Modal deployment: llama.cpp serving Qwen3.5-9B with JSON schema
+enforcement (ARCHITECTURE.md D3). Built on the official llama.cpp CUDA image.
+
+Deploy:  modal deploy modal_app/inference.py
+Secret:  modal secret create bds-auth BDS_TOKEN=<random hex>
+Then set on the HF Space / locally:
+  MODAL_URL=<the printed generate endpoint url>
+  MODAL_TOKEN=<same hex>
+"""
+from __future__ import annotations
+
+import json
+import os
+import subprocess
+import time
+import urllib.request
+
+import modal
+
+# Qwen3.5-9B Q4_K_M ≈ 6GB — newer generation, better multi-turn coherence
+# for board presentations, inside the 16GB budget. (Forfeits Tiny Titan ≤4B.)
+MODEL_REPO = "bartowski/Qwen_Qwen3.5-9B-GGUF"
+MODEL_FILE = "Qwen_Qwen3.5-9B-Q4_K_M.gguf"
+LLAMA_PORT = 8081
+
+image = (
+    modal.Image.from_registry(
+        "ghcr.io/ggml-org/llama.cpp:server-cuda", add_python="3.11")
+    .entrypoint([])  # the image defaults to exec llama-server; we manage it
+    .pip_install("fastapi[standard]", "huggingface_hub")
+    .run_commands(
+        "python -c \"from huggingface_hub import hf_hub_download; "
+        f"hf_hub_download('{MODEL_REPO}', '{MODEL_FILE}', "
+        "local_dir='/models')\""
+    )
+)
+
+app = modal.App("brad-did-something", image=image)
+
+with image.imports():
+    from fastapi import HTTPException, Request
+
+
+def _find_server_binary() -> str:
+    for path in ("/app/llama-server", "/llama-server",
+                 "/usr/local/bin/llama-server"):
+        if os.path.exists(path):
+            return path
+    return "llama-server"  # hope it's on PATH
+
+
+@app.cls(
+    gpu="L4",
+    scaledown_window=300,  # stay warm between calls within a play session
+    timeout=120,
+    secrets=[modal.Secret.from_name("bds-auth")],
+)
+class Llama:
+    @modal.enter()
+    def start_server(self):
+        self.proc = subprocess.Popen([
+            _find_server_binary(),
+            "--model", f"/models/{MODEL_FILE}",
+            "--ctx-size", "4096",
+            "--n-gpu-layers", "99",
+            "--port", str(LLAMA_PORT),
+            "--host", "127.0.0.1",
+        ])
+        deadline = time.time() + 120
+        while time.time() < deadline:
+            try:
+                urllib.request.urlopen(
+                    f"http://127.0.0.1:{LLAMA_PORT}/health", timeout=2)
+                return
+            except Exception:
+                time.sleep(1)
+        raise RuntimeError("llama-server did not become healthy")
+
+    @modal.exit()
+    def stop_server(self):
+        self.proc.terminate()
+
+    @modal.fastapi_endpoint(method="POST")
+    def generate(self, body: dict, request: Request):
+        expected = os.environ.get("BDS_TOKEN", "")
+        sent = request.headers.get("authorization", "")
+        if expected and sent != f"Bearer {expected}":
+            raise HTTPException(401, "bad token")
+
+        t0 = time.time()
+        # the empty <think> block disables Qwen3.5's default thinking mode —
+        # the JSON grammar takes over immediately after
+        prompt = (
+            f"<|im_start|>system\n{body['system_prompt']}\n"
+            f"GAME STATE JSON:\n{json.dumps(body.get('context', {}))}\n<|im_end|>\n"
+            f"<|im_start|>user\n{body['user_prompt']}<|im_end|>\n"
+            f"<|im_start|>assistant\n<think>\n\n</think>\n\n"
+        )
+        payload = json.dumps({
+            "prompt": prompt,
+            "temperature": 0.4,
+            # 512 truncated the JSON once crises/events gained the long
+            # image_prompt + comic_caption fields → unterminated-string parse
+            # failures → fallbacks. 1024 leaves comfortable headroom.
+            "n_predict": 1024,
+            "cache_prompt": True,
+            "json_schema": body["schema"],  # grammar-enforced at generation
+        }).encode()
+        req = urllib.request.Request(
+            f"http://127.0.0.1:{LLAMA_PORT}/completion",
+            data=payload, headers={"Content-Type": "application/json"})
+        try:
+            with urllib.request.urlopen(req, timeout=90) as resp:
+                out = json.loads(resp.read())
+            data = json.loads(out["content"])
+            return {"ok": True, "data": data,
+                    "ms": int((time.time() - t0) * 1000)}
+        except Exception as exc:  # caller falls back; never crash the endpoint
+            return {"ok": False, "error": str(exc)[:200],
+                    "ms": int((time.time() - t0) * 1000)}

requirements.txt

@@ -0,0 +1,5 @@
+gradio>=5.0
+fastapi>=0.110
+uvicorn>=0.29
+requests>=2.31
+pydantic>=2.6

run_modal.ps1

@@ -0,0 +1,18 @@
+# Launch Brad Did Something against the deployed Modal GPU endpoints.
+#   .\run_modal.ps1
+$env:MODAL_URL = "https://qfelix0112--brad-did-something-llama-generate.modal.run"
+$env:MODAL_TOKEN = (Get-Content "$PSScriptRoot\.bds_modal_token" -Raw).Trim()
+# 20s tolerates the one-time container cold start; warm calls are 2-4s
+$env:BDS_LLM_TIMEOUT = "20"
+
+# --- Comic panels (FLUX image generation on Modal) — optional ---
+# After `modal deploy modal_app/image.py`, Modal prints the generate_image URL.
+# Paste it below (this is the predicted name — VERIFY it matches the deploy
+# output). The bearer token is the SAME bds-auth BDS_TOKEN as the text model.
+# Leave FLUX_URL blank to play without comics — the overlay just no-ops.
+$env:FLUX_URL = "https://qfelix0112--brad-comic-flux-generate-image.modal.run"
+$env:FLUX_TOKEN = $env:MODAL_TOKEN
+# FLUX cold start is large (~30-60s); warm klein calls are a few seconds
+$env:BDS_FLUX_TIMEOUT = "25"
+
+python "$PSScriptRoot\app.py"

static/audio/bgm.mp3

@@ -0,0 +1,3 @@
+version https://git-lfs.github.com/spec/v1
+oid sha256:7e28bec5faf9a093c5704db33987cf8c6745e2cb4fe2f7ac5c20ad54bbd0308a
+size 3505649

static/css/game.css

@@ -0,0 +1,516 @@
+/* ============================================================
+   GAME CHROME — Brad Did Something  ·  DAYLIGHT re-skin
+   Paper panels, dark-ink pixel frames, ink text. Matches the
+   new warmlight Design System. World pixels live on canvas +
+   DOM sprites inside #stage (640x480, scaled).
+   ============================================================ */
+
+* { box-sizing: border-box; }
+html, body {
+  margin: 0; padding: 0; background: var(--bg-app);
+  font-family: var(--font-display, "Press Start 2P", monospace);
+  color: var(--text-body); overflow: hidden; height: 100%;
+}
+.hidden { display: none !important; }
+button { font-family: inherit; cursor: pointer; }
+
+#viewport { display: flex; flex-direction: column; height: 100vh;
+  height: 100dvh; }  /* dvh: avoids the mobile address-bar clip/scroll */
+
+/* ---- wordmark ---- */
+#wordmark {
+  display: flex; gap: 16px; align-items: baseline; padding: 8px 16px;
+  background: var(--surface-card); border-bottom: 3px solid var(--border-bright);
+}
+.wm-main {
+  font-size: 14px; color: var(--text-heading);
+  text-shadow: 2px 2px 0 var(--bds-amber);
+}
+.wm-sub { font-size: 8px; color: var(--text-muted); }
+
+/* ---- HUD ---- */
+#hud {
+  display: flex; gap: 16px; align-items: center; padding: 8px 16px;
+  background: var(--surface-card);
+  border-bottom: 3px solid var(--border-bright); position: relative;
+}
+.hud-row { display: flex; align-items: baseline; gap: 8px; }
+#rev-number { font-size: 16px; color: var(--bds-success); transition: color .3s; }
+#rev-number.warn { color: var(--bds-kevin); }
+#rev-number.crit { color: var(--bds-brad); }
+#rev-target { font-size: 8px; color: var(--text-muted); }
+#rev-bar {
+  width: 320px; height: 12px; margin: 6px 0; background: var(--bg-well);
+  border: 2px solid var(--border-bright); position: relative;
+}
+#rev-fill {
+  height: 100%; width: 0%; background: var(--bds-success);
+  transition: width .6s steps(12);
+}
+#rev-fill.warn { background: var(--bds-kevin); }
+#rev-fill.crit { background: var(--bds-brad); }
+#boss-title { font-size: 8px; color: var(--bds-janet); white-space: nowrap;
+  overflow: hidden; text-overflow: ellipsis; max-width: 340px;
+  transition: opacity .25s; }
+#hud-right { margin-left: auto; display: flex; gap: 16px; font-size: 8px;
+  align-items: center; }
+#crisis-counter { color: var(--text-muted); }
+#pocket { color: var(--bds-success); }
+#hr-badge {
+  color: var(--bds-neon-magenta); border: 2px solid var(--bds-neon-magenta);
+  padding: 4px 6px; animation: hrpulse 1s steps(2) infinite;
+}
+@keyframes hrpulse { 50% { background: var(--bds-janet-soft); } }
+#hud-banner {
+  position: absolute; left: 50%; top: 100%; transform: translateX(-50%);
+  background: var(--surface-card); border: 3px solid var(--bds-amber);
+  color: var(--bds-amber); font-size: 8px; padding: 8px 12px; z-index: 40;
+  white-space: nowrap; box-shadow: 4px 4px 0 var(--bds-void);
+}
+#hud-banner.gold { border-color: var(--bds-kevin); color: var(--bds-amber); }
+#hud-banner.red { border-color: var(--bds-brad); color: var(--bds-white);
+  background: var(--bds-brad); }
+
+/* ---- stage layout ---- */
+#frame { flex: 1; display: flex; min-height: 0; }
+#stage-wrap { flex: 1; display: flex; align-items: center;
+  justify-content: center; background: var(--bg-app); min-width: 0; }
+#stage {
+  width: 640px; height: 480px; position: relative; flex: none;
+  transform-origin: center center; background: var(--bds-navy-900);
+  border: 4px solid var(--border-bright); image-rendering: pixelated;
+  box-shadow: 0 6px 0 rgba(36,31,23,.25);
+  overflow: hidden;   /* keep wipe/flash/overlays inside the screen */
+}
+#floor { position: absolute; inset: 0; image-rendering: pixelated; }
+#world, #fx { position: absolute; inset: 0; pointer-events: none; }
+#world { z-index: 5; } #fx { z-index: 20; }
+
+/* in-world bits */
+.prompt-box {
+  position: absolute; transform: translateX(-50%); background: var(--bds-void);
+  border: 2px solid var(--bds-white); color: var(--bds-white); font-size: 6px;
+  padding: 3px 5px; z-index: 30; white-space: nowrap; letter-spacing: 1px;
+}
+.prompt-box.gold { border-color: var(--bds-kevin); color: var(--bds-kevin);
+  box-shadow: 0 0 8px rgba(207,154,42,.7); }
+.bubble {
+  position: absolute; transform: translateX(-50%); z-index: 28;
+  width: 18px; height: 18px; background: var(--bds-white);
+  border: 2px solid var(--bds-brad); color: var(--bds-brad);
+  font-size: 9px; line-height: 14px; text-align: center;
+  box-shadow: 2px 2px 0 var(--bds-void);
+  animation: bpop .35s var(--ease-pop, ease-out), bfloat 1s steps(2) infinite 0.4s;
+}
+.bubble.amber { border-color: var(--bds-amber); color: var(--bds-amber); }
+.bubble.heart { border-color: var(--bds-neon-magenta); color: var(--bds-neon-magenta); }
+@keyframes bpop { 0% { transform: translateX(-50%) scale(0); }
+  70% { transform: translateX(-50%) scale(1.3); }
+  100% { transform: translateX(-50%) scale(1); } }
+@keyframes bfloat { 50% { margin-top: -3px; } }
+
+.say-bubble {
+  position: absolute; transform: translateX(-50%); z-index: 32;
+  max-width: 150px; background: var(--bds-white);
+  border: 2px solid var(--border-bright); color: var(--text-body);
+  font-size: 6px; line-height: 1.9; padding: 5px 7px; text-align: left;
+  box-shadow: 3px 3px 0 var(--bds-void);
+  animation: saypop .25s var(--ease-pop, ease-out);
+}
+.say-bubble::after {
+  content: ""; position: absolute; left: 50%; bottom: -6px;
+  margin-left: -3px; border: 3px solid transparent;
+  border-top-color: var(--border-bright);
+}
+.say-bubble.fading { opacity: 0; transition: opacity .5s steps(4); }
+@keyframes saypop { 0% { transform: translateX(-50%) scale(.4); } }
+
+.newspaper {
+  position: absolute; width: 34px; height: 24px; background: #efe9d8;
+  border: 2px solid var(--bds-void); z-index: 12; font-size: 4px;
+  color: #3a3326; padding: 2px; overflow: hidden; line-height: 1.4;
+}
+.newspaper.falling { animation: npfall 1.2s steps(8) forwards; }
+@keyframes npfall {
+  0% { transform: translateY(-300px) rotate(0); }
+  100% { transform: translateY(0) rotate(720deg); } }
+.newspaper.floor { opacity: .45; }
+.envelope {
+  position: absolute; width: 22px; height: 14px; background: #f2ecda;
+  border: 2px solid var(--bds-void); z-index: 12;
+  box-shadow: 0 0 8px rgba(63,154,63,.8);
+  animation: envslide .8s steps(8); }
+.envelope::after { content:""; position:absolute; left:0; top:0;
+  border-left:9px solid transparent; border-right:9px solid transparent;
+  border-top:7px solid #d8d0b8; }
+@keyframes envslide { 0% { transform: translateX(300px); } }
+
+.float-text {
+  position: absolute; font-size: 10px; z-index: 60; pointer-events: none;
+  text-shadow: 2px 2px 0 var(--bds-void); white-space: nowrap;
+  animation: floatup 1.6s steps(8) forwards;
+}
+.float-text.down { animation: floatdown 1.6s steps(8) forwards; }
+@keyframes floatup { 0% { opacity:1; } 100% { transform: translateY(-46px); opacity:0; } }
+@keyframes floatdown { 0% { opacity:1; } 100% { transform: translateY(46px); opacity:0; } }
+
+.pixel-part { position: absolute; z-index: 55; pointer-events: none; }
+
+/* ---- overlays inside stage ---- */
+#dim { position: absolute; inset: 0; background: rgba(36,31,23,.45); z-index: 35;
+  transition: opacity .25s; }
+#flash { position: absolute; inset: 0; background: var(--bds-brad); opacity: 0;
+  z-index: 70; pointer-events: none; }
+#flash.on { animation: redflash .5s steps(4) forwards; }
+@keyframes redflash { 0% { opacity: .3; } 100% { opacity: 0; } }
+#edge-pulse { position: absolute; inset: 0; z-index: 68; pointer-events: none;
+  opacity: 0; box-shadow: inset 0 0 36px 12px rgba(210,89,58,.5); }
+#edge-pulse.on { animation: edgep 1s steps(4) infinite; }
+@keyframes edgep { 50% { opacity: 1; } }
+#wipe { position: absolute; inset: 0; background: var(--bds-void); z-index: 90;
+  transform: translateX(-100%); pointer-events: none; }
+#wipe.go { animation: wipeacross .7s steps(10) forwards; }
+@keyframes wipeacross { 0% { transform: translateX(-100%); }
+  45%,55% { transform: translateX(0); } 100% { transform: translateX(100%); } }
+#stamp {
+  position: absolute; left: 50%; top: 40%; transform: translate(-50%,-50%) rotate(-8deg);
+  font-size: 32px; color: var(--bds-white); z-index: 80;
+  background: var(--bds-neon-magenta);
+  border: 6px solid var(--bds-void); padding: 12px 20px;
+  box-shadow: 6px 6px 0 var(--bds-void);
+  animation: stampin .9s steps(3) forwards;
+}
+@keyframes stampin { 0% { transform: translate(-50%,-50%) scale(3) rotate(-8deg);
+    opacity: 0; } 30% { opacity: 1; } 80% { opacity: 1; }
+  100% { transform: translate(-50%,-50%) scale(1) rotate(-8deg); opacity: 0; } }
+
+/* ---- paper trail ---- */
+#papertrail {
+  width: 230px; padding: 8px; background: var(--surface-card);
+  border-left: 3px solid var(--border-bright);
+  display: flex; flex-direction: column; min-height: 0;
+}
+.pt-head { font-size: 8px; color: var(--text-muted); letter-spacing: 2px;
+  padding-bottom: 8px; border-bottom: 2px solid var(--border); }
+#pt-entries { overflow-y: auto; flex: 1; scrollbar-width: thin; }
+.pt-empty { font-size: 7px; color: var(--text-disabled); padding: 8px 0; }
+.pt-entry { font-size: 7px; line-height: 1.9; padding: 6px 0;
+  border-bottom: 1px solid var(--border);
+  animation: ptslide .3s steps(4); }
+@keyframes ptslide { 0% { transform: translateX(40px); opacity: 0; } }
+.pt-entry .pt-npc { letter-spacing: 1px; }
+.pt-entry .pt-delta.up { color: var(--bds-success); }
+.pt-entry .pt-delta.down { color: var(--bds-brad); }
+.pt-entry .pt-text { color: var(--text-muted); }
+
+/* ---- dialogue box ---- */
+#dialogue {
+  position: fixed; left: 50%; bottom: 0; transform: translateX(-50%);
+  width: min(720px, 96vw); max-height: 62vh; overflow-y: auto;
+  background: var(--surface-card);
+  border: 4px solid var(--npc-color, var(--border-bright));
+  box-shadow: 8px 8px 0 var(--bds-void);
+  z-index: 200; padding: 14px;
+  animation: dlgup .3s steps(6);
+}
+@keyframes dlgup { 0% { transform: translate(-50%, 105%); } }
+#dialogue.closing { animation: dlgdown .25s steps(5) forwards; }
+@keyframes dlgdown { 100% { transform: translate(-50%, 105%); } }
+#dialogue.gold { border-color: var(--bds-kevin); }
+#dialogue.tone-warm { border-color: var(--bds-success); }
+#dialogue.tone-neutral { border-color: var(--bds-ink-3); }
+#dialogue.tone-concerned { border-color: var(--bds-kevin); }
+#dialogue.tone-alarmed { border-color: var(--bds-brad); }
+
+/* ---- comic-panel crisis overlay (FLUX-generated; no overlay when no image) ---- */
+#comic {
+  position: fixed; inset: 0; z-index: 300;
+  display: flex; align-items: center; justify-content: center;
+  background: rgba(36, 31, 23, .72);
+  cursor: pointer; opacity: 0; transition: opacity .18s ease;
+}
+#comic.comic-in { opacity: 1; }
+#comic.hidden { display: none; }
+.comic-frame {
+  position: relative;
+  display: flex; flex-direction: column; gap: 8px;
+  max-width: min(880px, 94vw); max-height: 90vh;
+  background: var(--bds-white); padding: 10px;
+  border: 6px solid var(--bds-void);
+  box-shadow: 10px 10px 0 var(--bds-void);
+  transform: scale(.95) rotate(-.5deg);
+  transition: transform .22s cubic-bezier(.2, 1.3, .5, 1);
+}
+#comic.comic-in .comic-frame { transform: scale(1) rotate(0); }
+.comic-caption {
+  font-size: 11px; line-height: 1.7; color: var(--bds-void);
+  background: var(--bds-amber); border: 3px solid var(--bds-void);
+  padding: 8px 10px; text-align: center; letter-spacing: .5px;
+}
+.comic-img {
+  display: block; max-width: 100%; max-height: 74vh;
+  border: 2px solid var(--bds-void);
+}
+.comic-hint {
+  position: absolute; right: 12px; bottom: 12px;
+  font-size: 8px; letter-spacing: 1px; color: var(--bds-white);
+  background: var(--bds-void); padding: 4px 7px; opacity: .85;
+}
+
+.dlg-head { display: flex; gap: 10px; align-items: center; padding-bottom: 10px;
+  border-bottom: 2px solid var(--border); margin-bottom: 10px; }
+.dlg-name { font-size: 11px; color: var(--npc-color, var(--text-heading)); }
+.dlg-title { font-size: 7px; color: var(--text-muted); display: block;
+  margin-top: 5px; }
+.dlg-sprite { width: 72px; height: 66px; position: relative; flex: none; }
+.dlg-headline { font-size: 8px; color: var(--bds-amber); margin-bottom: 8px;
+  letter-spacing: 1px; }
+.dlg-body { font-size: 9px; line-height: 2; color: var(--text-body);
+  margin-bottom: 12px; }
+.dlg-urgency { font-size: 8px; color: var(--bds-neon-magenta); margin: 8px 0;
+  text-align: center; }
+
+.dlg-options { display: flex; gap: 10px; margin-bottom: 10px; }
+.dlg-option {
+  flex: 1; background: var(--surface-hover); padding: 10px; text-align: left;
+  border: 2px solid var(--bds-brad); color: var(--text-body);
+  font-size: 8px; line-height: 1.9; box-shadow: 3px 3px 0 var(--bds-void);
+}
+.dlg-option.b { border-color: var(--bds-kevin); }
+.dlg-option .opt-label { display: block; color: var(--bds-brad); font-size: 7px;
+  letter-spacing: 1px; margin-bottom: 6px; }
+.dlg-option.b .opt-label { color: var(--bds-amber); }
+.dlg-option:hover { background: var(--bds-white); }
+.dlg-option:active { transform: translate(3px,3px); box-shadow: none; }
+
+.dlg-quick { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 10px; }
+.btn-quick {
+  background: var(--surface-hover); border: 2px solid var(--border-bright);
+  color: var(--text-heading); font-size: 7px; padding: 8px 10px;
+  box-shadow: 3px 3px 0 var(--bds-void);
+}
+.btn-quick:active { transform: translate(3px,3px); box-shadow: none; }
+.btn-quick.danger { border-color: var(--bds-brad); color: var(--bds-brad); }
+
+.dlg-inputrow { display: flex; gap: 8px; }
+.dlg-input {
+  flex: 1; background: var(--bds-white); border: 2px solid var(--border-bright);
+  color: var(--text-body); font-family: inherit; font-size: 8px;
+  padding: 10px; outline: none;
+}
+.dlg-input::placeholder { color: var(--text-disabled); }
+.dlg-input:focus { border-color: var(--bds-neon-cyan);
+  box-shadow: 0 0 8px rgba(31,127,174,.4); }
+.btn-send {
+  background: var(--bds-neon-magenta); border: 2px solid var(--bds-void);
+  color: var(--bds-white); font-size: 8px; padding: 10px 14px;
+  box-shadow: 3px 3px 0 var(--bds-void);
+}
+.btn-send:active { transform: translate(3px,3px); box-shadow: none; }
+
+.dlg-thinking { font-size: 9px; color: var(--text-muted); padding: 18px 0;
+  text-align: center; }
+.dlg-thinking .dots::after { content: ""; animation: dots 1.2s steps(4) infinite; }
+@keyframes dots { 0% { content: ""; } 25% { content: "."; }
+  50% { content: ".."; } 75% { content: "..."; } }
+
+.dlg-after-you { border: 2px solid var(--border); padding: 8px;
+  font-size: 7px; color: var(--text-muted); margin-bottom: 8px;
+  background: var(--surface-hover); }
+.dlg-after-react { border-left: 4px solid var(--npc-color, var(--border-bright));
+  padding: 8px; font-size: 9px; line-height: 2; margin-bottom: 8px;
+  color: var(--text-body); }
+.dlg-after-conseq { border-left: 4px solid var(--bds-success); padding: 8px;
+  font-size: 8px; line-height: 1.9; color: var(--text-body);
+  margin-bottom: 10px; }
+.dlg-after-conseq.down { border-left-color: var(--bds-brad); }
+.btn-next {
+  width: 100%; background: var(--bds-neon-magenta); border: 2px solid var(--bds-void);
+  color: var(--bds-white); font-size: 10px; padding: 14px;
+  box-shadow: 4px 4px 0 var(--bds-void);
+}
+.btn-next:active { transform: translate(4px,4px); box-shadow: none; }
+
+.round-dots { font-size: 10px; color: var(--bds-amber); letter-spacing: 4px; }
+.board-badge { font-size: 7px; color: var(--bds-brad);
+  border: 2px solid var(--bds-brad); padding: 4px 6px; margin-left: auto; }
+.wrong-slide {
+  background: var(--bds-janet-soft); border: 4px solid var(--bds-neon-magenta);
+  padding: 12px; text-align: center; margin-bottom: 10px; color: #5a3a50;
+  font-size: 8px;
+}
+.wrong-slide .ws-photo { width: 90px; height: 64px; background: #d8d0e2;
+  margin: 6px auto; border: 2px solid #9a90b0; position: relative;
+  display: flex; align-items: flex-end; justify-content: center;
+  overflow: visible; }
+.wrong-slide .ws-title { font-size: 10px; color: var(--bds-neon-magenta);
+  font-style: italic; }
+
+/* ---- gift panel ---- */
+#gift-panel {
+  position: fixed; left: 50%; top: 50%; transform: translate(-50%,-50%);
+  background: var(--surface-card);
+  border: 4px solid var(--npc-color, var(--border-bright));
+  box-shadow: 8px 8px 0 var(--bds-void); z-index: 210; padding: 14px;
+  width: 320px;
+}
+.gift-head { font-size: 9px; color: var(--npc-color, var(--text-heading));
+  margin-bottom: 10px; }
+.gift-balance { font-size: 7px; color: var(--bds-success); margin-bottom: 10px; }
+.gift-row {
+  display: flex; justify-content: space-between; width: 100%;
+  background: var(--surface-hover); border: 2px solid var(--border-bright);
+  color: var(--text-body); font-size: 8px; padding: 10px; margin-bottom: 8px;
+  box-shadow: 2px 2px 0 var(--bds-void);
+}
+.gift-row:hover:not(:disabled) { border-color: var(--bds-success);
+  background: var(--bds-white); }
+.gift-row:disabled { color: var(--text-disabled); border-color: var(--border);
+  box-shadow: none; cursor: not-allowed; }
+.gift-cancel { font-size: 7px; color: var(--text-muted); background: none;
+  border: none; width: 100%; padding: 6px; }
+
+/* ---- boardroom ---- */
+#boardroom { position: absolute; inset: 0; z-index: 15;
+  background: var(--bds-purple-900); }
+
+/* ---- title screen ---- */
+#title-screen {
+  position: fixed; inset: 0; z-index: 300;
+  display: flex; align-items: center; justify-content: center;
+  /* soft vignette focuses the card and lifts it off the flat field */
+  background: radial-gradient(ellipse at center,
+    var(--bds-purple-800) 0%, var(--bds-navy-800) 100%);
+}
+.ts-card {
+  text-align: center; max-width: 560px; padding: 32px 44px;
+  background: var(--surface-card); border: 4px solid var(--border-bright);
+  box-shadow: 10px 10px 0 var(--bds-void);
+}
+.ts-logo {
+  font-size: 38px; color: var(--text-heading); line-height: 1.4;
+  text-shadow: 4px 4px 0 var(--bds-amber);
+  animation: ts-logo 2.8s ease-in-out infinite;
+}
+@keyframes ts-logo {
+  0%, 100% { transform: translateY(0);
+    text-shadow: 4px 4px 0 var(--bds-amber); }
+  50% { transform: translateY(-3px);
+    text-shadow: 4px 4px 0 var(--bds-amber), 0 0 16px rgba(185,133,42,.55); }
+}
+.ts-sub { display: block; font-size: 9px; color: var(--bds-neon-cyan);
+  margin: 14px 0 18px; letter-spacing: 3px;
+  text-shadow: 1px 1px 0 rgba(36,31,23,.25); }
+.ts-premise { font-size: 8px; line-height: 2.2; color: var(--text-body);
+  margin-bottom: 22px; }
+.btn-cta {
+  background: var(--bds-neon-magenta); color: var(--bds-white);
+  border: 3px solid var(--bds-void);
+  font-size: 12px; padding: 16px 28px; box-shadow: 5px 5px 0 var(--bds-void);
+}
+.btn-cta:active { transform: translate(5px,5px); box-shadow: none; }
+#btn-start { animation: ts-cta 1.9s ease-in-out infinite; }
+@keyframes ts-cta {
+  0%, 100% { box-shadow: 5px 5px 0 var(--bds-void); }
+  50% { box-shadow: 5px 5px 0 var(--bds-void), 0 0 18px rgba(192,57,143,.6); }
+}
+.ts-keys { margin-top: 18px; font-size: 7px; color: var(--text-body);
+  line-height: 1.8; }
+#ts-cast { display: flex; justify-content: center; gap: 14px;
+  margin-bottom: 22px; align-items: flex-end; }
+/* the team idles in place, gently, staggered so it reads as a busy office */
+#ts-cast .cast-slot { text-align: center; animation: ts-bob 2.4s ease-in-out infinite; }
+#ts-cast .cast-slot:nth-child(2) { animation-delay: .35s; }
+#ts-cast .cast-slot:nth-child(3) { animation-delay: .7s; }
+#ts-cast .cast-slot:nth-child(4) { animation-delay: 1.05s; }
+#ts-cast .cast-slot:nth-child(5) { animation-delay: 1.4s; }
+@keyframes ts-bob { 0%, 100% { transform: translateY(0); }
+  50% { transform: translateY(-5px); } }
+/* ink shadow keeps even the muted gold/blue names legible on cream */
+#ts-cast .cast-name { font-size: 6px; margin-top: 6px; letter-spacing: 1px;
+  text-shadow: 1px 1px 0 var(--bds-void); }
+
+/* ---- review screen ---- */
+#review-screen {
+  position: fixed; inset: 0; background: var(--bg-app); z-index: 290;
+  display: flex; align-items: center; justify-content: center;
+}
+.rv-card {
+  width: min(680px, 94vw); max-height: 92vh; overflow-y: auto;
+  border: 6px solid var(--rv-color, var(--border-bright)); padding: 22px;
+  background: var(--surface-card);
+  box-shadow: 8px 8px 0 var(--bds-void);
+}
+.rv-head { font-size: 14px; color: var(--text-heading); margin-bottom: 16px;
+  letter-spacing: 2px; }
+.rv-revenue { font-size: 28px; color: var(--rv-color, var(--text-heading));
+  margin-bottom: 6px; }
+.rv-gap { font-size: 8px; color: var(--text-muted); margin-bottom: 14px; }
+.rv-line { font-size: 8px; line-height: 2.2; color: var(--text-body); }
+.rv-title { color: var(--bds-janet); }
+.rv-section { margin: 14px 0; border-top: 2px solid var(--border);
+  padding-top: 12px; }
+.rv-sec-head { font-size: 8px; color: var(--text-muted); letter-spacing: 2px;
+  margin-bottom: 8px; }
+.rv-verdict { font-size: 9px; line-height: 2.1; color: var(--bds-amber); }
+
+/* ---- ambient light wash (replaces CRT — daylight DS, no scanlines) ---- */
+#crt {
+  position: fixed; inset: 0; pointer-events: none; z-index: 999;
+  background: radial-gradient(ellipse at 50% 0%,
+    rgba(255,248,226,.10) 0%, transparent 55%);
+}
+
+/* ---- reduced motion + mobile ---- */
+@media (prefers-reduced-motion: reduce) {
+  *, *::before, *::after { animation-duration: .01s !important;
+    transition-duration: .01s !important; }
+}
+@media (max-width: 760px) {
+  #papertrail { display: none; }
+  #rev-bar { width: 140px; }
+  #hud { flex-wrap: wrap; gap: 8px 12px; padding: 6px 10px; }
+  #hud-right { gap: 10px; }
+  #wordmark { padding: 6px 10px; gap: 10px; }
+  .wm-main { font-size: 11px; }
+  .dlg-options { flex-direction: column; }
+  #dialogue { width: 96vw; max-height: 56vh; padding: 11px; }
+  .ts-card, .rv-card { max-width: 94vw; max-height: 88vh; overflow-y: auto; }
+  .comic-caption { font-size: 9px; }
+}
+
+/* ---- touch controls (created by touch.js only on touch devices) ---- */
+#tc-stick, #tc-buttons {
+  position: fixed; bottom: 20px; z-index: 150;
+  touch-action: none; user-select: none; -webkit-user-select: none;
+}
+#tc-stick {
+  left: 20px; width: 122px; height: 122px; border-radius: 50%;
+  background: rgba(36, 31, 23, .20); border: 3px solid rgba(36, 31, 23, .45);
+  display: flex; align-items: center; justify-content: center;
+}
+.tc-thumb {
+  width: 52px; height: 52px; border-radius: 50%;
+  background: var(--bds-amber); border: 3px solid var(--bds-void);
+  box-shadow: 0 3px 0 rgba(36, 31, 23, .4);
+}
+#tc-buttons { right: 20px; display: flex; gap: 14px; align-items: center; }
+.tc-btn {
+  font-family: var(--font-display, "Press Start 2P", monospace);
+  border: 3px solid var(--bds-void); color: var(--bds-void); padding: 0;
+  box-shadow: 0 4px 0 rgba(36, 31, 23, .4);
+}
+.tc-btn.down { transform: translateY(3px); box-shadow: 0 1px 0 rgba(36, 31, 23, .4); }
+.tc-action {
+  width: 88px; height: 88px; border-radius: 50%; font-size: 13px;
+  background: var(--bds-success, #3fae62); color: var(--bds-white, #fff);
+}
+.tc-gift {
+  width: 62px; height: 62px; border-radius: 50%; font-size: 9px;
+  background: var(--bds-amber);
+}
+/* hide the controls whenever a menu / dialogue / comic owns the screen */
+:is(#title-screen, #review-screen, #dialogue, #comic, #gift-panel):not(.hidden) ~ #tc-stick,
+:is(#title-screen, #review-screen, #dialogue, #comic, #gift-panel):not(.hidden) ~ #tc-buttons {
+  display: none;
+}

static/css/tokens.css

@@ -0,0 +1,337 @@
+/* ============================================================
+   BASE — Brad Did Something
+   Element defaults so any consumer page reads as the game by
+   default: warm paper canvas, dark-ink headings, warm body text,
+   clean (no scanlines).
+   ============================================================ */
+
+*, *::before, *::after { box-sizing: border-box; }
+
+html { -webkit-text-size-adjust: 100%; }
+
+body {
+  margin: 0;
+  background: var(--bg-app);
+  color: var(--text-body);
+  font-family: var(--font-body);
+  font-size: var(--fs-body);
+  line-height: var(--lh-body);
+  letter-spacing: var(--ls-normal);
+  -webkit-font-smoothing: none;        /* keep pixels crunchy */
+  font-smooth: never;
+  text-rendering: optimizeSpeed;
+}
+
+h1, h2, h3, h4, h5, h6 {
+  font-family: var(--font-display);
+  color: var(--text-heading);
+  line-height: var(--lh-tight);
+  margin: 0 0 var(--space-4);
+  font-weight: 400;
+}
+h1 { font-size: var(--fs-h1); }
+h2 { font-size: var(--fs-h2); }
+h3 { font-size: var(--fs-h3); }
+
+p { margin: 0 0 var(--space-4); text-wrap: pretty; }
+
+a {
+  color: var(--link);
+  text-decoration: none;
+  border-bottom: 2px solid currentColor;
+}
+a:hover { text-shadow: var(--text-glow-cyan); }
+
+:focus-visible {
+  outline: none;
+  box-shadow: var(--focus-shadow);
+}
+
+code, kbd, samp { font-family: var(--font-mono); }
+
+img[data-pixel-img], .pixel-art { image-rendering: pixelated; }
+
+/* ---------- Utility: arcade marquee text ---------- */
+.bds-marquee {
+  color: var(--text-heading);
+  text-shadow: var(--text-glow-magenta);
+}
+.bds-terminal { color: var(--text-body); }
+.bds-money { color: var(--text-money); text-shadow: var(--text-glow-lime); }
+
+/* ---------- Utility: full-screen daylight shell ----------
+   Wrap a page in <div class="bds-screen"> to get the warm paper
+   canvas + soft top-light automatically. (CRT is retired.) */
+.bds-screen {
+  position: relative;
+  min-height: 100vh;
+  background:
+    radial-gradient(ellipse at 50% -10%, var(--bds-purple-900) 0%, var(--bg-app) 60%);
+  overflow: clip;
+}
+/* ============================================================
+   COLORS — Brad Did Something  ·  DAYLIGHT 3/4 re-skin
+   Warm, sunlit office: tiled warm-grey floors, cream paper
+   panels, dark warm INK for outlines + text, the five
+   character colors muted to read in daylight. No CRT, no neon
+   void. (--bds-void stays dark = it is the INK; --bds-white
+   stays light = highlights / player / light fills.)
+   ============================================================ */
+
+:root {
+  /* ---- INK (dark, warm) — outlines, borders, hard edges, text ---- */
+  --bds-void:        #241f17; /* the ink line behind everything */
+  --bds-ink:         #2b2519; /* near-ink */
+  --bds-ink-2:       #4b4534; /* body text */
+  --bds-ink-3:       #7c755f; /* muted label */
+  --bds-ink-4:       #a79f88; /* disabled / ghost */
+
+  /* ---- PAPER ramp (warm light) — was the navy/purple ramp.
+         darkest = desktop behind panels · lightest = hover ---- */
+  --bds-navy-900:    #b7b1a0; /* app background (warm grey carpet) */
+  --bds-navy-800:    #a59e8b; /* recessed wells */
+  --bds-purple-900:  #ccc6b5; /* alt background band */
+  --bds-purple-800:  #d7d1c0; /* raised surface */
+  --bds-purple-700:  #e9e4d3; /* card surface (cream) */
+  --bds-purple-600:  #f4f0e2; /* hover surface */
+
+  /* ---- Light ink: highlights, player, light fills ---- */
+  --bds-white:       #faf7ee; /* warm white */
+  --bds-phosphor:    #3f5a44; /* terminal/log text (dark sage, reads on paper) */
+  --bds-phosphor-dim:#6a7d62; /* muted terminal text */
+  --bds-amber:       #b9852a; /* warning / scrutiny gold (reads on paper) */
+  --bds-grey:        #7c755f; /* low-emphasis label */
+  --bds-grey-dim:    #a79f88; /* disabled / ghost ink */
+
+  /* ---- The five underlings — muted for daylight ---- */
+  --bds-brad:        #d2593a; /* warm orange-red — the problem */
+  --bds-stacey:      #1f9c8e; /* teal — the competent one */
+  --bds-kevin:       #cf9a2a; /* gold — the pie chart guy */
+  --bds-janet:       #9a52c4; /* purple — the wildcard */
+  --bds-derek:       #4f93c4; /* blue — barely present */
+
+  /* character tints — light wash behind portraits */
+  --bds-brad-soft:   #f0d8cd;
+  --bds-stacey-soft: #d2e9e4;
+  --bds-kevin-soft:  #efe4c4;
+  --bds-janet-soft:  #e7dcf0;
+  --bds-derek-soft:  #d6e6f2;
+
+  /* ---- System accents — daylight-legible ---- */
+  --bds-neon-magenta:#c0398f; /* primary accent / CTA (raspberry) */
+  --bds-neon-cyan:   #1f7fae; /* links, focus, selection (sea blue) */
+  --bds-neon-lime:   #3f9a3f; /* success / money (forest green) */
+
+  /* ---- Semantic status ---- */
+  --bds-success:     #3f9a3f; /* revenue went up (rare) */
+  --bds-warning:     #cf9a2a; /* a Brad is forming */
+  --bds-danger:      #d2593a; /* a Brad has formed */
+  --bds-info:        #4f93c4;
+
+  /* ============================================================
+     SEMANTIC ALIASES — design against these, not the raw scale
+     ============================================================ */
+  --bg-app:          var(--bds-navy-900);
+  --bg-band:         var(--bds-purple-900);
+  --bg-well:         var(--bds-navy-800);
+  --surface-raised:  var(--bds-purple-800);
+  --surface-card:    var(--bds-purple-700);
+  --surface-hover:   var(--bds-purple-600);
+
+  --text-heading:    var(--bds-ink);
+  --text-body:       var(--bds-ink-2);
+  --text-muted:      var(--bds-ink-3);
+  --text-disabled:   var(--bds-ink-4);
+  --text-money:      var(--bds-success);
+
+  --accent:          var(--bds-neon-magenta);
+  --accent-2:        var(--bds-neon-cyan);
+  --link:            var(--bds-neon-cyan);
+  --focus-ring:      var(--bds-neon-cyan);
+  --selection:       var(--bds-neon-magenta);
+
+  --border:          #b3ab95; /* soft divider / inset edge */
+  --border-bright:   #3a3326; /* the dark pixel frame */
+  --border-neon:     var(--bds-neon-magenta);
+}
+
+::selection {
+  background: var(--selection);
+  color: var(--bds-white);
+}
+/* ============================================================
+   FONTS — Brad Did Something
+   One typeface to rule them all: Press Start 2P.
+   A bitmap arcade font (Namco, 1980s). Looks best at multiples
+   of 8px. We ship the latin woff2 locally so consumers are
+   offline-safe.
+   ============================================================ */
+
+@font-face {
+  font-family: "Press Start 2P";
+  font-style: normal;
+  font-weight: 400;
+  font-display: swap;
+  src: url("../fonts/PressStart2P-Regular.woff2") format("woff2");
+}
+/* ============================================================
+   TYPOGRAPHY — Brad Did Something
+   Everything is Press Start 2P. Headlines = arcade marquee.
+   Body = crashed terminal. Sizes are multiples of 8 because
+   the font is a bitmap and renders crisp on the grid.
+   ============================================================ */
+
+:root {
+  --font-pixel: "Press Start 2P", "Courier New", monospace;
+  --font-display: var(--font-pixel);
+  --font-body: var(--font-pixel);
+  --font-mono: var(--font-pixel);
+
+  /* ---- Type scale (px, multiples of 8 where possible) ----
+     Press Start 2P runs LARGE and WIDE per glyph, so the body
+     sizes are small numerically but read big. Never go below
+     8px; UI body lives at 10–12px, prose at 12px. */
+  --fs-display: 40px; /* hero / title screen */
+  --fs-h1:      28px; /* screen titles, arcade marquee */
+  --fs-h2:      20px; /* section headers */
+  --fs-h3:      16px; /* sub-headers */
+  --fs-body:    12px; /* default body / dialogue */
+  --fs-ui:      10px; /* buttons, labels, HUD readouts */
+  --fs-fine:    8px;  /* legal-ish memo footer, terminal logs */
+
+  /* ---- Line height ----
+     Pixel fonts need air. 1.8–2.0 keeps the scanline rhythm. */
+  /* line-height — pixel fonts need air; 1.8–2.0 keeps scanline rhythm */
+  --lh-tight:   1.4; /* @kind other */
+  --lh-body:    1.9; /* @kind other */
+  --lh-loose:   2.2; /* @kind other */
+
+  /* ---- Letter spacing ----
+     The glyphs are already monospaced & square; only nudge. */
+  --ls-tight:   -0.5px;
+  --ls-normal:  0px;
+  --ls-wide:    2px;  /* HUD labels, all-caps tags */
+
+  /* ---- Semantic roles ---- */
+  --text-display-size: var(--fs-display);
+  --text-h1-size: var(--fs-h1);
+  --text-body-size: var(--fs-body);
+  --text-ui-size: var(--fs-ui);
+}
+
+/* Pixel fonts must NOT be anti-aliased into mush. Keep edges
+   crisp; let the CRT overlay do the softening. */
+:root {
+  --pixel-render: pixelated; /* @kind other */
+}
+/* ============================================================
+   SPACING — Brad Did Something
+   8px grid. The font lives on it; so does everything else.
+   No fractional spacing. Pixels are sacred.
+   ============================================================ */
+
+:root {
+  --space-0:  0px;
+  --space-1:  4px;   /* hairline gap (half-step, use sparingly) */
+  --space-2:  8px;   /* base unit */
+  --space-3:  12px;
+  --space-4:  16px;
+  --space-5:  24px;
+  --space-6:  32px;
+  --space-7:  48px;
+  --space-8:  64px;
+  --space-9:  96px;
+
+  /* ---- Radius ----
+     Pixel UI = mostly hard corners. We allow a single 4px
+     "chunky pixel" rounding for soft chips; never smooth. */
+  --radius-0:    0px;   /* default — everything is square */
+  --radius-chunk:4px;   /* chips, avatars, soft cards */
+  --radius-pill: 0px;   /* there are no pills here */
+
+  /* ---- Border widths (the pixel frame) ---- */
+  --bw-1: 2px;  /* default UI border */
+  --bw-2: 4px;  /* emphasized frame / dialogue boxes */
+  --bw-3: 6px;  /* HUD chrome, window bezels */
+
+  /* ---- Containers ---- */
+  --container-screen: 1280px;
+  --container-narrow: 720px;
+  --hud-bar-height: 64px;
+}
+/* ============================================================
+   EFFECTS — Brad Did Something
+   CRT scanlines, neon glow, hard pixel shadows, glitch.
+   Shadows are HARD-OFFSET (no blur) to read as 8-bit. Glow
+   is the ONLY place blur is allowed.
+   ============================================================ */
+
+:root {
+  /* ---- Hard pixel shadows (offset, zero blur) — warm, on paper ---- */
+  --shadow-pixel:    4px 4px 0 0 rgba(36,31,23,0.28);
+  --shadow-pixel-lg: 8px 8px 0 0 rgba(36,31,23,0.26);
+  --shadow-pixel-sm: 2px 2px 0 0 rgba(36,31,23,0.30);
+
+  /* ---- Accent glow — kept SUBTLE in daylight (small, low-alpha) ---- */
+  --glow-magenta: 0 0 7px rgba(192,57,143,0.35);
+  --glow-cyan:    0 0 7px rgba(31,127,174,0.35);
+  --glow-lime:    0 0 7px rgba(63,154,63,0.35);
+  --glow-soft:    0 0 6px rgba(120,100,70,0.25);
+
+  /* text glow for arcade marquee headings — now a soft warm halo */
+  --text-glow-magenta: 0 0 5px rgba(192,57,143,0.28);
+  --text-glow-cyan:    0 0 5px rgba(31,127,174,0.28);
+  --text-glow-lime:    0 0 5px rgba(63,154,63,0.28);
+
+  /* ---- Focus ---- */
+  --focus-shadow: 0 0 0 2px var(--bds-white), 0 0 0 4px var(--focus-ring), 0 0 6px rgba(31,127,174,0.4);
+
+  /* ---- CRT scanline overlay ----
+     Apply as a fixed/absolute ::after layer. Two-layer:
+     horizontal scanlines + a faint vignette. pointer-events:none. */
+  /* DAYLIGHT re-skin: CRT is retired. These are neutralized to
+     transparent so any leftover .crt-overlay / [data-crt] renders
+     nothing (kept as vars so old markup doesn't error). */
+  --crt-scanline-size: 3px;   /* line period */
+  --crt-scanline: linear-gradient(rgba(0,0,0,0), rgba(0,0,0,0)); /* @kind other */
+  --crt-tint: linear-gradient(rgba(0,0,0,0), rgba(0,0,0,0));
+
+  /* ---- Motion ---- */
+  --ease-step: steps(4, end); /* @kind other */
+  --ease-pop: cubic-bezier(0.2,1.4,0.4,1); /* @kind other */
+  --dur-fast: 90ms; /* @kind other */
+  --dur: 160ms; /* @kind other */
+  --dur-slow: 320ms; /* @kind other */
+}
+
+/* ---------- Reusable CRT overlay ----------
+   Put <div class="crt-overlay"></div> as a fixed child of a
+   relatively/fixed positioned root, OR add data-crt to a box. */
+.crt-overlay,
+[data-crt]::after {
+  content: "";
+  position: absolute;
+  inset: 0;
+  pointer-events: none;
+  z-index: 9999;
+  background: var(--crt-scanline), var(--crt-tint);
+  mix-blend-mode: multiply;
+}
+[data-crt] { position: relative; }
+
+/* faint flicker — disabled under reduced motion */
+@media (prefers-reduced-motion: no-preference) {
+  @keyframes bds-flicker {
+    0%, 97%, 100% { opacity: 1; }
+    98%           { opacity: 0.82; }
+    99%           { opacity: 0.94; }
+  }
+  .crt-overlay { animation: bds-flicker 6s steps(1,end) infinite; }
+}
+
+/* ---------- Pixel-perfect rendering helper ---------- */
+[data-pixel-img] {
+  image-rendering: pixelated;
+  image-rendering: crisp-edges;
+}
+

static/fonts/PressStart2P-Regular.woff2

@@ -0,0 +1,3 @@
+version https://git-lfs.github.com/spec/v1
+oid sha256:854e91989d45c8148a3c17b67e0ec0925012db61fe8d7a9e04593883f105db72
+size 4716

static/index.html

@@ -0,0 +1,77 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+<meta charset="utf-8">
+<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
+<title>BRAD DID SOMETHING</title>
+<link rel="stylesheet" href="/static/css/tokens.css">
+<link rel="stylesheet" href="/static/css/game.css">
+</head>
+<body>
+<div id="viewport">
+  <header id="wordmark">
+    <span class="wm-main">BRAD DID SOMETHING</span>
+    <span class="wm-sub">VELOURA TECHNOLOGIES · Q3</span>
+  </header>
+
+  <div id="hud" class="hidden">
+    <div id="hud-revenue">
+      <div class="hud-row">
+        <span id="rev-number">$0</span><span id="rev-target">/ $1,000,000</span>
+      </div>
+      <div id="rev-bar"><div id="rev-fill"></div></div>
+      <div id="boss-title">HEAD OF SALES AND PARTNERSHIPS</div>
+    </div>
+    <div id="hud-right">
+      <span id="crisis-counter">CRISES 0/15</span>
+      <span id="pocket">POCKET $3,000</span>
+      <span id="hr-badge" class="hidden">! HR</span>
+    </div>
+    <div id="hud-banner" class="hidden"></div>
+  </div>
+
+  <main id="frame">
+    <div id="stage-wrap">
+      <div id="stage">
+        <canvas id="floor" width="640" height="480"></canvas>
+        <div id="world"></div>
+        <div id="fx"></div>
+        <div id="boardroom" class="hidden"></div>
+        <div id="dim" class="hidden"></div>
+        <div id="flash"></div>
+        <div id="edge-pulse"></div>
+        <div id="wipe"></div>
+        <div id="stamp" class="hidden">HR ALERT</div>
+      </div>
+    </div>
+    <aside id="papertrail">
+      <div class="pt-head">PAPER TRAIL</div>
+      <div id="pt-entries"><div class="pt-empty">&gt; nothing is on fire. yet.</div></div>
+    </aside>
+  </main>
+
+  <div id="dialogue" class="hidden"></div>
+  <div id="comic" class="hidden"></div>
+  <div id="gift-panel" class="hidden"></div>
+
+  <div id="title-screen">
+    <div class="ts-card">
+      <div class="ts-logo">BRAD DID<br>SOMETHING</div>
+      <div class="ts-sub">VELOURA TECHNOLOGIES</div>
+      <p class="ts-premise">You are the Head of Sales and Partnerships. Your team
+      is enthusiastic, well-intentioned, and completely unhinged. Hit $1,000,000
+      this quarter. Your people will keep happening.</p>
+      <div id="ts-cast"></div>
+      <button id="btn-start" class="btn-cta">START Q3 &#9654;</button>
+      <div class="ts-keys">&gt; WASD move &middot; SPACE talk &middot; G gift &middot; 1/2 choose &middot; ENTER send</div>
+    </div>
+  </div>
+
+  <div id="review-screen" class="hidden"></div>
+  <div id="crt"></div>
+</div>
+
+<script src="/static/js/chibi.js"></script>
+<script type="module" src="/static/js/main.js"></script>
+</body>
+</html>

static/js/api.js

@@ -0,0 +1,33 @@
+// fetch wrappers for the /api endpoints (SCHEMAS.md HTTP contracts)
+async function post(path, body) {
+  const resp = await fetch(path, {
+    method: "POST",
+    headers: { "Content-Type": "application/json" },
+    body: JSON.stringify(body || {}),
+  });
+  if (!resp.ok) {
+    const detail = await resp.json().catch(() => ({}));
+    const err = new Error(detail.detail || `http ${resp.status}`);
+    err.status = resp.status;
+    throw err;
+  }
+  return resp.json();
+}
+
+export const warm = () => post("/api/warm");
+export const newGame = () => post("/api/new_game");
+export const nextEvent = (sid) => post("/api/next_event", { session_id: sid });
+export const respond = (sid, response_type, text) =>
+  post("/api/respond", { session_id: sid, response_type, text: text || "" });
+export const presentationRound = (sid, response_type, text) =>
+  post("/api/presentation_round",
+       { session_id: sid, response_type: response_type || "custom", text: text || "" });
+export const gift = (sid, npc_id, tier) =>
+  post("/api/gift", { session_id: sid, npc_id, tier });
+export const review = (sid) => post("/api/review", { session_id: sid });
+export const chat = (sid, npc_id, text) =>
+  post("/api/chat", { session_id: sid, npc_id, text: text || "" });
+export const idle = (sid) => post("/api/idle", { session_id: sid });
+export const readEmail = (sid) => post("/api/read_email", { session_id: sid });
+export const comic = (sid, image_prompt) =>
+  post("/api/comic", { session_id: sid, image_prompt: image_prompt || "" });

static/js/audio.js

@@ -0,0 +1,277 @@
+// Cozy WebAudio sound — warm and quiet, not techy. Sine/triangle voices run
+// through a soft lowpass + a little reverb; notes are pentatonic so nothing
+// ever clashes; envelopes fade in/out so there are no clicks. Low master gain.
+// No audio files. Mute with M.
+
+let ctx = null, bus = null, master = null, muted = false, dead = false;
+const MASTER = 0.32;            // overall cosiness ceiling — everything sits under this
+
+// looping background music (mp3 in static/audio/). Routed past the SFX
+// lowpass/reverb so it stays full, but still under master + M mute.
+const MUSIC_SRC = "/static/audio/bgm.mp3";
+const MUSIC_VOL = 0.15;         // sits gently under the SFX — tune to taste
+let musicEl = null, musicGain = null, musicWired = false;
+
+function ac() {
+  if (dead) return null;
+  try {
+    if (!ctx) {
+      ctx = new (window.AudioContext || window.webkitAudioContext)();
+      master = ctx.createGain();
+      master.gain.value = MASTER;
+      master.connect(ctx.destination);
+      // warm everything: a gentle lowpass shaves the harsh top end
+      const lp = ctx.createBiquadFilter();
+      lp.type = "lowpass"; lp.frequency.value = 2600; lp.Q.value = 0.5;
+      lp.connect(master);
+      // a little room: short generated reverb, mixed in low
+      const wet = ctx.createGain(); wet.gain.value = 0.16;
+      const verb = ctx.createConvolver(); verb.buffer = impulse(0.9, 2.6);
+      verb.connect(wet); wet.connect(master);
+      bus = ctx.createGain(); bus.gain.value = 1;
+      bus.connect(lp);          // dry
+      bus.connect(verb);        // wet
+    }
+    if (ctx.state === "suspended") ctx.resume();
+    return ctx;
+  } catch {
+    dead = true;              // no audio device — game keeps working, silently
+    return null;
+  }
+}
+
+function impulse(seconds, decay) {
+  const a = ctx, len = Math.floor(a.sampleRate * seconds);
+  const buf = a.createBuffer(2, len, a.sampleRate);
+  for (let ch = 0; ch < 2; ch++) {
+    const d = buf.getChannelData(ch);
+    for (let i = 0; i < len; i++)
+      d[i] = (Math.random() * 2 - 1) * Math.pow(1 - i / len, decay);
+  }
+  return buf;
+}
+
+// pentatonic C-major — any mix of these sounds pleasant and warm
+const N = {
+  C3: 130.81, E3: 164.81, G3: 196.0,
+  C4: 261.63, D4: 293.66, E4: 329.63, G4: 392.0, A4: 440.0,
+  C5: 523.25, D5: 587.33, E5: 659.25, G5: 783.99, A5: 880.0,
+  C6: 1046.5, D6: 1174.7, E6: 1318.5, G6: 1568.0,
+};
+
+// one soft voice with a click-free envelope
+function tone(freq, o = {}) {
+  if (muted) return;
+  const a = ac(), t0 = a.currentTime + (o.t || 0);
+  const dur = o.dur || 0.2, atk = o.attack || 0.012, rel = o.rel || dur * 0.85;
+  const osc = a.createOscillator();
+  osc.type = o.type || "sine";
+  osc.frequency.setValueAtTime(freq, t0);
+  if (o.glideTo) osc.frequency.exponentialRampToValueAtTime(o.glideTo, t0 + dur);
+  if (o.detune) osc.detune.value = o.detune;
+  const g = a.createGain();
+  g.gain.setValueAtTime(0.0001, t0);
+  g.gain.exponentialRampToValueAtTime(o.gain || 0.1, t0 + atk);
+  g.gain.exponentialRampToValueAtTime(0.0001, t0 + atk + rel);
+  osc.connect(g).connect(bus);
+  osc.start(t0); osc.stop(t0 + atk + rel + 0.05);
+  // a faint octave/fifth layer warms plucks without making them louder
+  if (o.warm) tone(freq * o.warm, { ...o, warm: 0, gain: (o.gain || 0.1) * 0.35 });
+}
+
+// filtered noise — footsteps, paper, whooshes (cloth/wood, never beeps)
+function noise(o = {}) {
+  if (muted) return;
+  const a = ac(), t0 = a.currentTime + (o.t || 0), dur = o.dur || 0.08;
+  const buf = a.createBuffer(1, Math.floor(a.sampleRate * dur), a.sampleRate);
+  const d = buf.getChannelData(0);
+  for (let i = 0; i < d.length; i++) d[i] = Math.random() * 2 - 1;
+  const src = a.createBufferSource(); src.buffer = buf;
+  const f = a.createBiquadFilter();
+  f.type = o.filter || "lowpass";
+  f.frequency.setValueAtTime(o.cutoff || 700, t0);
+  f.Q.value = o.q || 0.7;
+  if (o.sweep) f.frequency.linearRampToValueAtTime(o.sweep, t0 + dur);
+  const g = a.createGain();
+  g.gain.setValueAtTime(0.0001, t0);
+  g.gain.exponentialRampToValueAtTime(o.gain || 0.04, t0 + (o.attack || 0.005));
+  g.gain.exponentialRampToValueAtTime(0.0001, t0 + dur);
+  src.connect(f).connect(g).connect(bus);
+  src.start(t0); src.stop(t0 + dur + 0.02);
+}
+
+// play a little melody/arpeggio
+function seq(freqs, gap, o = {}) {
+  freqs.forEach((f, i) => tone(f, { ...o, t: (o.t || 0) + i * gap }));
+}
+
+// ---- ambient office bed: a near-silent warm drone, always running ----
+let bed = null;
+function ambientStart() {
+  if (bed) return;
+  const a = ac();
+  const g = a.createGain(); g.gain.value = 0.0001; g.connect(bus);
+  g.gain.exponentialRampToValueAtTime(0.013, a.currentTime + 3);
+  const f = a.createBiquadFilter();
+  f.type = "lowpass"; f.frequency.value = 380; f.Q.value = 0.4; f.connect(g);
+  const o1 = a.createOscillator(); o1.type = "sine"; o1.frequency.value = N.C3;
+  const o2 = a.createOscillator(); o2.type = "sine"; o2.frequency.value = N.C3 + 0.6;
+  const o3 = a.createOscillator(); o3.type = "sine"; o3.frequency.value = N.G3;
+  const g3 = a.createGain(); g3.gain.value = 0.4;
+  o1.connect(f); o2.connect(f); o3.connect(g3).connect(f);
+  // a very slow filter drift so it breathes
+  const lfo = a.createOscillator(); lfo.frequency.value = 0.06;
+  const lg = a.createGain(); lg.gain.value = 60;
+  lfo.connect(lg).connect(f.frequency);
+  [o1, o2, o3, lfo].forEach((x) => x.start());
+  bed = { g, nodes: [o1, o2, o3, lfo] };
+}
+function ambientStop() {
+  if (!bed) return;
+  const a = ac(), { g, nodes } = bed;
+  g.gain.exponentialRampToValueAtTime(0.0001, a.currentTime + 1.2);
+  nodes.forEach((x) => { try { x.stop(a.currentTime + 1.4); } catch {} });
+  bed = null;
+}
+
+// ---- looping background music (mp3) ----
+function musicStart() {
+  try {
+    if (!musicEl) {
+      musicEl = new Audio(MUSIC_SRC);
+      musicEl.loop = true; musicEl.preload = "auto";
+      musicEl.style.display = "none";
+      document.body.appendChild(musicEl); // attach for robustness + inspection
+    }
+    musicEl.muted = muted;
+    const a = ac();
+    if (a && !musicWired) {
+      try {
+        const src = a.createMediaElementSource(musicEl);
+        musicGain = a.createGain(); musicGain.gain.value = 0.0001;
+        src.connect(musicGain).connect(master); // past the SFX lowpass/reverb
+        musicGain.gain.exponentialRampToValueAtTime(MUSIC_VOL, a.currentTime + 2.5);
+        musicWired = true;
+      } catch { musicEl.volume = MUSIC_VOL; }
+    } else if (!a) {
+      musicEl.volume = MUSIC_VOL;                // no WebAudio — plain element
+    } else if (musicGain) {
+      musicGain.gain.exponentialRampToValueAtTime(MUSIC_VOL, a.currentTime + 1.5);
+    }
+    const p = musicEl.play();
+    if (p && p.catch) p.catch(() => {});         // autoplay block — ignore
+  } catch {}
+}
+function musicStop() {
+  if (!musicEl) return;
+  try {
+    if (musicGain && ctx) {
+      musicGain.gain.exponentialRampToValueAtTime(0.0001, ctx.currentTime + 1.2);
+      setTimeout(() => { try { musicEl.pause(); } catch {} }, 1300);
+    } else { musicEl.pause(); }
+  } catch {}
+}
+
+// ---- rate limiters so footsteps / typing never stack into a buzz ----
+let lastFoot = 0, footToggle = 0, lastType = 0;
+
+export const sfx = {
+  // movement & ambient
+  footstep() {
+    const now = performance.now();
+    if (now - lastFoot < 250) return;
+    lastFoot = now; footToggle ^= 1;
+    noise({ dur: 0.06, cutoff: footToggle ? 540 : 600, q: 1.1, gain: 0.022 });
+    tone(footToggle ? N.C3 : N.E3, { type: "sine", dur: 0.05, gain: 0.012 });
+  },
+  bump() { noise({ dur: 0.11, cutoff: 300, gain: 0.03 });
+    tone(90, { type: "sine", dur: 0.12, gain: 0.035, glideTo: 70 }); },
+  ambientStart, ambientStop, musicStart, musicStop,
+
+  // dialogue & UI
+  open() { seq([N.E5, N.A5], 0.06, { type: "sine", gain: 0.06, dur: 0.22 }); },
+  close() { seq([N.A5, N.E5], 0.06, { type: "sine", gain: 0.045, dur: 0.2 }); },
+  type() {
+    const now = performance.now();
+    if (now - lastType < 55) return;
+    lastType = now;
+    tone(350 + Math.random() * 36, { type: "triangle", dur: 0.035,
+      gain: 0.016, attack: 0.002 });
+  },
+  click() { tone(N.A5, { type: "triangle", dur: 0.1, gain: 0.05, warm: 0.5 }); },
+  send() { seq([N.G5, N.C6], 0.05, { type: "sine", gain: 0.06, dur: 0.16 }); },
+  prompt() { tone(N.D6, { type: "sine", dur: 0.12, gain: 0.028 }); },
+  comic() { noise({ dur: 0.34, cutoff: 420, sweep: 1800, gain: 0.04 }); // page reveal
+    seq([N.G5, N.C6, N.E6], 0.07, { type: "sine", gain: 0.04, dur: 0.26, warm: 0.5 }); },
+
+  // event arrivals
+  bubble() { tone(N.E5, { type: "sine", dur: 0.2, gain: 0.06, glideTo: N.A5 }); },
+  amberBubble() { tone(N.D5, { type: "sine", dur: 0.22, gain: 0.05, glideTo: N.G4 }); },
+  heart() { seq([N.E5, N.A5, N.C6], 0.07, { type: "sine", gain: 0.045, dur: 0.24 });
+    tone(N.E6, { t: 0.2, dur: 0.32, gain: 0.022 }); },
+  newspaper() { noise({ dur: 0.4, cutoff: 380, sweep: 1700, gain: 0.04 });
+    noise({ t: 0.32, dur: 0.05, cutoff: 2400, gain: 0.03 });
+    noise({ t: 0.4, dur: 0.05, cutoff: 2000, gain: 0.025 }); },
+  envelope() { noise({ dur: 0.3, cutoff: 1100, sweep: 520, gain: 0.035,
+    filter: "bandpass", q: 0.8 }); },
+  mail() { seq([N.G5, N.C6], 0.13, { type: "sine", gain: 0.05, dur: 0.32, warm: 0.5 }); },
+  phoneRingStart() {
+    if (sfx._ring) return;
+    const ring = () => { seq([N.E5, N.G5], 0.12, { type: "sine", gain: 0.04, dur: 0.22 });
+      seq([N.E5, N.G5], 0.12, { type: "sine", gain: 0.04, dur: 0.22, t: 0.3 }); };
+    ring(); sfx._ring = setInterval(ring, 1400);
+  },
+  phoneRingStop() { if (sfx._ring) { clearInterval(sfx._ring); sfx._ring = null; } },
+
+  // outcomes
+  moneyUp() { seq([N.C5, N.E5, N.G5, N.C6], 0.06,
+    { type: "triangle", gain: 0.055, dur: 0.24, warm: 0.5 }); },
+  moneyDown() { seq([N.A5, N.G5, N.E5, N.C5], 0.07,
+    { type: "sine", gain: 0.05, dur: 0.26 }); },
+  disaster() { noise({ dur: 0.28, cutoff: 220, gain: 0.05 });
+    tone(72, { type: "sine", dur: 0.4, gain: 0.05, glideTo: 54 }); },
+  titleSwap() { seq([N.D6, N.G6], 0.04, { type: "sine", gain: 0.02, dur: 0.12 }); },
+  trail() { noise({ dur: 0.04, cutoff: 3200, gain: 0.013, filter: "highpass" }); },
+  gift() { seq([N.G5, N.A5, N.C6], 0.05, { type: "triangle", gain: 0.045, dur: 0.2 }); },
+  coffee() { [N.C5, N.E5, N.G5].forEach((f) =>
+    tone(f, { type: "sine", gain: 0.038, dur: 0.5 })); },
+
+  // boardroom / presentation
+  gold() { seq([N.G5, N.D6, N.G6], 0.08, { type: "sine", gain: 0.045, dur: 0.5 }); },
+  wipe() { noise({ dur: 0.35, cutoff: 550, sweep: 1900, gain: 0.035 }); },
+  boardIn() { noise({ dur: 0.08, cutoff: 380, gain: 0.03 });
+    noise({ t: 0.16, dur: 0.08, cutoff: 420, gain: 0.03 }); },
+  wrongSlide() { tone(N.G5, { type: "triangle", dur: 0.42, gain: 0.06, glideTo: N.D5 });
+    tone(N.E5, { t: 0.4, type: "triangle", dur: 0.32, gain: 0.05, glideTo: N.C5 }); },
+  score() { seq([N.C5, N.E5, N.G5], 0.08, { type: "triangle", gain: 0.05, dur: 0.2 });
+    tone(N.C6, { t: 0.28, dur: 0.5, gain: 0.05, warm: 0.5 }); },
+  stamp() { noise({ dur: 0.18, cutoff: 280, gain: 0.05 });
+    tone(110, { type: "sine", dur: 0.26, gain: 0.05, glideTo: 88 }); },
+
+  // endings
+  win() { seq([N.C5, N.E5, N.G5, N.C6, N.E6, N.G6], 0.09,
+    { type: "triangle", gain: 0.055, dur: 0.42, warm: 0.5 });
+    [N.C5, N.E5, N.G5].forEach((f) => tone(f, { t: 0.6, dur: 0.9, gain: 0.04 })); },
+  lose(tier) {
+    const sets = {
+      hit_target: [N.C5, N.E5, N.G5], above_600k: [N.A4, N.G4, N.E4],
+      "300k_to_600k": [N.G4, N.E4, N.C4], below_300k: [N.E4, N.D4, N.C4, N.C3],
+    };
+    seq(sets[tier] || sets["300k_to_600k"], 0.22,
+      { type: "sine", gain: 0.05, dur: 0.4 }); },
+  confetti() { for (let i = 0; i < 12; i++) {
+    const notes = [N.C6, N.D6, N.E6, N.G6, N.A5];
+    tone(notes[(Math.random() * notes.length) | 0],
+      { t: Math.random() * 1.1, type: "sine", dur: 0.18, gain: 0.03 }); } },
+  review() { [N.C4, N.G4, N.C5].forEach((f, i) =>
+    tone(f, { type: "sine", dur: 1.1, gain: 0.035, t: i * 0.08 })); },
+  play() { seq([N.G5, N.C6], 0.07, { type: "sine", gain: 0.05, dur: 0.25 }); },
+
+  toggleMute() {
+    muted = !muted;
+    if (master) master.gain.exponentialRampToValueAtTime(
+      muted ? 0.0001 : MASTER, (ctx ? ctx.currentTime : 0) + 0.15);
+    if (musicEl) musicEl.muted = muted; // covers both routed + plain-element paths
+    return muted;
+  },
+};

static/js/boardroom.js

@@ -0,0 +1,159 @@
+// boardroom interior scene (UI_UX.md §6 §17 §21)
+import { G } from "./state.js";
+import { chibiInBox } from "./sprites.js";
+
+// presenting NPC expression per PRESENTATION_SYSTEM.md state
+const PRESENT_EXPRESSION = {
+  romance: { eyes: "heart", blush: true, mouth: "smile" },
+  grief: { eyes: "closed", mouth: "frown", tilt: 4 },
+  overprepared: { armPose: "point", mouth: "open" },
+  bare_minimum: { armPose: "crossed", mouth: "flat" },
+  advocate: { eyes: "happy", mouth: "smile", armPose: "open" },
+  normal: { armPose: "point", mouth: "smirk" },
+};
+
+const HAIRS = ["#4a485e", "#6b6347", "#3a3850"];
+
+function slideHtml(kind) {
+  if (kind === "pie140") {
+    return `<div style="text-align:center;font-size:6px;color:#9a92c4;">
+      <div style="position:relative;width:54px;height:54px;margin:4px auto;
+        border-radius:50%;background:conic-gradient(
+        var(--bds-kevin) 0 115deg, var(--bds-neon-magenta) 115deg 215deg,
+        var(--bds-brad) 215deg 305deg, var(--bds-stacey) 305deg 360deg);
+        box-shadow:0 0 0 2px var(--bds-void), 6px -4px 0 -1px var(--bds-kevin);">
+      </div>
+      <span style="color:var(--bds-brad)">TOTAL: 140%</span></div>`;
+  }
+  if (kind === "momentum")
+    return `<div style="text-align:center;font-size:9px;color:var(--bds-white);
+      padding-top:18px;">MOMENTUM<br><span style="font-size:6px;
+      color:#9a92c4;">(Trust Us)</span></div>`;
+  return `<div style="text-align:center;padding-top:10px;">
+    <div style="display:inline-block;width:46px;height:24px;
+      background:linear-gradient(#190f33 60%, #ff9c3c 60%);"></div>
+    <div style="font-size:5px;color:#9a92c4;margin-top:4px;">[no title]</div></div>`;
+}
+
+export function enterBoardroom(presentingNpc, npcState) {
+  const room = G.els.boardroom;
+  const chairAt = (x, y) => `
+    <div style="position:absolute;left:${x}px;top:${y}px;width:26px;height:20px;
+      background:#42424d;border:2px solid #2c2c38;border-top:4px solid #5b5b68;
+      box-shadow:0 4px 0 rgba(70,70,95,.3);"></div>`;
+  const windowAt = (x, w) => `
+    <div style="position:absolute;left:${x}px;top:8px;width:${w}px;height:34px;
+      background:#aedcf2;border:3px solid #8e94a6;overflow:hidden;">
+      <div style="position:absolute;left:0;top:0;width:100%;height:10px;background:#cdeaf8;"></div>
+      <div style="position:absolute;left:10px;top:5px;width:16px;height:4px;background:#ffffff;"></div>
+      <div style="position:absolute;left:6px;bottom:0;width:14px;height:16px;background:#9fb2c4;"></div>
+      <div style="position:absolute;left:26px;bottom:0;width:12px;height:22px;background:#9fb2c4;"></div>
+      <div style="position:absolute;left:44px;bottom:0;width:16px;height:12px;background:#9fb2c4;"></div>
+      <div style="position:absolute;left:30px;bottom:12px;width:3px;height:3px;background:#fffbe8;"></div>
+    </div>`;
+  room.innerHTML = `
+    <!-- warm meeting-room carpet -->
+    <div style="position:absolute;inset:0;background:
+      repeating-linear-gradient(0deg,#9b9183 0 16px,#948a7c 16px 32px),
+      repeating-linear-gradient(90deg,transparent 0 16px,rgba(0,0,0,.05) 16px 32px);
+      "></div>
+    <!-- area rug under the table -->
+    <div style="position:absolute;left:140px;top:120px;width:360px;height:180px;
+      background:#c4664e;border:6px solid #b6543e;"></div>
+    <!-- white top wall with daylight windows -->
+    <div style="position:absolute;left:0;top:0;width:100%;height:48px;
+      background:#f3f3f5;border-bottom:4px solid #aaaab6;
+      box-shadow:inset 0 4px 0 #fbfbfd, inset 0 -8px 0 #e2e2e8;"></div>
+    ${windowAt(40, 70)}${windowAt(470, 70)}
+    <!-- conference table (z 2: covers the legs of seated board chibis) -->
+    <div style="position:absolute;left:170px;top:150px;width:300px;height:120px;
+      z-index:2;
+      background:#6b4f2e;border:3px solid #2e2113;border-top:6px solid #83643c;
+      border-bottom:8px solid #4e3920;box-shadow:10px 12px 0 rgba(5,4,14,.45);">
+      <div style="position:absolute;left:24px;top:22px;width:26px;height:18px;
+        background:#cfcadf;box-shadow:3px 3px 0 #8d87a8;"></div>
+      <div style="position:absolute;right:40px;top:54px;width:26px;height:18px;
+        background:#cfcadf;box-shadow:3px 3px 0 #8d87a8;"></div>
+      <div style="position:absolute;left:130px;top:44px;width:36px;height:22px;
+        background:#454060;border-top:3px solid #575278;"></div>
+      <div style="position:absolute;left:70px;top:70px;width:12px;height:14px;
+        background:#ff5a3c;border-top:2px solid #ffa28e;"></div>
+    </div>
+    ${chairAt(210, 122)}${chairAt(300, 122)}${chairAt(390, 122)}
+    ${chairAt(210, 282)}${chairAt(300, 282)}${chairAt(390, 282)}
+    ${chairAt(132, 196)}
+    <!-- projector screen -->
+    <div id="projector" style="position:absolute;left:240px;top:30px;width:160px;
+      height:92px;background:var(--bds-navy-800);border:4px solid #5d5d68;
+      border-bottom:8px solid #44444f;
+      box-shadow:0 0 22px rgba(127,178,236,.35), 6px 8px 0 rgba(70,70,95,.3);">
+      ${slideHtml("pie140")}</div>
+    <!-- glass wall, left -->
+    <div style="position:absolute;left:20px;top:60px;width:10px;height:330px;
+      background:rgba(140,200,235,.3);border-left:3px solid #8e94a6;
+      border-right:3px solid #8e94a6;"></div>
+    <div style="position:absolute;left:22px;top:140px;width:6px;height:2px;background:rgba(255,255,255,.7);"></div>
+    <div style="position:absolute;left:22px;top:260px;width:6px;height:2px;background:rgba(255,255,255,.7);"></div>
+    <!-- corner plant -->
+    <div style="position:absolute;right:30px;bottom:36px;width:18px;height:14px;
+      background:#b35c3a;border-top:3px solid #cf7450;"></div>
+    <div style="position:absolute;right:26px;bottom:48px;width:11px;height:18px;
+      background:#3f9e52;"></div>
+    <div style="position:absolute;right:38px;bottom:54px;width:9px;height:22px;
+      background:#5cc46e;"></div>
+    <div id="kevin-glass" style="position:absolute;left:2px;top:240px;"></div>
+    <div id="board-seats" style="position:absolute;left:0;top:0;width:100%;
+      height:100%;"></div>
+    <div style="position:absolute;right:14px;bottom:10px;font-size:6px;
+      color:var(--bds-grey-dim);">&gt; kevin watching (always)</div>`;
+  room.classList.remove("hidden");
+
+  // board members file in one at a time — full designed chibis, seated
+  // behind the table (the table's z-index covers their legs)
+  const seats = room.querySelector("#board-seats");
+  seats.style.zIndex = "1";
+  [188, 288, 388].forEach((x, i) => {
+    setTimeout(() => {
+      const member = chibiInBox("board", {
+        face: { hair: HAIRS[i], woman: i === 1 },
+        mouth: i === 2 ? "frown" : "flat",
+      }, 70, 78);
+      member.style.position = "absolute";
+      member.style.left = `${x}px`;
+      member.style.top = "100px";
+      seats.appendChild(member);
+    }, 350 * i);
+  });
+
+  // presenting NPC at the projector — their emotional state shows
+  const colorVar = `var(--bds-${presentingNpc})`;
+  const npc = chibiInBox(presentingNpc, PRESENT_EXPRESSION[npcState] ||
+    PRESENT_EXPRESSION.normal, 80, 86);
+  npc.style.position = "absolute";
+  npc.style.left = "150px"; npc.style.top = "44px";
+  npc.style.zIndex = "3";
+  if (npcState === "grief") npc.style.filter = "saturate(.55) brightness(.85)";
+  seats.appendChild(npc);
+  const tagEl = window.BDSChibi.tag(
+    presentingNpc.toUpperCase(), colorVar, { top: 0 });
+  tagEl.style.left = "190px"; tagEl.style.top = "134px";
+  tagEl.style.transform = "none"; tagEl.style.zIndex = "3";
+  seats.appendChild(tagEl);
+
+  // kevin through the glass (unless kevin is presenting — then derek watches)
+  const watcher = presentingNpc === "kevin" ? "derek" : "kevin";
+  const kv = window.BDSChibi.topSprite({ who: watcher, pose: "lean" });
+  kv.style.opacity = ".55";
+  room.querySelector("#kevin-glass").appendChild(kv);
+
+  return {
+    setSlide(kind) {
+      room.querySelector("#projector").innerHTML = slideHtml(kind);
+    },
+  };
+}
+
+export function exitBoardroom() {
+  G.els.boardroom.classList.add("hidden");
+  G.els.boardroom.innerHTML = "";
+}

static/js/chibi.js

@@ -0,0 +1,526 @@
+/* ============================================================
+   chibi.js — shared sprite engine for Brad Did Something
+   Ported from "Character Sprite Sheet.html" v1.0 and extended
+   with v2 emotional/talk poses, top-down floor sprites and a
+   box-shadow pixel-glyph drawer (hearts, stars, drops, Z).
+   Vanilla JS. Load with <script src="../assets/chibi.js">.
+   Exposes window.BDSChibi.
+   ============================================================ */
+(function () {
+  const DARK = "var(--bds-void)";
+
+  /* ---------- shared styles (injected once) ---------- */
+  const css = `
+  .chibi { position: relative; transform-origin: bottom center; z-index: 2; }
+  .chibi * { position: absolute; box-sizing: border-box; }
+  .chibi .part { border: 3px solid var(--bds-void); }
+  .chibi .head   { border-radius: 44% 44% 46% 46%; z-index: 4; }
+  .chibi .hairpc { border: 3px solid var(--bds-void); z-index: 6; }
+  .chibi .collar { border-radius: 50%; z-index: 5; }
+  .chibi .torso  { border-radius: 42% 42% 26% 26%; z-index: 3; }
+  .chibi .arm    { border-radius: 45%; z-index: 2; transform-origin: top center; }
+  .chibi .hand   { border-radius: 50%; z-index: 3; }
+  .chibi .leg    { border-radius: 22% 22% 30% 30%; z-index: 3; }
+  .chibi .eye    { background: var(--bds-void); border-radius: 50%; z-index: 7; }
+  .chibi .brow   { z-index: 8; border-radius: 2px; }
+  .chibi .lash   { background: var(--bds-void); z-index: 8; }
+  .chibi .glasses{ border: 3px solid var(--bds-void); background: transparent; border-radius: 36%; z-index: 8; }
+  .chibi .bridge { background: var(--bds-void); z-index: 8; }
+  .chibi .mouth  { z-index: 7; }
+  .chibi .blush  { z-index: 7; border-radius: 50%; opacity: .8; }
+  .chibi .sweat  { background: var(--bds-stacey); border-radius: 50% 50% 50% 50% / 65% 65% 40% 40%; z-index: 9; box-shadow: 0 0 6px var(--bds-stacey); }
+  .chibi .pxglyph { z-index: 10; }
+
+  .bds-top-sprite { position: absolute; width: 28px; height: 34px; z-index: 5; transform-origin: 50% 90%; }
+  .bds-top-sprite > i { position: absolute; display: block; }
+
+  @media (prefers-reduced-motion: no-preference) {
+    .a-idle    { animation: bds-c-idle 2.6s ease-in-out infinite; }
+    .a-bob     { animation: bds-c-bob var(--spd,.5s) ease-in-out infinite; }
+    .a-walk .leg.l { animation: bds-c-lega var(--spd,.5s) ease-in-out infinite; }
+    .a-walk .leg.r { animation: bds-c-legb var(--spd,.5s) ease-in-out infinite; }
+    .a-walk .arm.l { animation: bds-c-arma var(--spd,.5s) ease-in-out infinite; }
+    .a-walk .arm.r { animation: bds-c-armb var(--spd,.5s) ease-in-out infinite; }
+    .a-crisis  { animation: bds-c-jolt .45s ease-out infinite alternate; }
+    .a-rise    { animation: bds-c-rise 3.6s ease-in-out infinite; }
+    .a-talkarm .arm.gesture { animation: bds-c-wave .7s ease-in-out infinite alternate; }
+    .a-mouth .mouth { animation: bds-c-flap .42s steps(2) infinite; }
+    .a-mouth-slow .mouth { animation: bds-c-flap 1.4s steps(2) infinite; }
+    .a-wring .arm.l { animation: bds-c-wra .55s ease-in-out infinite alternate; }
+    .a-wring .arm.r { animation: bds-c-wrb .55s ease-in-out infinite alternate; }
+    .a-type .arm.r { animation: bds-c-tap .3s steps(2) infinite; }
+    .a-nod .head, .a-nod .hairpc { animation: bds-c-nod 3s ease-in-out infinite; }
+    .a-shiver { animation: bds-c-shiver .22s steps(2) infinite; }
+    .a-bounce { animation: bds-c-bounce .6s var(--ease-pop, ease-out) infinite alternate; }
+    .a-peek   { animation: bds-c-peek 3.2s steps(1,end) infinite; }
+    .a-tear .tearpx { animation: bds-c-tear 1.1s steps(3) infinite; }
+    .a-zzz .zpx { animation: bds-c-zzz 2.4s steps(4) infinite; }
+    .a-top-idle  { animation: bds-top-idle 1.6s steps(2) infinite; }
+    .a-top-walk  { animation: bds-top-walk var(--spd,.5s) ease-in-out infinite; }
+    /* articulated floor walk: legs step in opposition, arms counter-swing */
+    .a-top-walk .fl-leg-l { animation: bds-fl-stepA var(--spd,.5s) ease-in-out infinite; }
+    .a-top-walk .fl-leg-r { animation: bds-fl-stepB var(--spd,.5s) ease-in-out infinite; }
+    .a-top-walk .fl-arm-l { animation: bds-fl-swingA var(--spd,.5s) ease-in-out infinite; }
+    .a-top-walk .fl-arm-r { animation: bds-fl-swingB var(--spd,.5s) ease-in-out infinite; }
+    .a-top-shake { animation: bds-c-shiver .2s steps(2) infinite; }
+  }
+  @keyframes bds-c-idle { 0%,100%{ transform: translateY(0) rotate(0); } 50%{ transform: translateY(-1px) rotate(-1.5deg); } }
+  @keyframes bds-c-bob  { 50% { transform: translateY(-3px); } }
+  @keyframes bds-c-lega { 50% { transform: translateY(-5px) rotate(8deg); } }
+  @keyframes bds-c-legb { 50% { transform: translateY(0) rotate(-8deg); } }
+  @keyframes bds-c-arma { 50% { transform: rotate(18deg); } }
+  @keyframes bds-c-armb { 50% { transform: rotate(-18deg); } }
+  @keyframes bds-c-jolt { from { transform: translateY(2px) rotate(1.5deg);} to { transform: translateY(-4px) rotate(-1.5deg);} }
+  @keyframes bds-c-rise { 0%,28%{ transform: translateY(12px);} 72%,100%{ transform: translateY(0);} }
+  @keyframes bds-c-wave { from{ transform: rotate(-12deg);} to{ transform: rotate(-58deg);} }
+  @keyframes bds-c-flap { 50% { transform: scaleY(.4); } }
+  @keyframes bds-c-wra { from{ transform: rotate(14deg);} to{ transform: rotate(30deg) translateY(-2px);} }
+  @keyframes bds-c-wrb { from{ transform: rotate(-14deg);} to{ transform: rotate(-30deg) translateY(-2px);} }
+  @keyframes bds-c-tap { 50% { transform: translateY(-3px); } }
+  @keyframes bds-c-nod { 0%,40%,100%{ transform: translateY(0);} 50%,58%{ transform: translateY(2px);} }
+  @keyframes bds-c-shiver { 50% { transform: translateX(2px); } }
+  @keyframes bds-c-bounce { to { transform: translateY(-5px); } }
+  @keyframes bds-c-peek { 0%,60%,100% { transform: translateX(0); } 70%,90% { transform: translateX(7px); } }
+  @keyframes bds-c-tear { 0%{ transform: translateY(0); opacity:1;} 100%{ transform: translateY(14px); opacity:0;} }
+  @keyframes bds-c-zzz { 0%{ transform: translate(0,0); opacity:0;} 25%{ opacity:1;} 100%{ transform: translate(8px,-16px); opacity:0;} }
+  @keyframes bds-top-idle { 50% { transform: translateY(-2px); } }
+  @keyframes bds-top-walk { 0%,100%{transform:translateY(0);} 25%,75%{transform:translateY(-2px);} 50%{transform:translateY(0);} }
+  @keyframes bds-fl-stepA { 0%,100%{transform:translateY(0);} 50%{transform:translateY(-3.5px);} }
+  @keyframes bds-fl-stepB { 0%,100%{transform:translateY(-3.5px);} 50%{transform:translateY(0);} }
+  @keyframes bds-fl-swingA { 0%,100%{transform:translateY(-1.5px);} 50%{transform:translateY(1px);} }
+  @keyframes bds-fl-swingB { 0%,100%{transform:translateY(1px);} 50%{transform:translateY(-1.5px);} }
+  `;
+  const styleEl = document.createElement("style");
+  styleEl.textContent = css;
+  document.head.appendChild(styleEl);
+
+  /* ---------- character registry (lowercase keys) ---------- */
+  const CHARS = {
+    player: { key:"PLAYER", color:"--bds-white",  u:132, wf:1.00, bw:14, bh:22, hd:10, walk:".5s",
+      face:{ hair:"#5d5b86", style:"short", eyes:"dot",    brows:null,      mouth:"neutral", glasses:false, woman:false } },
+    brad:   { key:"BRAD",   color:"--bds-brad",   u:134, wf:1.16, bw:18, bh:22, hd:11, walk:".34s",
+      face:{ hair:"#7a4626", style:"messy", eyes:"big",    brows:"worried", mouth:"worried", glasses:false, woman:false, sweat:true } },
+    stacey: { key:"STACEY", color:"--bds-stacey", u:118, wf:0.90, bw:12, bh:20, hd:9,  walk:".42s",
+      face:{ hair:"#9a5a32", style:"long",  eyes:"round",  brows:null,      mouth:"smile",   glasses:false, woman:true } },
+    kevin:  { key:"KEVIN",  color:"--bds-kevin",  u:132, wf:1.00, bw:14, bh:22, hd:12, walk:".5s", roundHead:true,
+      face:{ hair:"#33324a", style:"neat",  eyes:"round",  brows:"stern",   mouth:"smirk",   glasses:true,  woman:false } },
+    janet:  { key:"JANET",  color:"--bds-janet",  u:138, wf:1.00, bw:14, bh:23, hd:10, walk:".46s",
+      face:{ hair:"#241a30", style:"long",  eyes:"round",  brows:null,      mouth:"smile",   glasses:false, woman:true, streak:"var(--bds-neon-magenta)" } },
+    derek:  { key:"DEREK",  color:"--bds-derek",  u:148, wf:1.18, bw:18, bh:24, hd:11, walk:"1.1s",
+      face:{ hair:"#6f6a52", style:"bald",  eyes:"sleepy", brows:"flat",    mouth:"flat",    glasses:false, woman:false } },
+    /* generic grey-suit board member; pass face overrides via opts */
+    board:  { key:"BOARD",  color:"--bds-grey",   u:138, wf:1.06, bw:16, bh:23, hd:10, walk:".6s", suit:"#3c3a52",
+      face:{ hair:"#4a485e", style:"neat",  eyes:"dot",    brows:"flat",    mouth:"flat",    glasses:false, woman:false } },
+    /* Kevin's parent — taller, older */
+    parent: { key:"PARENT", color:"--bds-kevin",  u:158, wf:1.04, bw:16, bh:26, hd:11, walk:".7s", suit:"#6b632e",
+      face:{ hair:"#c9c4d8", style:"bald",  eyes:"dot",    brows:"flat",    mouth:"smile",   glasses:true,  woman:false } },
+  };
+
+  /* ---------- pixel glyphs (box-shadow pixel art) ---------- */
+  const GLYPHS = {
+    heart: ["·##·##·", "#######", "#######", "·#####·", "··###··", "···#···"],
+    star:  ["···#···", "··###··", "#######", "·#####·", "··#·#··", "·#···#·"],
+    drop:  ["··#··", "·###·", "#####", "#####", "·###·"],
+    z:     ["####", "··#·", "·#··", "####"],
+    money: ["·###·", "#·#··", "·###·", "··#·#", "·###·"],
+    excl:  ["##", "##", "##", "··", "##"],
+    flame: ["··#··", "·##··", "·###·", "#####", "·###·"],
+  };
+
+  function pixelGlyph(rows, px, color, glow) {
+    if (typeof rows === "string") rows = GLYPHS[rows];
+    px = px || 3;
+    const shadows = [];
+    rows.forEach((row, y) => {
+      [...row].forEach((ch, x) => {
+        if (ch === "#") shadows.push(`${x * px}px ${y * px}px 0 0 ${color}`);
+      });
+    });
+    const d = document.createElement("i");
+    d.className = "pxglyph";
+    d.style.cssText = `display:block;position:relative;width:${px}px;height:${px}px;` +
+      `margin-right:${(rows[0].length - 1) * px}px;margin-bottom:${(rows.length - 1) * px}px;` +
+      `background:transparent;box-shadow:${shadows.join(",")};` +
+      (glow ? `filter:drop-shadow(0 0 4px ${color});` : "");
+    return d;
+  }
+  function glyphHTML(name, px, color, extra) {
+    const rows = GLYPHS[name];
+    const shadows = [];
+    rows.forEach((row, y) => [...row].forEach((ch, x) => {
+      if (ch === "#") shadows.push(`${x * px}px ${y * px}px 0 0 ${color}`);
+    }));
+    return `<i class="pxglyph" style="display:block;width:${px}px;height:${px}px;box-shadow:${shadows.join(",")};${extra || ""}"></i>`;
+  }
+
+  /* ---------- front-view chibi ----------
+     state: idle|down|up|left|right|crisis|talk
+     opts: { eyes ('closed'|'happy'|'heart'|'wide'), mouth ('open'|'frown'|'wavy'|
+             'smile'|'flat'|'worried'|'neutral'|'smirk'), brows, armPose
+             ('out'|'palms'|'point'|'open'|'hips'|'behindhead'|'wring'),
+             tears, sweat, zzz, heartAbove, blush, tilt (deg), anim (extra classes),
+             suit (torso color override), noBubble, scale } */
+  function chibi(who, state, opts) {
+    opts = opts || {};
+    const c = typeof who === "string" ? CHARS[who] : who;
+    const u = c.u, wf = c.wf;
+    const col = opts.suit || c.suit ? `${opts.suit || c.suit}` : `var(${c.color})`;
+    const skin = "var(--bds-white)";
+    const pants = "#241a44";
+    const F = Object.assign({}, c.face, opts.face || {});
+    const headD = Math.round((c.roundHead ? 0.50 : 0.46) * u);
+    const torsoW = Math.round(0.40 * u * wf);
+    const torsoH = Math.round(0.30 * u);
+    const armW = Math.round(0.13 * u), armH = Math.round(0.26 * u);
+    const legW = Math.round(0.16 * u), legH = Math.round(0.17 * u), legGap = Math.round(0.05 * u);
+    const handD = Math.round(0.13 * u);
+
+    const torsoBottomY = Math.round(legH * 0.45);
+    const torsoTopY = torsoBottomY + torsoH;
+    const headBottomY = torsoTopY - Math.round(headD * 0.22);
+    const headTopY = headBottomY + headD;
+    const H = headTopY + Math.round(0.06 * u);
+    const W = Math.round(Math.max(headD, torsoW + armW * 1.4) + Math.round(0.18 * u));
+    const cx = W / 2;
+    const headLeft = cx - headD / 2;
+
+    const isBack = state === "up";
+    const side = (state === "left" || state === "right") ? state : null;
+
+    const px = (fx) => headLeft + headD * fx;
+    const py = (fy) => headBottomY + headD * (1 - fy);
+
+    const el = document.createElement("div");
+    el.className = "chibi";
+    el.style.width = W + "px"; el.style.height = H + "px";
+    if (opts.scale) { el.style.transform = `scale(${opts.scale})`; }
+    if (opts.tilt) { el.style.transform = (el.style.transform || "") + ` rotate(${opts.tilt}deg)`; }
+    let html = "";
+
+    /* long hair back panels */
+    if (F.style === "long") {
+      const hw = Math.round(headD * 0.26), hh = (headTopY - torsoBottomY) - Math.round(0.02 * u);
+      const hbot = torsoBottomY + Math.round(0.02 * u);
+      const z = isBack ? 7 : 3;
+      html += `<div class="hairpc" style="width:${hw}px;height:${hh}px;left:${headLeft - Math.round(0.01*u)}px;bottom:${hbot}px;background:${F.hair};border-radius:60% 40% 45% 55%;z-index:${z};"></div>`;
+      html += `<div class="hairpc" style="width:${hw}px;height:${hh}px;left:${headLeft + headD - hw + Math.round(0.01*u)}px;bottom:${hbot}px;background:${F.hair};border-radius:40% 60% 55% 45%;z-index:${z};"></div>`;
+      if (F.streak) html += `<div class="hairpc" style="width:${Math.round(hw*0.4)}px;height:${Math.round(hh*0.8)}px;left:${headLeft + headD - hw + Math.round(0.01*u)}px;bottom:${hbot}px;background:${F.streak};border:none;border-radius:40% 60% 55% 45%;z-index:${z+1};"></div>`;
+    }
+
+    /* legs */
+    html += `<div class="part leg l" style="width:${legW}px;height:${legH}px;left:${cx - legGap/2 - legW}px;bottom:0;background:${pants};"></div>`;
+    html += `<div class="part leg r" style="width:${legW}px;height:${legH}px;left:${cx + legGap/2}px;bottom:0;background:${pants};"></div>`;
+
+    /* arms */
+    const armBottom = torsoBottomY + Math.round(0.03 * u);
+    const pose = opts.armPose;
+    function armPair(rotL, rotR, raiseL, raiseR) {
+      const lx = cx - torsoW/2 - armW + Math.round(0.03*u);
+      const rx = cx + torsoW/2 - Math.round(0.03*u);
+      /* hand nests INSIDE the arm so it inherits the arm's rotation —
+         a sibling hand with a linear offset drifts off-body at high rotations */
+      const hand = `<div class="part hand" style="width:${handD}px;height:${handD}px;left:50%;margin-left:${-Math.round(handD/2) - 3}px;bottom:${-Math.round(handD * 0.4)}px;background:${skin};"></div>`;
+      html += `<div class="part arm l" style="width:${armW}px;height:${armH}px;left:${lx}px;bottom:${armBottom + (raiseL||0)}px;background:${col};transform:rotate(${rotL}deg);">${hand}</div>`;
+      html += `<div class="part arm r gesture" style="width:${armW}px;height:${armH}px;left:${rx}px;bottom:${armBottom + (raiseR||0)}px;background:${col};transform:rotate(${rotR}deg);">${hand}</div>`;
+    }
+    if (side) {
+      const fx = side === "right" ? 1 : -1;
+      html += `<div class="part arm gesture" style="width:${armW}px;height:${armH}px;left:${cx - armW/2 + fx*Math.round(0.10*u)}px;bottom:${armBottom}px;background:${col};transform:rotate(${fx*22}deg);"></div>`;
+    } else if (pose === "out")        armPair(8, -70, 0, Math.round(0.06*u));
+    else if (pose === "open")         armPair(46, -46, Math.round(0.04*u), Math.round(0.04*u));
+    else if (pose === "palms")        armPair(58, -58, Math.round(0.07*u), Math.round(0.07*u));
+    else if (pose === "point")        armPair(6, -88, 0, Math.round(0.10*u));
+    else if (pose === "hips")         armPair(-34, 34, 0, 0);
+    else if (pose === "behindhead")   armPair(4, -160, 0, Math.round(0.16*u));
+    else if (pose === "wring")        armPair(22, -22, 0, 0);
+    else if (pose === "crossed") {
+      html += `<div class="part arm" style="width:${torsoW*0.92}px;height:${Math.round(armH*0.5)}px;left:${cx - torsoW*0.46}px;bottom:${armBottom + Math.round(0.05*u)}px;background:${col};border-radius:30%;z-index:4;"></div>`;
+    }
+    else armPair(0, 0, 0, 0);
+
+    /* torso */
+    html += `<div class="part torso" style="width:${torsoW}px;height:${torsoH}px;left:${cx - torsoW/2}px;bottom:${torsoBottomY}px;background:${col};"></div>`;
+    if (c.suit || opts.suit) { /* tie pixel for suits */
+      html += `<div style="width:${Math.round(0.04*u)}px;height:${Math.round(torsoH*0.6)}px;left:${cx - Math.round(0.02*u)}px;bottom:${torsoTopY - Math.round(torsoH*0.62)}px;background:${DARK};z-index:5;"></div>`;
+    }
+    if (!isBack && !side) {
+      const nw = Math.round(headD*0.34), nh = Math.round(0.05*u);
+      html += `<div class="collar" style="width:${nw}px;height:${nh}px;left:${cx - nw/2}px;bottom:${torsoTopY - nh - 1}px;background:rgba(0,0,0,.28);border-radius:0 0 60% 60%;"></div>`;
+    }
+
+    /* head */
+    html += `<div class="part head" style="width:${headD}px;height:${headD}px;left:${headLeft}px;bottom:${headBottomY}px;background:${skin};${isBack ? "filter:brightness(.92);" : ""}"></div>`;
+
+    /* hair cap */
+    const cap = (w, h, by, radius) =>
+      `<div class="hairpc" style="width:${w}px;height:${h}px;left:${cx - w/2}px;bottom:${by}px;background:${F.hair};border-radius:${radius};"></div>`;
+    if (F.style === "bald")      html += cap(Math.round(headD*0.66), Math.round(headD*0.20), headTopY - Math.round(headD*0.22), "50% 50% 14% 14%");
+    else if (F.style === "messy")html += cap(Math.round(headD*0.94), Math.round(headD*0.46), headTopY - Math.round(headD*0.42), "60% 50% 35% 30% / 70% 65% 30% 30%");
+    else if (F.style === "neat") html += cap(Math.round(headD*0.92), Math.round(headD*0.40), headTopY - Math.round(headD*0.36), "55% 55% 20% 40%");
+    else if (F.style === "long") html += cap(Math.round(headD*0.98), Math.round(headD*0.46), headTopY - Math.round(headD*0.40), "55% 55% 40% 40%");
+    else                         html += cap(Math.round(headD*0.9),  Math.round(headD*0.40), headTopY - Math.round(headD*0.34), "55% 55% 30% 30%");
+
+    /* face */
+    if (!isBack && !opts.hideFace) {
+      const eyeBase = Math.max(4, Math.round(0.085 * u));
+      let exL = 0.34, exR = 0.66;
+      if (side === "right") { exL = 0.50; exR = 0.74; }
+      if (side === "left")  { exL = 0.26; exR = 0.50; }
+      const eyeY = 0.50;
+      const eyeStyle = opts.eyes || F.eyes;
+
+      const drawEye = (fx) => {
+        if (eyeStyle === "closed" || eyeStyle === "sleepy") {
+          const w = Math.round(eyeBase*1.4), h = Math.max(2, Math.round(eyeBase*0.42));
+          return `<div class="eye" style="width:${w}px;height:${h}px;border-radius:40%;left:${px(fx)-w/2}px;bottom:${py(eyeY)-h/2}px;"></div>`;
+        }
+        if (eyeStyle === "happy") {
+          const w = Math.round(eyeBase*1.5), h = Math.round(eyeBase*0.9);
+          return `<div class="eye" style="width:${w}px;height:${h}px;background:transparent;border:3px solid ${DARK};border-bottom:none;border-radius:80% 80% 0 0;left:${px(fx)-w/2}px;bottom:${py(eyeY)-h/3}px;"></div>`;
+        }
+        if (eyeStyle === "heart") {
+          return `<div class="eye" style="background:transparent;left:${px(fx)-9}px;bottom:${py(eyeY)-6}px;">${glyphHTML("heart", 3, "var(--bds-neon-magenta)", "filter:drop-shadow(0 0 4px var(--bds-neon-magenta));")}</div>`;
+        }
+        if (eyeStyle === "wide") {
+          const d = Math.round(eyeBase*1.5);
+          return `<div class="eye" style="width:${d}px;height:${d}px;background:${skin};border:3px solid ${DARK};left:${px(fx)-d/2}px;bottom:${py(eyeY)-d/2}px;"></div>`;
+        }
+        const d = eyeStyle === "big" ? Math.round(eyeBase*1.25) : eyeBase;
+        return `<div class="eye" style="width:${d}px;height:${d}px;left:${px(fx)-d/2}px;bottom:${py(eyeY)-d/2}px;"></div>`;
+      };
+      html += drawEye(exL) + drawEye(exR);
+
+      if (F.woman && eyeStyle !== "heart") {
+        const lw = Math.max(3, Math.round(eyeBase*0.7)), lh = Math.max(2, Math.round(0.022*u));
+        html += `<div class="lash" style="width:${lw}px;height:${lh}px;left:${px(exL)-eyeBase*0.7}px;bottom:${py(eyeY)+eyeBase*0.45}px;transform:rotate(-24deg);border-radius:2px;"></div>`;
+        html += `<div class="lash" style="width:${lw}px;height:${lh}px;left:${px(exR)+eyeBase*0.0}px;bottom:${py(eyeY)+eyeBase*0.45}px;transform:rotate(24deg);border-radius:2px;"></div>`;
+      }
+
+      const brows = opts.brows !== undefined ? opts.brows : F.brows;
+      if (brows) {
+        const bw = Math.round(headD*0.16), bh = Math.max(2, Math.round(0.028*u));
+        const browY = 0.34;
+        let rotL = 0, rotR = 0;
+        if (brows === "worried") { rotL = 16; rotR = -16; }
+        else if (brows === "stern") { rotL = -15; rotR = 15; }
+        html += `<div class="brow" style="width:${bw}px;height:${bh}px;background:${F.hair};left:${px(exL)-bw/2}px;bottom:${py(browY)}px;transform:rotate(${rotL}deg);"></div>`;
+        html += `<div class="brow" style="width:${bw}px;height:${bh}px;background:${F.hair};left:${px(exR)-bw/2}px;bottom:${py(browY)}px;transform:rotate(${rotR}deg);"></div>`;
+      }
+
+      if (F.glasses) {
+        const gd = Math.round(eyeBase*2.0);
+        html += `<div class="glasses" style="width:${gd}px;height:${Math.round(gd*0.86)}px;left:${px(exL)-gd/2}px;bottom:${py(eyeY)-gd*0.43}px;"></div>`;
+        html += `<div class="glasses" style="width:${gd}px;height:${Math.round(gd*0.86)}px;left:${px(exR)-gd/2}px;bottom:${py(eyeY)-gd*0.43}px;"></div>`;
+        html += `<div class="bridge" style="width:${px(exR)-px(exL)-gd}px;height:3px;left:${px(exL)+gd/2}px;bottom:${py(eyeY)}px;"></div>`;
+      }
+
+      /* mouth */
+      const mcx = px(0.5);
+      const mouth = opts.mouth || (state === "talk" ? "open" : F.mouth);
+      const my = 0.72;
+      if (mouth === "open") {
+        const mw = Math.round(headD*0.22), mh = Math.round(headD*0.16);
+        html += `<div class="mouth" style="width:${mw}px;height:${mh}px;left:${mcx-mw/2}px;bottom:${py(0.74)-mh/2}px;background:${DARK};border-radius:45%;transform-origin:center;"></div>`;
+      } else if (mouth === "smile") {
+        const mw = Math.round(headD*0.24), mh = Math.round(headD*0.12);
+        html += `<div class="mouth" style="width:${mw}px;height:${mh}px;left:${mcx-mw/2}px;bottom:${py(my)-mh}px;border:3px solid ${DARK};border-top:none;background:transparent;border-radius:0 0 80% 80%;"></div>`;
+      } else if (mouth === "frown") {
+        const mw = Math.round(headD*0.24), mh = Math.round(headD*0.12);
+        html += `<div class="mouth" style="width:${mw}px;height:${mh}px;left:${mcx-mw/2}px;bottom:${py(my)-mh/2}px;border:3px solid ${DARK};border-bottom:none;background:transparent;border-radius:80% 80% 0 0;"></div>`;
+      } else if (mouth === "worried") {
+        const mw = Math.round(headD*0.16), mh = Math.round(headD*0.13);
+        html += `<div class="mouth" style="width:${mw}px;height:${mh}px;left:${mcx-mw/2}px;bottom:${py(my)-mh/2}px;background:${DARK};border-radius:48%;"></div>`;
+      } else if (mouth === "smirk") {
+        const mw = Math.round(headD*0.22), mh = Math.max(3, Math.round(0.03*u));
+        html += `<div class="mouth" style="width:${mw}px;height:${mh}px;left:${mcx-mw/2+Math.round(headD*0.04)}px;bottom:${py(my)}px;background:${DARK};border-radius:3px;transform:rotate(-12deg);"></div>`;
+      } else if (mouth === "wavy") {
+        const mw = Math.round(headD*0.07);
+        for (let i = 0; i < 3; i++) {
+          html += `<div class="mouth" style="width:${mw}px;height:3px;left:${mcx-mw*1.5+i*mw}px;bottom:${py(my)+(i%2?2:0)}px;background:${DARK};"></div>`;
+        }
+      } else if (mouth === "flat") {
+        const mw = Math.round(headD*0.22), mh = Math.max(2, Math.round(0.025*u));
+        html += `<div class="mouth" style="width:${mw}px;height:${mh}px;left:${mcx-mw/2}px;bottom:${py(my)}px;background:${DARK};border-radius:2px;"></div>`;
+      } else {
+        const mw = Math.round(headD*0.12), mh = Math.max(2, Math.round(0.025*u));
+        html += `<div class="mouth" style="width:${mw}px;height:${mh}px;left:${mcx-mw/2}px;bottom:${py(my)}px;background:${DARK};border-radius:2px;"></div>`;
+      }
+
+      if (opts.blush) {
+        const bd = Math.round(headD*0.14);
+        html += `<div class="blush" style="width:${bd}px;height:${Math.round(bd*0.55)}px;left:${px(0.22)}px;bottom:${py(0.66)}px;background:var(--bds-brad);"></div>`;
+        html += `<div class="blush" style="width:${bd}px;height:${Math.round(bd*0.55)}px;left:${px(0.70)}px;bottom:${py(0.66)}px;background:var(--bds-brad);"></div>`;
+      }
+      if (opts.sweat || (F.sweat && (state === "crisis"))) {
+        const sw = Math.round(0.05*u), sh = Math.round(0.07*u);
+        html += `<div class="sweat" style="width:${sw}px;height:${sh}px;left:${px(0.84)}px;bottom:${py(0.30)}px;"></div>`;
+      }
+      if (opts.tears) {
+        html += `<div class="tearpx" style="position:absolute;left:${px(0.30)}px;bottom:${py(0.62)}px;z-index:9;">${glyphHTML("drop", 2, "var(--bds-derek)", "filter:drop-shadow(0 0 3px var(--bds-derek));")}</div>`;
+        html += `<div class="tearpx" style="position:absolute;left:${px(0.66)}px;bottom:${py(0.64)}px;z-index:9;">${glyphHTML("drop", 2, "var(--bds-derek)", "filter:drop-shadow(0 0 3px var(--bds-derek));")}</div>`;
+      }
+    }
+
+    /* above-head extras */
+    if (opts.heartAbove) {
+      html += `<div style="position:absolute;left:${cx + Math.round(headD*0.18)}px;bottom:${headTopY + 6}px;z-index:10;">${glyphHTML("heart", 3, "var(--bds-neon-magenta)", "filter:drop-shadow(0 0 5px var(--bds-neon-magenta));")}</div>`;
+    }
+    if (opts.zzz) {
+      for (let i = 0; i < 3; i++) {
+        html += `<div class="zpx" style="position:absolute;left:${cx + Math.round(headD*0.34) + i*10}px;bottom:${headTopY - 6 + i*9}px;z-index:10;animation-delay:${i*0.8}s;">${glyphHTML("z", 2, "var(--bds-grey)", "")}</div>`;
+      }
+    }
+    if (opts.sweatDropAbove) {
+      html += `<div style="position:absolute;left:${px(0.86)}px;bottom:${headTopY - 4}px;z-index:10;">${glyphHTML("drop", 3, "var(--bds-stacey)", "filter:drop-shadow(0 0 4px var(--bds-stacey));")}</div>`;
+    }
+    if (state === "crisis" && !opts.noBubble) {
+      html += `<div style="position:absolute;left:${cx + Math.round(headD*0.20)}px;bottom:${headTopY - 2}px;z-index:10;width:28px;height:28px;border-radius:8px;background:var(--bds-white);border:3px solid ${DARK};display:flex;align-items:center;justify-content:center;font-family:var(--font-display);font-size:13px;color:var(--bds-danger);box-shadow:0 0 12px rgba(255,90,60,.6);">!</div>`;
+    }
+
+    el.innerHTML = html;
+
+    /* animation classes */
+    if (opts.anim) opts.anim.split(" ").forEach(cl => cl && el.classList.add(cl));
+    else if (state === "idle") {
+      if (c.key === "DEREK") { /* still */ }
+      else el.classList.add("a-idle");
+    } else if (["down","up","left","right"].includes(state)) {
+      el.classList.add("a-walk","a-bob");
+      el.style.setProperty("--spd", c.walk);
+    } else if (state === "crisis") {
+      el.classList.add(c.key === "DEREK" ? "a-rise" : "a-crisis");
+    } else if (state === "talk") {
+      el.classList.add("a-mouth");
+    }
+    return el;
+  }
+
+  /* ---------- compact naturalistic 3/4 person (28x34 box) ----------
+     Shared body for floor sprites. Front-facing (or back when facing up),
+     skin + hair + office shirt — matches the warmlight Office Floor cast.
+     opts: { skin, hair, shirt, pants, back, style, glasses, streak, sweat,
+             eyes ('sleepy'|'big'|...), mouth ('smile'|'smirk'|'worried'|...) } */
+  function personHTML(o, ink) {
+    const skin = o.skin || "#f0c8a4", hair = o.hair || "#3a2a18",
+          shirt = o.shirt || "var(--bds-white)", pants = o.pants || "#2c2b3a",
+          style = o.style || "short", back = o.back;
+    const R = (x, y, w, h, bg, ex) => `<i style="left:${x}px;top:${y}px;width:${w}px;height:${h}px;background:${bg};${ex || ""}"></i>`;
+    const RC = (cls, x, y, w, h, bg, ex) => `<i class="${cls}" style="left:${x}px;top:${y}px;width:${w}px;height:${h}px;background:${bg};${ex || ""}"></i>`;
+    const O = `box-shadow:0 0 0 2px ${ink};`;
+    let h = "";
+    // legs + shoes — each leg shares its class with its shoe so they step as one
+    h += RC("fl-leg-l", 7, 25, 5, 8, pants, O) + RC("fl-leg-r", 14, 25, 5, 8, pants, O);
+    h += RC("fl-leg-l", 6, 31, 7, 3, "#26242f") + RC("fl-leg-r", 13, 31, 7, 3, "#26242f");
+    // arms + hands — each arm shares its class with its hand so they swing as one
+    h += RC("fl-arm-l", 0, 14, 4, 10, shirt, O) + RC("fl-arm-r", 22, 14, 4, 10, shirt, O);
+    h += RC("fl-arm-l", 0, 22, 4, 3, skin) + RC("fl-arm-r", 22, 22, 4, 3, skin);
+    // torso
+    h += R(4, 13, 18, 14, shirt, O + "border-radius:5px 5px 2px 2px;");
+    if (o.tie && !back) h += R(12, 14, 3, 10, o.tie);
+    h += R(11, 11, 4, 4, skin); // neck
+    // head
+    h += R(5, 0, 16, 14, skin, O + "border-radius:46% 46% 44% 44%;z-index:2;");
+    // hair
+    if (style === "bald") h += R(7, -1, 12, 5, hair, O + "border-radius:50% 50% 12% 12%;z-index:3;");
+    else if (style === "long") {
+      h += R(3, 1, 4, 15, hair, O + "border-radius:50% 20% 30% 60%;z-index:1;") + R(19, 1, 4, 15, hair, O + "border-radius:20% 50% 60% 30%;z-index:1;");
+      h += R(4, -2, 18, 8, hair, O + "border-radius:55% 55% 30% 30%;z-index:3;");
+      if (o.streak) h += R(18, 0, 4, 12, o.streak, "z-index:4;border-radius:30% 50% 60% 30%;");
+    } else if (style === "messy") h += R(3, -3, 20, 9, hair, O + "border-radius:60% 50% 40% 40% / 70% 65% 30% 30%;z-index:3;");
+    else h += R(4, -2, 18, 8, hair, O + "border-radius:55% 55% 25% 35%;z-index:3;");
+    if (back) {
+      // back of head — fill hair lower, no face
+      h += R(5, 2, 16, 10, hair, "z-index:3;border-radius:40% 40% 46% 46%;");
+    } else {
+      // eyes — sleepy reads as half-closed lines, big for the anxious ones
+      if (o.eyes === "sleepy") {
+        h += R(9, 7, 3, 1, ink, "z-index:4;border-radius:1px;") + R(14, 7, 3, 1, ink, "z-index:4;border-radius:1px;");
+      } else {
+        const eh = o.eyes === "big" ? 4 : 3;
+        h += R(9, 5, 2, eh, ink, "z-index:4;border-radius:1px;") + R(15, 5, 2, eh, ink, "z-index:4;border-radius:1px;");
+      }
+      if (o.glasses) {
+        h += R(7, 4, 5, 5, "transparent", "z-index:5;border:2px solid " + ink + ";border-radius:2px;") + R(14, 4, 5, 5, "transparent", "z-index:5;border:2px solid " + ink + ";border-radius:2px;") + R(12, 6, 2, 2, ink, "z-index:5;");
+      }
+      // mouth — a few legible expressions that still read at 16px
+      const mth = o.mouth;
+      if (mth === "smile") h += R(10, 10, 6, 3, "transparent", "z-index:4;border:2px solid rgba(120,40,30,.6);border-top:none;border-radius:0 0 70% 70%;");
+      else if (mth === "smirk") h += R(11, 10, 5, 2, "rgba(120,40,30,.6)", "z-index:4;border-radius:2px;transform:rotate(-13deg);");
+      else if (mth === "worried") h += R(11, 9, 3, 3, "rgba(120,40,30,.55)", "z-index:4;border-radius:50%;");
+      else h += R(11, 10, 4, 2, "rgba(120,40,30,.5)", "z-index:4;border-radius:2px;");
+      if (o.sweat) h += R(18, 3, 3, 4, "#7fc6e8", "z-index:6;border-radius:60% 60% 50% 50%;box-shadow:0 0 4px #7fc6e8;");
+    }
+    return h;
+  }
+
+  /* ---------- top-down floor sprite (warmlight 3/4 person) ----------
+     Back-compatible API. `color` becomes the shirt; identity is kept via
+     the shirt + hair. opts: { color, hair, skin, pose, dim, facing, scale,
+     still, glasses, streak, style, sweat } */
+  function topSprite(opts) {
+    opts = opts || {};
+    // pass who:'brad' to inherit that character's colour + face traits; explicit
+    // color/hair/style/etc. still override (back-compatible).
+    const c = opts.who && CHARS[opts.who] ? CHARS[opts.who] : null;
+    const f = c ? c.face : {};
+    const el = document.createElement("div");
+    el.className = "bds-top-sprite";
+    el.style.width = "26px"; el.style.height = "34px";
+    const anims = { idle: "a-top-idle", walk: "a-top-walk", shake: "a-top-shake" };
+    const pose = opts.pose;
+    if (!opts.still && anims[pose]) el.classList.add(anims[pose]);
+    else if (!opts.still && (pose == null || pose === "idle")) el.classList.add("a-top-idle");
+    // per-character walk cadence (brad frantic, derek plodding)
+    el.style.setProperty("--spd", opts.walk || (c && c.walk) || ".5s");
+    let tf = "";
+    if (pose === "lean") tf = "rotate(-8deg)";
+    else if (pose === "slump") tf = "rotate(6deg) translateY(3px)";
+    if (opts.scale) tf += ` scale(${opts.scale})`;
+    if (tf) { el.style.transform = tf; el.style.transformOrigin = "50% 100%"; }
+    if (opts.dim) el.style.filter = "brightness(.6) saturate(.7)";
+    el.innerHTML = personHTML({
+      skin: opts.skin,
+      hair: opts.hair || f.hair,
+      shirt: opts.color || (c ? `var(${c.color})` : "var(--bds-white)"),
+      pants: opts.pants, back: opts.facing === "up",
+      style: opts.style || f.style,
+      glasses: opts.glasses != null ? opts.glasses : f.glasses,
+      streak: opts.streak || f.streak,
+      eyes: opts.eyes || f.eyes,
+      mouth: opts.mouth || f.mouth,
+      sweat: opts.sweat,   // sweat is a transient state, not identity — stays explicit
+      tie: opts.tie,
+    }, "var(--bds-void)");
+    return el;
+  }
+
+  /* top-down desk with monitor */
+  function desk(opts) {
+    opts = opts || {};
+    const el = document.createElement("div");
+    el.style.cssText = "position:absolute;width:46px;height:22px;left:-23px;top:14px;background:#5a4326;border:2px solid #3a2b16;z-index:4;box-shadow:inset 0 3px 0 #6e542f, inset 0 -3px 0 #3f2f19;";
+    const mon = document.createElement("div");
+    mon.style.cssText = `position:absolute;left:50%;top:-9px;transform:translateX(-50%);width:18px;height:12px;background:${opts.dark ? "#0a0c14" : "#10131f"};border:2px solid #2a2f44;${opts.dark ? "" : "box-shadow:0 0 6px rgba(80,140,255,.35);"}`;
+    el.appendChild(mon);
+    return el;
+  }
+
+  /* name tag under a floor sprite */
+  function tag(text, color, opts) {
+    opts = opts || {};
+    const el = document.createElement("div");
+    el.style.cssText = `position:absolute;left:50%;top:${opts.top != null ? opts.top : 34}px;transform:translateX(-50%);font-family:var(--font-display);font-size:6px;letter-spacing:1px;color:${color};text-shadow:${opts.glow === false ? "1px 1px 0 var(--bds-void)" : `1px 1px 0 var(--bds-void), 0 0 6px ${color}`};white-space:nowrap;z-index:5;`;
+    el.textContent = text;
+    return el;
+  }
+
+  /* zero-size anchored station */
+  function station(x, y) {
+    const el = document.createElement("div");
+    el.style.cssText = `position:absolute;left:${x}px;top:${y}px;width:0;height:0;z-index:5;`;
+    for (let i = 2; i < arguments.length; i++) if (arguments[i]) el.appendChild(arguments[i]);
+    return el;
+  }
+
+  window.BDSChibi = { CHARS, chibi, topSprite, personHTML, desk, tag, station, pixelGlyph, glyphHTML, GLYPHS };
+})();

static/js/comic.js

@@ -0,0 +1,60 @@
+// comic.js — centered comic-panel overlay for crisis beats.
+//
+// Shows a wordless FLUX illustration with a UI-rendered caption above it
+// (FLUX renders garbled text, so all words live in the crisp caption, not the
+// picture). When there is no image (FLUX unavailable / failed / timed out / not
+// yet ready), it does NOTHING and calls onDone() straight away — the fallback
+// is simply no overlay, and the normal dialogue opens as usual.
+import { G } from "./state.js";
+import { sfx } from "./audio.js";
+
+let dismiss = null; // active dismiss handler while a comic is showing
+
+function escapeHtml(s) {
+  return String(s).replace(/[&<>"']/g, (c) => ({
+    "&": "&amp;", "<": "&lt;", ">": "&gt;", '"': "&quot;", "'": "&#39;" }[c]));
+}
+
+export function isOpen() {
+  const el = G.els.comic;
+  return !!(el && !el.classList.contains("hidden"));
+}
+
+// imageB64: a base64 PNG string, or null/"" → skip the overlay entirely.
+// caption: optional text drawn above the picture.
+export function showComic(imageB64, caption, onDone) {
+  if (!imageB64) { onDone && onDone(); return; }
+  const el = G.els.comic;
+  const cap = caption && caption.trim()
+    ? `<div class="comic-caption">${escapeHtml(caption.trim())}</div>` : "";
+  el.innerHTML = `
+    <div class="comic-frame">
+      ${cap}
+      <img class="comic-img" alt="" src="data:image/png;base64,${imageB64}">
+      <div class="comic-hint">CLICK or SPACE &#9654;</div>
+    </div>`;
+  el.classList.remove("hidden");
+  requestAnimationFrame(() => el.classList.add("comic-in"));
+  sfx.comic();
+
+  let done = false;
+  const timer = setTimeout(() => dismiss && dismiss(), 7000); // auto-advance
+  dismiss = () => {
+    if (done) return;
+    done = true;
+    clearTimeout(timer);
+    el.classList.remove("comic-in");
+    el.classList.add("hidden");
+    el.innerHTML = "";
+    el.removeEventListener("click", dismiss);
+    dismiss = null;
+    onDone && onDone();
+  };
+  el.addEventListener("click", dismiss);
+}
+
+// called by the SPACE/interact handler in main.js while a comic is showing
+export function dismissComic() {
+  if (dismiss) { dismiss(); return true; }
+  return false;
+}

static/js/dialogue.js

@@ -0,0 +1,355 @@
+// dialogue box: crisis lifecycle + presentation variant (UI_UX.md §5 §6)
+import { G } from "./state.js";
+import { charColor, crisisPortrait, outcomePortrait } from "./sprites.js";
+import { escapeHtml } from "./papertrail.js";
+import { setTyping } from "./input.js";
+import { sfx } from "./audio.js";
+
+const NPC_TITLES = {
+  brad: "SENIOR ACCOUNT EXECUTIVE", stacey: "ACCOUNT MANAGER",
+  kevin: "DATA & INSIGHTS LEAD", janet: "HEAD OF MARKETING",
+  derek: "SENIOR STRATEGIC CONSULTANT",
+};
+
+let current = null; // {mode, onRespond, stage}
+
+export function stage() { return current ? current.stage : null; }
+
+// ---- typewriter: dialog-game text reveal, click anywhere to complete ----
+let typer = null;
+
+function finishTyping() {
+  if (!typer) return;
+  clearInterval(typer.id);
+  typer.el.textContent = typer.text;
+  typer = null;
+}
+
+function typewrite(el, text) {
+  finishTyping();
+  if (!el) return;
+  if (window.matchMedia("(prefers-reduced-motion: reduce)").matches) {
+    el.textContent = text;
+    return;
+  }
+  // 2 chars per tick at ~60fps ≈ 120 chars/s; long text capped at ~3.5s
+  const step = Math.max(2, Math.ceil(text.length / 200));
+  let i = 0;
+  el.textContent = "";
+  const id = setInterval(() => {
+    i += step;
+    el.textContent = text.slice(0, i);
+    if (i < text.length) sfx.type(); // soft wooden tick (rate-limited inside)
+    else { clearInterval(id); typer = null; }
+  }, 16);
+  typer = { id, el, text };
+}
+
+// clicking the box completes the reveal (buttons still work normally)
+document.addEventListener("click", (e) => {
+  if (typer && e.target.closest("#dialogue")) finishTyping();
+});
+
+function box() { return G.els.dialogue; }
+
+function show(html, frameClass = "") {
+  const el = box();
+  el.className = frameClass;
+  el.innerHTML = html;
+  el.classList.remove("hidden", "closing");
+  G.dialogueOpen = true;
+}
+
+export function close() {
+  const el = box();
+  el.classList.add("closing");
+  setTyping(false);
+  sfx.close();
+  G.dialogueOpen = false;
+  current = null;
+  setTimeout(() => { el.classList.add("hidden"); el.classList.remove("closing"); }, 240);
+}
+
+function bindInput(onRespond) {
+  const input = box().querySelector(".dlg-input");
+  const send = box().querySelector(".btn-send");
+  if (!input) return;
+  input.addEventListener("focus", () => setTyping(true));
+  input.addEventListener("blur", () => setTyping(false));
+  input.addEventListener("keydown", (e) => {
+    if (e.key === "Enter" && input.value.trim()) {
+      e.preventDefault(); onRespond("custom", input.value.trim());
+    }
+    e.stopPropagation();
+  });
+  if (send) send.addEventListener("click", () => {
+    if (input.value.trim()) onRespond("custom", input.value.trim());
+  });
+  setTimeout(() => input.focus(), 350);
+}
+
+function inputRowHtml(placeholder) {
+  return `<div class="dlg-inputrow">
+    <input class="dlg-input" maxlength="400"
+           placeholder="${placeholder || "or type your own response..."}">
+    <button class="btn-send">SEND &#9654;</button>
+  </div>`;
+}
+
+// ------------------------------------------------------------------ crisis
+
+export function openCrisis(event, onRespond) {
+  current = { mode: "crisis", onRespond, stage: "question" };
+  const npcId = event.affected_npc !== "player" ? event.affected_npc : null;
+  const color = npcId ? charColor(npcId) : "var(--bds-neon-cyan)";
+  const isBribe = event.special === "bribery";
+  const isRomance = event.special === "romance";
+  const labels = isBribe ? ["THE TEMPTING ONE", "THE PRINCIPLED ONE"]
+    : isRomance ? ["‹♥› LEAN IN", "KEEP IT PROFESSIONAL"]
+    : ["THE STUPID ONE", "THE CURSED ONE"];
+  const header = npcId
+    ? `<div class="dlg-head">
+         <div class="dlg-sprite" data-portrait="${npcId}"></div>
+         <div><span class="dlg-name">${npcId.toUpperCase()}</span>
+         <span class="dlg-title">${NPC_TITLES[npcId]}</span></div>
+       </div>`
+    : `<div class="dlg-head"><div>
+         <span class="dlg-name" style="color:${color}">&gt; INCOMING</span>
+         <span class="dlg-title">VELOURA INTERNAL SYSTEMS</span></div></div>`;
+
+  show(`
+    ${header}
+    <div class="dlg-headline">${escapeHtml(event.headline).toUpperCase()}</div>
+    <div class="dlg-body" data-typed></div>
+    <div class="dlg-options">
+      <button class="dlg-option a"><span class="opt-label">[1] ${labels[0]}</span>
+        ${escapeHtml(event.option_a)}</button>
+      <button class="dlg-option b"><span class="opt-label">[2] ${labels[1]}</span>
+        ${escapeHtml(event.option_b)}</button>
+    </div>
+    <div class="dlg-urgency">! ${escapeHtml(event.urgency)}</div>
+    ${inputRowHtml(isBribe ? "or make a counter-offer..."
+      : isRomance ? "...or say it in your own words" : "")}
+  `);
+  box().style.setProperty("--npc-color", color);
+  sfx.open();
+
+  if (npcId) {
+    const slot = box().querySelector("[data-portrait]");
+    slot.appendChild(crisisPortrait(npcId)); // the designed chibi, in character
+  }
+  typewrite(box().querySelector("[data-typed]"), event.intro);
+  box().querySelector(".dlg-option.a").addEventListener("click",
+    () => onRespond("option_a", ""));
+  box().querySelector(".dlg-option.b").addEventListener("click",
+    () => onRespond("option_b", ""));
+  bindInput(onRespond);
+}
+
+export function chooseOption(which) {
+  // keyboard 1/2 shortcut routed from main.js
+  if (!current || !G.dialogueOpen) return;
+  const btn = box().querySelector(which === "a" ? ".dlg-option.a" : ".dlg-option.b");
+  if (btn) btn.click();
+}
+
+export function showThinking(npcId) {
+  if (current) current.stage = "thinking";
+  setTyping(false);
+  const name = npcId ? npcId : "the office";
+  const body = box();
+  const zone = document.createElement("div");
+  zone.className = "dlg-thinking";
+  zone.innerHTML = `&gt; ${name} is thinking<span class="dots"></span>`;
+  // replace interactive zones but keep the header + body text
+  body.querySelectorAll(".dlg-options,.dlg-quick,.dlg-inputrow,.dlg-urgency")
+    .forEach((n) => n.remove());
+  body.appendChild(zone);
+}
+
+export function showAftermath(outcome, youSaid, onNext) {
+  if (current) current.stage = "aftermath";
+  const el = box();
+  const color = outcome.npc_id ? charColor(outcome.npc_id) : "var(--bds-neon-cyan)";
+  el.style.setProperty("--npc-color", color);
+  // the portrait reacts to the outcome (designed chibi expression set)
+  const slot = el.querySelector("[data-portrait]");
+  if (slot && outcome.npc_id) {
+    slot.innerHTML = "";
+    slot.appendChild(outcomePortrait(outcome.npc_id, outcome.animation));
+  }
+  const delta = outcome.revenue_delta;
+  const deltaTxt = delta === 0 ? "no revenue impact"
+    : `${delta > 0 ? "+" : "-"}$${Math.abs(delta).toLocaleString()}`;
+  el.querySelector(".dlg-thinking")?.remove();
+  el.querySelectorAll(".dlg-body,.dlg-headline").forEach((n) => n.remove());
+  const wrap = document.createElement("div");
+  wrap.innerHTML = `
+    <div class="dlg-after-you">YOU SAID: "${escapeHtml(youSaid).toUpperCase()}"</div>
+    <div class="dlg-after-react" data-typed></div>
+    <div class="dlg-after-conseq ${delta < 0 ? "down" : ""}">
+      &gt; ${escapeHtml(outcome.consequence)}
+      <span style="color:${delta >= 0 ? "var(--bds-neon-lime)" : "var(--bds-brad)"}">
+      [${deltaTxt}]</span></div>
+    ${outcome.salary_paid ? `<div class="dlg-after-you" style="color:var(--bds-neon-lime)">
+      &gt; salary advance arrived. +$1,000 pocket money [payday]</div>` : ""}
+    ${outcome.relationship_unlocked ? `<div class="dlg-after-you" style="color:#ffc73b">
+      &gt; something changed with ${outcome.npc_id}. [relationship deepened]</div>` : ""}
+    <button class="btn-next">NEXT &#9654;</button>`;
+  el.appendChild(wrap);
+  typewrite(wrap.querySelector("[data-typed]"), outcome.npc_reaction);
+  el.querySelector(".btn-next").addEventListener("click", onNext);
+}
+
+// -------------------------------------------------------------------- idle
+
+export function openChat(npcId, npcLine, onReply, onClose) {
+  current = { mode: "chat", stage: "question" };
+  const color = charColor(npcId);
+  show(`
+    <div class="dlg-head">
+      <div class="dlg-sprite" data-portrait="${npcId}"></div>
+      <div><span class="dlg-name">${npcId.toUpperCase()}</span>
+      <span class="dlg-title">${NPC_TITLES[npcId]} — JUST CHATTING</span></div>
+    </div>
+    <div class="dlg-body" data-chatline></div>
+    <div class="dlg-inputrow">
+      <input class="dlg-input" maxlength="400" placeholder="say something back, or don't...">
+      <button class="btn-send">SEND &#9654;</button>
+    </div>
+    <button class="btn-quick" data-walkaway style="margin-top:8px;">WALK AWAY &#9654;</button>
+  `);
+  box().style.setProperty("--npc-color", color);
+  sfx.open();
+  const slot = box().querySelector("[data-portrait]");
+  slot.appendChild(crisisPortrait(npcId));
+  box().querySelector("[data-walkaway]").addEventListener("click", onClose);
+  typewrite(box().querySelector("[data-chatline]"), npcLine);
+  bindInput((rt, text) => onReply(text));
+}
+
+export function showChatReply(npcLine, relDelta, onClose) {
+  if (current) current.stage = "aftermath";
+  const el = box();
+  el.querySelector(".dlg-thinking")?.remove();
+  el.querySelectorAll(".dlg-inputrow,[data-walkaway]").forEach((n) => n.remove());
+  const line = el.querySelector("[data-chatline]");
+  if (line) typewrite(line, npcLine);
+  const wrap = document.createElement("div");
+  wrap.innerHTML = `
+    ${relDelta ? `<div class="dlg-after-you" style="color:${relDelta > 0
+      ? "var(--bds-neon-magenta)" : "var(--bds-grey)"}">
+      &gt; that ${relDelta > 0 ? "landed well" : "did not land"}</div>` : ""}
+    <button class="btn-next">BACK TO WORK &#9654;</button>`;
+  el.appendChild(wrap);
+  el.querySelector(".btn-next").addEventListener("click", onClose);
+}
+
+export function openEmail(email, onClose) {
+  current = { mode: "email", stage: "aftermath" };
+  const color = email.sender === "system"
+    ? "var(--bds-neon-cyan)" : charColor(email.sender);
+  show(`
+    <div class="dlg-head"><div>
+      <span class="dlg-name" style="color:${color}">FROM:
+        ${email.sender.toUpperCase()}@VELOURA</span>
+      <span class="dlg-title">SUBJECT: ${escapeHtml(email.subject)}</span>
+    </div></div>
+    <div class="dlg-body" data-typed></div>
+    <button class="btn-next">ARCHIVE FOREVER &#9654;</button>
+  `);
+  box().style.setProperty("--npc-color", color);
+  sfx.open();
+  typewrite(box().querySelector("[data-typed]"), email.body);
+  box().querySelector(".btn-next").addEventListener("click", onClose);
+}
+
+// -------------------------------------------------------------- presentation
+
+const TONE_LABEL = { warm: "WARM", neutral: "NEUTRAL",
+                     concerned: "CONCERNED", alarmed: "ALARMED" };
+
+export function openBoardRound(rd, onRespond) {
+  current = { mode: "presentation", onRespond, stage: "question" };
+  const dots = Array.from({ length: rd.total_rounds }, (_, i) =>
+    i < rd.round ? "&#9679;" : "&#9675;").join("");
+  const wrongSlide = rd.wrong_slide ? `
+    <div class="wrong-slide">
+      <div class="ws-photo">
+        ${["12,2", "70,4", "2,38", "78,34", "30,-6", "55,52"].map((p) => {
+          const [hx, hy] = p.split(",");
+          return `<span style="position:absolute;left:${hx}px;top:${hy}px;
+            color:var(--bds-neon-magenta);font-size:10px;
+            text-shadow:0 0 5px var(--bds-neon-magenta);">&#9829;</span>`;
+        }).join("")}
+      </div>
+      <div class="ws-title">"My Favourite"</div>
+      <div>the slide does not advance. everyone has seen it.</div>
+    </div>` : "";
+  const options = rd.input_only ? "" : `
+    <div class="dlg-options">
+      <button class="dlg-option a"><span class="opt-label">[1] OPTION A</span>
+        ${escapeHtml(rd.option_a)}</button>
+      <button class="dlg-option b"><span class="opt-label">[2] OPTION B</span>
+        ${escapeHtml(rd.option_b)}</button>
+    </div>`;
+  const inputNote = rd.input_only
+    ? `<div class="dlg-urgency">&gt; type your ${rd.round === 4 ? "answer" : "closing"}. no options here.</div>`
+    : "";
+  show(`
+    <div class="dlg-head">
+      <div><span class="dlg-name" style="color:#ffc73b">BOARD OF DIRECTORS &mdash;
+        ROUND ${rd.round} OF ${rd.total_rounds}</span>
+      <span class="dlg-title">TONE: ${TONE_LABEL[rd.board_tone]}</span></div>
+      <span class="round-dots">${dots}</span>
+      ${rd.round === 4 ? '<span class="board-badge">! HIGH SCRUTINY</span>' : ""}
+    </div>
+    ${wrongSlide}
+    <div class="dlg-body" data-typed></div>
+    ${options}
+    ${inputNote}
+    ${inputRowHtml(rd.input_only ? "speak. carefully." : "")}
+  `, "gold tone-" + rd.board_tone);
+  sfx.gold();
+  typewrite(box().querySelector("[data-typed]"), rd.board_dialogue);
+
+  if (rd.wrong_slide) {
+    sfx.wrongSlide(); // the cute "oops" sting
+    // "the photo" on the wrong slide is the player — the designed chibi
+    const photo = box().querySelector(".ws-photo");
+    if (photo) photo.prepend(crisisPortrait("player"));
+  }
+
+  if (!rd.input_only) {
+    box().querySelector(".dlg-option.a").addEventListener("click",
+      () => onRespond("option_a", rd.option_a));
+    box().querySelector(".dlg-option.b").addEventListener("click",
+      () => onRespond("option_b", rd.option_b));
+  }
+  bindInput(onRespond);
+}
+
+export function showPresentationOutcome(outcome, onClose) {
+  const delta = outcome.revenue_delta;
+  const deltaTxt = `${delta >= 0 ? "+" : "-"}$${Math.abs(delta).toLocaleString()}`;
+  show(`
+    <div class="dlg-head"><div>
+      <span class="dlg-name" style="color:#ffc73b">PRESENTATION COMPLETE</span>
+      <span class="dlg-title">THE BOARD HAS DELIBERATED</span></div></div>
+    <div class="dlg-body">
+      &gt; board assessment: ${outcome.score}/100<br>
+      &gt; revenue impact: <span style="color:${delta >= 0
+        ? "var(--bds-neon-lime)" : "var(--bds-brad)"}">${deltaTxt}</span><br>
+      ${outcome.budget_unlock ? "&gt; discretionary budget unlocked: +$" +
+        outcome.budget_unlock.toLocaleString() + "<br>" : ""}
+      ${outcome.board_scrutiny_public
+        ? "&gt; board scrutiny: HIGH [!]<br>" : ""}
+      &gt; new title: ${escapeHtml(outcome.boss_title).toUpperCase()}
+    </div>
+    <button class="btn-next">${outcome.final
+      ? "FACE THE QUARTERLY REVIEW &#9654;" : "RETURN TO THE FLOOR &#9654;"}</button>
+  `, "gold");
+  box().querySelector(".btn-next").addEventListener("click", onClose);
+}
+
+export function isOpen() { return G.dialogueOpen; }

static/js/effects.js

@@ -0,0 +1,75 @@
+// screen-level effects + the 17 animation trigger dispatcher
+import { G } from "./state.js";
+import { confettiBurst, heartFloat, moraleWave, revenueRain } from "./particles.js";
+import { sfx } from "./audio.js";
+
+export function dim(on) { G.els.dim.classList.toggle("hidden", !on); }
+
+export function redFlash() {
+  const el = G.els.flash;
+  el.classList.remove("on"); void el.offsetWidth; el.classList.add("on");
+}
+
+export function edgePulse(on) { G.els["edge-pulse"].classList.toggle("on", on); }
+
+export function hrStamp() {
+  const el = G.els.stamp;
+  el.classList.remove("hidden");
+  el.style.animation = "none"; void el.offsetWidth; el.style.animation = "";
+  sfx.stamp();
+  setTimeout(() => el.classList.add("hidden"), 950);
+}
+
+export function wipe(midCallback) {
+  const el = G.els.wipe;
+  el.classList.remove("go"); void el.offsetWidth; el.classList.add("go");
+  setTimeout(midCallback, 350); // swap scenes while fully covered
+  setTimeout(() => el.classList.remove("go"), 750);
+}
+
+export function fadeBlack(midCallback, hold = 1000) {
+  const el = G.els.wipe;
+  el.style.transition = "transform .01s";
+  el.style.transform = "translateX(0)";
+  el.style.opacity = 0;
+  el.animate([{ opacity: 0 }, { opacity: 1 }], { duration: 400, fill: "forwards" });
+  setTimeout(() => {
+    midCallback();
+    el.animate([{ opacity: 1 }, { opacity: 0 }],
+               { duration: 400, fill: "forwards" });
+    setTimeout(() => { el.style.transform = "translateX(-100%)";
+      el.style.opacity = 1; el.style.transition = ""; }, 450);
+  }, 400 + hold);
+}
+
+// the AI's animation enum → visual dispatch (ANIMATIONS.md)
+const NPC_ANIM_POSE = {
+  npc_happy: "idle", npc_angry: "shake", npc_confused: "idle",
+  npc_devastated: "headdown", npc_celebrating: "idle", npc_hiding: "slump",
+  npc_smug: "lean", npc_suspicious: "lean", npc_crying: "slump",
+  npc_grateful: "idle",
+};
+
+export function playOutcome(trigger, npcId, world) {
+  const npc = npcId && world.npcs[npcId];
+  switch (trigger) {
+    case "disaster_flash": redFlash(); sfx.disaster(); break;
+    case "revenue_rain": revenueRain(); sfx.moneyUp(); break;
+    case "heart_float":
+      if (npc) heartFloat(npc.x, npc.y - 44); sfx.gift(); break;
+    case "bribery_envelope": sfx.click(); break;
+    case "hr_stamp": hrStamp(); break;
+    case "morale_drop_wave": moraleWave(world.npcs); sfx.moneyDown(); break;
+    case "confetti_burst": confettiBurst(); sfx.win(); break;
+    default:
+      if (npc && NPC_ANIM_POSE[trigger]) {
+        npc.setPose(NPC_ANIM_POSE[trigger]);
+        if (trigger === "npc_celebrating" || trigger === "npc_happy") {
+          npc.sprite.animate(
+            [{ transform: "translateY(0)" }, { transform: "translateY(-6px)" },
+             { transform: "translateY(0)" }],
+            { duration: 320, iterations: 2, easing: "steps(3)" });
+        }
+      }
+  }
+}

static/js/hud.js

@@ -0,0 +1,75 @@
+// HUD: revenue bar (caps at 96% — the gag), boss title, counters, banner
+import { G } from "./state.js";
+
+const fmt = (n) => "$" + Math.abs(n).toLocaleString("en-US");
+
+let shownRevenue = 0;
+
+export function updateHud(state, animate = true) {
+  const els = G.els;
+  const target = state.target || 1_000_000;
+
+  // revenue number counts toward the real value
+  const to = state.revenue;
+  if (!animate) shownRevenue = to;
+  const step = () => {
+    const diff = to - shownRevenue;
+    if (Math.abs(diff) < 1000) shownRevenue = to;
+    else shownRevenue += Math.sign(diff) * Math.max(1000, Math.abs(diff) / 8 | 0);
+    els["rev-number"].textContent = fmt(shownRevenue);
+    if (shownRevenue !== to) requestAnimationFrame(step);
+  };
+  step();
+
+  // bar never quite fills: 96% cap per DESIGN_SYSTEM decisions log
+  const pct = Math.min(96, (state.revenue / target) * 100);
+  els["rev-fill"].style.width = pct + "%";
+
+  // color shifts against expected pace through the quarter
+  const expected = target * (Math.max(1, state.crisis_number) / 15);
+  const ratio = state.crisis_number <= 1 ? 1 : state.revenue / expected;
+  const cls = ratio >= 0.75 ? "" : ratio >= 0.4 ? "warn" : "crit";
+  els["rev-number"].className = cls;
+  els["rev-fill"].className = cls;
+
+  // boss title cross-fade
+  const bt = els["boss-title"];
+  const newTitle = (state.boss_title || "").toUpperCase();
+  if (bt.textContent !== newTitle) {
+    bt.style.opacity = 0;
+    setTimeout(() => { bt.textContent = newTitle; bt.style.opacity = 1; }, 250);
+  }
+
+  els["crisis-counter"].textContent =
+    `CRISES ${state.crisis_number}/${state.total_crises}`;
+  els["pocket"].textContent = `POCKET ${fmt(state.pocket_money)}`;
+  els["hr-badge"].classList.toggle("hidden", !state.hr_alert);
+}
+
+let bannerTimer = null;
+
+export function banner(text, cls = "", sticky = false) {
+  const el = G.els["hud-banner"];
+  clearTimeout(bannerTimer);
+  el.textContent = text;
+  el.className = cls;
+  el.classList.remove("hidden");
+  if (!sticky) bannerTimer = setTimeout(() => el.classList.add("hidden"), 4000);
+}
+
+export function clearBanner() {
+  clearTimeout(bannerTimer);
+  G.els["hud-banner"].classList.add("hidden");
+}
+
+export function revenueFloat(delta) {
+  const bar = document.getElementById("rev-bar");
+  const r = bar.getBoundingClientRect();
+  const el = document.createElement("div");
+  el.className = "float-text" + (delta < 0 ? " down" : "");
+  el.style.cssText = `position:fixed;left:${r.right + 10}px;top:${r.top}px;
+    color:${delta >= 0 ? "var(--bds-neon-lime)" : "var(--bds-brad)"};z-index:250;`;
+  el.textContent = (delta >= 0 ? "+" : "-") + fmt(delta);
+  document.body.appendChild(el);
+  setTimeout(() => el.remove(), 1700);
+}

static/js/input.js

@@ -0,0 +1,46 @@
+// keyboard + mouse input. GAMEPLAY_FLOW.md controls.
+export const keys = { up: false, down: false, left: false, right: false };
+const handlers = { interact: [], gift: [], escape: [], option: [], mute: [] };
+
+export function on(name, fn) { handlers[name].push(fn); }
+function fire(name, arg) { handlers[name].forEach((fn) => fn(arg)); }
+// touch controls fire the same handlers as the keyboard (see touch.js)
+export function emit(name, arg) { fire(name, arg); }
+
+const KEYMAP = {
+  KeyW: "up", ArrowUp: "up",
+  KeyS: "down", ArrowDown: "down",
+  KeyA: "left", ArrowLeft: "left",
+  KeyD: "right", ArrowRight: "right",
+};
+
+export let typingMode = false;
+export function setTyping(v) {
+  typingMode = v;
+  Object.keys(keys).forEach((k) => (keys[k] = false));
+}
+
+window.addEventListener("keydown", (e) => {
+  if (typingMode) return; // text input owns the keyboard
+  if (KEYMAP[e.code]) { keys[KEYMAP[e.code]] = true; e.preventDefault(); return; }
+  if (e.code === "Space" || e.code === "Enter") { fire("interact"); e.preventDefault(); }
+  else if (e.code === "KeyG") fire("gift");
+  else if (e.code === "Escape") fire("escape");
+  else if (e.code === "Digit1") fire("option", "a");
+  else if (e.code === "Digit2") fire("option", "b");
+  else if (e.code === "KeyM") fire("mute");
+});
+
+window.addEventListener("keyup", (e) => {
+  if (KEYMAP[e.code]) keys[KEYMAP[e.code]] = false;
+});
+
+// click-to-move: main.js registers the stage and receives world coords
+export function bindStageClick(stageEl, fn) {
+  stageEl.addEventListener("click", (e) => {
+    const r = stageEl.getBoundingClientRect();
+    const x = ((e.clientX - r.left) / r.width) * 640;
+    const y = ((e.clientY - r.top) / r.height) * 480;
+    fn(x, y);
+  });
+}

static/js/main.js

@@ -0,0 +1,684 @@
+// boot, fixed-timestep loop, phase machine, interactions (ARCHITECTURE.md D5)
+import * as api from "./api.js";
+import { G, cacheEls, setState } from "./state.js";
+import { keys, on, bindStageClick, typingMode } from "./input.js";
+import { drawFloor, SPOTS, NPC_SPOTS } from "./map.js";
+import { createPlayer } from "./player.js";
+import { createNpcs } from "./npcs.js";
+import { updateHud, banner, clearBanner, revenueFloat } from "./hud.js";
+import { renderTrail, resetTrail, escapeHtml } from "./papertrail.js";
+import * as dlg from "./dialogue.js";
+import * as comic from "./comic.js";
+import * as fx from "./effects.js";
+import { enterBoardroom, exitBoardroom } from "./boardroom.js";
+import { floatText, steam, confettiBurst, heartFloat } from "./particles.js";
+import { charColor, chibiInBox } from "./sprites.js";
+import { sfx } from "./audio.js";
+import { setupTouch } from "./touch.js";
+
+const ROAM_SECONDS = 20;
+const FIRST_CRISIS_SECONDS = 5;
+const INTERACT_DIST = 58; // must beat worst-case approach: blocked below a desk
+
+let player, world, ctx;
+let floorOpts = {};
+let inBoardroom = false;
+let worldObjects = { newspaper: null, envelope: null };
+
+// ----------------------------------------------------------------- helpers
+
+function fitStage() {
+  const wrap = G.els["stage-wrap"];
+  const scale = Math.min(wrap.clientWidth / 648, wrap.clientHeight / 488, 1.6);
+  G.els.stage.style.transform = `scale(${Math.max(scale, 0.5)})`;
+}
+
+function arrivalSpot(event) {
+  switch (event.arrival) {
+    case "newspaper": return SPOTS.newspaperLanding;
+    case "envelope": return SPOTS.playerDesk;
+    case "phone": return SPOTS.phone;
+    case "hr": return SPOTS.inbox;
+    case "boardroom": return SPOTS.boardroomDoor;
+    default: return NPC_SPOTS[event.affected_npc] || SPOTS.inbox;
+  }
+}
+
+function promptFor(event) {
+  switch (event.arrival) {
+    case "newspaper": return "SPACE — PICK UP";
+    case "envelope": return "SPACE — OPEN ENVELOPE";
+    case "phone": return "SPACE — ANSWER";
+    case "hr": return "SPACE — CHECK INBOX";
+    case "boardroom": return "ENTER — BOARDROOM";
+    default: return "SPACE — TALK";
+  }
+}
+
+let promptEl = null;
+function showPrompt(x, y, text, gold = false) {
+  if (!promptEl) {
+    promptEl = document.createElement("div");
+    promptEl.className = "prompt-box";
+    G.els.fx.appendChild(promptEl);
+  }
+  promptEl.className = "prompt-box" + (gold ? " gold" : "");
+  promptEl.style.left = `${x}px`;
+  promptEl.style.top = `${y - 64}px`;
+  // on touch there's no keyboard: the on-screen ACT/GIFT buttons do these
+  promptEl.textContent = document.body.classList.contains("touch")
+    ? text.replace(/SPACE|ENTER/g, "ACT").replace(/\bG\b/g, "GIFT")
+    : text;
+  promptEl.style.display = "block";
+}
+function hidePrompt() { if (promptEl) promptEl.style.display = "none"; }
+
+// --------------------------------------------------------- event arrivals
+
+function stageArrival(event) {
+  G.pendingEvent = event;
+  // kick off the setup comic now so FLUX renders during the walk to the NPC;
+  // it's purely decorative — if it isn't ready in time we just skip it.
+  G.setupComicImg = null;
+  if (event.image_prompt) {
+    api.comic(G.sessionId, event.image_prompt)
+      .then((r) => { G.setupComicImg = r.image_b64 || null; })
+      .catch(() => {});
+  }
+  switch (event.arrival) {
+    case "npc":
+      sfx.bubble();
+      world.showBubble(event.affected_npc, "danger");
+      banner(`${event.affected_npc.toUpperCase()} HAS A SITUATION`);
+      break;
+    case "npc_amber":
+      sfx.amberBubble();
+      world.showBubble(event.affected_npc, "amber");
+      banner("SOMETHING PERSONAL IS HAPPENING", "gold");
+      break;
+    case "npc_heart":
+      sfx.heart();
+      world.showBubble(event.affected_npc, "heart");
+      banner(`${event.affected_npc.toUpperCase()} WANTS A WORD...`, "gold");
+      break;
+    case "newspaper": {
+      sfx.newspaper();
+      banner("! THE PRESS HAS THE STORY", "red");
+      const np = document.createElement("div");
+      np.className = "newspaper falling";
+      np.style.left = `${SPOTS.newspaperLanding.x - 17}px`;
+      np.style.top = `${SPOTS.newspaperLanding.y - 12}px`;
+      np.textContent = "VELOURA EXEC DOES SOMETHING — sources say Brad";
+      G.els.world.appendChild(np);
+      worldObjects.newspaper = np;
+      world.npcs.brad.setPose("slump");
+      break;
+    }
+    case "envelope": {
+      sfx.envelope();
+      const env = document.createElement("div");
+      env.className = "envelope";
+      env.style.left = `${SPOTS.playerDesk.x + 8}px`;
+      env.style.top = `${SPOTS.playerDesk.y + 10}px`;
+      G.els.world.appendChild(env);
+      worldObjects.envelope = env;
+      banner("AN ENVELOPE HAS ARRIVED", "gold");
+      break;
+    }
+    case "phone":
+      floorOpts.phoneRing = true;
+      sfx.phoneRingStart();
+      banner("! CLIENT CALL INCOMING", "red");
+      break;
+    case "hr":
+      fx.hrStamp();
+      floorOpts.inboxLit = true;
+      banner("! HR WOULD LIKE A WORD", "red", true);
+      break;
+    case "boardroom":
+      floorOpts.doorGlow = true;
+      banner("THE BOARD AWAITS — ENTER THE BOARDROOM", "gold", true);
+      sfx.gold();
+      break;
+  }
+}
+
+function clearArrivalProps(event) {
+  world.clearBubbles();
+  floorOpts.phoneRing = false;
+  sfx.phoneRingStop();
+  floorOpts.inboxLit = false;
+  if (event && event.arrival === "newspaper" && worldObjects.newspaper) {
+    worldObjects.newspaper.className = "newspaper floor"; // stays. a reminder.
+    worldObjects.newspaper = null;
+  }
+  if (worldObjects.envelope) { worldObjects.envelope.remove();
+    worldObjects.envelope = null; }
+}
+
+// -------------------------------------------------------------- crisis flow
+
+async function fireNextEvent() {
+  if (G.busy || G.pendingEvent || dlg.isOpen()) return;
+  G.busy = true;
+  try {
+    const { event, state } = await api.nextEvent(G.sessionId);
+    setState(state);
+    updateHud(state);
+    if (event.kind === "review") { await showReview(); return; }
+    stageArrival(event);
+  } catch (err) {
+    console.error(err);
+    G.roamTimer = 6; // retry shortly
+  } finally {
+    G.busy = false;
+    fx.edgePulse(false);
+    G.telegraphed = false;
+  }
+}
+
+function openPendingEvent() {
+  const event = G.pendingEvent;
+  if (!event) return;
+  sfx.phoneRingStop(); // answered
+  if (event.kind === "presentation") { startPresentation(event); return; }
+  fx.dim(true);
+  player.frozen = true;
+  // setup comic (if FLUX finished during the walk) plays first, then dialogue
+  const setupImg = G.setupComicImg;
+  G.setupComicImg = null;
+  comic.showComic(setupImg, event.comic_caption, () => dlg.openCrisis(event, async (responseType, text) => {
+    if (G.busy) return;
+    G.busy = true;
+    const optLabel = event.special === "romance"
+      ? { option_a: "LEAN IN", option_b: "KEEP IT PROFESSIONAL" }
+      : event.special === "bribery"
+      ? { option_a: "ACCEPT", option_b: "DECLINE" }
+      : { option_a: "OPTION A", option_b: "OPTION B" };
+    const youSaid = text || optLabel[responseType] || responseType;
+    dlg.showThinking(event.affected_npc !== "player"
+      ? event.affected_npc : "the office");
+    const t0 = Date.now();
+    try {
+      const { outcome, state } = await api.respond(G.sessionId, responseType, text);
+      // fallbacks land fast — keep the thinking rhythm consistent (UI_UX §22)
+      const wait = Math.max(0, 1200 - (Date.now() - t0));
+      setTimeout(() => {
+        setState(state);
+        clearArrivalProps(event);
+        G.pendingEvent = null;
+        updateHud(state);
+        renderTrail(state.paper_trail);
+        if (outcome.revenue_delta !== 0) {
+          revenueFloat(outcome.revenue_delta);
+          (outcome.revenue_delta > 0 ? sfx.moneyUp : sfx.moneyDown)();
+        }
+        fx.playOutcome(outcome.animation, outcome.npc_id, world);
+        world.applyMoods(state.npc_moods);
+        floorOpts.gloomy = state.ambient === "gloomy";
+        const showAfter = () => dlg.showAftermath(outcome, youSaid, () => {
+          dlg.close();
+          fx.dim(false);
+          player.frozen = false;
+          startRoam();
+        });
+        // payoff comic: only exists after the outcome lands, so it renders now
+        // (thinking box stays up) and swaps to the aftermath when dismissed
+        if (outcome.image_prompt) {
+          api.comic(G.sessionId, outcome.image_prompt)
+            .then((r) => comic.showComic(r.image_b64, outcome.comic_caption, showAfter))
+            .catch(showAfter);
+        } else {
+          showAfter();
+        }
+        G.busy = false;
+      }, wait);
+    } catch (err) {
+      console.error(err);
+      G.busy = false;
+      dlg.close(); fx.dim(false); player.frozen = false; startRoam();
+    }
+  }));
+}
+
+function startRoam() {
+  clearBanner();
+  if (G.state && G.state.phase === "review") { showReview(); return; }
+  G.roamTimer = ROAM_SECONDS;
+  G.telegraphed = false;
+  G.idleRolled = false;
+  G.idleAt = ROAM_SECONDS - 6;
+  chattedNpcs.clear();
+}
+
+// -------------------------------------------------------- presentation flow
+
+async function startPresentation(event) {
+  G.pendingEvent = null; // consume — re-pressing SPACE must not re-enter
+  floorOpts.doorGlow = false;
+  clearBanner();
+  player.frozen = true;
+  G.busy = true;
+  try {
+    const { round_data, state } = await api.presentationRound(G.sessionId, "", "");
+    setState(state);
+    fx.wipe(() => {
+      inBoardroom = true;
+      G.els.world.style.visibility = "hidden";
+      enterBoardroom(round_data.presenting_npc, round_data.npc_state);
+      setTimeout(() => presentRound(round_data), 1200);
+    });
+  } catch (err) { console.error(err); player.frozen = false; }
+  G.busy = false;
+}
+
+function presentRound(rd) {
+  dlg.openBoardRound(rd, async (responseType, text) => {
+    if (G.busy) return;
+    G.busy = true;
+    dlg.showThinking("the board");
+    try {
+      const { round_data, state } = await api.presentationRound(
+        G.sessionId, responseType, text);
+      setState(state);
+      updateHud(state);
+      if (round_data.kind === "round") {
+        presentRound(round_data);
+      } else {
+        // outcome
+        renderTrail(state.paper_trail);
+        if (round_data.revenue_delta !== 0) revenueFloat(round_data.revenue_delta);
+        (round_data.revenue_delta >= 0 ? sfx.moneyUp : sfx.moneyDown)();
+        dlg.showPresentationOutcome(round_data, async () => {
+          dlg.close();
+          G.pendingEvent = null;
+          if (round_data.final) { await showReview(); return; }
+          fx.wipe(() => {
+            exitBoardroom();
+            inBoardroom = false;
+            G.els.world.style.visibility = "visible";
+            player.frozen = false;
+            world.applyMoods(G.state.npc_moods);
+            startRoam();
+          });
+        });
+      }
+    } catch (err) { console.error(err); }
+    G.busy = false;
+  });
+}
+
+// -------------------------------------------------------------- review flow
+
+const TIER_COLOR = {
+  hit_target: "var(--bds-neon-lime)", above_600k: "var(--bds-kevin)",
+  "300k_to_600k": "#ff9c3c", below_300k: "var(--bds-brad)",
+};
+const TIER_HEAD = {
+  hit_target: "THE GAME SHIPPED. SOMEHOW.",
+  above_600k: "THE BOARD IS NOT NOT IMPRESSED",
+  "300k_to_600k": "THE BOARD WANTS A CALL",
+  below_300k: "THE BOARD HAS DRAFTED SOMETHING",
+};
+
+async function showReview() {
+  dlg.close(); fx.dim(false);
+  let data;
+  try { ({ review: data } = await api.review(G.sessionId)); }
+  catch (err) { console.error(err); return; }
+  const el = G.els["review-screen"];
+  const color = TIER_COLOR[data.tier];
+  el.innerHTML = `
+    <div class="rv-card" style="--rv-color:${color}">
+      <div class="rv-head">Q3 QUARTERLY REVIEW</div>
+      <div class="rv-revenue" id="rv-count">$0</div>
+      <div class="rv-gap">${data.gap >= 0 ? "+" : "-"}$${Math.abs(data.gap)
+        .toLocaleString()} vs $1,000,000 target</div>
+      <div class="rv-line">${TIER_HEAD[data.tier]}</div>
+      <div class="rv-section">
+        <div class="rv-line">FINAL TITLE: <span class="rv-title">
+          ${escapeHtml(data.boss_title).toUpperCase()}</span></div>
+        <div class="rv-line">CRISES SURVIVED: ${data.crises_survived} ·
+          PRESS DISASTERS: ${data.press_disasters}</div>
+      </div>
+      <div class="rv-section">
+        <div class="rv-sec-head">THE QUARTER'S GREATEST HITS</div>
+        ${data.highlights.map((h) => `<div class="rv-line">
+          <span style="color:${h.npc === "board" ? "#ffc73b" : charColor(h.npc)}">
+          ${(h.npc || "?").toUpperCase()}</span> — ${escapeHtml(h.text)}</div>`).join("")}
+      </div>
+      <div class="rv-section">
+        <div class="rv-sec-head">THE BOARD'S VERDICT</div>
+        <div class="rv-verdict">${escapeHtml(data.verdict)}</div>
+      </div>
+      <button class="btn-cta" id="btn-again" style="margin-top:14px;">
+        PLAY AGAIN &#9654;</button>
+    </div>`;
+  sfx.musicStop(); // the office goes quiet for the verdict
+  fx.fadeBlack(() => {
+    el.classList.remove("hidden");
+    sfx.review();
+    // revenue count-up
+    const span = el.querySelector("#rv-count");
+    const total = data.final_revenue;
+    let cur = 0;
+    const tick = () => {
+      cur = Math.min(total, cur + Math.max(5000, total / 60 | 0));
+      span.textContent = "$" + cur.toLocaleString();
+      if (cur < total) requestAnimationFrame(tick);
+    };
+    tick();
+    if (data.tier === "hit_target") { confettiBurst(); setTimeout(() => sfx.win(), 500); }
+    else setTimeout(() => sfx.lose(data.tier), 600);
+  }, 800);
+  el.querySelector("#btn-again").addEventListener("click", () => location.reload());
+}
+
+// ------------------------------------------------------------ idle moments
+
+const chattedNpcs = new Set();
+
+async function rollIdleMoment() {
+  if (G.idleRolled || G.busy) return;
+  G.idleRolled = true;
+  try {
+    const { idle, state } = await api.idle(G.sessionId);
+    setState(state);
+    if (idle.kind === "banter") {
+      world.sayBubble(idle.npc_id, idle.line, 5200);
+    } else if (idle.kind === "eavesdrop") {
+      world.saySequence(idle.lines);
+    } else if (idle.kind === "email_waiting") {
+      floorOpts.inboxLit = true;
+      sfx.mail();
+      banner("YOU'VE GOT (INTERNAL) MAIL");
+    }
+  } catch (err) {
+    // cap hit or phase changed mid-flight — fine, stay quiet
+    if (err.status !== 409) console.error(err);
+  }
+}
+
+async function startChat(npcId) {
+  if (G.busy || chattedNpcs.has(npcId)) return;
+  G.busy = true;
+  player.frozen = true;
+  fx.dim(true);
+  try {
+    const { chat } = await api.chat(G.sessionId, npcId, "");
+    chattedNpcs.add(npcId);
+    dlg.openChat(npcId, chat.npc_line, async (text) => {
+      if (G.busy) return;
+      G.busy = true;
+      dlg.showThinking(npcId);
+      try {
+        const { chat: reply, state } = await api.chat(G.sessionId, npcId, text);
+        setState(state);
+        world.applyMoods(state.npc_moods);
+        dlg.showChatReply(reply.npc_line, reply.relationship_delta, endChat);
+        if (reply.relationship_delta) {
+          const npc = world.npcs[npcId];
+          floatText(npc.x, npc.y - 36,
+            (reply.relationship_delta > 0 ? "+" : "") + reply.relationship_delta,
+            reply.relationship_delta > 0
+              ? "var(--bds-neon-magenta)" : "var(--bds-grey)");
+        }
+      } catch (err) { console.error(err); endChat(); }
+      G.busy = false;
+    }, endChat);
+  } catch (err) {
+    if (err.status === 409) {
+      const npc = world.npcs[npcId];
+      floatText(npc.x, npc.y - 36, "...", "var(--bds-grey-dim)");
+    } else console.error(err);
+    fx.dim(false);
+    player.frozen = false;
+  }
+  G.busy = false;
+}
+
+function endChat() {
+  dlg.close();
+  fx.dim(false);
+  player.frozen = false;
+}
+
+async function openInboxEmail() {
+  if (G.busy) return;
+  try {
+    const { email, state } = await api.readEmail(G.sessionId);
+    setState(state);
+    floorOpts.inboxLit = false;
+    clearBanner();
+    player.frozen = true;
+    fx.dim(true);
+    dlg.openEmail(email, endChat);
+  } catch (err) { if (err.status !== 409) console.error(err); }
+}
+
+// ----------------------------------------------------------------- gifting
+
+function openGiftPanel(npcId) {
+  if (G.state.phase !== "free_roam" || G.pendingEvent) return;
+  const panel = G.els["gift-panel"];
+  const tiers = [["small", "FLOWERS", 200], ["medium", "LUNCH", 350],
+                 ["large", "GIFT CARD", 500]];
+  panel.style.setProperty("--npc-color", charColor(npcId));
+  panel.innerHTML = `
+    <div class="gift-head">GIFT FOR ${npcId.toUpperCase()}</div>
+    <div class="gift-balance">POCKET: $${G.state.pocket_money.toLocaleString()}
+      — this is YOUR money</div>
+    ${tiers.map(([tier, label, cost]) => `
+      <button class="gift-row" data-tier="${tier}"
+        ${G.state.pocket_money < cost ? "disabled" : ""}>
+        <span>${label}</span><span>$${cost}</span></button>`).join("")}
+    <button class="gift-cancel">ESC — NEVER MIND</button>`;
+  panel.classList.remove("hidden");
+  panel.querySelectorAll(".gift-row").forEach((b) =>
+    b.addEventListener("click", async () => {
+      panel.classList.add("hidden");
+      try {
+        const { result, state } = await api.gift(G.sessionId, npcId, b.dataset.tier);
+        setState(state); updateHud(state);
+        const npc = world.npcs[npcId];
+        fx.playOutcome("heart_float", npcId, world);
+        floatText(npc.x, npc.y - 30,
+          `+${result.relationship_delta}${result.halved ? " (again so soon?)" : ""}`,
+          "var(--bds-neon-magenta)");
+        if (result.unlocked) floatText(npc.x, npc.y - 46, "✓ something changed",
+          "#ffc73b");
+        world.applyMoods(state.npc_moods);
+      } catch (err) { console.error(err); }
+    }));
+  panel.querySelector(".gift-cancel").addEventListener("click",
+    () => panel.classList.add("hidden"));
+}
+
+async function buyCoffeeRound() {
+  if (G.state.pocket_money < 50) {
+    floatText(SPOTS.coffee.x, SPOTS.coffee.y - 20, "NO FUNDS", "var(--bds-brad)");
+    return;
+  }
+  try {
+    const { state } = await api.gift(G.sessionId, "brad", "coffee");
+    setState(state); updateHud(state);
+    floatText(SPOTS.coffee.x, SPOTS.coffee.y - 24, "TEAM COFFEE -$50",
+      "var(--bds-neon-lime)");
+    sfx.coffee();
+    world.applyMoods(state.npc_moods);
+  } catch (err) { console.error(err); }
+}
+
+// -------------------------------------------------------------- interaction
+
+function nearestInteraction() {
+  if (G.pendingEvent) {
+    const spot = arrivalSpot(G.pendingEvent);
+    if (player.distTo(spot) < INTERACT_DIST + (G.pendingEvent.kind ===
+        "presentation" ? 16 : 0))
+      return { kind: "event", spot, prompt: promptFor(G.pendingEvent),
+               gold: G.pendingEvent.kind === "presentation" };
+  }
+  if (G.state && G.state.phase === "free_roam" && !G.pendingEvent) {
+    if (G.state.email_waiting && player.distTo(SPOTS.inbox) < INTERACT_DIST)
+      return { kind: "email", spot: SPOTS.inbox, prompt: "SPACE — READ EMAIL" };
+    for (const [id, spot] of Object.entries(NPC_SPOTS))
+      if (player.distTo(spot) < INTERACT_DIST) {
+        const talked = chattedNpcs.has(id);
+        const parts = [];
+        if (!talked) parts.push("SPACE — TALK");
+        if (G.state.gift_available) parts.push("G — GIFT");
+        return { kind: "npc_idle", npcId: id, spot,
+                 prompt: parts.join(" / ") || "..." };
+      }
+    if (player.distTo(SPOTS.coffee) < INTERACT_DIST)
+      return { kind: "coffee", spot: SPOTS.coffee, prompt: "SPACE — TEAM COFFEE $50" };
+  }
+  return null;
+}
+
+function handleInteract() {
+  if (comic.isOpen()) { comic.dismissComic(); return; } // SPACE advances comic
+  if (dlg.isOpen()) return;
+  const hit = nearestInteraction();
+  if (!hit) return;
+  if (hit.kind === "event") openPendingEvent();
+  else if (hit.kind === "coffee") buyCoffeeRound();
+  else if (hit.kind === "email") openInboxEmail();
+  else if (hit.kind === "npc_idle" && !chattedNpcs.has(hit.npcId))
+    startChat(hit.npcId);
+}
+
+// --------------------------------------------------------------------- loop
+
+let last = 0;
+function loop(ts) {
+  const dt = Math.min(0.05, (ts - last) / 1000 || 0.016);
+  last = ts;
+
+  if (!inBoardroom && G.phase !== "title") {
+    drawFloor(ctx, floorOpts);
+    player.update(dt, keys);
+
+    // soft footsteps while walking (rate-limited inside sfx)
+    if (player.pose === "walk" && !player.frozen) sfx.footstep();
+
+    // roam countdown → next event
+    if (G.state && G.state.phase === "free_roam" && !G.pendingEvent &&
+        !dlg.isOpen() && !G.busy && !G.state.game_over) {
+      G.roamTimer -= dt;
+      if (!G.idleRolled && G.idleAt >= 0 && G.roamTimer <= G.idleAt)
+        rollIdleMoment(); // one AI ambient moment per gap, ~6s in
+      if (G.roamTimer <= 3 && !G.telegraphed) {
+        fx.edgePulse(true); G.telegraphed = true;
+      }
+      if (G.roamTimer <= 0) fireNextEvent();
+    }
+
+    // proximity prompt
+    const hit = nearestInteraction();
+    if (hit) showPrompt(hit.spot.x, hit.spot.y, hit.prompt, hit.gold);
+    else hidePrompt();
+
+    // ambient steam
+    if (Math.random() < 0.02) steam(SPOTS.coffee.x, SPOTS.coffee.y - 14);
+
+    // a heart drifts over whoever the player is dating
+    if (G.state && Math.random() < 0.012) {
+      const romancing = Object.entries(G.state.npc_romance || {})
+        .find(([, s]) => s === "active");
+      if (romancing) {
+        const npc = world.npcs[romancing[0]];
+        if (npc) heartFloat(npc.x, npc.y - 44);
+      }
+    }
+  }
+  requestAnimationFrame(loop);
+}
+
+// --------------------------------------------------------------------- boot
+
+async function startGame() {
+  const { session_id, state } = await api.newGame();
+  G.sessionId = session_id;
+  setState(state);
+  resetTrail();
+  updateHud(state, false);
+  G.els["title-screen"].classList.add("hidden");
+  G.els.hud.classList.remove("hidden");
+  requestAnimationFrame(fitStage); // re-fit now that the HUD shrinks the frame
+  banner("> a crisis approaches...", "");
+  G.roamTimer = FIRST_CRISIS_SECONDS;
+  G.idleRolled = false;
+  G.idleAt = -1; // no ambient moment in the short intro gap
+  sfx.open();
+  sfx.musicStart(); // looping background music (static/audio/bgm.mp3)
+}
+
+function buildTitleCast() {
+  const cast = document.getElementById("ts-cast");
+  if (!cast) return;
+  const lineup = [
+    ["brad", { armPose: "out", mouth: "open" }],
+    ["stacey", { armPose: "wring", mouth: "smile" }],
+    ["kevin", { armPose: "point", mouth: "smirk" }],
+    ["janet", { armPose: "open", mouth: "open" }],
+    ["derek", { mouth: "flat" }],
+  ];
+  for (const [id, expr] of lineup) {
+    const slot = document.createElement("div");
+    slot.className = "cast-slot";
+    slot.appendChild(chibiInBox(id, expr, 60, 72));
+    const name = document.createElement("div");
+    name.className = "cast-name";
+    name.textContent = id.toUpperCase();
+    name.style.color = charColor(id);
+    slot.appendChild(name);
+    cast.appendChild(slot);
+  }
+}
+
+function init() {
+  cacheEls();
+  window.BDS_DEBUG = G; // read-only debug/test handle
+  buildTitleCast();
+  setupTouch(); // on-screen joystick + buttons for phones/tablets
+  api.warm().catch(() => {}); // wake Modal while the player reads the title
+  ctx = G.els.floor.getContext("2d");
+  player = createPlayer(G.els.world);
+  world = createNpcs(G.els.world);
+  fitStage();
+  window.addEventListener("resize", fitStage);
+
+  document.getElementById("btn-start").addEventListener("click", startGame);
+
+  on("interact", handleInteract);
+  on("gift", () => {
+    const hit = nearestInteraction();
+    if (hit && hit.kind === "npc_idle" && G.state.gift_available)
+      openGiftPanel(hit.npcId);
+  });
+  on("escape", () => {
+    G.els["gift-panel"].classList.add("hidden");
+    // ESC closes a crisis dialogue only before a response is sent —
+    // the crisis stays pending (bubble remains, walk back to reopen)
+    if (dlg.isOpen() && dlg.stage() === "question" && !G.busy &&
+        G.pendingEvent && G.pendingEvent.kind !== "presentation") {
+      dlg.close();
+      fx.dim(false);
+      player.frozen = false;
+    }
+  });
+  on("option", (which) => dlg.chooseOption(which));
+  on("mute", () => sfx.toggleMute());
+
+  bindStageClick(G.els.stage, (x, y) => {
+    if (dlg.isOpen() || player.frozen || typingMode) return;
+    player.target = { x, y };
+    // clicking near an interactable walks there; arrival handled by prompts
+  });
+
+  requestAnimationFrame(loop);
+}
+
+init();

static/js/map.js

@@ -0,0 +1,662 @@
+// office geometry + canvas floor rendering. 640x480 internal (UI_UX.md).
+// COZY 16-BIT DEPTH PASS (user reference): every piece of furniture has a
+// dark outline, a lit top surface and a shaded front face; walls have
+// height; objects cast contact shadows. Geometry/colliders unchanged.
+// The static scene is pre-rendered once to an offscreen canvas; only
+// animated props (clock, rain, ringing phone, door glow…) draw per frame.
+export const W = 640, H = 480, WALL = 10;
+
+export const ROOMS = {
+  boardroom: { x: WALL, y: WALL, w: 220, h: 160 },          // upper left
+  breakroom: { x: 450, y: WALL, w: 180, h: 140 },           // upper right
+};
+
+export const SPOTS = {
+  playerDesk: { x: 150, y: 255 },
+  inbox: { x: 205, y: 252 },
+  coffee: { x: 590, y: 64 },
+  plant: { x: 612, y: 446 },
+  printer: { x: 420, y: 436 },
+  clock: { x: 330, y: 40 },
+  window: { x: 4, y: 250 },
+  phone: { x: 185, y: 250 },  // interact spot beside the desk, open approach
+  boardroomDoor: { x: 236, y: 120 },
+  newspaperLanding: { x: 330, y: 290 },
+  reception: { x: 320, y: 446 },
+  playerStart: { x: 320, y: 300 },
+};
+
+export const NPC_SPOTS = {
+  brad: { x: 310, y: 205 },
+  stacey: { x: 470, y: 235 },
+  kevin: { x: 560, y: 335 },
+  janet: { x: 360, y: 385 },
+  derek: { x: 175, y: 385 },
+};
+
+function deskCollider(s) { return { x: s.x - 26, y: s.y + 6, w: 52, h: 34 }; }
+
+export const COLLIDERS = [
+  // outer walls (top wall is deep: it has a visible face)
+  { x: 0, y: 0, w: W, h: 26 }, { x: 0, y: H - WALL, w: W, h: WALL },
+  { x: 0, y: 0, w: WALL, h: H }, { x: W - WALL, y: 0, w: WALL, h: H },
+  // boardroom is a solid block in office view — entered via the door scene
+  { x: ROOMS.boardroom.x, y: ROOMS.boardroom.y,
+    w: ROOMS.boardroom.w, h: ROOMS.boardroom.h },
+  // break room walls with an opening at the bottom (x 500..560)
+  { x: 450, y: WALL, w: 6, h: 140 },                  // left wall
+  { x: 450, y: 144, w: 50, h: 6 },                    // bottom left segment
+  { x: 560, y: 144, w: 70, h: 6 },                    // bottom right segment
+  // coffee machine + props
+  { x: SPOTS.coffee.x - 12, y: SPOTS.coffee.y - 10, w: 26, h: 24 },
+  { x: SPOTS.plant.x - 8, y: SPOTS.plant.y - 6, w: 18, h: 20 },
+  { x: SPOTS.printer.x - 14, y: SPOTS.printer.y - 8, w: 30, h: 22 },
+  { x: SPOTS.reception.x - 30, y: SPOTS.reception.y - 6, w: 60, h: 18 },
+  // desks
+  deskCollider(SPOTS.playerDesk),
+  ...Object.values(NPC_SPOTS).map(deskCollider),
+];
+
+export function collides(px, py) {
+  // player feet box: 16 wide, 10 tall, anchored at sprite bottom-center
+  const box = { x: px - 8, y: py - 4, w: 16, h: 10 };
+  return COLLIDERS.some((c) =>
+    box.x < c.x + c.w && box.x + box.w > c.x &&
+    box.y < c.y + c.h && box.y + box.h > c.y);
+}
+
+/* ---------------------------------------------------------------- palette */
+// aligned to the Design System warmlight theme (office34.js THEMES.warmlight)
+const P = {
+  ink: "#2e2a22",               // the 16-bit outline — warm dark ink
+  tileA: "#8d8b82", tileB: "#878579", tileSeam: "#76746b",
+  wallCap: "#ece8dc", wallFace: "#d8d4c8", wallShade: "#bcb7a8",
+  baseboard: "#b4af9f",
+  glass: "rgba(140,200,235,.32)", glassFrame: "#8e94a6",
+  glassLine: "rgba(255,255,255,.65)",
+  sky: "#aedcf2", skyHi: "#cdeaf8", bldg: "#9fb2c4", bldgLit: "#f4f9fd",
+  bldgLit2: "#ffe9a8",
+  woodFloorA: "#b58a55", woodFloorB: "#a87c45", woodSeam: "#8a6230",
+  meetFloorA: "#878579", meetFloorB: "#807e72",
+  woodTop: "#c3a169", woodTopHi: "#dcbb82", woodFace: "#997b46",
+  deskTop: "#e9e4d3", deskTopHi: "#f4f0e2", deskFace: "#c6c2b6",
+  deskFaceLo: "#b3ab95",
+  partTop: "#ece8dc", partFace: "#bdb8a6", partCloth: "#a7a08c",
+  monitor: "#1c3a5a", monitorFrame: "#2b2e3a", monitorSide: "#23242c",
+  screenGlow: "#7fb2ec",
+  chairTop: "#3b3e46", chairHi: "#4a4e58", chairFace: "#2f323a",
+  paper: "#faf7ee", paperShadow: "#c7c0aa",
+  metalTop: "#cfccc4", metalHi: "#e6e2d6", metalFace: "#a8a392",
+  shadow: "rgba(46,42,34,.30)", shadowSoft: "rgba(46,42,34,.16)",
+  plantPot: "#b35c3a", plantPotHi: "#cf7450", leaf: "#3f9e52",
+  leafHi: "#5cc46e", leafLo: "#2c7a3d",
+  mug: "#e25b4a", book: "#8e6fd8", folder: "#3aa3e0", binder2: "#e6b33c",
+  binder3: "#d9534f",
+  lamp: "#5b5e6b", lampGlow: "#ffd98c",
+  case: "#2e2f37", caseHi: "#46474f",
+  label: "#6e6e7e",
+};
+
+let staticScene = null;        // offscreen canvas, built once
+let rainDrops = [];
+
+// labels are baked into the static scene — rebuild once the pixel font lands
+if (typeof document !== "undefined" && document.fonts)
+  document.fonts.ready.then(() => { staticScene = null; });
+
+/* ------------------------------------------------------------ tiny helpers */
+function r(c, x, y, w, h, color) { c.fillStyle = color; c.fillRect(x, y, w, h); }
+
+function shade(c, x, y, w, soft) {
+  // contact shadow: a wide low rect hugging the object's south edge
+  r(c, x + 1, y, w - 2, 4, soft ? P.shadowSoft : P.shadow);
+  r(c, x + 3, y + 4, w - 6, 2, P.shadowSoft);
+}
+
+/* the core 16-bit primitive: outlined block with lit top + shaded front face */
+function box3d(c, x, y, w, topH, faceH, top, face, hi, outline = P.ink) {
+  r(c, x - 1, y - 1, w + 2, topH + faceH + 2, outline);
+  r(c, x, y, w, topH, top);
+  if (hi) r(c, x, y, w, 2, hi);
+  r(c, x, y + topH, w, faceH, face);
+  r(c, x, y + topH, w, 1, "rgba(0,0,0,.14)"); // crease under the lip
+}
+
+function plant(c, x, y, big) {
+  const s = big ? 1.4 : 1;
+  shade(c, x - 8 * s, y + 9 * s, 17 * s, true);
+  box3d(c, x - 6 * s, y, 12 * s, 3 * s, 8 * s, P.plantPotHi, P.plantPot);
+  r(c, x - 8 * s, y - 9 * s, 6 * s, 10 * s, P.leaf);
+  r(c, x + 1 * s, y - 12 * s, 6 * s, 13 * s, P.leafHi);
+  r(c, x - 3 * s, y - 7 * s, 5 * s, 8 * s, P.leafLo);
+  r(c, x - 1 * s, y - 15 * s, 3 * s, 7 * s, P.leaf);
+  r(c, x - 2 * s, y - 16 * s, 1, 1, "#7fe08f");
+}
+
+function chair(c, x, y) {
+  shade(c, x - 7, y + 7, 15, true);
+  box3d(c, x - 5, y - 9, 11, 6, 3, P.chairTop, P.chairFace, P.chairHi); // back
+  box3d(c, x - 6, y - 1, 13, 5, 4, P.chairTop, P.chairFace, P.chairHi); // seat
+}
+
+function monitor(c, x, y, lit = true) {
+  r(c, x - 9, y - 7, 19, 15, P.ink);
+  r(c, x - 8, y - 6, 17, 13, P.monitorFrame);
+  r(c, x + 7, y - 6, 2, 13, P.monitorSide);    // CRT side depth
+  r(c, x - 6, y - 4, 12, 8, P.monitor);
+  if (lit) {
+    r(c, x - 5, y - 3, 8, 1, P.screenGlow);
+    r(c, x - 5, y - 1, 5, 1, "#4d7fc0");
+    r(c, x - 5, y + 1, 7, 1, "#4d7fc0");
+  }
+  r(c, x - 2, y + 7, 5, 2, P.ink);             // stand
+}
+
+function papers(c, x, y) {
+  r(c, x, y, 8, 6, P.paperShadow);
+  r(c, x - 1, y - 1, 8, 6, P.paper);
+  r(c, x - 1, y - 1, 8, 1, "#f0f0f4");
+  r(c, x + 1, y + 1, 5, 1, P.paperShadow);
+}
+
+function keyboard(c, x, y) {
+  r(c, x - 1, y - 1, 14, 7, P.ink);
+  r(c, x, y, 12, 5, "#a4a7b4");
+  r(c, x + 1, y + 1, 10, 1, "#c9ccd6");
+}
+
+function deskLamp(c, x, y) {
+  r(c, x, y + 4, 6, 2, P.lamp);                 // base
+  r(c, x + 2, y - 2, 2, 6, P.lamp);             // arm
+  r(c, x, y - 5, 7, 4, P.ink);                  // head
+  r(c, x + 1, y - 4, 5, 2, P.lamp);
+  r(c, x + 1, y - 1, 5, 1, P.lampGlow);         // warm light
+}
+
+function landline(c, x, y) {
+  r(c, x - 1, y - 1, 12, 9, P.ink);
+  r(c, x, y, 10, 7, "#b9bcc8");
+  r(c, x, y, 10, 2, "#d4d6de");
+  r(c, x + 1, y - 3, 8, 3, "#8e919e");          // handset on top
+  r(c, x + 6, y + 3, 3, 3, "#7d8290");          // keypad
+}
+
+function briefcase(c, x, y) {
+  shade(c, x - 1, y + 9, 14, true);
+  r(c, x - 1, y - 1, 14, 11, P.ink);
+  r(c, x, y, 12, 9, P.case);
+  r(c, x, y, 12, 2, P.caseHi);
+  r(c, x + 4, y - 3, 4, 3, P.ink);              // handle
+  r(c, x + 5, y - 2, 2, 1, P.case);
+  r(c, x + 5, y + 4, 2, 2, "#8c8f9b");          // clasp
+}
+
+function shelfUnit(c, x, y) {
+  box3d(c, x, y, 40, 16, 7, "#e8e8ed", "#c2c4ce", "#f6f6f9");
+  r(c, x + 1, y + 7, 38, 1, "#b6b6c1");
+  [[3, P.folder], [9, P.binder2], [15, P.binder3], [21, P.book],
+   [27, P.folder]].forEach(([off, col]) => {
+    r(c, x + off, y + 2, 5, 8, col);
+    r(c, x + off, y + 2, 5, 1, "rgba(255,255,255,.4)");
+  });
+  papers(c, x + 33, y + 3);
+}
+
+/* a full cubicle: outlined partitions with faces, white desk with front */
+function cubicle(c, s, accent, opts = {}) {
+  const dx = s.x - 26, dy = s.y + 6;                // matches deskCollider
+  const py = s.y - 34;
+  // back partition: cap, cloth panel, face — fully outlined
+  r(c, dx - 5, py - 1, 62, 30, P.ink);
+  r(c, dx - 4, py, 60, 4, P.partTop);
+  r(c, dx - 4, py + 4, 60, 18, P.partFace);
+  r(c, dx - 2, py + 6, 56, 14, P.partCloth);
+  r(c, dx - 2, py + 6, 56, 1, "rgba(255,255,255,.35)");
+  r(c, dx - 4, py + 22, 60, 6, "#9da4b6");          // partition front face
+  // pinned note + identity accent stripe
+  r(c, dx + 4, py + 8, 6, 5, P.paper);
+  r(c, dx + 44, py + 8, 7, 5, accent);
+  r(c, dx + 44, py + 8, 7, 1, "rgba(255,255,255,.45)");
+  // side wings (outlined)
+  r(c, dx - 9, py + 3, 7, 58, P.ink);
+  r(c, dx - 8, py + 4, 5, 56, P.partFace);
+  r(c, dx - 8, py + 4, 5, 2, P.partTop);
+  r(c, dx + 54, py + 3, 7, 58, P.ink);
+  r(c, dx + 55, py + 4, 5, 56, P.partFace);
+  r(c, dx + 55, py + 4, 5, 2, P.partTop);
+  // desk: lit top + front face + outline + contact shadow
+  shade(c, dx - 2, dy + 31, 58);
+  box3d(c, dx, dy, 52, 20, 10, P.deskTop, P.deskFace, P.deskTopHi);
+  r(c, dx, dy + 26, 52, 2, P.deskFaceLo);
+  // desk gear
+  monitor(c, s.x, dy + 5, !opts.darkMonitor);
+  keyboard(c, s.x - 6, dy + 15);
+  papers(c, dx + 5, dy + 13);
+  deskLamp(c, dx + 41, dy + 6);
+  r(c, dx + 44, dy + 16, 5, 5, P.mug);
+  r(c, dx + 44, dy + 16, 5, 1, "#f2917f");
+  if (opts.phone) landline(c, dx + 3, dy + 3);
+  if (opts.books) { r(c, dx + 3, dy + 14, 4, 7, P.book);
+    r(c, dx + 8, dy + 15, 4, 6, P.folder); }
+}
+
+/* --------------------------------------------------------- the static scene */
+function buildStatic() {
+  const cv = document.createElement("canvas");
+  cv.width = W; cv.height = H;
+  const c = cv.getContext("2d");
+
+  // ---- light tile floor with thin grid seams
+  for (let ty = 0; ty < H / 32; ty++)
+    for (let tx = 0; tx < W / 32; tx++)
+      r(c, tx * 32, ty * 32, 32, 32, (tx + ty) % 2 ? P.tileA : P.tileB);
+  c.globalAlpha = 0.85;
+  for (let x = 0; x <= W; x += 32) r(c, x, 0, 1, H, P.tileSeam);
+  for (let y = 0; y <= H; y += 32) r(c, 0, y, W, 1, P.tileSeam);
+  c.globalAlpha = 1;
+  // sunlight patches under the corridor windows
+  c.globalAlpha = 0.10;
+  r(c, 244, 30, 92, 66, "#fff3c4");
+  r(c, 340, 30, 92, 66, "#fff3c4");
+  c.globalAlpha = 1;
+
+  // ---- boardroom interior — warm meeting room
+  const br = ROOMS.boardroom;
+  for (let ty = 0; ty < br.h / 16; ty++)
+    for (let tx = 0; tx < br.w / 16; tx++)
+      r(c, br.x + tx * 16, br.y + ty * 16, 16, 16,
+        (tx + ty) % 2 ? P.meetFloorA : P.meetFloorB);
+  // north wall with real height (cap + face + outline)
+  r(c, br.x, br.y, br.w, 4, P.wallCap);
+  r(c, br.x, br.y + 4, br.w, 16, P.wallFace);
+  r(c, br.x, br.y + 18, br.w, 2, P.wallShade);
+  r(c, br.x, br.y + 20, br.w, 1, P.ink);
+  // area rug
+  r(c, br.x + 38, br.y + 52, 146, 74, "#b6543e");
+  r(c, br.x + 42, br.y + 56, 138, 66, "#c4664e");
+  // projector screen mounted on the wall face
+  r(c, br.x + 63, br.y + 5, 92, 27, P.ink);
+  r(c, br.x + 64, br.y + 6, 90, 25, "#5d5d68");
+  r(c, br.x + 67, br.y + 9, 84, 19, "#fdfdfe");
+  r(c, br.x + 67, br.y + 9, 84, 4, "#e8e8ee");
+  // big table: wood top + front face + outline
+  shade(c, br.x + 46, br.y + 119, 130);
+  box3d(c, br.x + 46, br.y + 56, 128, 50, 12, P.woodTop, P.woodFace,
+        P.woodTopHi);
+  papers(c, br.x + 70, br.y + 74); papers(c, br.x + 130, br.y + 86);
+  r(c, br.x + 101, br.y + 78, 16, 11, P.ink);
+  r(c, br.x + 102, br.y + 79, 14, 9, P.metalTop);   // speakerphone
+  r(c, br.x + 107, br.y + 82, 4, 3, "#6e7180");
+  [[64, 44], [104, 44], [144, 44], [64, 128], [104, 128], [144, 128]]
+    .forEach(([x, y]) => chair(c, br.x + x, br.y + y));
+  plant(c, br.x + 16, br.y + 140);
+  briefcase(c, br.x + 196, br.y + 132);
+  // boardroom side walls + south wall with outside face
+  r(c, br.x, br.y, 6, br.h, P.wallCap);
+  r(c, br.x + 5, br.y, 1, br.h, P.ink);
+  r(c, br.x, br.y + br.h - 6, br.w, 6, P.wallCap);
+  r(c, br.x, br.y + br.h, br.w - 6, 10, P.wallFace);       // face seen from hall
+  r(c, br.x, br.y + br.h + 8, br.w - 6, 2, P.wallShade);
+  r(c, br.x, br.y + br.h + 10, br.w - 6, 1, P.ink);
+  // right wall: glass top section + door gap (90..140) + cap below
+  r(c, br.x + br.w - 6, br.y, 6, 14, P.wallCap);
+  r(c, br.x + br.w - 6, br.y, 6, 1, P.ink);
+  r(c, br.x + br.w - 7, br.y + 14, 8, 70, P.glassFrame);
+  r(c, br.x + br.w - 5, br.y + 16, 4, 66, P.glass);
+  for (let i = 0; i < 4; i++)
+    r(c, br.x + br.w - 5, br.y + 18 + i * 17, 4, 1, P.glassLine);
+  r(c, br.x + br.w - 6, br.y + 84, 6, 6, P.wallCap);
+  r(c, br.x + br.w - 6, br.y + 140, 6, 30, P.wallCap);
+  r(c, br.x + br.w - 1, br.y, 1, br.h, P.ink);
+  // door frame
+  r(c, br.x + br.w - 7, br.y + 88, 8, 3, P.ink);
+  r(c, br.x + br.w - 7, br.y + 139, 8, 3, P.ink);
+  // BOARDROOM plaque on the wall face
+  r(c, br.x + 55, br.y + 5, 82, 13, P.ink);
+  r(c, br.x + 56, br.y + 6, 80, 11, "#fdfdfe");
+  c.font = "7px 'Press Start 2P'";
+  c.fillStyle = "#34343f";
+  c.fillText("BOARDROOM", br.x + 61, br.y + 15);
+
+  // ---- break room interior — warm wood planks
+  const bk = ROOMS.breakroom;
+  for (let py = 0; py < bk.h; py += 10) {
+    r(c, bk.x, bk.y + py, bk.w, 10,
+      (py / 10) % 2 ? P.woodFloorA : P.woodFloorB);
+    r(c, bk.x, bk.y + py, bk.w, 1, P.woodSeam);
+  }
+  // north wall face inside the break room
+  r(c, bk.x, bk.y, bk.w, 4, P.wallCap);
+  r(c, bk.x, bk.y + 4, bk.w, 14, P.wallFace);
+  r(c, bk.x, bk.y + 16, bk.w, 2, P.wallShade);
+  r(c, bk.x, bk.y + 18, bk.w, 1, P.ink);
+  // counter: lit top + face + outline
+  shade(c, bk.x + 6, bk.y + 39, 124);
+  box3d(c, bk.x + 6, bk.y + 10, 124, 18, 10, P.deskTop, P.deskFace,
+        P.deskTopHi);
+  r(c, bk.x + 16, bk.y + 14, 16, 10, P.ink);
+  r(c, bk.x + 17, bk.y + 15, 14, 8, "#a9adba");    // sink
+  r(c, bk.x + 19, bk.y + 17, 10, 4, "#8a8e9c");
+  r(c, bk.x + 44, bk.y + 14, 10, 8, P.mug);        // mugs
+  r(c, bk.x + 44, bk.y + 14, 10, 2, "#f2917f");
+  r(c, bk.x + 58, bk.y + 16, 8, 6, P.folder);
+  papers(c, bk.x + 76, bk.y + 15);
+  // fridge: tall outlined block
+  shade(c, bk.x + 140, bk.y + 53, 28);
+  r(c, bk.x + 139, bk.y + 7, 30, 48, P.ink);
+  r(c, bk.x + 140, bk.y + 8, 28, 46, "#eceef2");
+  r(c, bk.x + 140, bk.y + 8, 28, 3, "#fafbfd");
+  r(c, bk.x + 140, bk.y + 26, 28, 2, "#c3c6cf");
+  r(c, bk.x + 162, bk.y + 14, 3, 8, "#9da0ab");
+  r(c, bk.x + 140, bk.y + 48, 28, 6, "#d4d6de");   // fridge base face
+  // vending machine: outlined, lit window
+  shade(c, bk.x + 112, bk.y + 99, 22);
+  r(c, bk.x + 111, bk.y + 63, 24, 38, P.ink);
+  r(c, bk.x + 112, bk.y + 64, 22, 36, "#d9534f");
+  r(c, bk.x + 112, bk.y + 64, 22, 3, "#e8736f");
+  r(c, bk.x + 115, bk.y + 70, 12, 20, "#23232e");
+  [[0, P.binder2], [6, P.folder], [12, "#5cc46e"]].forEach(([off, col]) => {
+    r(c, bk.x + 116, bk.y + 72 + off, 10, 3, col);
+  });
+  r(c, bk.x + 129, bk.y + 72, 3, 10, "#f2f2f5");
+  r(c, bk.x + 112, bk.y + 94, 22, 6, "#b23f3c");   // machine base face
+  // coffee machine on the counter end — the shrine
+  const cf = SPOTS.coffee;
+  shade(c, cf.x - 11, cf.y + 11, 24);
+  r(c, cf.x - 11, cf.y - 11, 24, 24, P.ink);
+  r(c, cf.x - 10, cf.y - 10, 22, 22, "#3a3a45");
+  r(c, cf.x - 10, cf.y - 10, 22, 3, "#52525e");
+  r(c, cf.x - 6, cf.y - 5, 14, 7, "#1d1d26");
+  r(c, cf.x - 4, cf.y + 4, 6, 5, P.mug);
+  r(c, cf.x + 5, cf.y - 3, 3, 2, "#7ddb6f");
+  // small table + chairs
+  shade(c, bk.x + 32, bk.y + 103, 48);
+  box3d(c, bk.x + 32, bk.y + 76, 48, 20, 8, P.woodTop, P.woodFace,
+        P.woodTopHi);
+  chair(c, bk.x + 20, bk.y + 84); chair(c, bk.x + 92, bk.y + 84);
+  r(c, bk.x + 48, bk.y + 82, 6, 6, P.mug);
+  // water cooler near the entrance gap
+  shade(c, bk.x + 56, bk.y + 132, 16, true);
+  r(c, bk.x + 56, bk.y + 111, 14, 24, P.ink);
+  r(c, bk.x + 57, bk.y + 116, 12, 15, "#dfe7f2");
+  r(c, bk.x + 59, bk.y + 112, 8, 6, "#bcd8f0");
+  r(c, bk.x + 57, bk.y + 128, 12, 3, P.metalFace);
+  // walls
+  r(c, bk.x, bk.y, 6, bk.h, P.wallCap);
+  r(c, bk.x + 5, bk.y, 1, bk.h, P.ink);
+  r(c, bk.x, bk.y + bk.h - 6, 50, 6, P.wallCap);
+  r(c, bk.x, bk.y + bk.h, 50, 10, P.wallFace);     // south face, left segment
+  r(c, bk.x, bk.y + bk.h + 9, 50, 1, P.ink);
+  r(c, bk.x + 110, bk.y + bk.h - 6, 70, 6, P.wallCap);
+  r(c, bk.x + 110, bk.y + bk.h, 70, 10, P.wallFace);
+  r(c, bk.x + 110, bk.y + bk.h + 9, 70, 1, P.ink);
+  // BREAK RM plaque on the wall face
+  r(c, bk.x + 29, bk.y + 3, 74, 13, P.ink);
+  r(c, bk.x + 30, bk.y + 4, 72, 11, "#fdfdfe");
+  c.fillStyle = "#34343f";
+  c.fillText("BREAK RM", bk.x + 35, bk.y + 13);
+
+  // ---- outer walls: white face with cap + ink line + daylight windows
+  r(c, 0, 0, W, 4, P.wallCap);
+  r(c, 0, 4, W, 18, P.wallFace);
+  r(c, 0, 4, W, 2, "#ffffff");
+  r(c, 0, 20, W, 3, P.wallShade);
+  r(c, 0, 23, W, 1, P.ink);
+  r(c, 0, 24, W, 3, P.baseboard);
+  // corridor windows: daytime sky, soft clouds, light skyline
+  [[250, 76], [346, 76]].forEach(([wx, ww]) => {
+    r(c, wx - 4, 2, ww + 8, 24, P.ink);
+    r(c, wx - 3, 3, ww + 6, 22, P.glassFrame);
+    r(c, wx, 5, ww, 18, P.sky);
+    r(c, wx, 5, ww, 6, P.skyHi);
+    r(c, wx + 8, 8, 14, 3, "#ffffff");
+    r(c, wx + 40, 11, 18, 3, "#ffffff");
+    for (let i = 0; i < ww / 12; i++) {
+      const bh = 6 + ((i * 37) % 7);
+      r(c, wx + i * 12 + 1, 23 - bh, 9, bh, P.bldg);
+      if (i % 2 === 0) r(c, wx + i * 12 + 3, 25 - bh + 2, 2, 2, P.bldgLit);
+      if (i % 3 === 0) r(c, wx + i * 12 + 6, 25 - bh + 4, 2, 2, P.bldgLit2);
+    }
+    r(c, wx + ww / 2 - 1, 5, 2, 18, P.glassFrame); // mullion
+  });
+  // AC unit on the wall face
+  r(c, 25, 5, 36, 16, P.ink);
+  r(c, 26, 6, 34, 14, "#e6e6eb");
+  r(c, 26, 6, 34, 3, "#f6f6f9");
+  r(c, 30, 14, 26, 2, "#b6b6c1");
+  r(c, 30, 17, 26, 1, "#b6b6c1");
+  // shelf with binders on the corridor wall
+  shelfUnit(c, 380, 28);
+  // whiteboard with line graph on the corridor wall (reference back wall)
+  r(c, 564, 4, 60, 21, P.ink);
+  r(c, 565, 5, 58, 19, "#ffffff");
+  r(c, 565, 5, 58, 2, "#e8e8ee");
+  c.strokeStyle = "#d9534f"; c.lineWidth = 1;
+  c.beginPath(); c.moveTo(570, 19); c.lineTo(580, 12); c.lineTo(590, 16);
+  c.lineTo(602, 8); c.lineTo(616, 11); c.stroke();
+  c.strokeStyle = "#3aa3e0";
+  c.beginPath(); c.moveTo(570, 21); c.lineTo(585, 18); c.lineTo(600, 20);
+  c.lineTo(616, 15); c.stroke();
+  // side + bottom walls
+  r(c, 0, H - WALL, W, WALL, P.wallFace);
+  r(c, 0, H - WALL, W, 2, P.ink);
+  r(c, 0, 0, WALL, H, P.wallFace);
+  r(c, WALL - 1, 0, 1, H, P.ink);
+  r(c, W - WALL, 0, WALL, H, P.wallFace);
+  r(c, W - WALL, 0, 1, H, P.ink);
+  // window on the left wall (rain overlay is dynamic)
+  r(c, 0, 226, WALL, 78, P.ink);
+  r(c, 0, 228, WALL - 1, 74, P.glassFrame);
+  r(c, 1, 231, WALL - 3, 68, P.sky);
+  r(c, 1, 262, WALL - 3, 2, P.glassFrame);
+  // entrance: double door at the bottom
+  r(c, 299, H - WALL - 1, 62, WALL + 1, P.ink);
+  r(c, 300, H - WALL, 60, WALL, "#c2996a");
+  r(c, 300, H - WALL, 60, 2, "#dab987");
+  r(c, 329, H - WALL, 2, WALL, P.ink);
+  r(c, 306, H - 6, 4, 2, "#6b4d2a"); r(c, 350, H - 6, 4, 2, "#6b4d2a");
+  // EXIT sign
+  r(c, 313, H - 25, 34, 12, P.ink);
+  r(c, 314, H - 24, 32, 10, "#1f7a37");
+  c.fillStyle = "#d8ffe2";
+  c.font = "6px 'Press Start 2P'";
+  c.fillText("EXIT", 318, H - 16);
+  // welcome mat
+  r(c, 302, H - 34, 56, 14, "#b6543e");
+  r(c, 302, H - 34, 56, 1, "#8a3f2e"); r(c, 302, H - 21, 56, 1, "#8a3f2e");
+
+  // ---- cubicles
+  cubicle(c, SPOTS.playerDesk, "#5b5b68", { books: true });
+  cubicle(c, NPC_SPOTS.brad, "#ff5a3c", { phone: true });
+  cubicle(c, NPC_SPOTS.stacey, "#1fd9c4", { books: true });
+  cubicle(c, NPC_SPOTS.kevin, "#ffd23f");
+  cubicle(c, NPC_SPOTS.janet, "#b95cff", { books: true });
+  cubicle(c, NPC_SPOTS.derek, "#8fd4ff", { darkMonitor: true, phone: true });
+  // "YOU" tag under the player cubicle
+  c.fillStyle = P.label;
+  c.font = "6px 'Press Start 2P'";
+  c.fillText("YOU", SPOTS.playerDesk.x - 9, SPOTS.playerDesk.y + 52);
+
+  // janet's mood board on her partition
+  const j = NPC_SPOTS.janet;
+  r(c, j.x - 19, j.y - 31, 38, 18, P.ink);
+  r(c, j.x - 18, j.y - 30, 36, 16, "#ffffff");
+  [["#ff36c0", 0], ["#3aa3e0", 9], ["#5cc46e", 18], ["#e6b33c", 27]]
+    .forEach(([col, off]) => r(c, j.x - 15 + off, j.y - 27, 6, 6, col));
+  r(c, j.x - 15, j.y - 19, 26, 2, P.paperShadow);
+
+  // kevin's whiteboard (right wall beside his cubicle)
+  r(c, 605, 311, 26, 50, P.ink);
+  r(c, 606, 312, 24, 48, "#9a9aa8");
+  r(c, 609, 315, 18, 42, "#ffffff");
+  c.strokeStyle = "#d9534f"; c.lineWidth = 1;
+  c.beginPath(); c.moveTo(612, 350); c.lineTo(617, 326);
+  c.lineTo(621, 340); c.lineTo(625, 320); c.stroke();
+  c.fillStyle = "#3aa3e0"; c.fillText("?", 612, 324);
+
+  // derek: ancient beige tower + briefcase he has had since 2009
+  const d = NPC_SPOTS.derek;
+  r(c, d.x - 25, d.y + 9, 12, 14, P.ink);
+  r(c, d.x - 24, d.y + 10, 10, 12, "#d9d2b8");
+  r(c, d.x - 22, d.y + 12, 6, 2, "#bfb89e");
+  briefcase(c, d.x + 38, d.y + 24);
+
+  // ---- props along walls
+  // filing cabinets (left wall): outlined with drawer faces
+  [320, 360].forEach((y) => {
+    shade(c, WALL + 2, y + 31, 26);
+    r(c, WALL + 1, y - 1, 26, 34, P.ink);
+    r(c, WALL + 2, y, 24, 32, P.metalTop);
+    r(c, WALL + 2, y, 24, 3, P.metalHi);
+    r(c, WALL + 2, y + 26, 24, 6, P.metalFace);
+    r(c, WALL + 4, y + 7, 20, 2, P.metalFace);
+    r(c, WALL + 4, y + 17, 20, 2, P.metalFace);
+    r(c, WALL + 12, y + 4, 5, 2, P.metalHi);
+    r(c, WALL + 12, y + 14, 5, 2, P.metalHi);
+  });
+  papers(c, WALL + 8, 308);
+  briefcase(c, WALL + 30, 344);
+  // colorful poster on the left wall
+  r(c, WALL + 3, 179, 28, 22, P.ink);
+  r(c, WALL + 4, 180, 26, 20, "#ffffff");
+  r(c, WALL + 6, 182, 22, 16, "#2c2c38");
+  [["#ff36c0", 0, 0], ["#3aa3e0", 11, 0], ["#5cc46e", 0, 8],
+   ["#e6b33c", 11, 8]].forEach(([col, ox, oy]) => {
+    r(c, WALL + 7 + ox, 183 + oy, 9, 7, col);
+  });
+  // copier / printer near reception: outlined block with tray
+  const pr = SPOTS.printer;
+  shade(c, pr.x - 13, pr.y + 9, 30);
+  r(c, pr.x - 14, pr.y - 9, 30, 20, P.ink);
+  r(c, pr.x - 13, pr.y - 8, 28, 14, "#e6e6eb");
+  r(c, pr.x - 13, pr.y - 8, 28, 3, "#f6f6f9");
+  r(c, pr.x - 13, pr.y + 6, 28, 4, "#c5c7d1");     // front face
+  r(c, pr.x - 8, pr.y - 12, 18, 5, "#cfcfd8");
+  r(c, pr.x - 8, pr.y - 12, 18, 1, P.ink);
+  r(c, pr.x - 5, pr.y - 2, 12, 4, "#3a3a45");
+  r(c, pr.x + 9, pr.y - 5, 3, 2, "#5cc46e");
+  // reception desk: wood with front face
+  shade(c, SPOTS.reception.x - 30, SPOTS.reception.y + 9, 60);
+  box3d(c, SPOTS.reception.x - 30, SPOTS.reception.y - 8, 60, 14, 8,
+        P.woodTop, P.woodFace, P.woodTopHi);
+  monitor(c, SPOTS.reception.x - 14, SPOTS.reception.y - 2);
+  landline(c, SPOTS.reception.x + 6, SPOTS.reception.y - 4);
+  r(c, SPOTS.reception.x + 20, SPOTS.reception.y - 4, 8, 6, P.leaf);
+  // big plant in the corner
+  plant(c, SPOTS.plant.x, SPOTS.plant.y, true);
+  plant(c, 248, 188);
+  plant(c, 432, 188);
+  // wall art between windows
+  r(c, 319, 6, 24, 18, P.ink);
+  r(c, 320, 7, 22, 16, "#ffffff");
+  r(c, 322, 9, 18, 12, "#aedcf2");
+  r(c, 324, 15, 6, 3, "#5cc46e"); r(c, 332, 11, 5, 5, "#e6b33c");
+  // scattered papers on the floor near brad (of course near brad)
+  [[352, 250, -20], [368, 262, 35], [340, 270, 10]].forEach(([x, y, a]) => {
+    c.save(); c.translate(x, y); c.rotate((a * Math.PI) / 180);
+    r(c, -4, -3, 8, 6, P.paper);
+    r(c, -4, 2, 8, 1, P.paperShadow);
+    c.restore();
+  });
+  // inbox tray: outlined with paper inside
+  const ib = SPOTS.inbox;
+  r(c, ib.x - 10, ib.y - 6, 22, 13, P.ink);
+  r(c, ib.x - 9, ib.y - 5, 20, 11, P.metalFace);
+  r(c, ib.x - 8, ib.y - 4, 18, 9, P.metalTop);
+  r(c, ib.x - 6, ib.y - 2, 14, 5, "#8a8e9c");
+  r(c, ib.x - 6, ib.y - 2, 14, 1, P.paper);
+
+  return cv;
+}
+
+/* --------------------------------------------------------- per-frame layer */
+const css = (name) =>
+  getComputedStyle(document.documentElement).getPropertyValue(name).trim();
+
+export function drawFloor(ctx, opts = {}) {
+  if (!staticScene) staticScene = buildStatic();
+  ctx.drawImage(staticScene, 0, 0);
+
+  if (opts.gloomy) { r(ctx, 0, 0, W, H, "rgba(54,60,92,.30)"); }
+
+  const br = ROOMS.boardroom;
+  // boardroom door (dynamic glow during presentation trigger)
+  if (opts.doorGlow) {
+    const pulse = Math.floor(Date.now() / 280) % 2;
+    r(ctx, br.x + br.w - 6, br.y + 90, 6, 50, pulse ? "#ffc73b" : "#d9a82f");
+    ctx.globalAlpha = pulse ? 0.35 : 0.2;
+    r(ctx, br.x + br.w - 16, br.y + 82, 26, 66, "#ffc73b");
+    ctx.globalAlpha = 1;
+  } else {
+    r(ctx, br.x + br.w - 6, br.y + 90, 6, 50, "#c2996a");
+    r(ctx, br.x + br.w - 6, br.y + 90, 2, 50, "#dab987");
+    r(ctx, br.x + br.w - 4, br.y + 112, 2, 6, "#6b4d2a"); // handle
+  }
+
+  // left-wall window rain (morale < 20 manifests as weather. nobody asks why)
+  if (opts.gloomy) {
+    if (rainDrops.length === 0)
+      rainDrops = Array.from({ length: 7 }, () =>
+        ({ x: 1 + Math.random() * 6, y: 232 + Math.random() * 64 }));
+    ctx.fillStyle = "#5a8ec4";
+    rainDrops.forEach((d) => {
+      ctx.fillRect(d.x, d.y, 1, 4);
+      d.y += 2; if (d.y > 296) d.y = 232;
+    });
+    // rain on the skyline windows too
+    ctx.globalAlpha = 0.5;
+    for (let i = 0; i < 10; i++) {
+      const rx = 252 + ((i * 53 + Math.floor(Date.now() / 90) * 7) % 168);
+      ctx.fillRect(rx, 6 + (i * 31) % 12, 1, 4);
+    }
+    ctx.globalAlpha = 1;
+  }
+
+  // wall clock with moving hands
+  const ck = SPOTS.clock;
+  r(ctx, ck.x - 9, ck.y - 9, 18, 18, "#3a3d49");
+  r(ctx, ck.x - 7, ck.y - 7, 14, 14, "#ffffff");
+  r(ctx, ck.x - 7, ck.y - 7, 14, 2, "#e8e8ee");
+  ctx.fillStyle = "#2c2c38";
+  const sec = Math.floor(Date.now() / 1000) % 60;
+  const ang = (sec / 60) * Math.PI * 2 - Math.PI / 2;
+  ctx.fillRect(ck.x, ck.y, Math.max(1, Math.cos(ang) * 4), 1);
+  ctx.fillRect(ck.x, ck.y - 3, 1, 3);
+
+  // monitors flicker faintly (alive, barely)
+  if (Math.floor(Date.now() / 800) % 5 === 0) {
+    ctx.globalAlpha = 0.15;
+    for (const s of [SPOTS.playerDesk, ...Object.values(NPC_SPOTS)])
+      r(ctx, s.x - 6, s.y + 7, 12, 8, "#7fb2ec");
+    ctx.globalAlpha = 1;
+  }
+
+  // printer shake during jam events
+  if (opts.printerShake) {
+    const pj = Math.sin(Date.now() / 30) * 2;
+    const pr = SPOTS.printer;
+    r(ctx, pr.x - 13 + pj, pr.y - 8, 28, 17, "#e6e6eb");
+    r(ctx, pr.x - 8 + pj, pr.y - 12, 18, 5, "#cfcfd8");
+    r(ctx, pr.x - 2 + pj, pr.y - 14, 10, 6, "#ffffff");
+  }
+
+  // desk phone on the desk surface (vibrates for client emergencies)
+  const pd = SPOTS.playerDesk;
+  const ph = opts.phoneRing ? Math.sin(Date.now() / 25) * 2 : 0;
+  r(ctx, pd.x + 9 + ph, pd.y + 12, 16, 11, "#3a3d49");
+  r(ctx, pd.x + 10 + ph, pd.y + 13, 14, 9, "#b9bcc8");
+  r(ctx, pd.x + 11 + ph, pd.y + 14, 12, 2, "#d4d6de");
+  r(ctx, pd.x + 12 + ph, pd.y + 18, 8, 2, "#7d8290");
+  if (opts.phoneRing && Math.floor(Date.now() / 200) % 2)
+    r(ctx, pd.x + 14, pd.y + 6, 6, 4, css("--bds-neon-cyan") || "#2ff0ff");
+
+  // inbox tray lights up for inbox/HR events
+  if (opts.inboxLit) {
+    const ib = SPOTS.inbox;
+    const lit = Math.floor(Date.now() / 300) % 2;
+    r(ctx, ib.x - 6, ib.y - 2, 14, 5, lit ? "#8edb3a" : "#6fae2c");
+    ctx.globalAlpha = 0.3;
+    r(ctx, ib.x - 12, ib.y - 8, 26, 17, "#8edb3a");
+    ctx.globalAlpha = 1;
+  }
+}

static/js/npcs.js

@@ -0,0 +1,87 @@
+// the five underlings: floor sprites, mood-driven idles, bubbles, prompts
+import { NPC_SPOTS } from "./map.js";
+import { makeChar } from "./sprites.js";
+import { zzz } from "./particles.js";
+
+// mood (server npc_moods string) → topSprite pose
+const MOOD_POSE = {
+  normal: "idle", happy: "idle", energized: "idle", grateful: "idle",
+  smug: "lean", suspicious: "lean", confused: "idle",
+  sad: "slump", tired: "slump", devastated: "headdown", sheepish: "slump",
+  angry: "shake", hiding: "slump", crying: "slump", sleeping: "headdown",
+};
+
+export function createNpcs(worldEl) {
+  const npcs = {};
+  for (const [id, spot] of Object.entries(NPC_SPOTS)) {
+    // desks/cubicles are part of the canvas scene now (map.js)
+    const opts = { facing: "down", pose: "idle" };
+    npcs[id] = makeChar(worldEl, id, spot.x, spot.y, opts);
+    npcs[id].bubble = null;
+    npcs[id].mood = "normal";
+  }
+  // Derek's default idle is one static frame. Intentional. Slightly unsettling.
+  npcs.derek.setPose("still");
+
+  // occasional ZZZ when Derek is left alone long enough
+  setInterval(() => {
+    if (npcs.derek.mood === "normal" && Math.random() < 0.3)
+      zzz(NPC_SPOTS.derek.x + 8, NPC_SPOTS.derek.y - 36);
+  }, 6000);
+
+  return {
+    npcs,
+    applyMoods(moods) {
+      for (const [id, mood] of Object.entries(moods || {})) {
+        const npc = npcs[id];
+        if (!npc || npc.mood === mood) continue;
+        npc.mood = mood;
+        if (id === "derek" && (mood === "normal" || mood === "happy"))
+          npc.setPose("still");
+        else npc.setPose(MOOD_POSE[mood] || "idle");
+      }
+    },
+    showBubble(id, kind = "danger") {
+      this.clearBubbles();
+      const npc = npcs[id];
+      const el = document.createElement("div");
+      el.className = "bubble" + (kind === "amber" ? " amber" : "") +
+        (kind === "heart" ? " heart" : "");
+      el.textContent = kind === "amber" ? "?" : kind === "heart" ? "♥" : "!";
+      el.style.left = `${npc.x}px`;
+      el.style.top = `${npc.y - 52}px`;
+      npc.root.parentElement.appendChild(el);
+      npc.bubble = el;
+      if (kind !== "heart") npc.setPose("shake");
+      setTimeout(() => { if (npc.bubble === el) npc.setPose(
+        MOOD_POSE[npc.mood] || "idle"); }, 600);
+    },
+    clearBubbles() {
+      for (const npc of Object.values(npcs))
+        if (npc.bubble) { npc.bubble.remove(); npc.bubble = null; }
+    },
+    freezeAll(v) {
+      for (const npc of Object.values(npcs)) npc.setDim(false), npc.root
+        .style.filter = v ? "brightness(.8)" : "";
+    },
+    // ambient speech bubble above an NPC; queued so eavesdrop alternates
+    sayBubble(id, text, ms = 4200) {
+      const npc = npcs[id];
+      if (!npc) return;
+      const el = document.createElement("div");
+      el.className = "say-bubble";
+      el.textContent = text;
+      el.style.left = `${npc.x}px`;
+      el.style.top = `${npc.y - 58}px`;
+      npc.root.parentElement.appendChild(el);
+      setTimeout(() => el.classList.add("fading"), ms - 600);
+      setTimeout(() => el.remove(), ms);
+    },
+    saySequence(lines, gap = 3400) {
+      lines.forEach((entry, i) => {
+        setTimeout(() => this.sayBubble(entry.speaker, entry.line, gap - 200),
+                   i * gap);
+      });
+    },
+  };
+}

static/js/office34.js

@@ -0,0 +1,454 @@
+/* ============================================================
+   office34.js — 3/4 top-down ("RPG / Stardew") world engine
+   Brad Did Something — WARMLIGHT direction (plan of record).
+
+   Orthographic projection: every object shows its TOP and its
+   FRONT face simultaneously. Axis-aligned (not isometric).
+   Daylight, warm-neutral palette. No CRT.
+
+   Vanilla JS. Exposes window.Office34:
+     • render(rootEl, theme)          — 560x384 style vignette (3 themes)
+     • renderCanonical(rootEl, theme) — 640x400 named game floor
+     • primitives: person, station, plant, printer, cooler, papers,
+       table, couch, fridge, door, whiteboard, room, wallTop
+     • THEMES.warmlight (+ coolopen, cozyden for exploration)
+   ============================================================ */
+(function () {
+  /* ---- inject shared keyframes once ---- */
+  if (!document.getElementById("o34-style")) {
+    const s = document.createElement("style");
+    s.id = "o34-style";
+    s.textContent = `
+      .o34-root, .o34-root * { box-sizing: border-box; image-rendering: pixelated; }
+      @media (prefers-reduced-motion: no-preference) {
+        .o34-bob   { animation: o34bob 2.6s steps(2) infinite; }
+        .o34-bob2  { animation: o34bob 2.1s steps(2) infinite; }
+        .o34-blink { animation: o34blink 1s steps(2) infinite; }
+        .o34-spin  { animation: o34spin 6s linear infinite; }
+        .o34-door  { animation: o34door 1.8s ease-in-out infinite; }
+      }
+      @keyframes o34bob  { 50% { transform: translateY(-2px); } }
+      @keyframes o34blink{ 50% { opacity: .2; } }
+      @keyframes o34spin { to { transform: rotate(360deg); } }
+      @keyframes o34door {
+        0%,100% { box-shadow: 0 0 7px 1px rgba(255,207,107,.55); }
+        50%     { box-shadow: 0 0 18px 5px rgba(255,207,107,.95); }
+      }
+    `;
+    document.head.appendChild(s);
+  }
+
+  /* ---------- tiny string-builder helpers ---------- */
+  function rect(x, y, w, h, bg, extra) {
+    return `<i style="position:absolute;left:${x}px;top:${y}px;width:${w}px;height:${h}px;background:${bg};${extra || ""}"></i>`;
+  }
+  function grp(x, y, w, h, z, inner, extra) {
+    return `<div style="position:absolute;left:${x}px;top:${y}px;width:${w}px;height:${h}px;z-index:${z};${extra || ""}">${inner}</div>`;
+  }
+  const out = (ink) => `box-shadow:0 0 0 2px ${ink};`;
+
+  /* =========================================================
+     FRONT-FACING PIXEL PERSON  (naturalistic, ~30x42 box)
+     ========================================================= */
+  function person(p, ink) {
+    const skin = p.skin, hair = p.hair, shirt = p.shirt, pants = p.pants || "#2c2b3a";
+    let h = "";
+    h += rect(8, 30, 6, 9, pants, out(ink));
+    h += rect(16, 30, 6, 9, pants, out(ink));
+    h += rect(7, 37, 8, 3, "#26242f", "");
+    h += rect(15, 37, 8, 3, "#26242f", "");
+    h += rect(2, 17, 5, 12, shirt, out(ink));
+    h += rect(23, 17, 5, 12, shirt, out(ink));
+    h += rect(2, 27, 5, 4, skin, "");
+    h += rect(23, 27, 5, 4, skin, "");
+    h += rect(6, 16, 18, 16, shirt, out(ink) + "border-radius:5px 5px 2px 2px;");
+    if (p.tie) h += rect(14, 18, 3, 11, p.tie, "");
+    h += rect(13, 13, 4, 5, skin, "");
+    h += rect(11, 16, 8, 3, "rgba(0,0,0,.18)", "border-radius:0 0 50% 50%;");
+    h += rect(7, 0, 16, 15, skin, out(ink) + "border-radius:46% 46% 44% 44%;z-index:2;");
+    if (p.style === "bald") {
+      h += rect(9, -1, 12, 5, hair, out(ink) + "border-radius:50% 50% 12% 12%;z-index:3;");
+    } else if (p.style === "long") {
+      h += rect(5, 1, 4, 16, hair, out(ink) + "border-radius:50% 20% 30% 60%;z-index:1;");
+      h += rect(21, 1, 4, 16, hair, out(ink) + "border-radius:20% 50% 60% 30%;z-index:1;");
+      h += rect(6, -2, 18, 8, hair, out(ink) + "border-radius:55% 55% 30% 30%;z-index:3;");
+      if (p.streak) h += rect(20, 0, 4, 13, p.streak, "z-index:4;border-radius:30% 50% 60% 30%;");
+    } else if (p.style === "messy") {
+      h += rect(5, -3, 20, 9, hair, out(ink) + "border-radius:60% 50% 40% 40% / 70% 65% 30% 30%;z-index:3;");
+    } else {
+      h += rect(6, -2, 18, 8, hair, out(ink) + "border-radius:55% 55% 25% 35%;z-index:3;");
+    }
+    h += rect(11, 6, 2, 3, ink, "z-index:4;border-radius:1px;");
+    h += rect(17, 6, 2, 3, ink, "z-index:4;border-radius:1px;");
+    if (p.glasses) {
+      h += rect(9, 5, 5, 5, "transparent", "z-index:5;border:2px solid " + ink + ";border-radius:2px;");
+      h += rect(16, 5, 5, 5, "transparent", "z-index:5;border:2px solid " + ink + ";border-radius:2px;");
+      h += rect(14, 7, 2, 2, ink, "z-index:5;");
+    }
+    if (p.sweat) h += rect(20, 4, 3, 4, "#7fc6e8", "z-index:6;border-radius:60% 60% 50% 50%;box-shadow:0 0 4px #7fc6e8;");
+    h += rect(13, 11, 4, 2, "rgba(120,40,30,.55)", "z-index:4;border-radius:2px;");
+    return h;
+  }
+
+  /* =========================================================
+     DESK STATION (top + front + monitor + chair + character)
+     opts: {x,y, screen, char, name, tone, papers, alert,
+            still, lean, ring}
+     ========================================================= */
+  function station(o, T) {
+    const { x, y } = o;
+    const dW = 72, dTopH = 26, dFrontH = 9;
+    const z = y + 200;
+    let h = "";
+
+    // ring (player spotlight) drawn under everything
+    let pre = "";
+    if (o.ring) {
+      pre = `<div class="o34-spin" style="position:absolute;left:${dW / 2 - 22}px;top:${dTopH + dFrontH + 14}px;width:44px;height:44px;border:2px dashed rgba(255,255,255,.6);border-radius:50%;z-index:0;"></div>`;
+    }
+
+    // chair tucked under desk
+    const chairY = dTopH + dFrontH - 4;
+    h += `<div style="position:absolute;left:${dW / 2 - 15}px;top:${chairY}px;width:30px;height:30px;z-index:1;">
+        ${rect(3, 8, 24, 18, T.chair, out(T.ink) + "border-radius:8px 8px 4px 4px;")}
+        ${rect(6, 2, 18, 12, T.chair2, out(T.ink) + "border-radius:9px 9px 3px 3px;")}
+        ${rect(12, 24, 6, 6, "#22232b", "")}
+      </div>`;
+
+    // desk top + front face
+    h += rect(0, 0, dW, dTopH, T.deskTop, out(T.ink) + "border-radius:2px;");
+    h += rect(2, 2, dW - 4, 4, "rgba(255,255,255,.16)", "border-radius:2px;");
+    h += rect(0, dTopH - 2, dW, dFrontH, T.deskFront, out(T.ink));
+    h += rect(0, dTopH - 2, dW, 2, "rgba(0,0,0,.25)", "");
+
+    // monitor standing at back, facing viewer
+    const mW = 26, mH = 19, mx = dW / 2 - mW / 2;
+    h += rect(dW / 2 - 5, -3, 10, 7, "#3a3d49", out(T.ink));
+    h += rect(mx, -16, mW, mH, "#2b2e3a", out(T.ink) + "border-radius:2px;");
+    const scr = o.screen || "lines";
+    if (scr !== "off") {
+      h += rect(mx + 3, -13, mW - 6, mH - 6, T.screen, "border-radius:1px;box-shadow:0 0 6px rgba(110,200,255,.35);");
+      if (scr === "chart") {
+        h += rect(mx + 5, -6, 3, 4, "#ffd56b", "");
+        h += rect(mx + 9, -8, 3, 6, "#6fd0ff", "");
+        h += rect(mx + 13, -5, 3, 3, "#ff8e6b", "");
+        h += rect(mx + 17, -9, 3, 7, "#8fe39a", "");
+      } else {
+        h += rect(mx + 5, -11, mW - 12, 2, "#9fe0ff", "");
+        h += rect(mx + 5, -8, mW - 16, 2, "#cfeeff", "");
+        h += rect(mx + 5, -5, mW - 10, 2, "#7fc8ff", "");
+      }
+    } else {
+      h += rect(mx + 3, -13, mW - 6, mH - 6, "#11131c", "border-radius:1px;");
+    }
+    // keyboard + mouse
+    h += rect(dW / 2 - 13, dTopH - 9, 26, 6, "#dcdae2", out(T.ink) + "border-radius:1px;");
+    h += rect(dW / 2 + 16, dTopH - 8, 5, 4, "#dcdae2", out(T.ink) + "border-radius:50%;");
+    // mug
+    h += rect(8, 6, 6, 6, o.tone || "#c96a4a", out(T.ink) + "border-radius:1px 1px 2px 2px;");
+    // papers on desk
+    if (o.papers) {
+      h += rect(dW - 20, 4, 11, 9, "#f3f0e6", out(T.ink) + "transform:rotate(-8deg);");
+      h += rect(dW - 16, 7, 11, 9, "#fbf8ee", out(T.ink) + "transform:rotate(6deg);");
+    }
+
+    // character standing in front, facing viewer
+    let charH = "";
+    if (o.char) {
+      const cls = o.still ? "" : "o34-bob";
+      const lean = o.lean ? "transform:rotate(-7deg);transform-origin:50% 100%;" : "";
+      charH = `<div class="${cls}" style="position:absolute;left:${dW / 2 - 15}px;top:${dTopH + dFrontH + 6}px;width:30px;height:42px;z-index:3;${lean}">
+          ${person(o.char, T.ink)}
+        </div>`;
+    }
+    if (o.alert) {
+      charH += `<div class="o34-blink" style="position:absolute;left:${dW / 2 + 12}px;top:-30px;width:18px;height:18px;z-index:6;background:#fff;border:2px solid ${T.ink};border-radius:4px;display:flex;align-items:center;justify-content:center;font-family:var(--font-display,monospace);font-size:11px;color:#d8402a;">!</div>`;
+    }
+    const tagY = dTopH + dFrontH + 52;
+    const tag = `<div style="position:absolute;left:-8px;top:${tagY}px;width:${dW + 16}px;text-align:center;font-family:var(--font-display,monospace);font-size:7px;letter-spacing:1px;color:${o.tone || "#fff"};text-shadow:1px 1px 0 ${T.ink};z-index:7;">${o.name || ""}</div>`;
+
+    return grp(x, y, dW, tagY + 14, z, pre + h + charH + tag);
+  }
+
+  /* =========================================================
+     PROPS
+     ========================================================= */
+  function plant(x, y, T, big) {
+    const s = big ? 1.25 : 1;
+    const w = Math.round(26 * s), potH = Math.round(12 * s);
+    let h = "";
+    h += rect(0, 18 * s, w, potH, T.pot, out(T.ink) + "border-radius:2px 2px 4px 4px;");
+    h += rect(0, 18 * s, w, 3, "rgba(255,255,255,.15)", "");
+    h += rect(2, 0, w - 4, Math.round(22 * s), T.leaf, out(T.ink) + "border-radius:60% 60% 40% 40%;");
+    h += rect(5, 3, 8, 10, T.leaf2, "border-radius:60% 30% 50% 40%;");
+    h += rect(w - 13, 5, 8, 9, T.leaf2, "border-radius:30% 60% 40% 50%;");
+    return grp(x, y, w, Math.round(30 * s), y + 200, h);
+  }
+  function printer(x, y, T) {
+    let h = "";
+    h += rect(0, 6, 34, 22, "#cfccc4", out(T.ink) + "border-radius:2px;");
+    h += rect(0, 6, 34, 4, "rgba(255,255,255,.2)", "");
+    h += rect(4, 0, 26, 8, "#b7b4ab", out(T.ink) + "border-radius:2px 2px 0 0;");
+    h += rect(6, 24, 22, 7, "#e9e6dc", out(T.ink));
+    h += rect(9, 26, 16, 9, "#fbf9f1", out(T.ink) + "transform:rotate(2deg);");
+    h += rect(24, 10, 4, 4, "#7fe39a", "border-radius:50%;box-shadow:0 0 4px #7fe39a;");
+    return grp(x, y, 34, 34, y + 200, h);
+  }
+  function cooler(x, y, T) {
+    let h = "";
+    h += rect(2, 14, 20, 22, "#e8ecef", out(T.ink) + "border-radius:2px;");
+    h += rect(4, 0, 16, 16, "#7fb9e0", out(T.ink) + "border-radius:6px 6px 2px 2px;");
+    h += rect(6, 2, 12, 8, "#a9d6f2", "border-radius:5px 5px 1px 1px;");
+    h += rect(7, 22, 10, 4, "#5a6a78", "");
+    return grp(x, y, 24, 38, y + 200, h);
+  }
+  function papers(x, y, T, n) {
+    let h = "";
+    for (let i = 0; i < (n || 4); i++) {
+      const px = (i * 13) % 40, py = ((i * 9) % 18);
+      h += rect(px, py, 11, 9, i % 2 ? "#fbf8ee" : "#eceadf", out(T.ink) + `transform:rotate(${(i % 2 ? 1 : -1) * (6 + i * 3)}deg);`);
+    }
+    return grp(x, y, 52, 30, y + 60, h);
+  }
+  // boardroom meeting table (3/4: top + front), with little chairs
+  function table(x, y, w, hgt, T) {
+    let h = "";
+    // chairs along top + bottom edges
+    let chairs = "";
+    const cn = Math.max(2, Math.round(w / 30));
+    for (let i = 0; i < cn; i++) {
+      const cx = 8 + i * ((w - 16) / (cn - 1)) - 7;
+      chairs += rect(cx, -10, 14, 12, T.chair, out(T.ink) + "border-radius:6px 6px 2px 2px;z-index:0;");
+      chairs += rect(cx, hgt + 2, 14, 11, T.chair2, out(T.ink) + "border-radius:3px 3px 6px 6px;z-index:0;");
+    }
+    h += chairs;
+    h += rect(0, 0, w, hgt, "#6b4a2e", out(T.ink) + "border-radius:4px;"); // top
+    h += rect(3, 3, w - 6, 5, "rgba(255,255,255,.14)", "border-radius:3px;");
+    h += rect(0, hgt - 2, w, 8, "#49301a", out(T.ink)); // front
+    // a couple of docs + a mug on the table
+    h += rect(w * 0.3, hgt * 0.3, 12, 9, "#fbf8ee", out(T.ink) + "transform:rotate(-6deg);");
+    h += rect(w * 0.58, hgt * 0.4, 6, 6, "#c96a4a", out(T.ink) + "border-radius:1px;");
+    return grp(x, y, w, hgt + 14, y + 100, h);
+  }
+  function couch(x, y, T) {
+    let h = "";
+    h += rect(0, 0, 56, 12, "#5f7384", out(T.ink) + "border-radius:6px 6px 2px 2px;"); // back
+    h += rect(0, 10, 56, 18, "#6d8294", out(T.ink) + "border-radius:2px 2px 4px 4px;"); // seat
+    h += rect(0, 8, 9, 18, "#566a7b", out(T.ink) + "border-radius:4px 2px 2px 4px;"); // arm L
+    h += rect(47, 8, 9, 18, "#566a7b", out(T.ink) + "border-radius:2px 4px 4px 2px;"); // arm R
+    h += rect(12, 13, 14, 11, "#7d92a3", "border-radius:3px;");
+    h += rect(30, 13, 14, 11, "#7d92a3", "border-radius:3px;");
+    return grp(x, y, 56, 34, y + 200, h);
+  }
+  function fridge(x, y, T) {
+    let h = "";
+    h += rect(0, 0, 26, 40, "#e2e5e9", out(T.ink) + "border-radius:3px;");
+    h += rect(0, 0, 26, 5, "rgba(255,255,255,.35)", "border-radius:3px 3px 0 0;");
+    h += rect(0, 18, 26, 2, T.ink, ""); // door split
+    h += rect(20, 6, 3, 9, "#9aa0a8", out(T.ink)); // handle top
+    h += rect(20, 24, 3, 9, "#9aa0a8", out(T.ink)); // handle bottom
+    return grp(x, y, 26, 44, y + 200, h);
+  }
+  // glowing amber boardroom door (animation drives the box-shadow glow,
+  // so the hard edge is a border, not a box-shadow)
+  function door(x, y, T) {
+    return `<div class="o34-door" style="position:absolute;left:${x}px;top:${y}px;width:38px;height:12px;z-index:${y + 250};background:linear-gradient(180deg,#ffe79a,#f3b53e 60%,#d99c1e);border:2px solid #8a5a12;"></div>`;
+  }
+  function whiteboard(x, y, T) {
+    let h = "";
+    h += rect(0, 0, 64, 34, "#f4f3ec", out(T.ink) + "border-radius:1px;");
+    h += rect(6, 7, 44, 2, "#d8402a", "");
+    h += rect(6, 14, 30, 2, "#3a6ea5", "");
+    h += rect(6, 21, 38, 2, "#2f9a93", "");
+    h += rect(6, 28, 24, 2, "#c79a3a", "");
+    return grp(x, y, 64, 34, 2, h);
+  }
+  // a floor-tinted partitioned room patch (top + side low walls, label on floor)
+  function room(x, y, w, hgt, label, T, opts) {
+    opts = opts || {};
+    const floor = opts.wood ? T.wood : T.roomFloor;
+    const seam = opts.wood ? T.woodSeam : T.seam;
+    let h = "";
+    // floor
+    h += `<i style="position:absolute;left:0;top:0;width:${w}px;height:${hgt}px;background:${floor};
+        background-image:linear-gradient(90deg, ${seam} 2px, transparent 2px), linear-gradient(0deg, ${seam} 2px, transparent 2px);
+        background-size:${opts.wood ? "16px 28px" : T.tile + "px " + T.tile + "px"};box-shadow:inset 0 0 16px rgba(0,0,0,.18);"></i>`;
+    // partition: top + left + right low walls (front faces)
+    h += rect(0, 0, w, 7, T.panelTop, out(T.ink));
+    h += rect(0, 0, 6, hgt, T.panelTop, out(T.ink));
+    h += rect(w - 6, 0, 6, hgt, T.panelTop, out(T.ink));
+    // label
+    h += `<span style="position:absolute;left:0;top:11px;width:${w}px;text-align:center;font-family:var(--font-display,monospace);font-size:7px;letter-spacing:1px;color:${T.ink};opacity:.55;">${label}</span>`;
+    return grp(x, y, w, hgt, y + 1, h);
+  }
+  function wallTop(W, T) {
+    let h = "";
+    h += rect(0, 0, W, 44, T.wallFace, "");
+    h += rect(0, 0, W, 6, T.wallTrim, "");
+    h += rect(0, 37, W, 7, T.wallBase, out(T.ink));
+    h += rect(0, 37, W, 2, "rgba(0,0,0,.22)", "");
+    return grp(0, 0, W, 44, 3, h);
+  }
+
+  /* ---- character roster (warm/daylight palette, keeps identity) ---- */
+  const CAST = {
+    stacey: { skin: "#f2c9a8", hair: "#8a5230", shirt: "#2f9a93", style: "long" },
+    kevin:  { skin: "#ecc7a2", hair: "#34323f", shirt: "#c79a3a", style: "neat", glasses: true, tie: "#9c7726" },
+    janet:  { skin: "#e9b88f", hair: "#241a30", shirt: "#8a5bb0", style: "long", streak: "#d24bb0" },
+    brad:   { skin: "#f0c3a0", hair: "#6e4422", shirt: "#c8623e", style: "messy", sweat: true },
+    you:    { skin: "#f0c8a4", hair: "#cfcad8", shirt: "#e7e5ef", style: "short" },
+    derek:  { skin: "#e7bfa0", hair: "#6f6a52", shirt: "#7fa8c8", style: "bald" },
+  };
+  const TONE = { stacey: "#34c4b6", kevin: "#ffd56b", janet: "#c98cff", brad: "#ff7a52", you: "#f4f1ff", derek: "#9ec4e6" };
+
+  /* ---- base carpet div (sits below top wall) ---- */
+  function carpet(W, H, T, topY) {
+    return `<div style="position:absolute;left:0;top:${topY}px;width:${W}px;height:${H - topY}px;background:${T.floor};
+        background-image:
+          linear-gradient(0deg, ${T.seam} 2px, transparent 2px),
+          linear-gradient(90deg, ${T.seam} 2px, transparent 2px),
+          linear-gradient(180deg, ${T.fhi} 1px, transparent 1px),
+          linear-gradient(270deg, ${T.fhi} 1px, transparent 1px);
+        background-size:${T.tile}px ${T.tile}px;z-index:0;"></div>`;
+  }
+  function lighting(T) {
+    let h = `<div style="position:absolute;inset:0;z-index:9990;pointer-events:none;${T.light}"></div>`;
+    if (T.grain) {
+      h += `<div style="position:absolute;inset:0;z-index:9991;pointer-events:none;opacity:.5;mix-blend-mode:multiply;
+        background-image:radial-gradient(${T.ink} 0.5px, transparent 0.6px);background-size:3px 3px;"></div>`;
+    }
+    return h;
+  }
+
+  /* =========================================================
+     VIGNETTE render (used by the exploration page)
+     ========================================================= */
+  function render(root, T) {
+    root.classList.add("o34-root");
+    const W = 560, H = 384, wallH = 56;
+    root.style.cssText += `position:relative;width:${W}px;height:${H}px;overflow:hidden;background:${T.floor};`;
+    let h = carpet(W, H, T, wallH);
+    h += rect(0, 0, W, wallH, T.wallFace, "z-index:1;");
+    h += rect(0, 0, W, 6, T.wallTrim, "z-index:1;");
+    h += rect(0, wallH - 7, W, 7, T.wallBase, out(T.ink) + "z-index:1;");
+    h += rect(0, wallH - 7, W, 2, "rgba(0,0,0,.22)", "z-index:1;");
+    [60, 360].forEach((wx) => {
+      h += rect(wx, 12, 70, 30, "#aee0f2", out(T.ink) + "z-index:2;");
+      h += rect(wx, 12, 70, 8, "#cdeefb", "z-index:2;");
+      h += rect(wx + 33, 12, 4, 30, T.wallBase, "z-index:2;");
+      h += rect(wx, 26, 70, 3, T.wallBase, "z-index:2;");
+    });
+    h += rect(150, 9, 56, 18, "#eceae2", out(T.ink) + "z-index:2;border-radius:2px;");
+    for (let i = 0; i < 5; i++) h += rect(156 + i * 10, 20, 6, 3, "#c7c4ba", "z-index:2;");
+    h += grp(248, 10, 64, 34, 2, whiteboard(0, 0, T));
+    h += rect(0, wallH, 7, H - wallH, T.wallBase, out(T.ink) + "z-index:1;");
+    h += rect(W - 7, wallH, 7, H - wallH, T.wallBase, out(T.ink) + "z-index:1;");
+    h += plant(18, 64, T, true);
+    h += cooler(20, 250, T);
+    h += printer(508, 112, T);
+    h += plant(512, 320, T);
+    if (T.density !== "low") h += papers(150, 300, T, 5);
+    const colX = [96, 252, 408], rowA = 92, rowB = 224;
+    h += station({ x: colX[0], y: rowA, char: CAST.stacey, name: "STACEY", tone: TONE.stacey }, T);
+    h += station({ x: colX[1], y: rowA, char: CAST.kevin, name: "KEVIN", tone: TONE.kevin, screen: "chart" }, T);
+    h += station({ x: colX[2], y: rowA, char: CAST.janet, name: "JANET", tone: TONE.janet }, T);
+    h += station({ x: colX[0], y: rowB, char: CAST.brad, name: "BRAD", tone: TONE.brad, papers: true, alert: true, lean: true }, T);
+    h += station({ x: colX[1], y: rowB, char: CAST.you, name: "YOU", tone: TONE.you, ring: true }, T);
+    h += station({ x: colX[2], y: rowB, char: CAST.derek, name: "DEREK", tone: TONE.derek, screen: "off", still: true }, T);
+    h += lighting(T);
+    root.innerHTML = h;
+  }
+
+  /* =========================================================
+     CANONICAL game floor (640x400) — named cast + rooms
+     ========================================================= */
+  function renderCanonical(root, T) {
+    root.classList.add("o34-root");
+    const W = 640, H = 400, wallH = 44;
+    root.style.cssText += `position:relative;width:${W}px;height:${H}px;overflow:hidden;background:${T.floor};`;
+    let h = carpet(W, H, T, wallH);
+
+    // top wall + fixtures
+    h += wallTop(W, T);
+    [22, 470].forEach((wx) => {
+      h += grp(wx, 11, 80, 26, 4, rect(0, 0, 80, 26, "#aee0f2", out(T.ink)) + rect(0, 0, 80, 7, "#cdeefb", "") + rect(38, 0, 4, 26, T.wallBase, "") + rect(0, 12, 80, 3, T.wallBase, ""));
+    });
+    h += grp(250, 8, 60, 18, 4, rect(0, 0, 60, 18, "#eceae2", out(T.ink) + "border-radius:2px;") + [0,1,2,3,4].map(i => rect(6 + i * 10, 11, 6, 3, "#c7c4ba", "")).join(""));
+
+    // ROOMS
+    h += room(8, wallH, 210, 104, "BOARDROOM", T, { wood: true });
+    h += table(48, wallH + 30, 120, 40, T);
+    h += door(98, wallH + 96, T);
+
+    h += room(424, wallH, 208, 104, "BREAK ROOM", T, { wood: true });
+    h += couch(452, wallH + 30, T);
+    h += fridge(592, wallH + 14, T);
+    h += cooler(556, wallH + 56, T);
+    h += grp(524, wallH + 60, 30, 18, 320, rect(0, 6, 30, 12, "#6b4a2e", out(T.ink) + "border-radius:50%;") + rect(8, 0, 14, 12, "#fbf8ee", out(T.ink))); // small round table + cup
+
+    // corridor centre: whiteboard on wall + a plant
+    h += grp(290, 9, 64, 30, 4, whiteboard(0, 0, T));
+    h += plant(300, wallH + 14, T, false);
+
+    // BULLPEN — the named cast
+    const colX = [38, 290, 542 - 30];
+    const rowA = wallH + 116, rowB = wallH + 240;
+    h += station({ x: colX[0], y: rowA, char: CAST.stacey, name: "STACEY", tone: TONE.stacey }, T);
+    h += station({ x: colX[1], y: rowA, char: CAST.kevin, name: "KEVIN", tone: TONE.kevin, screen: "chart" }, T);
+    h += station({ x: colX[2], y: rowA, char: CAST.janet, name: "JANET", tone: TONE.janet }, T);
+    h += station({ x: colX[0], y: rowB, char: CAST.brad, name: "BRAD", tone: TONE.brad, papers: true, alert: true, lean: true }, T);
+    h += station({ x: colX[1], y: rowB, char: CAST.you, name: "YOU", tone: TONE.you, ring: true }, T);
+    h += station({ x: colX[2], y: rowB, char: CAST.derek, name: "DEREK", tone: TONE.derek, screen: "off", still: true }, T);
+
+    // extra props
+    h += printer(594, wallH + 150, T);
+    h += papers(150, wallH + 224, T, 5);
+
+    h += lighting(T);
+    root.innerHTML = h;
+  }
+
+  /* =========================================================
+     THEMES
+     ========================================================= */
+  const THEMES = {
+    warmlight: {
+      name: "WARMLIGHT", tile: 28,
+      floor: "#8d8b82", seam: "#76746b", fhi: "rgba(255,255,255,.06)",
+      wallFace: "#d8d4c8", wallBase: "#b4af9f", wallTrim: "#ece8dc",
+      deskTop: "#c3a169", deskFront: "#997b46",
+      panelTop: "#c6c2b6", chair: "#3b3e46", chair2: "#4a4e58", screen: "#1c3a5a",
+      pot: "#b5703a", leaf: "#5f8a3f", leaf2: "#74a352",
+      wood: "#b58a55", woodSeam: "#9a763f", roomFloor: "#878579",
+      ink: "#2e2a22", density: "med",
+      light: "background:radial-gradient(ellipse at 50% 12%, rgba(255,248,226,.16) 0%, transparent 55%), radial-gradient(ellipse at 50% 122%, rgba(20,16,30,.30) 0%, transparent 60%);",
+    },
+    coolopen: {
+      name: "COOL OPEN-PLAN", tile: 32,
+      floor: "#9a9aa0", seam: "#7f7f86", fhi: "rgba(255,255,255,.08)",
+      wallFace: "#e3e4e7", wallBase: "#c2c3c8", wallTrim: "#f2f3f5",
+      deskTop: "#d8d2c4", deskFront: "#b1ab9b",
+      panelTop: "#cfd0d4", chair: "#2f3138", chair2: "#3c3f48", screen: "#15324d",
+      pot: "#9a9da6", leaf: "#5b8f6a", leaf2: "#74ab84",
+      wood: "#c2b6a4", woodSeam: "#a59a86", roomFloor: "#93939a",
+      ink: "#2f2f38", density: "low",
+      light: "background:radial-gradient(ellipse at 50% 8%, rgba(235,245,255,.22) 0%, transparent 60%), radial-gradient(ellipse at 50% 125%, rgba(30,34,46,.20) 0%, transparent 60%);",
+    },
+    cozyden: {
+      name: "COZY DEN", tile: 26,
+      floor: "#8a7f6e", seam: "#6f6557", fhi: "rgba(255,224,170,.07)",
+      wallFace: "#cdbfa6", wallBase: "#a99b80", wallTrim: "#e6dcc4",
+      deskTop: "#b98f54", deskFront: "#89642f",
+      panelTop: "#bda678", chair: "#39322a", chair2: "#4a4136", screen: "#1c3450",
+      pot: "#a85f30", leaf: "#5a7d35", leaf2: "#6f9446",
+      wood: "#a87c45", woodSeam: "#8a6230", roomFloor: "#827868",
+      ink: "#2c2114", density: "high", grain: true,
+      light: "background:radial-gradient(ellipse at 50% 14%, rgba(255,214,140,.20) 0%, transparent 55%), radial-gradient(ellipse at 50% 120%, rgba(30,18,8,.40) 0%, transparent 62%);",
+    },
+  };
+
+  window.Office34 = {
+    render, renderCanonical, THEMES, CAST, TONE,
+    person, station, plant, printer, cooler, papers, table, couch, fridge, door, whiteboard, room, wallTop,
+  };
+})();

static/js/papertrail.js

@@ -0,0 +1,44 @@
+// paper trail side panel — dollars, never HP (DESIGN_SYSTEM decisions log)
+import { G } from "./state.js";
+import { charColor } from "./sprites.js";
+
+const fmtK = (n) => {
+  const a = Math.abs(n);
+  return (n >= 0 ? "+$" : "-$") + (a >= 1000 ? `${Math.round(a / 1000)}K` : a);
+};
+
+let rendered = 0;
+
+export function renderTrail(entries) {
+  const box = G.els["pt-entries"];
+  if (!entries || entries.length === 0) return;
+  const empty = box.querySelector(".pt-empty");
+  if (empty) empty.remove();
+  // append only the new ones so the slide-in animation plays once each
+  for (let i = rendered; i < entries.length; i++) {
+    const e = entries[i];
+    const el = document.createElement("div");
+    el.className = "pt-entry";
+    const color = e.npc === "board" ? "#ffc73b"
+      : e.npc === "player" ? "var(--bds-white)" : charColor(e.npc);
+    el.innerHTML =
+      `<span class="pt-npc" style="color:${color}">${(e.npc || "?").toUpperCase()}</span> ` +
+      `<span class="pt-delta ${e.delta >= 0 ? "up" : "down"}">${e.delta !== 0 ? fmtK(e.delta) : ""}</span>` +
+      `<div class="pt-text">${escapeHtml(e.text)}</div>`;
+    box.appendChild(el);
+  }
+  rendered = entries.length;
+  box.scrollTop = box.scrollHeight;
+}
+
+export function resetTrail() {
+  rendered = 0;
+  G.els["pt-entries"].innerHTML =
+    '<div class="pt-empty">&gt; nothing is on fire. yet.</div>';
+}
+
+export function escapeHtml(s) {
+  const d = document.createElement("div");
+  d.textContent = s == null ? "" : String(s);
+  return d.innerHTML;
+}

static/js/particles.js

@@ -0,0 +1,100 @@
+// DOM particle effects inside #fx (UI_UX.md §8)
+import { G } from "./state.js";
+
+export function floatText(x, y, text, color, down = false) {
+  const el = document.createElement("div");
+  el.className = "float-text" + (down ? " down" : "");
+  el.style.left = `${x}px`; el.style.top = `${y}px`; el.style.color = color;
+  el.textContent = text;
+  G.els.fx.appendChild(el);
+  setTimeout(() => el.remove(), 1700);
+}
+
+function pixel(x, y, color, size = 4) {
+  const el = document.createElement("div");
+  el.className = "pixel-part";
+  el.style.cssText += `;left:${x}px;top:${y}px;width:${size}px;height:${size}px;
+    background:${color};`;
+  G.els.fx.appendChild(el);
+  return el;
+}
+
+export function heartFloat(x, y) {
+  const el = document.createElement("div");
+  el.className = "pixel-part";
+  el.appendChild(window.BDSChibi.pixelGlyph(
+    window.BDSChibi.GLYPHS.heart, 3, "var(--bds-neon-magenta)", true));
+  el.style.left = `${x}px`; el.style.top = `${y}px`;
+  el.animate([{ transform: "translateY(0)", opacity: 1 },
+              { transform: "translateY(-34px)", opacity: 0 }],
+             { duration: 1100, easing: "steps(6)" });
+  G.els.fx.appendChild(el);
+  setTimeout(() => el.remove(), 1100);
+}
+
+export function confettiBurst() {
+  const colors = ["var(--bds-brad)", "var(--bds-stacey)", "var(--bds-kevin)",
+                  "var(--bds-janet)", "var(--bds-derek)"];
+  for (let i = 0; i < 36; i++) {
+    const el = pixel(320, 200, colors[i % 5]);
+    const dx = (Math.random() - 0.5) * 420;
+    const dy = 120 + Math.random() * 260;
+    el.animate(
+      [{ transform: "translate(0,0)" },
+       { transform: `translate(${dx}px,${dy}px)`, opacity: 0.2 }],
+      { duration: 1400 + Math.random() * 600, easing: "steps(10)" });
+    setTimeout(() => el.remove(), 2000);
+  }
+}
+
+export function revenueRain() {
+  for (let i = 0; i < 14; i++) {
+    setTimeout(() => {
+      const x = 30 + Math.random() * 580;
+      const el = document.createElement("div");
+      el.className = "pixel-part";
+      el.textContent = "$";
+      el.style.cssText += `;left:${x}px;top:-12px;color:var(--bds-neon-lime);
+        font-size:10px;text-shadow:0 0 6px var(--bds-neon-lime);`;
+      el.animate([{ transform: "translateY(0)" },
+                  { transform: "translateY(500px)" }],
+                 { duration: 1500, easing: "steps(12)" });
+      G.els.fx.appendChild(el);
+      setTimeout(() => el.remove(), 1500);
+    }, i * 120);
+  }
+}
+
+export function moraleWave(npcObjs) {
+  const ordered = Object.values(npcObjs).sort((a, b) => a.x - b.x);
+  ordered.forEach((npc, i) => {
+    setTimeout(() => {
+      if (!npc.sprite) return;
+      npc.sprite.animate(
+        [{ transform: "translateY(0)" }, { transform: "translateY(5px)" },
+         { transform: "translateY(0)" }],
+        { duration: 360, easing: "steps(4)" });
+    }, i * 130);
+  });
+}
+
+export function zzz(x, y) {
+  const el = document.createElement("div");
+  el.className = "pixel-part";
+  el.appendChild(window.BDSChibi.pixelGlyph(
+    window.BDSChibi.GLYPHS.z, 2, "var(--bds-derek)", false));
+  el.style.left = `${x}px`; el.style.top = `${y}px`;
+  el.animate([{ transform: "translate(0,0)", opacity: 1 },
+              { transform: "translate(10px,-18px)", opacity: 0 }],
+             { duration: 2200, easing: "steps(6)" });
+  G.els.fx.appendChild(el);
+  setTimeout(() => el.remove(), 2200);
+}
+
+export function steam(x, y) {
+  const el = pixel(x + (Math.random() * 6 - 3), y, "rgba(244,241,255,.5)", 3);
+  el.animate([{ transform: "translateY(0)", opacity: 0.6 },
+              { transform: "translateY(-16px)", opacity: 0 }],
+             { duration: 1400, easing: "steps(5)" });
+  setTimeout(() => el.remove(), 1400);
+}

static/js/player.js

@@ -0,0 +1,47 @@
+// player movement: WASD/arrows + click-to-move, AABB collision
+import { collides, SPOTS } from "./map.js";
+import { makeChar } from "./sprites.js";
+
+const SPEED = 130; // px/s
+
+export function createPlayer(worldEl) {
+  const obj = makeChar(worldEl, "player", SPOTS.playerStart.x,
+                       SPOTS.playerStart.y, { tag: false });
+  obj.target = null; // click-to-move destination
+  obj.frozen = false;
+
+  obj.update = function (dt, keys) {
+    if (this.frozen) { this.setPose("idle", this.facing); return; }
+    let dx = 0, dy = 0;
+    if (keys.up) dy -= 1; if (keys.down) dy += 1;
+    if (keys.left) dx -= 1; if (keys.right) dx += 1;
+
+    if (dx === 0 && dy === 0 && this.target) {
+      const tx = this.target.x - this.x, ty = this.target.y - this.y;
+      const dist = Math.hypot(tx, ty);
+      if (dist < 6) this.target = null;
+      else { dx = tx / dist; dy = ty / dist; }
+    } else if (dx !== 0 || dy !== 0) {
+      this.target = null; // keys override click target
+    }
+
+    if (dx === 0 && dy === 0) { this.setPose("idle", this.facing); return; }
+
+    const len = Math.hypot(dx, dy);
+    const nx = this.x + (dx / len) * SPEED * dt;
+    const ny = this.y + (dy / len) * SPEED * dt;
+    // axis-separated collision so the player slides along walls
+    if (!collides(nx, this.y)) this.setPos(nx, this.y);
+    if (!collides(this.x, ny)) this.setPos(this.x, ny);
+
+    const facing = Math.abs(dx) > Math.abs(dy)
+      ? (dx > 0 ? "right" : "left") : (dy > 0 ? "down" : "up");
+    this.setPose("walk", facing);
+  };
+
+  obj.distTo = function (spot) {
+    return Math.hypot(this.x - spot.x, this.y - spot.y);
+  };
+
+  return obj;
+}

static/js/sprites.js

@@ -0,0 +1,113 @@
+// thin wrapper over the design system's BDSChibi top-down sprites
+const HAIR = {
+  player: "#5d5b86", brad: "#7a4626", stacey: "#9a5a32",
+  kevin: "#33324a", janet: "#241a30", derek: "#6f6a52",
+};
+const COLOR = {
+  player: "var(--bds-white)", brad: "var(--bds-brad)",
+  stacey: "var(--bds-stacey)", kevin: "var(--bds-kevin)",
+  janet: "var(--bds-janet)", derek: "var(--bds-derek)",
+};
+
+export function charColor(id) { return COLOR[id] || "var(--bds-grey)"; }
+
+// a positioned character on the office floor: sprite + name tag + optional desk
+export function makeChar(parent, id, x, y, opts = {}) {
+  const root = document.createElement("div");
+  root.style.cssText =
+    `position:absolute;left:${x}px;top:${y}px;width:0;height:0;z-index:5;`;
+  parent.appendChild(root);
+
+  // contact shadow under the feet — grounds the sprite on the floor
+  const feet = document.createElement("div");
+  feet.style.cssText = `position:absolute;left:-9px;top:0px;width:18px;
+    height:5px;background:rgba(58,61,73,.30);border-radius:50%;z-index:1;`;
+  root.appendChild(feet);
+
+  const obj = {
+    id, x, y, root, sprite: null, pose: null, facing: "down", dim: false,
+    setPose(pose, facing = this.facing) {
+      if (pose === this.pose && facing === this.facing && this.sprite) return;
+      this.pose = pose; this.facing = facing;
+      if (this.sprite) this.sprite.remove();
+      this.sprite = window.BDSChibi.topSprite({
+        who: id, pose, still: pose === "still", facing, dim: this.dim,
+      });
+      this.sprite.style.left = "-14px";
+      this.sprite.style.top = "-30px";
+      root.insertBefore(this.sprite, root.firstChild);
+    },
+    setPos(nx, ny) {
+      this.x = nx; this.y = ny;
+      root.style.left = `${nx}px`; root.style.top = `${ny}px`;
+    },
+    setDim(v) { if (v !== this.dim) { this.dim = v; const p = this.pose;
+      this.pose = null; this.setPose(p); } },
+    remove() { root.remove(); },
+  };
+
+  if (opts.desk) root.appendChild(window.BDSChibi.desk({ dark: opts.darkDesk }));
+  if (opts.tag !== false)
+    root.appendChild(window.BDSChibi.tag(id.toUpperCase(), COLOR[id], { top: 6 }));
+  obj.setPose(opts.pose || "idle", opts.facing || "down");
+  return obj;
+}
+
+// ---- full designed chibi characters (Character Sprite Sheet v1.0) ----
+
+// per-NPC default expression when they pitch a crisis
+const CRISIS_EXPRESSION = {
+  brad: { armPose: "out", mouth: "worried", sweat: true },
+  stacey: { armPose: "wring", mouth: "worried" },
+  kevin: { armPose: "point", mouth: "smirk" },
+  janet: { armPose: "open", mouth: "open" },
+  derek: { mouth: "flat" },
+  player: { mouth: "neutral" },
+};
+
+// outcome animation trigger → chibi expression
+const OUTCOME_EXPRESSION = {
+  npc_happy: { eyes: "happy", mouth: "smile", armPose: "open" },
+  npc_celebrating: { eyes: "happy", mouth: "open", armPose: "open", anim: "a-bounce" },
+  npc_angry: { mouth: "frown", armPose: "hips", anim: "a-shiver" },
+  npc_confused: { mouth: "wavy", tilt: 8 },
+  npc_devastated: { eyes: "closed", mouth: "frown", tilt: 5 },
+  npc_crying: { tears: true, mouth: "frown" },
+  npc_smug: { mouth: "smirk", armPose: "behindhead" },
+  npc_suspicious: { mouth: "flat", armPose: "crossed", tilt: -5 },
+  npc_hiding: { mouth: "worried", sweat: true },
+  npc_grateful: { eyes: "happy", mouth: "smile", blush: true },
+  heart_float: { eyes: "heart", mouth: "smile", blush: true },
+  disaster_flash: { eyes: "wide", mouth: "wavy", sweat: true },
+  revenue_rain: { eyes: "happy", mouth: "open", armPose: "open" },
+};
+
+/* a full chibi in a fixed-size box, scaled to fit (the chibi element itself
+   is ~130-150px tall; transform scale keeps the layout box stable) */
+export function chibiInBox(id, opts = {}, boxW = 72, boxH = 66) {
+  const box = document.createElement("div");
+  box.style.cssText = `position:relative;width:${boxW}px;height:${boxH}px;
+    flex:none;overflow:visible;`;
+  const el = window.BDSChibi.chibi(id, opts.state || "idle", opts);
+  // scale lives on a wrapper: the chibi's own idle/talk animations write to
+  // its transform and would clobber an inline scale set on the element
+  const realH = parseInt(el.style.height, 10) || 150;
+  const scale = opts.fit || boxH / realH;
+  const wrap = document.createElement("div");
+  wrap.style.cssText = `position:absolute;left:50%;bottom:0;
+    transform-origin:bottom center;
+    transform:translateX(-50%) scale(${scale})` +
+    (opts.tilt ? ` rotate(${opts.tilt}deg)` : "") + ";";
+  wrap.appendChild(el);
+  box.appendChild(wrap);
+  return box;
+}
+
+export function crisisPortrait(id) {
+  return chibiInBox(id, { ...CRISIS_EXPRESSION[id] });
+}
+
+export function outcomePortrait(id, animation) {
+  const expr = OUTCOME_EXPRESSION[animation] || CRISIS_EXPRESSION[id] || {};
+  return chibiInBox(id, { ...expr });
+}

static/js/state.js

@@ -0,0 +1,27 @@
+// shared client state — the server snapshot plus client-only bookkeeping
+export const G = {
+  sessionId: null,
+  state: null,          // latest server snapshot (client-safe, no hidden stats)
+  phase: "title",       // mirrors server phase + client-side nuance
+  busy: false,          // a network call is in flight
+  pendingEvent: null,   // fetched event waiting for the player to walk over
+  roamTimer: 0,         // seconds until next event fires
+  telegraphed: false,
+  dialogueOpen: false,
+  els: {},
+};
+
+export function cacheEls() {
+  for (const id of ["stage", "floor", "world", "fx", "boardroom", "dim",
+                    "flash", "edge-pulse", "wipe", "stamp", "hud", "dialogue",
+                    "gift-panel", "title-screen", "review-screen", "pt-entries",
+                    "rev-number", "rev-fill", "boss-title", "crisis-counter",
+                    "pocket", "hr-badge", "hud-banner", "stage-wrap", "comic"]) {
+    G.els[id] = document.getElementById(id);
+  }
+}
+
+export function setState(snapshot) {
+  G.state = snapshot;
+  G.phase = snapshot.phase;
+}

static/js/touch.js

@@ -0,0 +1,87 @@
+// touch.js — on-screen controls for phones/tablets (no physical keyboard).
+//
+// A left thumb-joystick drives the same `keys` object the player already reads,
+// so movement reuses player.update untouched. Right-side ACTION and GIFT
+// buttons fire the same handlers as SPACE and G. Created only on touch devices;
+// CSS hides them whenever a menu/dialogue/comic owns the screen. Tap-to-move
+// (bindStageClick) keeps working too.
+import { keys, emit } from "./input.js";
+
+const DEAD = 0.3; // joystick deadzone as a fraction of its radius
+
+export function isTouch() {
+  return "ontouchstart" in window || navigator.maxTouchPoints > 0;
+}
+
+export function setupTouch() {
+  if (!isTouch()) return;
+  document.body.classList.add("touch");
+  buildJoystick();
+  buildButtons();
+}
+
+function clearKeys() {
+  keys.up = keys.down = keys.left = keys.right = false;
+}
+
+function buildJoystick() {
+  const base = document.createElement("div");
+  base.id = "tc-stick";
+  base.innerHTML = `<div class="tc-thumb"></div>`;
+  document.getElementById("viewport").appendChild(base);
+  const thumb = base.querySelector(".tc-thumb");
+  let id = null, cx = 0, cy = 0, r = 1;
+
+  function place(t) {
+    let dx = (t.clientX - cx) / r, dy = (t.clientY - cy) / r;
+    const mag = Math.hypot(dx, dy);
+    if (mag > 1) { dx /= mag; dy /= mag; }
+    thumb.style.transform = `translate(${dx * r * 0.55}px, ${dy * r * 0.55}px)`;
+    keys.left = dx < -DEAD; keys.right = dx > DEAD;
+    keys.up = dy < -DEAD; keys.down = dy > DEAD;
+  }
+
+  base.addEventListener("touchstart", (e) => {
+    const rect = base.getBoundingClientRect();
+    r = rect.width / 2; cx = rect.left + r; cy = rect.top + r;
+    id = e.changedTouches[0].identifier;
+    place(e.changedTouches[0]);
+    e.preventDefault();
+  }, { passive: false });
+
+  base.addEventListener("touchmove", (e) => {
+    for (const t of e.changedTouches)
+      if (t.identifier === id) { place(t); e.preventDefault(); }
+  }, { passive: false });
+
+  const end = (e) => {
+    for (const t of e.changedTouches)
+      if (t.identifier === id) {
+        id = null; clearKeys();
+        thumb.style.transform = "translate(0,0)";
+      }
+  };
+  base.addEventListener("touchend", end);
+  base.addEventListener("touchcancel", end);
+}
+
+function buildButtons() {
+  const wrap = document.createElement("div");
+  wrap.id = "tc-buttons";
+  wrap.innerHTML = `
+    <button class="tc-btn tc-gift" aria-label="gift">GIFT</button>
+    <button class="tc-btn tc-action" aria-label="action">ACT</button>`;
+  document.getElementById("viewport").appendChild(wrap);
+  const bind = (sel, name, arg) => {
+    const b = wrap.querySelector(sel);
+    // touchstart for zero-delay response; preventDefault stops the synth click
+    b.addEventListener("touchstart", (e) => {
+      e.preventDefault(); b.classList.add("down"); emit(name, arg);
+    }, { passive: false });
+    const up = () => b.classList.remove("down");
+    b.addEventListener("touchend", up);
+    b.addEventListener("touchcancel", up);
+  };
+  bind(".tc-action", "interact");
+  bind(".tc-gift", "gift");
+}

tests/local_llm_server.py

@@ -0,0 +1,65 @@
+"""Local real-AI inference server — same /generate contract as the Modal app,
+same runtime (llama.cpp) and same Qwen3.5-9B GGUF, just on CPU for development.
+
+Usage:
+  python tests/local_llm_server.py [--port 8081] [--model models/<file>.gguf]
+Then point the game at it:
+  set MODAL_URL=http://127.0.0.1:8081
+  set BDS_LLM_TIMEOUT=90
+  python app.py
+"""
+from __future__ import annotations
+
+import argparse
+import json
+import time
+
+import uvicorn
+from fastapi import FastAPI
+
+parser = argparse.ArgumentParser()
+parser.add_argument("--port", type=int, default=8081)
+parser.add_argument("--model", default="models/Qwen_Qwen3.5-9B-Q4_K_M.gguf")
+args = parser.parse_args()
+
+print(f"loading {args.model} ...")
+from llama_cpp import Llama, LlamaGrammar  # noqa: E402  (slow import)
+from llama_cpp.llama_grammar import json_schema_to_gbnf  # noqa: E402
+
+llm = Llama(model_path=args.model, n_ctx=4096, n_threads=None, verbose=False)
+print("model loaded.")
+
+app = FastAPI()
+
+
+@app.post("/generate")
+def generate(body: dict):
+    t0 = time.time()
+    try:
+        schema = body["schema"]
+        grammar = LlamaGrammar.from_string(
+            json_schema_to_gbnf(json.dumps(schema)), verbose=False)
+        # mirror the Modal path: the empty <think> block disables Qwen3.5's
+        # thinking mode so the JSON grammar takes over immediately
+        prompt = (
+            f"<|im_start|>system\n{body['system_prompt']}\n"
+            f"GAME STATE JSON:\n{json.dumps(body.get('context', {}))}\n<|im_end|>\n"
+            f"<|im_start|>user\n{body['user_prompt']}<|im_end|>\n"
+            f"<|im_start|>assistant\n<think>\n\n</think>\n\n"
+        )
+        out = llm(prompt, max_tokens=1024, temperature=0.4, grammar=grammar)
+        text = out["choices"][0]["text"]
+        data = json.loads(text)
+        return {"ok": True, "data": data, "ms": int((time.time() - t0) * 1000)}
+    except Exception as exc:  # caller falls back; never crash the endpoint
+        return {"ok": False, "error": str(exc)[:300],
+                "ms": int((time.time() - t0) * 1000)}
+
+
+@app.get("/healthz")
+def healthz():
+    return {"ok": True}
+
+
+if __name__ == "__main__":
+    uvicorn.run(app, host="127.0.0.1", port=args.port)