@volter/editor-game 0.5.67 → 0.5.69

package/src/bridge/dispatch.ts

@@ -109,19 +109,19 @@ function recordContractSystemUse(member: string, value: unknown, name?: string):
 
 /**
  * #140 — the generic session-wire dispatch table: the SAME method-name
- * surface `window.__vgai` exposes (`@volter/editor-game/runtime/debug-bridge`'s
- * `VgaiDebugHandle` — `state`/`stateAll`/`providers`/`commands`/`events`/
+ * surface `window.__volter` exposes (`@volter/editor-game/runtime/debug-bridge`'s
+ * `VolterDebugHandle` — `state`/`stateAll`/`providers`/`commands`/`events`/
  * `snapshot`/`invoke`/`runTicks`/`input.*`), built from the SAME
  * registry-backed accessors the sibling
  * `gameplay.command.ts` verbs (`list-gameplay-state`/`inject-input`/`run-ticks`)
  * already use. This is what makes the
  * `bridge-call` relay op (below) a session-generic primitive rather than a
  * test-specific one — any client of the live session (the `@volter/editor-live`
- * `RelayTransport`, a future one-shot `vgai game state/call/hold` REPL) can
+ * `RelayTransport`, a future one-shot `volter game state/call/hold` REPL) can
  * issue `{method, callArgs}` against it with no dependency on a proof run's
  * own lifecycle/env, and get byte-identical dispatch to the page-transport's
  * `page.evaluate(bridgeCallInPage)` (D17) — without requiring the editor tab
- * to be loaded with `?vgai-debug=1` (that gate exists for the bridge's own
+ * to be loaded with `?volter-debug=1` (that gate exists for the bridge's own
  * production exposure; this relay is already local-loopback-only — see
  * `editor-server.ts`'s CSRF/origin guard).
  */
