@jgengine/shell 0.10.0 → 0.11.0

package/dist/GamePlayerShell.js

@@ -1,61 +1,47 @@
 import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Canvas, useFrame, useLoader } from "@react-three/fiber";
-import { Component, Suspense, useCallback, useEffect, useMemo, useRef, useState, useSyncExternalStore, } from "react";
-import * as THREE from "three";
-import { GLTFLoader } from "three/examples/jsm/loaders/GLTFLoader.js";
-import { MeshoptDecoder } from "three/examples/jsm/libs/meshopt_decoder.module.js";
-import { actionRepeatMs, createActionStateTracker, hotbarSlotActionIndex, resolveActionCommand, shouldDispatchAction, toActionStateBindingMap, } from "@jgengine/core/input/actionBindings";
-import { deriveTouchScheme, withTouchCodes } from "@jgengine/core/input/touchScheme";
-import { buildContextMenu, contextVerbInput, } from "@jgengine/core/interaction/contextMenu";
-import { resolveActivePrompt } from "@jgengine/core/interaction/proximityPrompt";
-import { aimToPoint } from "@jgengine/core/input/pointer";
-import { eyeHeightFromColliders } from "@jgengine/core/combat/shotOrigin";
+import { Canvas } from "@react-three/fiber";
+import { useCallback, useEffect, useMemo, useRef, useState, useSyncExternalStore, } from "react";
+import { createActionStateTracker, toActionStateBindingMap, } from "@jgengine/core/input/actionBindings";
+import { RESERVED_INPUT_ACTIONS } from "./boundActionDispatch.js";
+import { resolveWorldSky } from "./worldSky.js";
+import { pointerAimFor, pointerContextMenu } from "./shellPointer.js";
+import { deriveTouchScheme, withTouchCodes, DEFAULT_TOUCH_STYLE } from "@jgengine/core/input/touchScheme";
+import { contextVerbInput, } from "@jgengine/core/interaction/contextMenu";
 import { normalizePointerToAxis } from "@jgengine/core/input/pointerAxis";
 import { createSelectionSet, isMarquee, screenRect, selectWithinRect, } from "@jgengine/core/scene/selection";
-import { steerYaw } from "@jgengine/core/movement/steering";
-import { stepPlayerMovement, resolvePlayerMovementTuning } from "@jgengine/core/movement/playerMovement";
 import { createGameContext } from "@jgengine/core/runtime/gameContext";
-import { isServerAuthoritative } from "@jgengine/core/runtime/adapter";
-import { attachWorldSync } from "./worldSync.js";
-import { localCommandSink, resolveCommandSink } from "./commandSink.js";
-import { inputFramesEqual, resolveInputSink } from "./inputSink.js";
-import { objectVisualScale } from "@jgengine/core/scene/objectStore";
-import { DEFAULT_PICKUP_RADIUS, WORLD_ITEM_ENTITY_NAME } from "@jgengine/core/game/worldItem";
-import { useGameContext } from "@jgengine/react/provider";
+import { DEFAULT_PICKUP_RADIUS } from "@jgengine/core/game/worldItem";
 import { useDisplayProfile } from "@jgengine/react/display";
 import { HudViewportProvider } from "@jgengine/react/hudViewport";
 import { GameViewportProvider } from "@jgengine/react/gameViewport";
 import { RotateDeviceScreen } from "@jgengine/react/rotateDevice";
-import { useSceneEntities, useSceneObjects, usePlayer, useTarget } from "@jgengine/react/hooks";
 import { GameProvider } from "@jgengine/react/provider";
 import { CAMERA_FRUSTUM_DEFAULTS } from "@jgengine/core/game/playableGame";
 import { createSettingsStore } from "@jgengine/core/settings/settingsModel";
 import { applyBindingOverrides, clearBindingOverride, loadBindingOverrides, saveBindingOverride, } from "@jgengine/core/input/bindingOverrides";
 import { playControlsActive } from "@jgengine/core/game/controlGate";
 import { orientationGateActive, orientationHintActive, resolveOrientationRequirement, } from "@jgengine/core/ui/orientation";
-import { resolveOneShotClip } from "@jgengine/core/game/modelAnimation";
 import { sky as resolveSkyDescriptor } from "@jgengine/core/world/features";
-import { devtools } from "@jgengine/core/devtools/devtools";
-import { VERSION } from "@jgengine/core/meta/changelog";
+import { resolveGameLook } from "@jgengine/core/render/lookPreset";
 import { AudioListener, EntityAudioEmitters, ObjectAudioEmitters } from "./audio/AudioComponents.js";
 import { createAudioEngine } from "./audio/audioEngine.js";
+import { attachAudioEventWire } from "./audio/audioWire.js";
 import { PostProcessing } from "./postfx/PostProcessing.js";
+import { EnvironmentLighting } from "./render/EnvironmentLighting.js";
 import { CollisionDebugWorld } from "./devtools/CollisionDebugWorld.js";
-import { collisionDebug } from "./devtools/collisionDebug.js";
 import { DevtoolsOverlay, DevtoolsRendererProbe, withDevtoolsLatency } from "./devtools/DevtoolsOverlay.js";
-import { GAME_SIM_FRAME_PRIORITY, GameCameraRig, PlayerFovProvider, PlayerFovSlider, resolveRigKind, rtsPanKeysConflict, } from "./camera/index.js";
-import { resolveModel, tryResolveCatalogModel } from "./render/resolveModel.js";
-import { CullingProvider, useRenderVisibility } from "./visibility/CullingProvider.js";
+import { installAgentBridge } from "./devtools/agentBridge.js";
+import { GameCameraRig, PlayerFovProvider, PlayerFovSlider, resolveRigKind, rtsPanKeysConflict, } from "./camera/index.js";
+import { CullingProvider } from "./visibility/CullingProvider.js";
 import { SkyDaylight, TimeOfDayDaylight } from "./environment.js";
 import { resolveSkyLightOwnership, skyEmitsLights } from "./environment/skyLightingPolicy.js";
 import { EnvironmentScene } from "./environment/EnvironmentScene.js";
-import { applyMaterialOverride } from "./materialOverride.js";
 import { PointerProbe } from "./pointer/PointerProbe.js";
-import { applyPaintTextureToMaterials, cacheStandardMaterials, cloneModelScene, createPaintCanvas, disposeClonedMaterials, syncPaintCanvas, } from "./render/modelRender.js";
-import { writeEntityPose } from "./world/entityPose.js";
 import { MarqueeBox, ContextMenuView } from "./pointer/PointerOverlays.js";
-import { createPointerService, POINTER_ENTITY_KEY, POINTER_OBJECT_KEY, } from "./pointer/pointerService.js";
-import { CombatCameraShake, ProjectileTracers, Reticle, WorldEntityBars, WorldFloatText, WorldTelegraphs, } from "./world/WorldHud.js";
+import { createPointerService } from "./pointer/pointerService.js";
+import { CombatCameraShake, ProjectileTracers, Reticle, WorldEntityBars, WorldFloatText, WorldNameplates, WorldTelegraphs, } from "./world/WorldHud.js";
+import { WorldSpellVfx } from "./world/WorldVfx.js";
+import { RetainedVfx } from "./world/RetainedVfx.js";
 import { GridWorldScene } from "./world/GridWorldScene.js";
 import { WorldItems } from "./world/WorldItems.js";
 import { OrientationHint } from "./touch/OrientationHint.js";
@@ -64,894 +50,34 @@ import { BUILT_IN_SETTING_CATEGORIES } from "@jgengine/core/settings/settingsMod
 import { SettingsProvider } from "@jgengine/react/settings";
 import { SettingsRuntime } from "./settings/SettingsRuntime.js";
 import { SettingsChrome } from "./settings/SettingsChrome.js";
-import { AudioSettingsBridge, useGraphicsSettings } from "./settings/appliedSettings.js";
+import { AudioSettingsBridge, useGraphicsSettings, useTouchStyle } from "./settings/appliedSettings.js";
+import { ConfiguredLighting, BackdropFog } from "./render/SceneLighting.js";
+import { WorldView, RemotePlayers } from "./world/WorldScene.js";
+import { FrameDriver } from "./drivers/FrameDriver.js";
+import { HudOnlyDriver } from "./drivers/HudOnlyDriver.js";
+import { DiagnosticOverlay, GameUiErrorBoundary, logRuntimeError, } from "./diagnostics/RuntimeDiagnostics.js";
+import { GamePhaseStamp } from "./GamePhaseStamp.js";
+import { EMPTY_RESERVED } from "./shellConstants.js";
+import { useShellMultiplayerSync } from "./useShellMultiplayerSync.js";
 const DEV_USER_ID = "dev-player";
-const TURN_SPEED = 2.4;
 const PRIMARY_CLICK_MOVE_THRESHOLD_PX = 6;
-const GROUND_SIZE = 160;
-const GROUND_SEGMENTS = 80;
 const DEFAULT_BACKGROUND_COLOR = "#14161b";