@@ -228,7 +228,7 @@ export async function dispatchBridgeMethod(
         // funnels window error/unhandledrejection into the editor console as
         // level 'error' / source 'runtime' (`installEditorConsoleCapture`'s
         // boot-time listeners) — the SAME events and message format
-        // `window.__vgai`'s own handle buffers. Fenced to the current play run
+        // `window.__volter`'s own handle buffers. Fenced to the current play run
         // via `inPlayRun` so a probe never reads a previous run's stale
         // failures, capped at 100 for parity with the bridge's ring buffer.
         pageErrors: collectPlayRunPageErrors(),
@@ -308,10 +308,10 @@ export async function dispatchBridgeMethod(
     case 'input.clearVirtualActions':
     // bridge↔wire coverage-parity gate (`bridge-wire-parity.test.ts`)
     // closed this trio's gap: `startRecording`/`stopRecording`/`isRecording`
-    // exist on the page bridge's `VgaiDebugInputHandle` (`runtime/
+    // exist on the page bridge's `VolterDebugInputHandle` (`runtime/
     // debug-bridge.ts`) but had no relay case at all — an agent driving the
     // input-trace recorder over the session wire (RelayTransport) instead of
-    // `?vgai-debug=1` simply had no door to it. Same single optional
+    // `?volter-debug=1` simply had no door to it. Same single optional
     // trailing `worldId` shape as `clearVirtualActions`.
     case 'input.startRecording':
     case 'input.stopRecording':
@@ -320,10 +320,10 @@ export async function dispatchBridgeMethod(
       // D15/T-D15.5 (rebase composition with #140): this wire is a THIRD
       // door to the virtual-input target — it must resolve through the SAME
       // `DebugRegistry.getVirtualInputTarget(worldId?)` the page bridge
-      // (`window.__vgai.input.*`) and the `inject-input` relay case use, so
+      // (`window.__volter.input.*`) and the `inject-input` relay case use, so
       // no two doors can ever disagree about which world an unqualified
       // actuation targets. Each method takes the page bridge's own optional
-      // trailing `worldId` (byte-parity with `VgaiDebugInputHandle`); an
+      // trailing `worldId` (byte-parity with `VolterDebugInputHandle`); an
       // explicit, unregistered id throws the registry's structured
       // `DEBUG_INPUT_WORLD_NOT_FOUND`, shipped back over the wire as-is.
       const worldId = (
@@ -365,7 +365,7 @@ export async function dispatchBridgeMethod(
       return inputTarget.isInputRecording();
     }
     case 'input.scheduleActionAtTick': {
-      // bridge↔wire coverage-parity gate: `window.__vgai.input.
+      // bridge↔wire coverage-parity gate: `window.__volter.input.
       // scheduleActionAtTick` (`runtime/debug-bridge.ts`, D15/T-D15.5) had NO
       // bridge-call case — it was reachable over the relay ONLY via the
       // separate `inject-input` command's `atTick` field (see that case,
@@ -390,7 +390,7 @@ export async function dispatchBridgeMethod(
     }
     case 'input.injectPointerDelta':
     case 'input.injectPointerPosition': {
-      // pointer-dispatch op: `window.__vgai.input.injectPointerDelta`/
+      // pointer-dispatch op: `window.__volter.input.injectPointerDelta`/
       // `injectPointerPosition` (`runtime/debug-bridge.ts`) had no relay case
       // — this is the HONEST gameplay-seam reading of "pointer dispatch": the
       // engine's existing virtual pointer-injection, never a synthesized DOM
@@ -417,7 +417,7 @@ export async function dispatchBridgeMethod(
       return undefined;
     }
     case 'holdFor': {
-      // #140/D17: byte-identical semantics to `window.__vgai.holdFor` (door
+      // #140/D17: byte-identical semantics to `window.__volter.holdFor` (door
       // a, `runtime/debug-bridge.ts`) — same `getInputTarget(worldId?)`
       // resolution as the `input.*` cases above, same `waitForHoldBudget`
       // poll/stall loop (imported, not hand-copied, so the two doors can

package/src/bridge/screenshot.ts

@@ -51,7 +51,7 @@ import { captureLiveCanvasFrame } from './live-frames';
  *
  *  BOTH legs read a canvas, and a canvas is only readable after its frame when
  *  its WebGL context was created with `preserveDrawingBuffer: true`. Every
- *  canvas the vgai RUNTIME mounts sets it (`@volter/editor-game/runtime/create-runtime`,
+ *  canvas the volter RUNTIME mounts sets it (`@volter/editor-game/runtime/create-runtime`,
  *  D5 §1/§4); a canvas an INGESTED game created is the game's own and usually
  *  does not, which read as a silently BLACK screenshot over a perfectly
  *  healthy running game. {@link liveCanvasFrame} is the answer for that
@@ -102,8 +102,8 @@ function screenshotResult(
  * and the play log whose event timestamps convert an event into an offset.
  *
  * THIS USED TO BE A REFUSAL, AND THE REFUSAL WAS THE DEFECT (2026-08-29,
- * cold fox #3). Because `vgai play` always records, refusing the still made
- * `vgai screenshot` dead for the rest of the session — and the look lane's
+ * cold fox #3). Because `volter-game-editor play` always records, refusing the still made
+ * `volter-game-editor screenshot` dead for the rest of the session — and the look lane's
  * questions ("is the ear proportion right", "is the fox sunk into the
  * ground") are exactly the ones a still DOES answer. The refusal was
  * discouraging a wrong question by making a right one impossible, and the
@@ -160,7 +160,7 @@ export async function handleBridgeScreenshot(
   // Same reachability rule `handleBridgeCall` uses, and for the same reason:
   // an ingested game's mount IS the running game, so it never creates a
   // first-party play session and `isPlayModeActive()` alone made
-  // `vgai screenshot` permanently unusable against ingest. Loosening the gate
+  // `volter-game-editor screenshot` permanently unusable against ingest. Loosening the gate
   // costs nothing in honesty — the ingest mount renders into the very
   // container `getInstanceContainer()` returns (`play-mode.ts`'s
   // `getGameContainer` is shared with the ingest mount paths), and when there is
@@ -171,10 +171,10 @@ export async function handleBridgeScreenshot(
   // TRUE. `hasLiveDebugPlane()` covers an ingest that publishes a debug plane
   // projected from a declared contract — which a canvas ingest has no way to
   // do (`mount-canvas-ingest-root.ts` publishes `setActiveSystems({})`), so
-  // `vgai screenshot` answered "not in play mode" over a mounted, running,
+  // `volter-game-editor screenshot` answered "not in play mode" over a mounted, running,
   // self-ticking game whose play state the mount had itself set to `playing`.
   // A lying refusal is worse than a missing feature: it sends the reader to
-  // `vgai play`, which is not the thing that was wrong. The question this gate
+  // `volter-game-editor play`, which is not the thing that was wrong. The question this gate
   // asks is "is a game surface live here", and a live ingest is one.
   if (!isPlayModeActive() && !hasLiveDebugPlane() && !isIngestActive()) return notPlayingResult();
   // Capture the ADDRESSED seat, not always the primary. `game.instance(id)`

package/src/build/BuildProfilesPanel.tsx

@@ -1,7 +1,7 @@
 /**
  * THE BUILD PROFILES PANEL — the configuration surface the `build-profiles`
  * document draws: the project's build-role configurations as a target list,
- * the name/resolution/app-id fields it writes back into `vgai.project.json`
+ * the name/resolution/app-id fields it writes back into `volter.project.json`
  * through the project's file history, the Build trigger, and the finished
  * build's report. The LOG is not here: it streams into the Build Output tab
  * (the native Output panel’s Build channel), which is the whole point of the split — a
@@ -32,6 +32,7 @@ import {
 import { useCallback, useEffect, useRef, useState, useSyncExternalStore } from 'react';
 import {
   type BuildTarget,
+  buildAndRun,
   buildSessionVersion,
   cancelBuild,
   getBuildSession,
@@ -48,7 +49,7 @@ interface ProjectConfig {
   appId: string;
 }
 
-const MANIFEST_PATH = 'vgai.project.json';
+const MANIFEST_PATH = 'volter.project.json';
 
 const DEFAULT_CONFIG: ProjectConfig = {
   name: 'My Game',
@@ -215,7 +216,7 @@ export function BuildProfilesPanel() {
         <div style={fieldRowStyle}>
           <label style={labelStyle}>Name</label>
           <TextInput
-            className="vgai-input"
+            className="volter-input"
             style={{ flex: 1 }}
             value={config.name}
             onChange={(e) => updateConfig({ name: e.target.value })}
@@ -227,7 +228,7 @@ export function BuildProfilesPanel() {
           <div style={{ display: 'flex', alignItems: 'center', gap: spaceVar[2], flex: 1 }}>
             <TextInput
               type="number"
-              className="vgai-input"
+              className="volter-input"
               style={{ width: 0, flex: 1 }}
               value={config.resolution.width}
               onChange={(e) => {
@@ -238,7 +239,7 @@ export function BuildProfilesPanel() {
             <span style={{ fontSize: fontSizeVar.sm, color: text[3] }}>&times;</span>
             <TextInput
               type="number"
-              className="vgai-input"
+              className="volter-input"
               style={{ width: 0, flex: 1 }}
               value={config.resolution.height}
               onChange={(e) => {
@@ -252,7 +253,7 @@ export function BuildProfilesPanel() {
         <div style={fieldRowStyle}>
           <label style={labelStyle}>App ID</label>
           <TextInput
-            className="vgai-input"
+            className="volter-input"
             style={{ flex: 1 }}
             value={config.appId}
             onChange={(e) => updateConfig({ appId: e.target.value })}
@@ -308,7 +309,7 @@ export function BuildProfilesPanel() {
                 <a
                   href={getDownloadUrl(artifact)}
                   download={artifact}
-                  className="vgai-btn"
+                  className="volter-btn"
                   data-variant="secondary"
                   data-size="default"
                   style={{
@@ -331,6 +332,16 @@ export function BuildProfilesPanel() {
               >
                 {phase === 'done' ? 'Build Again' : 'Build'}
               </Button>
+              <Button
+                data-testid="build-profiles-build-and-run"
+                onClick={() => {
+                  if (!selected) return;
+                  if (phase === 'done') resetBuildSession();
+                  void buildAndRun(selected);
+                }}
+              >
+                Build And Run
+              </Button>
             </>
           )}
         </div>
@@ -383,7 +394,7 @@ function BuildReportSummary({ report }: { report: BuildReport }) {
                   position: 'absolute',
                   inset: 0,
                   width: `${Math.max(2, (file.bytes / largest) * 100)}%`,
-                  background: 'color-mix(in srgb, var(--vgai-accent) 16%, transparent)',
+                  background: 'color-mix(in srgb, var(--volter-accent) 16%, transparent)',
                 }}
               />
               <div

package/src/build/build-session.ts

@@ -17,6 +17,7 @@ import {
 } from '../host/api/configurations';
 import type { EditorHostOutputDiagnostic } from '@volter/editor-sdk/host';
 import { editorHost } from '@volter/editor-sdk/host';
+import { BASE } from '@volter/editor-sdk/kit/api-base';
 import type { BuildReport } from '@volter/editor-sdk/session/build-report';
 import { useEffect, useState } from 'react';
 import { formatBytes } from './format-bytes';
@@ -34,6 +35,40 @@ export function openBuildProfilesDocument(): boolean {
   return editorHost().workspace.openContributedDocument(BUILD_PROFILES_DOCUMENT_ID);
 }
 
+/** The Build Player document's contribution id (`build-player.document.tsx`). */
+export const BUILD_PLAYER_DOCUMENT_ID = 'build-player.document';
+
+/** Where the editor server serves the project's built `dist/` (`routes/configurations.ts`). */
+export const BUILD_PLAYER_URL = `${BASE}/build/web/index.html`;
+
+let _runs = 0;
+const _runListeners = new Set<() => void>();
+
+/** How many times the build has been run: the player reloads on each. */
+export function buildRunCount(): number {
+  return _runs;
+}
+
+export function subscribeBuildRuns(fn: () => void): () => void {
+  _runListeners.add(fn);
+  return () => {
+    _runListeners.delete(fn);
+  };
+}
+
+/** Run the last build in the Build Player document, fresh. */
+export function runBuild(): boolean {
+  _runs++;
+  for (const fn of _runListeners) fn();
+  return editorHost().workspace.openContributedDocument(BUILD_PLAYER_DOCUMENT_ID);
+}
+
+/** Unity's Build And Run: build, and run the result when the build succeeds. */
+export async function buildAndRun(target: BuildTarget): Promise<void> {
+  await startBuild(target);
+  if (_session.phase === 'done' && _session.result?.ok) runBuild();
+}
+
 /** A build-role configuration's id (ARCHITECTURE-CORE §The project model). */
 export type BuildTarget = string;
 export type BuildPhase = 'idle' | 'building' | 'done';

package/src/canvas/canvas-board/CanvasBoardDocument.tsx

@@ -74,7 +74,8 @@ import {
 } from '@volter/editor-sdk/kit/workspace-document-registry';
 import { storyBoardPresentation } from '@volter/editor-sdk/kit/stories/story-presentation';
 import { getProjectStoryModules, subscribeProjectStoryModules } from '@volter/editor-sdk/kit/stories/story-registry';
-import { useEffect, useRef, useState, useSyncExternalStore } from 'react';
+import { useEffect, useMemo, useRef, useState, useSyncExternalStore } from 'react';
+import type { AuthoringAdapter, EditorNode } from '@volter/editor-project/adapter';
 import {
   buildCanvasBoard,
   type CanvasBoard,
@@ -113,6 +114,8 @@ interface CanvasBoardPresentation {
   zoomAt(clientX: number, clientY: number): boolean;
   /** The exhibit the board is currently showing as active, for the Inspector. */
   activeStoryId(): string | null;
+  /** Select one frame by its id, as a click on it does (the layers list's row). */
+  selectStory(storyId: string): boolean;
   dispose(): void;
 }
 
@@ -131,6 +134,53 @@ interface CanvasBoardPresentation {
  * An ungrouped exhibit (no district) carries no title and falls back to the
  * substrate's own module-path derivation, exactly like an untitled dom story.
  */
+/**
+ * THE BOARD'S LAYERS — Figma's layers panel lists a page's frames; this adapter hands the
+ * Hierarchy the board's frames the same way, each with its district beside its name. It owns no
+ * transform, inspector or structure: a frame is chosen here, and choosing one is the same act as
+ * clicking it on the board.
+ */
+function canvasBoardAdapter(
+  board: CanvasBoard,
+  selected: () => string | null,
+  select: (storyId: string) => void,
+): AuthoringAdapter & { notify(): void } {
+  const listeners = new Set<() => void>();
+  const nodes: EditorNode[] = boardRows(board).map((row) => ({
+    id: row.id,
+    label: row.label,
+    ...(row.title ? { secondaryLabel: row.title } : {}),
+    kind: 'frame',
+    typeLabel: 'Frame',
+    parentId: null,
+    childIds: [],
+  }));
+  return {
+    capabilities: { transform: false, inspectorFields: false, persist: false },
+    hierarchy: {
+      roots: () => nodes,
+      node: (id) => nodes.find((node) => node.id === id) ?? null,
+    },
+    selection: {
+      get: () => {
+        const id = selected();
+        return id ? [id] : [];
+      },
+      set: (ids) => {
+        const id = ids.at(-1);
+        if (id) select(id);
+      },
+    },
+    subscribe(listener) {
+      listeners.add(listener);
+      return () => listeners.delete(listener);
+    },
+    notify() {
+      for (const listener of listeners) listener();
+    },
+  };
+}
+
 function boardRows(board: CanvasBoard): ReactStoryBoardStory[] {
   return [
     ...board.exhibits.map((exhibit) => ({
@@ -305,6 +355,13 @@ function presentCanvasBoard(
     activeStoryId(): string | null {
       return selectedStoryId;
     },
+    selectStory(storyId: string): boolean {
+      if (!rows.some((row) => row.id === storyId)) return false;
+      selectedStoryId = storyId;
+      storyBoard?.activate(storyId, false);
+      onSelectionChanged?.();
+      return true;
+    },
     zoomAt(clientX: number, clientY: number): boolean {
       return storyBoard?.zoomAtClientPoint(clientX, clientY) ?? false;
     },
@@ -446,13 +503,29 @@ function CanvasBoardContent({ active }: WorkspaceDocumentContentProps) {
   // never reach the no-selection seam at all
   // (`workspace-document-registry.ts`'s `WorkspaceDocumentSelection`, and
   // `components/AssetEditorShell.tsx`, which registers the same pair).
+  // The layers list: the board's frames through their own adapter. The node stays null so the
+  // Inspector keeps describing the chosen frame through the subject published below.
+  const boardAdapter = useMemo(
+    () =>
+      board
+        ? canvasBoardAdapter(
+            board,
+            () => presentationRef.current?.activeStoryId() ?? null,
+            (storyId) => presentationRef.current?.selectStory(storyId),
+          )
+        : null,
+    [board],
+  );
+  useEffect(() => {
+    boardAdapter?.notify();
+  }, [boardAdapter, selectedStoryId]);
   useEffect(() => {
     if (!active) return;
     return registerWorkspaceDocumentSelection(CANVAS_COMPONENTS_DOCUMENT_ID, () => ({
-      adapter: null,
+      adapter: boardAdapter,
       nodeId: null,
     }));
-  }, [active]);
+  }, [active, boardAdapter]);
   useEffect(() => {
     if (!active || !selectedExhibit) return;
     return publishDocumentInspectionSubject(CANVAS_COMPONENTS_DOCUMENT_ID, () => ({
@@ -479,8 +552,8 @@ function CanvasBoardContent({ active }: WorkspaceDocumentContentProps) {
   return (
     <div
       data-testid="canvas-board"
-      data-vgai-backdrop-color={active ? REACT_DESIGN_CANVAS_COLOR : undefined}
-      data-vgai-backdrop-policy={active ? 'dark-frost' : undefined}
+      data-volter-backdrop-color={active ? REACT_DESIGN_CANVAS_COLOR : undefined}
+      data-volter-backdrop-policy={active ? 'dark-frost' : undefined}
       style={{
         position: 'absolute',
         inset: 0,

package/src/canvas/canvas-board/canvas-component-board.ts

@@ -51,6 +51,6 @@ export const canvasComponentBoard: ComponentBoard = {
     `This project has no ${CANVAS_COMPONENTS_TITLE} board (${CANVAS_COMPONENTS_DOCUMENT_ID}): ` +
     "board presence keys on STORIES, not on roots, and none of this project's stories declares " +
     'the "canvas" medium. Declare it — a manifest root entry naming the story\'s module, or a ' +
-    '`vgai.adapter.ts` regionInclude that covers it — and the board appears. `vgai console` ' +
+    '`volter.adapter.ts` regionInclude that covers it — and the board appears. `volter-game-editor console` ' +
     'names every story it could not place.',
 };

package/src/canvas/canvas-design-mount.ts

@@ -120,7 +120,7 @@ function createDesignGame(): GameInternal {
  * which part of the unbounded authored plane is visible. */
 function createDesignCanvas(): HTMLCanvasElement {
   const canvas = document.createElement('canvas');
-  canvas.dataset['vgaiCanvasSceneSurface'] = 'true';
+  canvas.dataset['volterCanvasSceneSurface'] = 'true';
   canvas.style.position = 'absolute';
   canvas.style.inset = '0';
   canvas.style.width = '100%';

package/src/coverage/live-project-verbs.ts

@@ -4,7 +4,7 @@
  *
  * It reads the session's own singletons plus two project files the browser
  * cannot read for itself, and hands the facts to the pure derivation. The
- * report goes out the doors coverage already uses — `vgai status`'s
+ * report goes out the doors coverage already uses — `volter-game-editor status`'s
  * `projectCoverage` facet, and the editor console via
  * `coverage/session-coverage.ts`, which unions this family with the other two
  * so one headline counts them all. No new transport, no new panel: the console
@@ -59,7 +59,7 @@ let _filesFor: string | null = null;
 
 /**
  * Drop the cached file facts so the next read re-asks the dev server. Called
- * on `vgai restart` (a restart is precisely "my project's files changed —
+ * on `volter-game-editor restart` (a restart is precisely "my project's files changed —
  * re-read them"; the probe-measured failure was the dependency detector
  * grading rows against a package.json edit two restarts old) and by tests.
  */
@@ -148,7 +148,7 @@ export function projectVerbFacts(): ProjectVerbFacts | null {
 
 /**
  * The `project.*` report for the open project, re-derived on every read — the
- * scripts a project declares change while it is open (`vgai add` writes them),
+ * scripts a project declares change while it is open (`volter-game-editor add` writes them),
  * so a cached answer would start lying.
  */
 export function projectVerbCoverage(): CapabilityCoverageReport | null {

package/src/coverage/native-system-coverage.ts

@@ -4,7 +4,7 @@
  *
  * It reads the session's own singletons and hands the facts to the pure
  * derivation. The report goes out the two doors coverage already uses —
- * `vgai status`'s `systemCoverage` facet, and the editor console via
+ * `volter-game-editor status`'s `systemCoverage` facet, and the editor console via
  * `coverage/session-coverage.ts`, which unions this family with the others so
  * one headline counts them all — so an unbound slot becomes a STANDING
  * condition rather than a one-off line. No new transport, no new panel, and no
@@ -129,8 +129,8 @@ export function nativeSystemCoverage(): CapabilityCoverageReport | null {
       // NetworkingAdapter for a single-player game, telling its author to
       // register one because "this project declares a `server` block" when it
       // declares nothing of the sort. A matchmaker is a listener; no port, no
-      // server. (`vgai edit`'s auto-boot had the identical bug — see
-      // `packages/vgai-cli/src/colyseus-autoboot.ts`'s `readDeclaredProcess`.)
+      // server. (`volter-game-editor edit`'s auto-boot had the identical bug — see
+      // `packages/volter-cli/src/colyseus-autoboot.ts`'s `readDeclaredProcess`.)
       declaresServer: (project.config.configurations ?? []).some(
         (c) => c.kind === 'process' && typeof (c as { port?: unknown }).port === 'number',
       ),

package/src/coverage/root-coverage.ts

@@ -23,13 +23,13 @@
  * Two doors, one derivation — the same shape `ingest/mount-coverage.ts` already
  * uses:
  *
- *  - `vgai status`, through {@link rootCoverageFacet}, so an agent reads the
+ *  - `volter-game-editor status`, through {@link rootCoverageFacet}, so an agent reads the
  *    same answer without opening the editor;
  *  - the editor console, through `coverage/session-coverage.ts`, which unions
  *    this family with the game- and project-scoped ones so the warning's
  *    headline counts every seam rather than this family's 21. The console
  *    ledger turns that into a standing unresolved condition, loud on every
- *    `vgai` command until it is closed.
+ *    `volter` command until it is closed.
  */
 
 import { measureAdapter } from '../host/adapter-reach';

package/src/coverage/session-coverage.ts

@@ -24,7 +24,7 @@
  *
  * It owns assembly and the console door. Every family still derives itself, in
  * its own file, from its own facts; nothing here decides a verdict. The
- * per-family facets on `vgai status` (`command-listener.ts`) stay separate for
+ * per-family facets on `volter-game-editor status` (`command-listener.ts`) stay separate for
  * the same reason they always were — a machine reader wants the rows keyed by
  * subject, and it is the HUMAN-facing sentence that has to be a union.
  */
@@ -90,7 +90,7 @@ export function sessionCoverageReport(
  *
  * Keyed on the rendered TEXT rather than a mount or project token, because the
  * union's inputs come and go inside one session (a root mounts, a design
- * session attaches, `vgai add` lands a script) and the honest rule is "say it
+ * session attaches, `volter-game-editor add` lands a script) and the honest rule is "say it
  * when the answer changes". A recurrence after a real change is a new condition
  * and gets said again; the server ledger sums repeats of an unchanged one.
  */

package/src/design-system-stories/InspectorNarrowBodies.stories.tsx

@@ -73,10 +73,10 @@ function RailColumn({ children }: { readonly children: ReactNode }) {
         width: RAIL_WIDTH,
         height: 600,
         display: 'flex',
-        border: '1px solid var(--vgai-border-2)',
+        border: '1px solid var(--volter-border-2)',
         borderRadius: 8,
         overflow: 'hidden',
-        background: 'var(--vgai-bg-1)',
+        background: 'var(--volter-bg-1)',
       }}
     >
       {children}

package/src/game-document/DevicePresetPicker.tsx

@@ -2,7 +2,7 @@
  * W2c (F13) — Game-tab device preset dropdown. Chrome-device-mode-style:
  * picking a preset constrains the game mount to that device's CSS resolution
  * + DPR (letterboxed/scaled by `GamePanel`), phone/tablet presets add the
- * safe-area overlay + `--vgai-safe-area-inset-*` CSS vars and auto-enable
+ * safe-area overlay + `--volter-safe-area-inset-*` CSS vars and auto-enable
  * pointer-as-touch. State lives in `../device-preview.ts`; this component is
  * pure UI over it.
  */
@@ -30,18 +30,18 @@ export function DevicePresetPicker({
   const isFit = active.kind === 'fit';
 
   return (
-    <div className="vgai-playbar-popover-anchor">
+    <div className="volter-playbar-popover-anchor">
       <Button
         ref={ref}
         variant="ghost"
         size="comfortable"
         aria-haspopup="menu"
         aria-expanded={open}
-        aria-controls={open ? 'vgai-device-preset-menu' : undefined}
+        aria-controls={open ? 'volter-device-preset-menu' : undefined}
         data-testid="device-preset-picker"
         onClick={() => setOpen((value) => !value)}
         title={
-          'Device preview — constrain the game to a device resolution + DPR. Phone/tablet presets show the safe area, set --vgai-safe-area-inset-top/right/bottom/left CSS vars on the game mount, and send mouse input as touch.'
+          'Device preview — constrain the game to a device resolution + DPR. Phone/tablet presets show the safe area, set --volter-safe-area-inset-top/right/bottom/left CSS vars on the game mount, and send mouse input as touch.'
         }
       >
         <EditorIcon icon={faMobileScreenButton} size="md" />
@@ -49,9 +49,9 @@ export function DevicePresetPicker({
       </Button>
       {open && (
         <AnchoredMenu
-          id="vgai-device-preset-menu"
+          id="volter-device-preset-menu"
           anchorRef={ref}
-          className="vgai-resolution-menu"
+          className="volter-resolution-menu"
           gap={4}
           onDismiss={() => setOpen(false)}
         >

package/src/game-document/GameCaptureFrameButton.tsx

@@ -27,7 +27,7 @@ export function GameCaptureFrameButton() {
       size="compact"
       variant="ghost"
       data-testid="game-capture-frame"
-      className="vgai-frame-capture-game-button"
+      className="volter-frame-capture-game-button"
       disabled={!available}
       title={
         available

package/src/game-document/GameDocument.tsx

@@ -60,7 +60,7 @@ function GameDebugMenu() {
         data-testid="game-debug-menu"
         aria-haspopup="menu"
         aria-expanded={open}
-        aria-controls={open ? 'vgai-game-debug-menu' : undefined}
+        aria-controls={open ? 'volter-game-debug-menu' : undefined}
         onClick={() => setOpen((value) => !value)}
       >
         <span>Debug</span>
@@ -68,7 +68,7 @@ function GameDebugMenu() {
       </Button>
       {open && (
         <AnchoredMenu
-          id="vgai-game-debug-menu"
+          id="volter-game-debug-menu"
           anchorRef={ref}
           gap={3}
           onDismiss={() => setOpen(false)}

package/src/game-document/GamePanel.tsx

@@ -74,7 +74,7 @@ import {
  * surfaces (stacked canvases + React DOM layers). */
 export function collectGameSurfaces(container: HTMLElement): Element[] {
   return Array.from(container.children).filter(
-    (node) => (node as HTMLElement).dataset?.['vgaiRootSurface'] === 'true',
+    (node) => (node as HTMLElement).dataset?.['volterRootSurface'] === 'true',
   );
 }
 
@@ -250,7 +250,7 @@ function InstanceViewport({ index }: { index: number }) {
       focused={mountedId != null && focused === mountedId}
       onFocus={mountedId ? () => setFocusedInstance(mountedId) : undefined}
     >
-      <div ref={ref} data-vgai-instance-viewport="" style={{ position: 'absolute', inset: 0 }} />
+      <div ref={ref} data-volter-instance-viewport="" style={{ position: 'absolute', inset: 0 }} />
     </InstanceSlot>
   );
 }
@@ -355,7 +355,7 @@ export function GamePanel({ style }: { style?: React.CSSProperties }) {
   // the same call — and switching resolution DURING play would silently drop
   // the running game's canvases with the removed element. Only nodes the game
   // HOST mounted are
-  // stashed (world surfaces carry `data-vgai-root-surface`): the fill/device branches are keyed below so
+  // stashed (world surfaces carry `data-volter-root-surface`): the fill/device branches are keyed below so
   // React really remounts, but if it ever aliases the container DOM node
   // again, a blind childNodes copy would capture React-owned children too —
   // that exact aliasing put the incoming inner div in the stash and made
@@ -412,7 +412,7 @@ export function GamePanel({ style }: { style?: React.CSSProperties }) {
   // which consults `deviceEmulatedPixelRatio()` once the session exists.)
   // What size this game is PRESENTED at. Two things can name one and the precedence lives in
   // `resolvePresentedSize`: a device preset the user picked wins, and otherwise the project's own
-  // declared `resolution` (`vgai.project.json`) puts the game on screen at its authored logical
+  // declared `resolution` (`volter.project.json`) puts the game on screen at its authored logical
   // size, uniformly scaled and letterboxed by the branch below — presentation scaling, never a
   // stretch mode. A project that declares neither fills the panel exactly as before.
   const declaredResolution = project?.config.resolution;
@@ -474,16 +474,16 @@ export function GamePanel({ style }: { style?: React.CSSProperties }) {
 
   // Safe-area contract: the game MOUNT container always carries the
   // inset CSS vars (0px unless the active preset declares insets), so game
-  // UI can style with `var(--vgai-safe-area-inset-top, 0px)` etc. Real
+  // UI can style with `var(--volter-safe-area-inset-top, 0px)` etc. Real
   // `env(safe-area-inset-*)` cannot be injected from a same-document host
   // (env() is UA-supplied for the top-level viewport only) — the vars + the
   // visual overlay below ARE the emulation.
   const safeArea = preset.safeArea;
   const safeAreaVars = {
-    '--vgai-safe-area-inset-top': `${safeArea?.top ?? 0}px`,
-    '--vgai-safe-area-inset-right': `${safeArea?.right ?? 0}px`,
-    '--vgai-safe-area-inset-bottom': `${safeArea?.bottom ?? 0}px`,
-    '--vgai-safe-area-inset-left': `${safeArea?.left ?? 0}px`,
+    '--volter-safe-area-inset-top': `${safeArea?.top ?? 0}px`,
+    '--volter-safe-area-inset-right': `${safeArea?.right ?? 0}px`,
+    '--volter-safe-area-inset-bottom': `${safeArea?.bottom ?? 0}px`,
+    '--volter-safe-area-inset-left': `${safeArea?.left ?? 0}px`,
   } as React.CSSProperties;
 
   return (