-const DEFAULT_BACKDROP_FOG_COLOR = "#1a1c22";
-function errorToDiagnostic(error, phase, componentStack) {
-    const capturedAt = new Date().toISOString();
-    if (error instanceof Error) {
-        return { phase, message: error.message, stack: error.stack, componentStack, capturedAt };
-    }
-    return { phase, message: typeof error === "string" ? error : JSON.stringify(error), componentStack, capturedAt };
-}
-function logRuntimeError(error, phase, componentStack) {
-    const diagnostic = errorToDiagnostic(error, phase, componentStack);
-    console.error(`[jgengine:${phase}] ${diagnostic.message}`, error);
-    return diagnostic;
-}
-const RESERVED_INPUT_ACTIONS = new Set([
-    "moveForward",
-    "moveBack",
-    "moveLeft",
-    "moveRight",
-    "turnLeft",
-    "turnRight",
-    "sprint",
-    "jump",
-    "tabTarget",
-    "clearTarget",
-    "useAbility",
-    "interact",
-]);
-/** No action names are reserved when no camera rig is active (hud/none presentation): games may bind `turnLeft`/`interact`/etc. as their own. */
-const EMPTY_RESERVED = new Set();
-/** Empty action list — published while the orientation gate is up to suppress all held input without touching the tracker. */
-const NO_ACTIONS = [];
-const SHELL_MOVEMENT_ACTIONS = ["moveForward", "moveBack", "moveLeft", "moveRight", "jump"];
-function shellDrivesPlayerPose(input) {
-    const bound = input ?? {};
-    return SHELL_MOVEMENT_ACTIONS.some((action) => action in bound);
-}
-function findHotbarSlotActions(input) {
-    return Object.keys(input ?? {}).flatMap((action) => {
-        const slot = hotbarSlotActionIndex(action);
-        return slot === null ? [] : [{ action, slot }];
-    });
-}
-function hotbarIdFor(playable) {
-    const declarations = Object.entries(playable.game.inventories ?? {});
-    const hud = declarations.find(([, declaration]) => declaration.hud === "hotbar");
-    return (hud ?? declarations[0])?.[0] ?? null;
-}
-function executeHotbarSlot(ctx, fromId, hotbarId, slot, yaw, pitch, aimOverride) {
-    const stack = ctx.player.inventory.state(hotbarId).slots[slot];
-    if (stack === undefined || stack === null)
-        return { ok: false, error: `Hotbar slot ${slot + 1} is empty` };
-    const result = ctx.item.use.use({
-        from: fromId,
-        itemId: stack.itemId,
-        inventoryId: hotbarId,
-        aim: aimOverride ?? { yaw, pitch },
-    });
-    return result.error === undefined ? { ok: true } : { ok: false, error: result.error };
-}
-function pointerAimFor(ctx, service) {
-    const hit = service.worldHit();
-    if (hit === null)
-        return undefined;
-    const shooter = ctx.scene.entity.get(ctx.player.possession.active(ctx.player.userId)) ??
-        ctx.scene.entity.get(ctx.player.userId);
-    if (shooter === null)
-        return undefined;
-    const eye = eyeHeightFromColliders(ctx.scene.entity.collidersOf(shooter.id));
-    return aimToPoint([shooter.position[0], shooter.position[1] + eye, shooter.position[2]], hit.point);
-}
-function pointerContextMenu(ctx, playable, hit) {
-    if (hit.entity !== null) {
-        const entity = ctx.scene.entity.get(hit.entity);
-        const verbs = entity === null ? undefined : playable.content.entityById?.(entity.name)?.verbs;
-        return buildContextMenu({ kind: "entity", targetId: hit.entity, verbs, point: hit.point });
-    }
-    if (hit.object !== null) {
-        const verbs = ctx.scene.object.catalog(hit.object)?.verbs;
-        return buildContextMenu({ kind: "object", targetId: hit.object, verbs, point: hit.point });
-    }
-    return null;
-}
-/** Actions from `input` currently held down, for `ctx.input.publish` (#164.1); includes reserved movement/jump actions. */
-export function heldActionsFor(tracker, actions) {
-    return actions.filter((action) => tracker.isDown(action));
-}
-/** Whether a bound action should fire this frame: on press, or on repeat interval while held (shared by `FrameDriver` and `HudOnlyDriver`). */
-export function shouldFireBoundAction(tracker, action, input, repeatFiredAt, now) {
-    return shouldDispatchAction({
-        pressed: tracker.wasPressed(action),
-        down: tracker.isDown(action),
-        repeatMs: actionRepeatMs(input?.[action]),
-        lastFiredAt: repeatFiredAt.get(action) ?? null,
-        now,
-    });
-}
-/** Resolves and runs the command bound to `action` via the shell's action→command convention (shared by `FrameDriver` and `HudOnlyDriver`). */
-export function dispatchBoundAction(ctx, action, yaw, pitch, aim, reserved = RESERVED_INPUT_ACTIONS, sink = localCommandSink(ctx)) {
-    const command = resolveActionCommand(action, (name) => ctx.game.commands.has(name), reserved);
-    if (command !== null)
-        sink.run(command, { yaw, pitch, aim });
-}
 export { applyMotionImpulses } from "@jgengine/core/runtime/motionIntents";
 export { nearbyObstacles } from "@jgengine/core/movement/movementModel";
 export { resolvePhysicsTuning } from "@jgengine/core/movement/playerMovement";
 export { hasEnvironmentTerrain } from "@jgengine/core/world/terrain";
-/** The world's declared sky, when its world feature is an environment with one (#196.1). */
-export function resolveWorldSky(world) {
-    return world?.kind === "environment" ? world.sky : undefined;
-}
-function colorFromId(id) {
-    let hash = 0;
-    for (let index = 0; index < id.length; index += 1)
-        hash = (hash * 31 + id.charCodeAt(index)) >>> 0;
-    return `hsl(${hash % 360}, 65%, 55%)`;
-}
-function DirectionalShadowLight({ entry }) {
-    const size = entry.shadowCameraSize ?? 40;
-    return (_jsx("directionalLight", { position: [entry.position[0], entry.position[1], entry.position[2]], intensity: entry.intensity ?? 1.3, color: entry.color, castShadow: entry.castShadow ?? false, "shadow-mapSize-width": entry.shadowMapSize ?? 1024, "shadow-mapSize-height": entry.shadowMapSize ?? 1024, "shadow-camera-left": -size, "shadow-camera-right": size, "shadow-camera-top": size, "shadow-camera-bottom": -size, "shadow-camera-near": 0.5, "shadow-camera-far": Math.max(200, size * 6), "shadow-bias": entry.shadowBias ?? -0.0004, "shadow-normalBias": entry.shadowNormalBias ?? 0.02 }));
-}
-function ConfiguredLighting({ lighting }) {
-    return (_jsxs(_Fragment, { children: [lighting.ambient !== undefined ? (_jsx("ambientLight", { color: lighting.ambient.color, intensity: lighting.ambient.intensity ?? 0.55 })) : null, lighting.hemisphere !== undefined ? (_jsx("hemisphereLight", { args: [
-                    lighting.hemisphere.skyColor ?? "#bfe3ff",
-                    lighting.hemisphere.groundColor ?? "#4c6b34",
-                    lighting.hemisphere.intensity ?? 0.55,
-                ] })) : null, (lighting.directional ?? []).map((entry, index) => (_jsx(DirectionalShadowLight, { entry: entry }, index)))] }));
-}
-function BackdropFog({ fog }) {
-    if (fog === undefined)
-        return null;
-    return fog.density !== undefined ? (_jsx("fogExp2", { attach: "fog", args: [fog.color ?? DEFAULT_BACKDROP_FOG_COLOR, fog.density] })) : (_jsx("fog", { attach: "fog", args: [fog.color ?? DEFAULT_BACKDROP_FOG_COLOR, fog.near ?? 10, fog.far ?? 200] }));
-}
-function EntitySprite({ sprite }) {
-    const texture = useLoader(THREE.TextureLoader, sprite.url);
-    useEffect(() => {
-        texture.colorSpace = THREE.SRGBColorSpace;
-        texture.anisotropy = 4;
-        texture.needsUpdate = true;
-    }, [texture]);
-    return (_jsx("sprite", { "position-y": sprite.y, scale: [sprite.width, sprite.height, 1], children: _jsx("spriteMaterial", { map: texture, transparent: true, alphaTest: 0.08, depthWrite: false }) }));
-}
-class ModelFallbackBoundary extends Component {
-    state = { failed: false };
-    static getDerivedStateFromError() {
-        return { failed: true };
-    }
-    render() {
-        return this.state.failed ? this.props.fallback : this.props.children;
-    }
-}
-function IsolatedEntityModel({ model, instanceId, fallback, }) {
-    return (_jsx(ModelFallbackBoundary, { fallback: fallback ?? null, children: _jsx(Suspense, { fallback: null, children: _jsx(EntityModel, { model: model, instanceId: instanceId }) }) }));
-}
-function BoneAttachment({ rig, model, slot, position, rotation, scale, }) {
-    const gltf = useLoader(GLTFLoader, model.url, (loader) => {
-        loader.setMeshoptDecoder(MeshoptDecoder);
-    });
-    const weaponScene = useMemo(() => cloneModelScene(gltf.scene), [gltf]);
-    const px = position?.[0] ?? 0;
-    const py = position?.[1] ?? 0;
-    const pz = position?.[2] ?? 0;
-    const rx = rotation?.[0] ?? 0;
-    const ry = rotation?.[1] ?? 0;
-    const rz = rotation?.[2] ?? 0;
-    const s = scale ?? 1;
-    useEffect(() => {
-        const bone = rig.getObjectByName(slot);
-        if (bone === undefined) {
-            if (typeof console !== "undefined") {
-                console.warn(`[jgengine] entityModels attachment: bone/slot "${slot}" not found on the rig`);
-            }
-            return;
-        }
-        weaponScene.position.set(px, py, pz);
-        weaponScene.rotation.set(rx, ry, rz);
-        weaponScene.scale.setScalar(s);
-        bone.add(weaponScene);
-        return () => {
-            bone.remove(weaponScene);
-        };
-    }, [rig, weaponScene, slot, px, py, pz, rx, ry, rz, s]);
-    useEffect(() => () => disposeClonedMaterials(weaponScene), [weaponScene]);
-    return null;
-}
-/** Resolves an entity model plus any bone attachments' models through the asset catalog, so `EntityModel` receives fully-resolved `ModelConfig`s. */
-function resolveEntityModel(value, assets, key) {
-    const model = resolveModel(value, assets, { seam: "entityModels", key });
-    if (model?.attachments === undefined)
-        return model;
-    return {
-        ...model,
-        attachments: model.attachments.map((attachment) => ({
-            ...attachment,
-            model: resolveModel(attachment.model, assets) ?? attachment.model,
-        })),
-    };
-}
-function EntityModel({ model, instanceId }) {
-    const gltf = useLoader(GLTFLoader, model.url, (loader) => {
-        loader.setMeshoptDecoder(MeshoptDecoder);
-    });
-    const ctx = useGameContext();
-    const material = model.material;
-    const baseY = model.y ?? 0;
-    const dims = model.dims;
-    const scene = useMemo(() => {
-        const cloned = cloneModelScene(gltf.scene);
-        if (material !== undefined)
-            applyMaterialOverride(cloned, material, { clone: false });
-        return cloned;
-    }, [gltf, material]);
-    const measured = useMemo(() => {
-        if (model.targetHeight === undefined)
-            return null;
-        const box = new THREE.Box3().setFromObject(scene);
-        const height = box.max.y - box.min.y;
-        if (!Number.isFinite(height) || height <= 0)
-            return null;
-        return {
-            normalize: model.targetHeight / height,
-            minY: box.min.y,
-            centerX: (box.min.x + box.max.x) / 2,
-            centerZ: (box.min.z + box.max.z) / 2,
-        };
-    }, [scene, model.targetHeight]);
-    const scale = (model.scale ?? 1) * (measured?.normalize ?? 1);
-    const centered = (model.anchor ?? "center") === "center" && dims !== undefined;
-    const position = measured !== null
-        ? [-scale * measured.centerX, baseY - scale * measured.minY, -scale * measured.centerZ]
-        : centered
-            ? [-scale * dims.center.x, baseY - scale * dims.minY, -scale * dims.center.z]
-            : [0, baseY, 0];
-    useEffect(() => () => {
-        disposeClonedMaterials(scene);
-    }, [scene]);
-    const animation = model.animation;
-    const mixerRef = useRef(null);
-    const animationPausedRef = useRef(false);
-    const stateActionsRef = useRef(null);
-    const states = animation?.states;
-    const oneShots = animation?.oneShots;
-    const oneShotPlayRef = useRef(null);
-    const activeOneShotRef = useRef(null);
-    useEffect(() => {
-        if (animation === undefined || gltf.animations.length === 0) {
-            mixerRef.current = null;
-            stateActionsRef.current = null;
-            return;
-        }
-        const mixer = new THREE.AnimationMixer(scene);
-        if (states !== undefined) {
-            const clipFor = (name) => THREE.AnimationClip.findByName(gltf.animations, name) ?? gltf.animations[0];
-            const actions = {
-                idle: mixer.clipAction(clipFor(states.idle)),
-                walk: mixer.clipAction(clipFor(states.walk)),
-                ...(states.run === undefined ? {} : { run: mixer.clipAction(clipFor(states.run)) }),
-            };
-            for (const action of Object.values(actions)) {
-                action.setLoop(THREE.LoopRepeat, Infinity);
-                action.timeScale = animation.timeScale ?? 1;
-                action.enabled = true;
-            }
-            actions.idle.play();
-            mixer.update(0);
-            mixerRef.current = mixer;
-            stateActionsRef.current = { actions, active: "idle", lastPos: null, smoothedSpeed: 0 };
-            animationPausedRef.current = false;
-            let onOneShotFinished = null;
-            if (oneShots !== undefined) {
-                const clipNames = new Set();
-                for (const spec of Object.values(oneShots)) {
-                    if (typeof spec === "string")
-                        clipNames.add(spec);
-                    else
-                        for (const name of spec)
-                            clipNames.add(name);
-                }
-                const oneShotActions = new Map();
-                for (const name of clipNames) {
-                    const found = THREE.AnimationClip.findByName(gltf.animations, name);
-                    if (found === null)
-                        continue;
-                    const oneShotAction = mixer.clipAction(found);
-                    oneShotAction.setLoop(THREE.LoopOnce, 1);
-                    oneShotAction.enabled = true;
-                    oneShotActions.set(name, oneShotAction);
-                }
-                onOneShotFinished = ({ action }) => {
-                    const active = activeOneShotRef.current;
-                    if (active === null || action !== active.action || active.isDeath)
-                        return;
-                    const machine = stateActionsRef.current;
-                    const back = machine?.actions[machine.active];
-                    action.fadeOut(0.15);
-                    if (back !== undefined)
-                        back.reset().fadeIn(0.15).play();
-                    activeOneShotRef.current = null;
-                };
-                mixer.addEventListener("finished", onOneShotFinished);
-                oneShotPlayRef.current = (event) => {
-                    const active = activeOneShotRef.current;
-                    if (active !== null && active.isDeath)
-                        return;
-                    const clipName = resolveOneShotClip(oneShots, event, Math.random());
-                    if (clipName === null)
-                        return;
-                    const oneShotAction = oneShotActions.get(clipName);
-                    if (oneShotAction === undefined)
-                        return;
-                    const machine = stateActionsRef.current;
-                    machine?.actions[machine.active]?.fadeOut(0.1);
-                    if (active !== null && active.action !== oneShotAction)
-                        active.action.stop();
-                    oneShotAction.clampWhenFinished = event === "death";
-                    oneShotAction.reset().fadeIn(0.1).play();
-                    activeOneShotRef.current = { action: oneShotAction, isDeath: event === "death" };
-                };
-            }
-            return () => {
-                if (onOneShotFinished !== null)
-                    mixer.removeEventListener("finished", onOneShotFinished);
-                oneShotPlayRef.current = null;
-                activeOneShotRef.current = null;
-                mixer.stopAllAction();
-                mixerRef.current = null;
-                stateActionsRef.current = null;
-            };
-        }
-        const clip = (animation.clip !== undefined ? THREE.AnimationClip.findByName(gltf.animations, animation.clip) : undefined) ??
-            gltf.animations[0];
-        const action = mixer.clipAction(clip);
-        action.setLoop(animation.loop === false ? THREE.LoopOnce : THREE.LoopRepeat, Infinity);
-        action.clampWhenFinished = animation.loop === false;
-        action.timeScale = animation.timeScale ?? 1;
-        action.enabled = true;
-        action.paused = animation.paused === true;
-        action.play();
-        if (animation.time !== undefined)
-            action.time = animation.time;
-        mixer.update(0);
-        mixerRef.current = mixer;
-        animationPausedRef.current = animation.paused === true;
-        return () => {
-            mixer.stopAllAction();
-            mixerRef.current = null;
-        };
-    }, [
-        scene,
-        gltf,
-        animation?.clip,
-        animation?.loop,
-        animation?.timeScale,
-        animation?.paused,
-        animation?.time,
-        states,
-        oneShots,
-    ]);
-    useEffect(() => {
-        if (instanceId === undefined || oneShots === undefined)
-            return;
-        const fire = (event) => oneShotPlayRef.current?.(event);
-        const offAnimation = ctx.game.events.on("entity.animation", (event) => {
-            if (event.instanceId === instanceId)
-                fire(event.event);
-        });
-        const offHit = ctx.game.events.on("combat.hitReaction", (event) => {
-            if (event.instanceId === instanceId)
-                fire("hit");
-        });
-        const offDied = ctx.game.events.on("entity.died", (event) => {
-            if (event.instanceId === instanceId)
-                fire("death");
-        });
-        return () => {
-            offAnimation();
-            offHit();
-            offDied();
-        };
-    }, [ctx, instanceId, oneShots]);
-    const paintCanvasRef = useRef(null);
-    const paintDrawnCountRef = useRef(0);
-    const paintVersionRef = useRef(-1);
-    const materialCacheRef = useRef(null);
-    useEffect(() => {
-        paintCanvasRef.current = null;
-        paintDrawnCountRef.current = 0;
-        paintVersionRef.current = -1;
-        materialCacheRef.current = null;
-    }, [scene]);
-    useFrame((_state, delta) => {
-        const stateMachine = stateActionsRef.current;
-        if (stateMachine !== null && states !== undefined && instanceId !== undefined && delta > 0) {
-            const entity = ctx.scene.entity.get(instanceId);
-            if (entity !== null) {
-                const [x, , z] = entity.position;
-                if (stateMachine.lastPos !== null) {
-                    const instantSpeed = Math.hypot(x - stateMachine.lastPos[0], z - stateMachine.lastPos[2]) / delta;
-                    stateMachine.smoothedSpeed +=
-                        (instantSpeed - stateMachine.smoothedSpeed) * Math.min(1, delta * 12);
-                }
-                stateMachine.lastPos = [x, entity.position[1], z];
-                const walkSpeed = states.walkSpeed ?? 0.5;
-                const runSpeed = states.runSpeed ?? 6;
-                const next = stateMachine.smoothedSpeed < walkSpeed
-                    ? "idle"
-                    : stateMachine.actions.run !== undefined && stateMachine.smoothedSpeed >= runSpeed
-                        ? "run"
-                        : "walk";
-                if (next !== stateMachine.active) {
-                    if (activeOneShotRef.current === null) {
-                        const fade = states.fadeSec ?? 0.2;
-                        const from = stateMachine.actions[stateMachine.active];
-                        const to = stateMachine.actions[next];
-                        if (from !== undefined && to !== undefined) {
-                            to.reset().fadeIn(fade).play();
-                            from.fadeOut(fade);
-                        }
-                    }
-                    stateMachine.active = next;
-                }
-            }
-        }
-        if (mixerRef.current !== null && !animationPausedRef.current)
-            mixerRef.current.update(delta);
-        if (instanceId === undefined)
-            return;
-        const paint = ctx.scene.entity.paint;
-        const version = paint.version(instanceId);
-        if (version === paintVersionRef.current)
-            return;
-        paintVersionRef.current = version;
-        const strokes = paint.strokes(instanceId);
-        const cache = cacheStandardMaterials(scene, materialCacheRef.current);
-        materialCacheRef.current = cache;
-        if (paintCanvasRef.current === null) {
-            if (strokes.length === 0)
-                return;
-            const seed = cache.materials[0];
-            if (seed === undefined)
-                return;
-            const paintCanvas = createPaintCanvas(seed);
-            paintCanvasRef.current = paintCanvas;
-            applyPaintTextureToMaterials(cache.materials, paintCanvas);
-        }
-        paintDrawnCountRef.current = syncPaintCanvas(paintCanvasRef.current, cache.seedColor, strokes, paintDrawnCountRef.current);
-    });
-    return (_jsxs(_Fragment, { children: [_jsx("primitive", { object: scene, position: position, scale: [scale, scale, scale] }), (model.attachments ?? []).map((attachment, index) => typeof attachment.model === "string" ? null : (_jsx(BoneAttachment, { rig: scene, model: attachment.model, slot: attachment.slot, position: attachment.position, rotation: attachment.rotation, scale: attachment.scale }, `${attachment.slot}-${index}`)))] }));
-}
-function EntityMarker({ entity, custom, model, sprite, isLocal, targeted, selected, onSelect, }) {
-    const groupRef = useRef(null);
-    const ctx = useGameContext();
-    const visibleRef = useRenderVisibility();
-    const entityId = entity.id;
-    const role = entity.role;
-    const name = entity.name;
-    const color = isLocal ? "#4ade80" : role === "npc" ? colorFromId(name) : "#9ca3af";
-    useFrame(() => {
-        const group = groupRef.current;
-        if (group === null)
-            return;
-        const live = ctx.scene.entity.get(entityId);
-        if (live === null)
-            return;
-        writeEntityPose(group, live);
-        group.visible = visibleRef.current(entityId);
-    });
-    return (_jsxs("group", { ref: groupRef, userData: { [POINTER_ENTITY_KEY]: entityId }, onPointerDown: (event) => {
-            event.stopPropagation();
-            if (isLocal)
-                return;
-            const live = ctx.scene.entity.get(entityId);
-            if (live !== null)
-                onSelect(live);
-        }, children: [selected ? (_jsxs("mesh", { "rotation-x": -Math.PI / 2, "position-y": 0.02, children: [_jsx("ringGeometry", { args: [0.8, 0.95, 32] }), _jsx("meshBasicMaterial", { color: "#34d399", transparent: true, opacity: 0.9 })] })) : null, custom !== undefined && custom !== null ? (custom) : model !== undefined ? (_jsx(IsolatedEntityModel, { model: model, instanceId: entityId, fallback: sprite !== undefined ? _jsx(EntitySprite, { sprite: sprite }) : undefined })) : sprite !== undefined ? (_jsx(EntitySprite, { sprite: sprite })) : role === "prop" ? (_jsxs("mesh", { "position-y": 0.5, children: [_jsx("sphereGeometry", { args: [0.45, 16, 16] }), _jsx("meshStandardMaterial", { color: color })] })) : (_jsxs(_Fragment, { children: [_jsxs("mesh", { "position-y": 0.95, children: [_jsx("capsuleGeometry", { args: [0.35, 1.1, 6, 14] }), _jsx("meshStandardMaterial", { color: color })] }), _jsxs("mesh", { position: [0, 1.35, 0.32], children: [_jsx("boxGeometry", { args: [0.16, 0.16, 0.16] }), _jsx("meshStandardMaterial", { color: "#f8fafc" })] })] })), targeted ? (_jsxs("mesh", { "rotation-x": -Math.PI / 2, "position-y": 0.03, children: [_jsx("ringGeometry", { args: [0.6, 0.75, 28] }), _jsx("meshBasicMaterial", { color: "#f87171" })] })) : null] }));
-}
-function ObjectMarker({ object, custom, model, style, }) {
-    const groupRef = useRef(null);
-    const ctx = useGameContext();
-    const visibleRef = useRenderVisibility();
-    const instanceId = object.instanceId;
-    const [scaleX, scaleY, scaleZ] = objectVisualScale(object.visual);
-    const color = object.visual?.color ?? style?.color ?? colorFromId(object.catalogId);
-    const opacity = object.visual?.opacity ?? style?.opacity ?? 1;
-    useFrame(() => {
-        const group = groupRef.current;
-        if (group === null)
-            return;
-        const live = ctx.scene.object.get(instanceId);
-        if (live === null)
-            return;
-        writeEntityPose(group, live);
-        group.visible = visibleRef.current(instanceId);
-    });
-    return (_jsx("group", { ref: groupRef, userData: { [POINTER_OBJECT_KEY]: instanceId }, children: custom !== undefined && custom !== null ? (custom) : model !== undefined ? (_jsx(IsolatedEntityModel, { model: model, instanceId: instanceId })) : style?.hidden === true ? null : (_jsxs("mesh", { "position-y": 0.5 * scaleY, scale: [scaleX, scaleY, scaleZ], children: [_jsx("boxGeometry", { args: [1, 1, 1] }), _jsx("meshStandardMaterial", { color: color, transparent: opacity < 1, opacity: opacity })] })) }));
-}
-function GroundPlane() {
-    const geometry = useMemo(() => {
-        const next = new THREE.PlaneGeometry(GROUND_SIZE, GROUND_SIZE, GROUND_SEGMENTS, GROUND_SEGMENTS);
-        const positions = next.attributes.position;
-        for (let index = 0; index < positions.count; index += 1) {
-            const x = positions.getX(index);
-            const y = positions.getY(index);
-            const height = Math.sin(x * 0.16) * 0.12 +
-                Math.cos(y * 0.11) * 0.1 +
-                Math.sin((x + y) * 0.05) * 0.16;
-            positions.setZ(index, height);
-        }
-        next.computeVertexNormals();
-        return next;
-    }, []);
-    return (_jsx("mesh", { "rotation-x": -Math.PI / 2, geometry: geometry, children: _jsx("meshStandardMaterial", { color: "#283729", roughness: 0.9, metalness: 0 }) }));
-}
-function RockField() {
-    const rocks = useMemo(() => Array.from({ length: 18 }, (_, index) => {
-        const angle = index * 2.399963229728653;
-        const radius = 10 + ((index * 17) % 58);
-        return {
-            id: `rock-${index}`,
-            x: Math.cos(angle) * radius,
-            z: Math.sin(angle) * radius,
-            scale: 0.45 + ((index * 13) % 11) / 10,
-            rotation: angle,
-        };
-    }), []);
-    return (_jsx(_Fragment, { children: rocks.map((rock) => (_jsxs("mesh", { position: [rock.x, 0.25 * rock.scale, rock.z], rotation: [0.1, rock.rotation, -0.08], scale: [rock.scale * 1.4, rock.scale * 0.7, rock.scale], children: [_jsx("dodecahedronGeometry", { args: [0.8, 0] }), _jsx("meshStandardMaterial", { color: "#6b6f63", roughness: 1 })] }, rock.id))) }));
-}
-function WorldEnvironment({ environment: Environment }) {
-    if (Environment !== undefined)
-        return _jsx(Environment, {});
-    return (_jsxs(_Fragment, { children: [_jsx(GroundPlane, {}), _jsx("gridHelper", { args: [160, 80, "#3a3f4a", "#2b2f38"], "position-y": 0.01 }), _jsx(RockField, {})] }));
-}
-function WorldActors({ entitySprites, entityModels, objectModels, objectStyles, assets, renderEntity, renderObject, selectedIds, hideLocalActor, }) {
-    const ctx = useGameContext();
-    const entities = useSceneEntities();
-    const objects = useSceneObjects();
-    const player = usePlayer();
-    const targetId = useTarget(player.userId);
-    const controlledId = ctx.player.possession.active(player.userId);
-    const handleSelect = (entity) => {
-        const relation = ctx.scene.entity.canReceive(entity.id, "damage") === null ? "hostile" : "friendly";
-        ctx.scene.entity.setTarget(controlledId, relation === "hostile" || entity.role === "npc" ? entity.id : null);
-    };
-    return (_jsxs(_Fragment, { children: [entities
-                .filter((entity) => entity.name !== WORLD_ITEM_ENTITY_NAME)
-                .filter((entity) => !(hideLocalActor && entity.id === controlledId))
-                .map((entity) => (_jsx(EntityMarker, { entity: entity, custom: renderEntity?.(entity), model: resolveEntityModel(entityModels?.[entity.name], assets, entity.name), sprite: entitySprites?.[entity.name], isLocal: entity.id === controlledId, targeted: entity.id === targetId, selected: selectedIds.has(entity.id), onSelect: handleSelect }, entity.id))), objects.map((object) => {
-                const model = resolveModel(objectModels?.[object.catalogId], assets, {
-                    seam: "objectModels",
-                    key: object.catalogId,
-                }) ?? tryResolveCatalogModel(object.catalogId, assets);
-                return (_jsx(ObjectMarker, { object: object, custom: renderObject?.(object), model: model, style: objectStyles?.[object.catalogId] }, object.instanceId));
-            })] }));
-}
-function WorldView({ entitySprites, entityModels, objectModels, objectStyles, environment, assets, renderEntity, renderObject, selectedIds, hideLocalActor, }) {
-    return (_jsxs(_Fragment, { children: [_jsx(WorldEnvironment, { environment: environment }), _jsx(WorldActors, { entitySprites: entitySprites, entityModels: entityModels, objectModels: objectModels, objectStyles: objectStyles, assets: assets, renderEntity: renderEntity, renderObject: renderObject, selectedIds: selectedIds, hideLocalActor: hideLocalActor })] }));
-}
-function RemotePlayers({ rows }) {
-    return (_jsx(_Fragment, { children: rows.map((row) => (_jsxs("group", { position: [row.position.x, row.position.y, row.position.z], "rotation-y": row.rotationY, children: [_jsxs("mesh", { "position-y": 0.95, children: [_jsx("capsuleGeometry", { args: [0.35, 1.1, 6, 14] }), _jsx("meshStandardMaterial", { color: colorFromId(row.userId) })] }), _jsxs("mesh", { position: [0, 1.35, 0.32], children: [_jsx("boxGeometry", { args: [0.16, 0.16, 0.16] }), _jsx("meshStandardMaterial", { color: "#f8fafc" })] })] }, row.userId))) }));
-}
-function FrameDriver({ ctx, playable, tracker, yawRef, pitchRef, primaryClickRef, pointerAxisRef, gateRef, onRuntimeError, multiplayer, serverIdRef, pointerService, pointerAim, pingCommand, poster, onPosterSettled, }) {
-    const posterElapsedRef = useRef(0);
-    const posterDoneRef = useRef(false);
-    const hasReportedTickError = useRef(false);
-    const repeatFiredAtRef = useRef(new Map());
-    const slotActions = useMemo(() => findHotbarSlotActions(playable.game.input), [playable]);
-    const hotbarId = useMemo(() => hotbarIdFor(playable), [playable]);
-    const movementTuning = useMemo(() => resolvePlayerMovementTuning({
-        collision: playable.collision,
-        movement: playable.movement,
-        physics: playable.game.physics,
-        world: playable.game.world,
-    }), [playable]);
-    const autoPickupRadius = useMemo(() => {
-        const cfg = playable.worldItem?.autoPickup;
-        if (cfg === undefined || cfg === false)
-            return null;
-        const fallback = playable.worldItem?.pickupRadius ?? DEFAULT_PICKUP_RADIUS;
-        return cfg === true ? fallback : cfg.radius ?? fallback;
-    }, [playable]);
-    const drivesPose = useMemo(() => shellDrivesPlayerPose(playable.game.input), [playable]);
-    const serverAuthoritative = useMemo(() => isServerAuthoritative(playable.game.multiplayer) && multiplayer !== null, [playable, multiplayer]);
-    const commandSink = useMemo(() => ({
-        run: (name, input) => resolveCommandSink(ctx, {
-            serverAuthoritative,
-            backend: multiplayer?.backend ?? null,
-            serverId: serverIdRef.current,
-        }).run(name, input),
-    }), [ctx, multiplayer, serverAuthoritative, serverIdRef]);
-    const inputSink = useMemo(() => ({
-        send: (frame) => resolveInputSink({
-            serverAuthoritative,
-            backend: multiplayer?.backend ?? null,
-            serverId: serverIdRef.current,
-        }).send(frame),
-    }), [multiplayer, serverAuthoritative, serverIdRef]);
-    const lastSentInputRef = useRef(null);
-    const inputActions = useMemo(() => Object.keys(playable.game.input ?? {}), [playable]);
-    useFrame((_state, rawDt) => {
-        if (poster) {
-            if (posterDoneRef.current)
-                return;
-            posterElapsedRef.current += Math.min(rawDt, 0.05);
-            if (posterElapsedRef.current >= POSTER_SETTLE_SECONDS) {
-                posterDoneRef.current = true;
-                onPosterSettled();
-                return;
-            }
-        }
-        const sendInput = () => {
-            if (!serverAuthoritative)
-                return;
-            const frame = { held: ctx.input.held(), pointer: ctx.input.pointer() };
-            const last = lastSentInputRef.current;
-            if (last !== null && inputFramesEqual(last, frame))
-                return;
-            lastSentInputRef.current = frame;
-            inputSink.send(frame);
-        };
-        if (gateRef.current) {
-            ctx.input.publish(heldActionsFor(tracker, NO_ACTIONS));
-            sendInput();
-            return;
-        }
-        const simStart = performance.now();
-        try {
-            let endPhase = devtools.profile.begin("time+input");
-            const dt = Math.min(rawDt, 0.05);
-            const gameDt = ctx.time.advance(dt);
-            ctx.input.publish(heldActionsFor(tracker, inputActions));
-            ctx.input.publishPointer(pointerAxisRef.current);
-            sendInput();
-            const turnInput = (tracker.isDown("turnRight") ? 1 : 0) - (tracker.isDown("turnLeft") ? 1 : 0);
-            if (turnInput !== 0)
-                yawRef.current = steerYaw(yawRef.current, turnInput, TURN_SPEED, dt);
-            endPhase();
-            const playerId = ctx.player.possession.active(ctx.player.userId);
-            const player = ctx.scene.entity.get(playerId);
-            if (player !== null && drivesPose && !serverAuthoritative) {
-                endPhase = devtools.profile.begin("pose");
-                stepPlayerMovement(ctx, ctx.player.userId, { held: ctx.input.held(), pointer: ctx.input.pointer() }, rawDt, movementTuning, yawRef.current);
-                endPhase();
-            }
-            if (autoPickupRadius !== null && !serverAuthoritative) {
-                endPhase = devtools.profile.begin("pickup");
-                const self = ctx.scene.entity.get(playerId);
-                if (self !== null) {
-                    const nearest = ctx.scene.worldItem.nearestInRadius(self.position, autoPickupRadius);
-                    if (nearest !== null)
-                        ctx.scene.worldItem.pickup(nearest, ctx.player.userId);
-                }
-                endPhase();
-            }
-            if (!serverAuthoritative) {
-                devtools.profile.measure("onTick", () => {
-                    playable.loop.onTick(ctx, gameDt);
-                });
-            }
-            endPhase = devtools.profile.begin("actions");
-            if (tracker.wasPressed("tabTarget")) {
-                if (ctx.game.commands.has("target.cycle"))
-                    ctx.game.commands.run("target.cycle", {});
-                else
-                    ctx.scene.entity.cycleTarget(playerId, { filter: "hostile" });
-            }
-            if (tracker.wasPressed("clearTarget")) {
-                if (ctx.game.commands.has("target.clear"))
-                    ctx.game.commands.run("target.clear", {});
-                else
-                    ctx.scene.entity.setTarget(playerId, null);
-            }
-            if (pingCommand !== undefined && tracker.wasPressed("ping")) {
-                const hit = pointerService.worldHit();
-                if (hit !== null && ctx.game.commands.has(pingCommand)) {
-                    commandSink.run(pingCommand, {
-                        point: hit.point,
-                        entity: hit.entity,
-                        object: hit.object,
-                        normal: hit.normal,
-                    });
-                }
-            }
-            const aimOverride = pointerAim ? pointerAimFor(ctx, pointerService) : undefined;
-            const commandAim = aimOverride ?? { yaw: yawRef.current, pitch: pitchRef.current };
-            if (collisionDebug.getState().layers.aimLaser) {
-                const aimFrom = ctx.player.possession.active(playerId) ?? playerId;
-                collisionDebug.setAimProbe({
-                    from: aimFrom,
-                    aim: commandAim,
-                    originPolicy: { kind: "eye" },
-                    maxDistance: 100,
-                });
-            }
-            else if (collisionDebug.getAimProbe() !== null) {
-                collisionDebug.setAimProbe(null);
-            }
-            const nowMs = performance.now();
-            for (const action of Object.keys(playable.game.input ?? {})) {
-                const pressed = tracker.wasPressed(action);
-                if (action === "ping" && pingCommand !== undefined)
-                    continue;
-                if (action === "interact") {
-                    if (!pressed)
-                        continue;
-                    const prompts = playable.prompts?.(ctx);
-                    const focus = prompts === undefined ? null : ctx.scene.entity.get(playerId);
-                    if (prompts !== undefined && focus !== null) {
-                        const active = resolveActivePrompt({ x: focus.position[0], z: focus.position[2] }, prompts);
-                        if (active !== null && active.prompt.invoke !== null) {
-                            commandSink.run(active.prompt.invoke.name, active.prompt.invoke.input);
-                        }
-                    }
-                    continue;
-                }
-                if (!shouldFireBoundAction(tracker, action, playable.game.input, repeatFiredAtRef.current, nowMs))
-                    continue;
-                repeatFiredAtRef.current.set(action, nowMs);
-                dispatchBoundAction(ctx, action, yawRef.current, pitchRef.current, commandAim, RESERVED_INPUT_ACTIONS, commandSink);
-            }
-            if (hotbarId !== null) {
-                for (const { action, slot } of slotActions) {
-                    if (!tracker.wasPressed(action))
-                        continue;
-                    const result = executeHotbarSlot(ctx, playerId, hotbarId, slot, yawRef.current, pitchRef.current, aimOverride);
-                    if (!result.ok)
-                        console.warn(`[jgengine:item-use] ${result.error}`);
-                }
-                const usePrimary = tracker.wasPressed("useAbility") || (primaryClickRef.current && hotbarId !== null);
-                if (usePrimary) {
-                    primaryClickRef.current = false;
-                    const slots = ctx.player.inventory.state(hotbarId).slots;
-                    const preferred = playable.hotbarSelection?.() ?? -1;
-                    const slot = preferred >= 0 && slots[preferred] !== null && slots[preferred] !== undefined
-                        ? preferred
-                        : slots.findIndex((stack) => stack !== null);
-                    if (slot >= 0) {
-                        const result = executeHotbarSlot(ctx, playerId, hotbarId, slot, yawRef.current, pitchRef.current, aimOverride);
-                        if (!result.ok)
-                            console.warn(`[jgengine:item-use] ${result.error}`);
-                    }
-                }
-            }
-            tracker.endFrame();
-            endPhase();
-            const serverId = serverIdRef.current;
-            if (multiplayer !== null && serverId !== null) {
-                endPhase = devtools.profile.begin("presence");
-                const focus = ctx.scene.entity.get(playerId);
-                if (focus !== null) {
-                    multiplayer.backend.presenceSync.syncPose(serverId, {
-                        x: focus.position[0],
-                        y: focus.position[1],
-                        z: focus.position[2],
-                        rotationY: focus.rotationY,
-                        rotationPitch: pitchRef.current,
-                    });
-                }
-                endPhase();
-            }
-        }
-        catch (error) {
-            if (!hasReportedTickError.current) {
-                hasReportedTickError.current = true;
-                onRuntimeError(error, "tick");
-            }
-        }
-        devtools.frame.record({ frameMs: rawDt * 1000, simMs: performance.now() - simStart });
-    }, GAME_SIM_FRAME_PRIORITY);
-    return null;
-}
-function HudOnlyDriver({ ctx, playable, tracker, pointerAxisRef, gateRef, onRuntimeError, }) {
-    const hasReportedTickError = useRef(false);
-    const repeatFiredAtRef = useRef(new Map());
-    const lastFrameRef = useRef(null);
-    const inputActions = useMemo(() => Object.keys(playable.game.input ?? {}), [playable]);
-    useEffect(() => {
-        let frameId;
-        const tick = (now) => {
-            frameId = requestAnimationFrame(tick);
-            const last = lastFrameRef.current;
-            lastFrameRef.current = now;
-            if (last === null)
-                return;
-            if (gateRef.current) {
-                ctx.input.publish(heldActionsFor(tracker, NO_ACTIONS));
-                return;
-            }
-            const rawDt = (now - last) / 1000;
-            const simStart = performance.now();
-            try {
-                let endPhase = devtools.profile.begin("time+input");
-                const dt = Math.min(rawDt, 0.05);
-                const gameDt = ctx.time.advance(dt);
-                ctx.input.publish(heldActionsFor(tracker, inputActions));
-                ctx.input.publishPointer(pointerAxisRef.current);
-                endPhase();
-                devtools.profile.measure("onTick", () => {
-                    playable.loop.onTick(ctx, gameDt);
-                });
-                endPhase = devtools.profile.begin("actions");
-                const nowMs = performance.now();
-                for (const action of inputActions) {
-                    if (!shouldFireBoundAction(tracker, action, playable.game.input, repeatFiredAtRef.current, nowMs))
-                        continue;
-                    repeatFiredAtRef.current.set(action, nowMs);
-                    dispatchBoundAction(ctx, action, 0, 0, { yaw: 0, pitch: 0 }, EMPTY_RESERVED);
-                }
-                tracker.endFrame();
-                endPhase();
-            }
-            catch (error) {
-                if (!hasReportedTickError.current) {
-                    hasReportedTickError.current = true;
-                    onRuntimeError(error, "tick");
-                }
-            }
-            devtools.frame.record({ frameMs: rawDt * 1000, simMs: performance.now() - simStart });
-        };
-        frameId = requestAnimationFrame(tick);
-        return () => cancelAnimationFrame(frameId);
-    }, [ctx, playable, tracker, pointerAxisRef, gateRef, onRuntimeError, inputActions]);
-    return null;
-}
-class GameUiErrorBoundary extends Component {
-    state = { failed: false };
-    static getDerivedStateFromError() {
-        return { failed: true };
-    }
-    componentDidCatch(error, info) {
-        this.props.onRuntimeError(error, "ui-render", info.componentStack ?? undefined);
-    }
-    render() {
-        if (this.state.failed)
-            return null;
-        return this.props.children;
-    }
-}
-function expandedReactError(message) {
-    return /Minified React error #185\b/.test(message)
-        ? "Maximum update depth exceeded. A component is repeatedly updating state during render or after every update."
-        : null;
-}
-function diagnosticReport(diagnostic, gameName) {
-    const explanation = expandedReactError(diagnostic.message);
-    return [
-        "JGengine runtime error",
-        `Game: ${gameName}`,
-        `Engine: ${VERSION}`,
-        `Phase: ${diagnostic.phase}`,
-        `Time: ${diagnostic.capturedAt}`,
-        `Page: ${window.location.origin}${window.location.pathname}`,
-        `Browser: ${navigator.userAgent}`,
-        explanation === null ? null : `Explanation: ${explanation}`,
-        "",
-        `Message: ${diagnostic.message}`,
-        diagnostic.stack === undefined ? null : `JavaScript stack:\n${diagnostic.stack}`,
-        diagnostic.componentStack === undefined ? null : `React component stack:\n${diagnostic.componentStack}`,
-    ]
-        .filter((line) => line !== null)
-        .join("\n");
-}
-function DiagnosticOverlay({ diagnostics, gameName }) {
-    const [copied, setCopied] = useState(false);
-    if (diagnostics.length === 0)
-        return null;
-    const latest = diagnostics[diagnostics.length - 1];
-    const explanation = expandedReactError(latest.message);
-    const report = diagnosticReport(latest, gameName);
-    const issueBody = report.length > 8000 ? `${report.slice(0, 8000)}\n\n[Report truncated; use Copy error for the full report.]` : report;
-    const issueUrl = `https://github.com/Noisemaker111/jgengine/issues/new?title=${encodeURIComponent(`[BUG] ${latest.phase}: ${latest.message.slice(0, 100)}`)}&body=${encodeURIComponent(issueBody)}`;
-    return (_jsxs("div", { className: "pointer-events-auto absolute right-4 top-4 z-50 max-w-lg rounded border border-red-400/60 bg-red-950/95 p-3 text-xs text-red-50 shadow-2xl", children: [_jsx("div", { className: "mb-1 font-semibold uppercase tracking-wide text-red-200", children: "JG engine error" }), _jsxs("div", { className: "font-mono text-[11px] text-red-100", children: ["[", latest.phase, "] ", latest.message] }), explanation !== null ? _jsx("div", { className: "mt-2 text-red-100", children: explanation }) : null, latest.stack !== undefined ? (_jsx("pre", { className: "mt-2 max-h-36 overflow-auto whitespace-pre-wrap text-[10px] text-red-200/80", children: latest.stack })) : null, latest.componentStack !== undefined ? (_jsx("pre", { className: "mt-2 max-h-36 overflow-auto whitespace-pre-wrap text-[10px] text-red-200/80", children: latest.componentStack })) : null, _jsxs("div", { className: "mt-3 flex gap-2", children: [_jsx("button", { className: "rounded border border-red-300/50 bg-red-900 px-2 py-1 font-semibold hover:bg-red-800", type: "button", onClick: () => {
-                            void navigator.clipboard.writeText(report).then(() => {
-                                setCopied(true);
-                                window.setTimeout(() => setCopied(false), 2000);
-                            });
-                        }, children: copied ? "Copied" : "Copy error" }), _jsx("a", { className: "rounded border border-red-300/50 bg-red-900 px-2 py-1 font-semibold hover:bg-red-800", href: issueUrl, rel: "noreferrer", target: "_blank", children: "File issue" })] })] }));
-}
-const POSTER_SETTLE_SECONDS = 1.6;
 export function GamePlayerShell({ playable, multiplayer: rawMultiplayer = null, poster = false, onContextReady, }) {
     const multiplayer = useMemo(() => (rawMultiplayer === null ? null : withDevtoolsLatency(rawMultiplayer)), [rawMultiplayer]);
     const devtoolsEnabled = playable.devtools !== false && !poster;
     const [devtoolsOpen, setDevtoolsOpen] = useState(false);
+    const devtoolsOpenRef = useRef(false);
+    devtoolsOpenRef.current = devtoolsOpen;
+    useEffect(() => installAgentBridge({
+        playable,
+        devtoolsEnabled,
+        isDevtoolsOpen: () => devtoolsOpenRef.current,
+        setDevtoolsOpen,
+    }), [playable, devtoolsEnabled]);
     const [posterFrozen, setPosterFrozen] = useState(false);
     const posterSettledRef = useRef(false);
     const [ctx, setCtx] = useState(null);
@@ -967,7 +93,6 @@ export function GamePlayerShell({ playable, multiplayer: rawMultiplayer = null,
     const pointerAxisRef = useRef(null);
     const marqueeStartRef = useRef(null);
     const f2HeldRef = useRef(false);
-    const f2ChordedRef = useRef(false);
     const pointerService = useMemo(() => createPointerService(), []);
     const selection = useMemo(() => createSelectionSet(), [playable]);
     const [marquee, setMarquee] = useState(null);
@@ -1001,6 +126,7 @@ export function GamePlayerShell({ playable, multiplayer: rawMultiplayer = null,
         firstPerson: resolveRigKind(playable.camera) === "first",
         config: playable.touch,
     }), [playable]);
+    const touchStyle = useTouchStyle(settingsStore, touchScheme?.style ?? DEFAULT_TOUCH_STYLE);
     const { coarsePointer, portrait, compact } = useDisplayProfile();
     const touchSink = useMemo(() => ({ onCodeDown: (code) => tracker.handleDown(code), onCodeUp: (code) => tracker.handleUp(code) }), [tracker]);
     const gateRef = useRef(false);
@@ -1021,18 +147,7 @@ export function GamePlayerShell({ playable, multiplayer: rawMultiplayer = null,
     useEffect(() => {
         if (ctx === null)
             return;
-        const offPlay = ctx.game.events.on("audio.play", ({ sound, at }) => {
-            audioEngine.playOneShot(sound, at === undefined ? undefined : { x: at[0], y: at[1], z: at[2] });
-        });
-        const offMusic = ctx.game.events.on("audio.music", ({ theme, transpose }) => {
-            audioEngine.playMusic(theme, transpose === undefined ? undefined : { transpose });
-        });
-        const offResume = ctx.game.events.on("audio.resume", () => audioEngine.resume());
-        return () => {
-            offPlay();
-            offMusic();
-            offResume();
-        };
+        return attachAudioEventWire(ctx.game.events, audioEngine);
     }, [ctx, audioEngine]);
     useEffect(() => {
         if (typeof document === "undefined")
@@ -1062,7 +177,6 @@ export function GamePlayerShell({ playable, multiplayer: rawMultiplayer = null,
         setDiagnostics((current) => [...current.slice(-4), { ...diagnostic, id: Date.now() + current.length }]);
     };
     useEffect(() => {
-        playable.game.scene.clear();
         setDiagnostics([]);
         try {
             const context = createGameContext({
@@ -1080,102 +194,10 @@ export function GamePlayerShell({ playable, multiplayer: rawMultiplayer = null,
             setCtx(null);
         }
         return () => {
-            playable.game.scene.clear();
             setCtx(null);
         };
     }, [playable, userId]);
-    useEffect(() => {
-        if (ctx === null || multiplayer === null)
-            return;
-        let disposed = false;
-        const cleanups = [];
-        void multiplayer.backend.transport
-            .joinServer({ gameId: multiplayer.gameId })
-            .then((joined) => {
-            if (disposed) {
-                void multiplayer.backend.transport.leaveServer({ serverId: joined.serverId });
-                return;
-            }
-            serverIdRef.current = joined.serverId;
-            if (isServerAuthoritative(playable.game.multiplayer) && multiplayer.backend.feeds !== undefined) {
-                cleanups.push(attachWorldSync(multiplayer.backend.feeds, joined.serverId, ctx));
-            }
-            cleanups.push(multiplayer.backend.presenceSync.subscribe(joined.serverId, (rows) => {
-                setRemotePlayers(rows.filter((row) => row.userId !== multiplayer.userId));
-            }));
-            const seen = new Set();
-            let injecting = false;
-            for (const action of multiplayer.feedActions) {
-                cleanups.push(ctx.game.feed.subscribe(action, (entry) => {
-                    if (injecting)
-                        return;
-                    void multiplayer.backend
-                        .pushFeedEntry({
-                        serverId: joined.serverId,
-                        action,
-                        entry: { at: entry.at, data: entry.data, from: multiplayer.userId },
-                    })
-                        .catch(() => undefined);
-                }));
-                const remoteUnsub = multiplayer.backend.feeds?.subscribeFeed({ serverId: joined.serverId, action }, (view) => {
-                    for (const raw of view.entries) {
-                        const remote = raw;
-                        if (typeof remote.from !== "string" || remote.from === multiplayer.userId)
-                            continue;
-                        const key = `${action}|${remote.from}|${remote.at ?? 0}`;
-                        if (seen.has(key))
-                            continue;
-                        seen.add(key);
-                        injecting = true;
-                        ctx.game.feed.push(action, remote.data);
-                        injecting = false;
-                    }
-                });
-                if (remoteUnsub !== undefined)
-                    cleanups.push(remoteUnsub);
-            }
-            const chatSync = multiplayer.backend.chatSyncFor?.(joined.serverId);
-            if (chatSync !== undefined && ctx.game.chat !== undefined) {
-                const chat = ctx.game.chat;
-                const globalChannelIds = new Set(chat
-                    .channels()
-                    .filter((channel) => channel.kind === "global")
-                    .map((channel) => channel.id));
-                const seenRemoteChat = new Set();
-                cleanups.push(ctx.game.events.subscribe("chat.message", (event) => {
-                    if (event.fromUserId !== multiplayer.userId)
-                        return;
-                    if (!globalChannelIds.has(event.channelId))
-                        return;
-                    void chatSync.send(event.channelId, event.body).catch(() => undefined);
-                }));
-                for (const channelId of globalChannelIds) {
-                    cleanups.push(chatSync.subscribe(channelId, (messages) => {
-                        for (const message of messages) {
-                            if (message.fromUserId === multiplayer.userId)
-                                continue;
-                            if (seenRemoteChat.has(message.id))
-                                continue;
-                            seenRemoteChat.add(message.id);
-                            chat.send(message.fromUserId, message.channelId, message.body);
-                        }
-                    }));
-                }
-            }
-        })
-            .catch(() => undefined);
-        return () => {
-            disposed = true;
-            for (const cleanup of cleanups)
-                cleanup();
-            const serverId = serverIdRef.current;
-            serverIdRef.current = null;
-            setRemotePlayers([]);
-            if (serverId !== null) {
-                void multiplayer.backend.transport.leaveServer({ serverId }).catch(() => undefined);
-            }
-        };
-    }, [ctx, multiplayer, playable]);
+    useShellMultiplayerSync(ctx, multiplayer, playable, serverIdRef, setRemotePlayers);
     useEffect(() => {
         wrapperRef.current?.focus();
     }, [ctx]);
@@ -1192,31 +214,33 @@ export function GamePlayerShell({ playable, multiplayer: rawMultiplayer = null,
     if (rigKind === "none" || playable.presentation === "hud") {
         const GameUI = playable.GameUI;
         return (_jsx("div", { ref: wrapperRef, tabIndex: 0, className: "relative h-full w-full bg-neutral-950 outline-none", onKeyDown: (event) => {
-                if (event.code === "F2" && devtoolsEnabled) {
+                if (event.code === "F2") {
                     event.preventDefault();
                     f2HeldRef.current = true;
-                    f2ChordedRef.current = false;
                     return;
                 }
                 if (f2HeldRef.current) {
-                    f2ChordedRef.current = true;
+                    if (event.code === "KeyD" && devtoolsEnabled) {
+                        event.preventDefault();
+                        setDevtoolsOpen((current) => !current);
+                    }
                     return;
                 }
                 if (event.code === "Tab" || event.code === "Space")
                     event.preventDefault();
-                tracker.handleDown(event.code);
+                if (playControlsActive(ctx))
+                    tracker.handleDown(event.code);
             }, onKeyUp: (event) => {
-                if (event.code === "F2" && devtoolsEnabled) {
+                if (event.code === "F2") {
                     f2HeldRef.current = false;
-                    if (!f2ChordedRef.current)
-                        setDevtoolsOpen((current) => !current);
                     return;
                 }
-                tracker.handleUp(event.code);
+                if (playControlsActive(ctx))
+                    tracker.handleUp(event.code);
             }, onBlur: () => {
                 f2HeldRef.current = false;
                 tracker.reset();
-            }, onPointerDown: () => audioEngine.resume(), onPointerMove: trackPointerAxis, onPointerLeave: deactivatePointerAxis, onPointerCancel: deactivatePointerAxis, children: _jsxs(GameViewportProvider, { platforms: playable.platforms, children: [_jsx(HudOnlyDriver, { ctx: ctx, playable: playable, tracker: tracker, pointerAxisRef: pointerAxisRef, gateRef: gateRef, onRuntimeError: reportRuntimeError }), !orientationGate && coarsePointer && touchScheme !== null && touchScheme.gestures !== null && playControlsActive(ctx) ? (_jsx(TouchPlaySurface, { scheme: touchScheme, sink: touchSink, yawRef: yawRef, pitchRef: pitchRef, maxPitch: 0, onPrimaryTap: () => undefined })) : null, _jsx(GameUiErrorBoundary, { onRuntimeError: reportRuntimeError, children: _jsx(GameProvider, { context: ctx, children: _jsx(HudViewportProvider, { platforms: playable.platforms, config: playable.hudFit, userScale: graphics.uiScale, children: orientationGate ? null : _jsx(GameUI, {}) }) }) }), orientationGateEl, devtoolsEnabled ? (_jsx(DevtoolsOverlay, { open: devtoolsOpen, ctx: ctx, playable: playable, multiplayer: multiplayer })) : null, _jsx(DiagnosticOverlay, { diagnostics: diagnostics, gameName: playable.game.name })] }) }));
+            }, onPointerDown: () => audioEngine.resume(), onPointerMove: trackPointerAxis, onPointerLeave: deactivatePointerAxis, onPointerCancel: deactivatePointerAxis, children: _jsxs(GameViewportProvider, { platforms: playable.platforms, children: [_jsx(HudOnlyDriver, { ctx: ctx, playable: playable, tracker: tracker, pointerAxisRef: pointerAxisRef, gateRef: gateRef, onRuntimeError: reportRuntimeError }), !orientationGate && coarsePointer && touchScheme !== null && touchScheme.gestures !== null && playControlsActive(ctx) ? (_jsx(TouchPlaySurface, { scheme: touchScheme, sink: touchSink, yawRef: yawRef, pitchRef: pitchRef, maxPitch: 0, onPrimaryTap: () => undefined })) : null, _jsx(GameUiErrorBoundary, { onRuntimeError: reportRuntimeError, children: _jsxs(GameProvider, { context: ctx, children: [_jsx(GamePhaseStamp, {}), _jsx(HudViewportProvider, { platforms: playable.platforms, config: playable.hudFit, userScale: graphics.uiScale, children: orientationGate ? null : _jsx(GameUI, {}) })] }) }), orientationGateEl, devtoolsEnabled ? (_jsx(DevtoolsOverlay, { open: devtoolsOpen, ctx: ctx, playable: playable, multiplayer: multiplayer })) : null, _jsx(DiagnosticOverlay, { diagnostics: diagnostics, gameName: playable.game.name })] }) }));
     }
     const firstPerson = rigKind === "first";
     const showReticle = (firstPerson && playable.camera?.firstPerson?.reticle !== false) || rigKind === "shoulder";
@@ -1231,23 +255,40 @@ export function GamePlayerShell({ playable, multiplayer: rawMultiplayer = null,
     const barsMaxDistance = worldBars === undefined || worldBars === true || worldBars === false
         ? undefined
         : worldBars.maxDistance;
+    const nameplates = playable.nameplates;
+    const nameplatesStatId = nameplates === undefined || nameplates === false
+        ? null
+        : nameplates === true
+            ? "health"
+            : nameplates.statId ?? "health";
+    const nameplatesRoles = nameplates === undefined || nameplates === true || nameplates === false ? undefined : nameplates.roles;
+    const nameplatesMaxDistance = nameplates === undefined || nameplates === true || nameplates === false ? undefined : nameplates.maxDistance;
     const resolveEntityRole = (entity) => playable.content.entityById?.(entity.name)?.role;
     const pointer = playable.pointer;
     const pointerUsesLeft = pointer !== undefined && (pointer.select === true || pointer.moveCommand !== undefined);
     const selectFilter = pointer?.selectFilter;
     const worldSky = resolveWorldSky(playable.game.world);
     const world = playable.game.world;
+    const biomeBands = world?.kind === "environment" ? world.terrain?.biomeBands : undefined;
     const AutoEnvironment = playable.environment ??
         (world?.kind === "environment"
             ? () => _jsx(EnvironmentScene, { feature: world })
             : world?.kind === "biomes" || world?.kind === "voxel" || world?.kind === "plots" || world?.kind === "tilemap"
                 ? () => _jsx(GridWorldScene, { feature: world })
                 : undefined);
-    const backdrop = playable.backdrop;
+    const resolvedLook = resolveGameLook({
+        look: playable.look,
+        lighting: playable.lighting,
+        backdrop: playable.backdrop,
+        postProcessing: playable.postProcessing,
+        hasWorldSky: worldSky !== undefined,
+    });
+    const cinematicLook = (playable.look ?? "cinematic") !== "flat";
+    const backdrop = resolvedLook.backdrop;
     const backdropSky = backdrop?.sky !== undefined ? resolveSkyDescriptor(backdrop.sky) : undefined;
     const effectiveSky = backdropSky ?? worldSky;
     const backgroundColor = backdrop?.background ?? (effectiveSky === undefined ? DEFAULT_BACKGROUND_COLOR : undefined);
-    const lighting = playable.lighting;
+    const lighting = resolvedLook.lighting;
     const orthographic = playable.camera?.projection === "orthographic";
     const localXY = (event) => {
         const rect = wrapperRef.current?.getBoundingClientRect();
@@ -1273,7 +314,8 @@ export function GamePlayerShell({ playable, multiplayer: rawMultiplayer = null,
     /** DOM UI (menus, HUD buttons) sits in the same wrapper as the canvas — only canvas-targeted clicks are world input. */
     const isWorldPointerTarget = (event) => event.target instanceof HTMLCanvasElement;
     const handlePointerDown = (event) => {
-        wrapperRef.current?.focus();
+        if (isWorldPointerTarget(event))
+            wrapperRef.current?.focus();
         trackPointerAxis(event);
         audioEngine.resume();
         if (contextMenu !== null)
@@ -1411,32 +453,35 @@ export function GamePlayerShell({ playable, multiplayer: rawMultiplayer = null,
         controlsActive &&
         touchScheme !== null &&
         (touchScheme.joystick !== null || touchScheme.buttons.length > 0);
-    return (_jsx(SettingsProvider, { store: settingsStore, children: _jsxs(PlayerFovProvider, { config: playable.camera, orthographic: orthographic, children: [_jsx(AudioSettingsBridge, { store: settingsStore, engine: audioEngine, buses: playable.audio?.buses }), _jsx(SettingsRuntime, { variant: settingsVariant, surface: settingsSurface, actions: settingsActions, input: playable.game.input ?? {}, buses: playable.audio?.buses, extra: settingsConfig.extra ?? [], categories: settingsConfig.categories ?? [], hide: hideCategories, fovEnabled: fovControlEnabled, hideBindings: settingsConfig.hideBindings ?? [], overrides: bindingOverrides, rebind: rebindAction, resetBinding: resetActionBinding, children: _jsx("div", { ref: wrapperRef, tabIndex: 0, ...(poster && posterFrozen ? { "data-poster-ready": "" } : {}), className: "relative h-full w-full bg-neutral-950 outline-none", style: {
+    return (_jsx(SettingsProvider, { store: settingsStore, children: _jsxs(PlayerFovProvider, { config: playable.camera, orthographic: orthographic, children: [_jsx(AudioSettingsBridge, { store: settingsStore, engine: audioEngine, buses: playable.audio?.buses }), _jsx(SettingsRuntime, { variant: settingsVariant, surface: settingsSurface, actions: settingsActions, input: playable.game.input ?? {}, buses: playable.audio?.buses, extra: settingsConfig.extra ?? [], categories: settingsConfig.categories ?? [], hide: hideCategories, fovEnabled: fovControlEnabled, hideBindings: settingsConfig.hideBindings ?? [], touchStyle: coarsePointer &&
+                        touchScheme !== null &&
+                        (touchScheme.joystick !== null || touchScheme.buttons.length > 0), overrides: bindingOverrides, rebind: rebindAction, resetBinding: resetActionBinding, children: _jsx("div", { ref: wrapperRef, tabIndex: 0, ...(poster && posterFrozen ? { "data-poster-ready": "" } : {}), className: "relative h-full w-full bg-neutral-950 outline-none", style: {
                             "--jg-hud-dock-clearance": `${dockMounted ? touchDockClearance(touchScheme, touchScale) : 0}px`,
                         }, onKeyDown: (event) => {
-                            if (event.code === "F2" && devtoolsEnabled) {
+                            if (event.code === "F2") {
                                 event.preventDefault();
                                 f2HeldRef.current = true;
-                                f2ChordedRef.current = false;
                                 return;
                             }
                             if (f2HeldRef.current) {
-                                f2ChordedRef.current = true;
+                                if (event.code === "KeyD" && devtoolsEnabled) {
+                                    event.preventDefault();
+                                    document.exitPointerLock?.();
+                                    setDevtoolsOpen((current) => !current);
+                                }
                                 return;
                             }
                             if (event.code === "Tab" || event.code === "Space")
                                 event.preventDefault();
-                            tracker.handleDown(event.code);
+                            if (playControlsActive(ctx))
+                                tracker.handleDown(event.code);
                         }, onKeyUp: (event) => {
-                            if (event.code === "F2" && devtoolsEnabled) {
+                            if (event.code === "F2") {
                                 f2HeldRef.current = false;
-                                if (!f2ChordedRef.current) {
-                                    document.exitPointerLock?.();
-                                    setDevtoolsOpen((current) => !current);
-                                }
                                 return;
                             }
-                            tracker.handleUp(event.code);
+                            if (playControlsActive(ctx))
+                                tracker.handleUp(event.code);
                         }, onBlur: () => {
                             f2HeldRef.current = false;
                             tracker.reset();
@@ -1460,14 +505,14 @@ export function GamePlayerShell({ playable, multiplayer: rawMultiplayer = null,
                                             fov: playable.camera?.frustum?.fov ?? CAMERA_FRUSTUM_DEFAULTS.fov,
                                             near: playable.camera?.frustum?.near ?? CAMERA_FRUSTUM_DEFAULTS.near,
                                             far: playable.camera?.frustum?.far ?? CAMERA_FRUSTUM_DEFAULTS.far,
-                                        }, shadows: graphics.shadows, dpr: graphics.dpr, gl: { preserveDrawingBuffer: true }, style: { touchAction: "none" }, children: [backgroundColor !== undefined ? _jsx("color", { attach: "background", args: [backgroundColor] }) : null, lighting !== undefined ? (_jsx(ConfiguredLighting, { lighting: lighting })) : effectiveSky === undefined ? (_jsxs(_Fragment, { children: [_jsx("ambientLight", { intensity: 0.55 }), _jsx("directionalLight", { position: [10, 16, 6], intensity: 1.3 })] })) : null, effectiveSky !== undefined ? (effectiveSky.timeOfDay ? (_jsx(TimeOfDayDaylight, { sky: effectiveSky, clock: ctx.time, lights: skyEmitsLights(resolveSkyLightOwnership(lighting !== undefined)) })) : (_jsx(SkyDaylight, { sky: effectiveSky, lights: skyEmitsLights(resolveSkyLightOwnership(lighting !== undefined)) }))) : null, _jsx(BackdropFog, { fog: backdrop?.fog }), _jsxs(GameProvider, { context: ctx, children: [_jsx(CullingProvider, { config: playable.visibility, children: _jsx(WorldView, { entitySprites: playable.entitySprites, entityModels: playable.entityModels, objectModels: playable.objectModels, objectStyles: playable.objectStyles, environment: AutoEnvironment, assets: playable.game.assets, renderEntity: playable.renderEntity, renderObject: playable.renderObject, selectedIds: selectedIds, hideLocalActor: firstPerson }) }), WorldOverlay !== undefined ? _jsx(WorldOverlay, {}) : null, barsStatId !== null ? (_jsx(WorldEntityBars, { statId: barsStatId, roles: barsRoles, resolveRole: resolveEntityRole, ...(barsMaxDistance === undefined ? {} : { maxDistance: barsMaxDistance }) })) : null, _jsx(WorldItems, { config: playable.worldItem }), _jsx(WorldTelegraphs, {}), _jsx(WorldFloatText, {}), _jsx(ProjectileTracers, {}), devtoolsEnabled ? _jsx(CollisionDebugWorld, {}) : null, _jsx(CombatCameraShake, {}), _jsx(AudioListener, { engine: audioEngine }), _jsx(EntityAudioEmitters, { engine: audioEngine, entitySounds: playable.entitySounds }), _jsx(ObjectAudioEmitters, { engine: audioEngine, objectSounds: playable.objectSounds }), _jsx(GameCameraRig, { yawRef: yawRef, pitchRef: pitchRef, config: cameraConfig, pointerControls: pointerUsesLeft, panKeysEnabled: rtsPanKeysEnabled, director: ctx.camera, onDragChange: (dragging) => {
+                                        }, shadows: graphics.shadows, dpr: graphics.dpr, gl: { preserveDrawingBuffer: true }, style: { touchAction: "none" }, children: [backgroundColor !== undefined ? _jsx("color", { attach: "background", args: [backgroundColor] }) : null, cinematicLook ? _jsx(EnvironmentLighting, {}) : null, lighting !== undefined ? (_jsx(ConfiguredLighting, { lighting: lighting })) : effectiveSky === undefined ? (_jsxs(_Fragment, { children: [_jsx("ambientLight", { intensity: 0.55 }), _jsx("directionalLight", { position: [10, 16, 6], intensity: 1.3 })] })) : null, effectiveSky !== undefined ? (effectiveSky.timeOfDay ? (_jsx(TimeOfDayDaylight, { sky: effectiveSky, clock: ctx.time, bands: effectiveSky === worldSky ? biomeBands : undefined, lights: skyEmitsLights(resolveSkyLightOwnership(lighting !== undefined)) })) : (_jsx(SkyDaylight, { sky: effectiveSky, bands: effectiveSky === worldSky ? biomeBands : undefined, lights: skyEmitsLights(resolveSkyLightOwnership(lighting !== undefined)) }))) : null, _jsx(BackdropFog, { fog: backdrop?.fog }), _jsxs(GameProvider, { context: ctx, children: [_jsx(CullingProvider, { config: playable.visibility, children: _jsx(WorldView, { entitySprites: playable.entitySprites, entityModels: playable.entityModels, objectModels: playable.objectModels, objectStyles: playable.objectStyles, environment: AutoEnvironment, assets: playable.game.assets, renderEntity: playable.renderEntity, renderObject: playable.renderObject, selectedIds: selectedIds, hideLocalActor: firstPerson }) }), WorldOverlay !== undefined ? _jsx(WorldOverlay, { ctx: ctx }) : null, barsStatId !== null ? (_jsx(WorldEntityBars, { statId: barsStatId, roles: barsRoles, resolveRole: resolveEntityRole, ...(barsMaxDistance === undefined ? {} : { maxDistance: barsMaxDistance }) })) : null, nameplatesStatId !== null ? (_jsx(WorldNameplates, { statId: nameplatesStatId, roles: nameplatesRoles, resolveRole: resolveEntityRole, ...(nameplatesMaxDistance === undefined ? {} : { maxDistance: nameplatesMaxDistance }) })) : null, _jsx(WorldItems, { config: playable.worldItem }), _jsx(WorldTelegraphs, {}), _jsx(WorldSpellVfx, {}), _jsx(RetainedVfx, {}), _jsx(WorldFloatText, {}), _jsx(ProjectileTracers, {}), devtoolsEnabled ? _jsx(CollisionDebugWorld, {}) : null, _jsx(CombatCameraShake, {}), _jsx(AudioListener, { engine: audioEngine }), _jsx(EntityAudioEmitters, { engine: audioEngine, entitySounds: playable.entitySounds }), _jsx(ObjectAudioEmitters, { engine: audioEngine, objectSounds: playable.objectSounds }), _jsx(GameCameraRig, { yawRef: yawRef, pitchRef: pitchRef, config: cameraConfig, viewmodel: playable.viewmodel, pointerControls: pointerUsesLeft, panKeysEnabled: rtsPanKeysEnabled, director: ctx.camera, onDragChange: (dragging) => {
                                                         cameraDraggingRef.current = dragging;
                                                     } }), _jsx(PointerProbe, { service: pointerService })] }), _jsx(RemotePlayers, { rows: remotePlayers }), _jsx(FrameDriver, { ctx: ctx, playable: playable, tracker: tracker, yawRef: yawRef, pitchRef: pitchRef, primaryClickRef: primaryClickRef, pointerAxisRef: pointerAxisRef, gateRef: gateRef, onRuntimeError: reportRuntimeError, multiplayer: multiplayer, serverIdRef: serverIdRef, pointerService: pointerService, pointerAim: pointer?.aim === true, pingCommand: pointer?.pingCommand, poster: poster, onPosterSettled: () => {
                                                 if (posterSettledRef.current)
                                                     return;
                                                 posterSettledRef.current = true;
                                                 setPosterFrozen(true);
-                                            } }), _jsx(DevtoolsRendererProbe, {}), playable.postProcessing !== undefined && playable.postProcessing.enabled !== false ? (_jsx(PostProcessing, { config: playable.postProcessing })) : null] }), !poster && !orientationGate && coarsePointer && controlsActive && touchScheme !== null && (touchScheme.gestures !== null || touchScheme.look) ? (_jsx(TouchPlaySurface, { scheme: touchScheme, sink: touchSink, yawRef: yawRef, pitchRef: pitchRef, maxPitch: playable.camera?.firstPerson?.maxPitch ?? 1.45, onPrimaryTap: () => {
+                                            } }), _jsx(DevtoolsRendererProbe, {}), resolvedLook.postProcessing !== undefined && resolvedLook.postProcessing.enabled !== false ? (_jsx(PostProcessing, { config: resolvedLook.postProcessing })) : null] }), !poster && !orientationGate && coarsePointer && controlsActive && touchScheme !== null && (touchScheme.gestures !== null || touchScheme.look) ? (_jsx(TouchPlaySurface, { scheme: touchScheme, sink: touchSink, yawRef: yawRef, pitchRef: pitchRef, maxPitch: playable.camera?.firstPerson?.maxPitch ?? 1.45, onPrimaryTap: () => {
                                         primaryClickRef.current = true;
-                                    } })) : null, _jsx(GameUiErrorBoundary, { onRuntimeError: reportRuntimeError, children: _jsx(GameProvider, { context: ctx, children: _jsx(HudViewportProvider, { platforms: playable.platforms, config: playable.hudFit, userScale: graphics.uiScale, children: orientationGate ? null : _jsx(GameUI, {}) }) }) }), !poster && !orientationGate && showReticle ? _jsx(Reticle, {}) : null, dockMounted && touchScheme !== null ? (_jsx(TouchControlsDock, { scheme: touchScheme, sink: touchSink, scale: touchScale })) : null, orientationGateEl, marquee !== null ? _jsx(MarqueeBox, { rect: marquee }) : null, contextMenu !== null ? (_jsx(ContextMenuView, { menu: contextMenu.menu, x: contextMenu.x, y: contextMenu.y, onPick: handleVerbPick, onClose: () => setContextMenu(null) })) : null, devtoolsEnabled ? (_jsx(DevtoolsOverlay, { open: devtoolsOpen, ctx: ctx, playable: playable, multiplayer: multiplayer })) : null, poster ? null : _jsx(DiagnosticOverlay, { diagnostics: diagnostics, gameName: playable.game.name }), poster || orthographic || settingsHostsFov ? null : _jsx(PlayerFovSlider, {}), poster ? null : _jsx(SettingsChrome, {})] }) }) })] }) }));
+                                    } })) : null, _jsx(GameUiErrorBoundary, { onRuntimeError: reportRuntimeError, children: _jsxs(GameProvider, { context: ctx, children: [_jsx(GamePhaseStamp, {}), _jsx(HudViewportProvider, { platforms: playable.platforms, config: playable.hudFit, userScale: graphics.uiScale, children: orientationGate ? null : _jsx(GameUI, {}) })] }) }), !poster && !orientationGate && showReticle ? _jsx(Reticle, {}) : null, dockMounted && touchScheme !== null ? (_jsx(TouchControlsDock, { scheme: touchScheme, sink: touchSink, style: touchStyle, scale: touchScale })) : null, orientationGateEl, marquee !== null ? _jsx(MarqueeBox, { rect: marquee }) : null, contextMenu !== null ? (_jsx(ContextMenuView, { menu: contextMenu.menu, x: contextMenu.x, y: contextMenu.y, onPick: handleVerbPick, onClose: () => setContextMenu(null) })) : null, devtoolsEnabled ? (_jsx(DevtoolsOverlay, { open: devtoolsOpen, ctx: ctx, playable: playable, multiplayer: multiplayer })) : null, poster ? null : _jsx(DiagnosticOverlay, { diagnostics: diagnostics, gameName: playable.game.name }), poster || orthographic || settingsHostsFov ? null : _jsx(PlayerFovSlider, {}), poster ? null : _jsx(SettingsChrome, {})] }) }) })] }) }));
 }