diff --git a/CONTEXT.md b/CONTEXT.md
index 7d94f912..e7d59568 100644
--- a/CONTEXT.md
+++ b/CONTEXT.md
@@ -43,6 +43,30 @@ Ridge Stage Composition Source. It is not the legacy Ridge Blockout Viewer or a
 final art map editor.
 _Avoid_: Ridge Blockout Viewer, final art editor, generic map editor
 
+**Stage Authoring Draft**:
+Ephemeral in-debugger adjustments to Ridge Stage Composition Source spatial
+data. A draft updates the live preview immediately, shows copyable typed-source
+snippets for review, and is applied to git only when Danilo or an agent pastes
+the change into the Ridge Stage Composition Source. It is not a second persisted
+editor format or runtime data store.
+_Avoid_: map editor save file, localStorage canonical source, auto-patched source file
+
+**Stage Authoring Mode**:
+An explicit Ridge Stage Debugger state for spatial tweaking. While active, player
+movement is frozen, all source-backed Walk Rail points, Stage Spots, and Stage
+Object contact markers are shown regardless of route-beat visibility, preview
+clicks select draft targets, and the sidebar exposes nudge controls plus
+copyable typed-source replacement snippets. Outside this mode, the debugger
+keeps its normal live-preview QA behavior.
+_Avoid_: always-on pick mode, modifier-only pick mode, beat-filtered edit targets, separate map editor app
+
+**Stage Authoring Camera**:
+The preview camera behavior used during Stage Authoring Mode. It stops following
+the frozen player, scrolls to center the selected spatial target when selection
+changes, and allows free panning across the authored stage canvas so distant
+rail points, spots, and objects remain easy to inspect.
+_Avoid_: player-follow camera, locked-on-target camera with no pan, separate editor viewport
+
 **Grid Cell**:
 A configurable unit in the typed Ridge Blockout Source that converts text-grid positions into world-space pixels.
 _Avoid_: hard-coded tile size, permanent pixel size
diff --git a/fallow-baselines/dupes.json b/fallow-baselines/dupes.json
index 2c263025..c059bf6c 100644
--- a/fallow-baselines/dupes.json
+++ b/fallow-baselines/dupes.json
@@ -21,10 +21,6 @@
     "src/game/scenes/basement/runtime/BasementScene.ts:175-188|src/game/scenes/hobbies/runtime/HobbiesScene.ts:169-182",
     "src/game/scenes/potassiumSlip/runtime/PotassiumSlipScene.ts:507-513|src/game/scenes/potassiumSlip/runtime/PotassiumSlipScene.ts:536-542",
     "src/game/scenes/potassiumSlip/runtime/waves.test.ts:175-182|src/game/scenes/potassiumSlip/runtime/waves.test.ts:55-62",
-    "src/game/scenes/ridge/bridge/BridgeTracerStageRuntime.ts:400-409|src/game/scenes/ridge/bridge/BridgeTracerStageRuntime.ts:440-449",
-    "src/game/scenes/ridge/bridge/BridgeWalkRailPlayerRuntime.ts:81-97|src/game/sharedSceneRuntime/player/SideViewPlayerRuntime.ts:78-94",
-    "src/game/scenes/ridge/bridge/BridgeWalkRailPlayerRuntime.ts:112-122|src/game/sharedSceneRuntime/player/SideViewPlayerRuntime.ts:112-122",
-    "src/game/scenes/ridge/bridge/BridgeWalkRailPlayerRuntime.ts:152-162|src/game/sharedSceneRuntime/player/SideViewPlayerRuntime.ts:143-155",
     "src/game/scenes/stampedeSketch/runtime/rewards.test.ts:16-22|src/game/scenes/stampedeSketch/runtime/rewards.test.ts:24-30",
     "src/game/scenes/stampedeSketch/runtime/runFlow.test.ts:121-129|src/game/scenes/stampedeSketch/runtime/runFlow.test.ts:94-102",
     "src/game/scenes/stampedeSketch/runtime/runFlow.test.ts:261-271|src/game/scenes/stampedeSketch/runtime/runFlow.test.ts:97-103",
diff --git a/fallow-baselines/health.json b/fallow-baselines/health.json
index 72782435..c643ac46 100644
--- a/fallow-baselines/health.json
+++ b/fallow-baselines/health.json
@@ -14,7 +14,7 @@
       }
     },
     "src/dev/ridgeStageDebugger/RidgeRuntimePreview.tsx": {
-      "complexity_moderate": {
+      "complexity_high": {
         "count": 1
       }
     },
@@ -23,6 +23,11 @@
         "count": 1
       }
     },
+    "src/dev/ridgeStageDebugger/hooks/useStageAuthoring.ts": {
+      "crap_high": {
+        "count": 1
+      }
+    },
     "src/game/bridge/store.ts": {
       "crap_moderate": {
         "count": 2
@@ -90,12 +95,23 @@
         "count": 1
       }
     },
-    "src/game/scenes/ridge/bridge/BridgeWalkRailPlayerRuntime.ts": {
-      "crap_moderate": {
+    "src/game/scenes/ridge/bridge/bridgeStageDebugOverlay.ts": {
+      "complexity_moderate": {
+        "count": 1
+      }
+    },
+    "src/game/scenes/ridge/bridge/stageAuthoring.ts": {
+      "complexity_high": {
+        "count": 1
+      },
+      "crap_high": {
         "count": 1
       }
     },
     "src/game/scenes/ridge/runtime/RidgeScene.ts": {
+      "crap_high": {
+        "count": 2
+      },
       "crap_moderate": {
         "count": 3
       }
@@ -118,11 +134,6 @@
         "count": 1
       }
     },
-    "src/game/sharedSceneRuntime/player/SideViewPlayerRuntime.ts": {
-      "crap_high": {
-        "count": 1
-      }
-    },
     "src/game/shell/usePhaserGameBoot.ts": {
       "crap_moderate": {
         "count": 1
diff --git a/src/dev/ridgeStageDebugger/RidgeRuntimePreview.tsx b/src/dev/ridgeStageDebugger/RidgeRuntimePreview.tsx
index 2481dccd..e83b39f1 100644
--- a/src/dev/ridgeStageDebugger/RidgeRuntimePreview.tsx
+++ b/src/dev/ridgeStageDebugger/RidgeRuntimePreview.tsx
@@ -1,4 +1,5 @@
-import { useEffect, useRef } from 'react';
+import { useEffect, useMemo, useRef } from 'react';
+import { resolveRidgePreviewStatus } from './resolveRidgePreviewStatus';
 import Game from '@/game/shell/Game';
 import { bridgeActions, useBridgeState } from '@/game/bridge/store';
 import { OverlayHost } from '@/game/overlays/OverlayHost';
@@ -12,12 +13,14 @@ function ignorePreviewSceneClose(): void {}
 export type RidgePreviewInputOwner = 'game' | 'panel';
 
 export function RidgeRuntimePreview({
+  authoringActive = false,
   inputOwner,
   isActive,
   onClaimGameInput,
   previewZoom,
   ridgeDevControls
 }: {
+  authoringActive?: boolean;
   inputOwner: RidgePreviewInputOwner;
   isActive: boolean;
   onClaimGameInput: () => void;
@@ -26,22 +29,25 @@ export function RidgeRuntimePreview({
 }) {
   const bridge = useBridgeState();
   const previewRef = useRef<HTMLElement | null>(null);
-  const isInputPaused =
-    !isActive || bridge.isPaused || bridge.loadingSceneId !== null || inputOwner === 'panel';
-  const inputStatusLabel = !isActive
-    ? 'Debugger inactive'
-    : inputOwner === 'panel'
-      ? 'Panel focus'
-      : bridge.isPaused || bridge.loadingSceneId !== null
-        ? 'Runtime paused'
-        : 'Game input';
-  const pauseReason = !isActive
-    ? 'Debugger inactive'
-    : inputOwner === 'panel'
-      ? 'Panel focus'
-      : 'Runtime paused';
-  const showPausedOverlay =
-    isActive && isInputPaused && bridge.loadingSceneId === null && bridge.activeOverlayId === null;
+  const previewStatus = useMemo(
+    () => resolveRidgePreviewStatus({
+      activeOverlayId: bridge.activeOverlayId,
+      authoringActive,
+      inputOwner,
+      isActive,
+      isPaused: bridge.isPaused,
+      loadingSceneId: bridge.loadingSceneId
+    }),
+    [
+      authoringActive,
+      bridge.activeOverlayId,
+      bridge.isPaused,
+      bridge.loadingSceneId,
+      inputOwner,
+      isActive
+    ]
+  );
+  const { inputStatusLabel, isInputPaused, pauseReason, showPausedOverlay } = previewStatus;
   const presentationMode = getPhaserScenePresentationMode(bridge.activeSceneId);
   const isRidgeSceneActive = bridge.activeSceneId === RIDGE_SCENE_ID;
 
@@ -84,6 +90,7 @@ export function RidgeRuntimePreview({
       aria-hidden={!isActive}
       className={[
         'relative h-full min-h-0 min-w-0 overflow-hidden border-4 border-[#1a1a1a] bg-[#fbfbf9] shadow-[7px_7px_0_rgba(26,26,26,1)]',
+        authoringActive ? 'cursor-grab active:cursor-grabbing' : '',
         isActive ? '' : 'invisible pointer-events-none'
       ].join(' ')}
       data-testid="ridge-runtime-preview"
diff --git a/src/dev/ridgeStageDebugger/RidgeStageDebugger.test.tsx b/src/dev/ridgeStageDebugger/RidgeStageDebugger.test.tsx
index 0fa863c5..877d84bc 100644
--- a/src/dev/ridgeStageDebugger/RidgeStageDebugger.test.tsx
+++ b/src/dev/ridgeStageDebugger/RidgeStageDebugger.test.tsx
@@ -1,6 +1,6 @@
 // @vitest-environment jsdom
 
-import { act, cleanup, render, screen, waitFor } from '@testing-library/react';
+import { act, cleanup, fireEvent, render, screen, waitFor } from '@testing-library/react';
 import userEvent from '@testing-library/user-event';
 import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest';
 import { bridgeActions, bridgeStore } from '@/game/bridge/store';
@@ -148,6 +148,51 @@ describe('RidgeStageDebugger', () => {
     });
   });
 
+  it('exposes Stage Authoring controls and draft source wiring', async () => {
+    render(<RidgeStageDebugger />);
+
+    expect(screen.getByLabelText('Stage Authoring Mode')).toHaveProperty('checked', false);
+    expect(lastRidgeDevControls?.resolveAuthoringState?.()).toEqual({
+      active: false,
+      selection: null
+    });
+    expect(lastRidgeDevControls?.resolveCompositionSource?.()).toBeUndefined();
+
+    await userEvent.click(screen.getByLabelText('Stage Authoring Mode'));
+
+    expect(screen.getByLabelText('Stage Authoring Mode')).toHaveProperty('checked', true);
+    expect(lastRidgeDevControls?.resolveAuthoringState?.()).toEqual({
+      active: true,
+      selection: null
+    });
+    expect(lastRidgeDevControls?.resolveCompositionSource?.()?.id).toBe('bridge');
+    expect(lastRidgeDevControls?.resolveDebugSettings?.()).toMatchObject({
+      showTraversalAssists: true
+    });
+  });
+
+  it('updates the authoring draft and snippet from sidebar field edits', async () => {
+    render(<RidgeStageDebugger />);
+
+    await userEvent.click(screen.getByLabelText('Stage Authoring Mode'));
+    await userEvent.selectOptions(
+      screen.getByLabelText('Authoring target'),
+      'Spot draftsperson'
+    );
+
+    expect(screen.getByText('Stage Spot draftsperson')).not.toBeNull();
+
+    const offsetYInput = screen.getByLabelText('offset.y');
+    fireEvent.change(offsetYInput, { target: { value: '-6' } });
+
+    expect(lastRidgeDevControls?.resolveCompositionSource?.()?.spots.find((spot) => spot.id === 'draftsperson')?.offset)
+      .toEqual({ x: 0, y: -6 });
+    expect(screen.getByLabelText('Copyable Ridge Stage Source replacement snippet').textContent)
+      .toContain("id: 'draftsperson'");
+    expect(screen.getByLabelText('Copyable Ridge Stage Source replacement snippet').textContent)
+      .toContain('offset: { x: 0, y: -6 }');
+  });
+
   it('renders the latest rail snapshot and copyable source snippet', () => {
     render(<RidgeStageDebugger />);
 
diff --git a/src/dev/ridgeStageDebugger/RidgeStageDebugger.tsx b/src/dev/ridgeStageDebugger/RidgeStageDebugger.tsx
index ff0af63b..76ac5591 100644
--- a/src/dev/ridgeStageDebugger/RidgeStageDebugger.tsx
+++ b/src/dev/ridgeStageDebugger/RidgeStageDebugger.tsx
@@ -1,5 +1,4 @@
-import { useCallback, useMemo, useState } from 'react';
-import type { ReactNode } from 'react';
+import { useCallback, useMemo, useState, type ReactNode } from 'react';
 import {
   Bug,
   Crosshair,
@@ -32,7 +31,9 @@ import {
 import { IconButton } from './components/IconButton';
 import { Detail } from './components/Detail';
 import { PREVIEW_ZOOM_OPTIONS } from './constants';
+import { AuthoringPanel } from './components/AuthoringPanel';
 import { useRidgePreviewControls } from './hooks/useRidgePreviewControls';
+import { useStageAuthoring } from './hooks/useStageAuthoring';
 
 const BRIDGE_BEAT_OPTIONS = [
   { id: 'intro', label: 'Intro' },
@@ -61,6 +62,7 @@ export default function RidgeStageDebugger() {
   const bridge = useBridgeState();
   const [previewInputOwner, setPreviewInputOwner] = useState<RidgePreviewInputOwner>('game');
   const previewControls = useRidgePreviewControls();
+  const authoring = useStageAuthoring();
   const claimPanelInput = useCallback(() => setPreviewInputOwner('panel'), []);
   const claimGameInput = useCallback(() => setPreviewInputOwner('game'), []);
   const routeState = bridge.progress.ridge.firstPlayableRoute;
@@ -74,6 +76,29 @@ export default function RidgeStageDebugger() {
     return next;
   }, [resolvedSpots]);
 
+  const ridgeDevControls = useMemo(() => ({
+    ...previewControls.ridgeDevControls,
+    resolveCompositionSource: authoring.resolveCompositionSource,
+    resolveAuthoringState: () => ({
+      active: authoring.active,
+      selection: authoring.selection
+    }),
+    publishAuthoringPick: authoring.handlePick,
+    publishAuthoringDrag: authoring.handleDrag,
+    resolveDebugSettings: () => ({
+      ...previewControls.debugSettings,
+      showTraversalAssists: previewControls.debugSettings.showTraversalAssists || authoring.active
+    })
+  }), [
+    authoring.active,
+    authoring.handleDrag,
+    authoring.handlePick,
+    authoring.resolveCompositionSource,
+    authoring.selection,
+    previewControls.debugSettings,
+    previewControls.ridgeDevControls
+  ]);
+
   return (
     <div className="h-[100dvh] max-h-[100dvh] overflow-hidden bg-[#f4f1ea] text-[#1a1a1a]">
       <div className="grid h-full min-h-0 min-w-0 grid-rows-[auto_minmax(0,1fr)] gap-2 p-2 lg:p-3">
@@ -101,11 +126,12 @@ export default function RidgeStageDebugger() {
         <main className="grid min-h-0 min-w-0 grid-rows-[minmax(0,1fr)_minmax(260px,38dvh)] gap-2 lg:grid-cols-[minmax(0,1fr)_340px] lg:grid-rows-none">
           <div className="relative h-full min-h-0 min-w-0">
             <RidgeRuntimePreview
+              authoringActive={authoring.active}
               inputOwner={previewInputOwner}
               isActive
               onClaimGameInput={claimGameInput}
               previewZoom={previewControls.previewZoom}
-              ridgeDevControls={previewControls.ridgeDevControls}
+              ridgeDevControls={ridgeDevControls}
             />
           </div>
 
@@ -114,6 +140,23 @@ export default function RidgeStageDebugger() {
             onFocusCapture={claimPanelInput}
             onPointerDownCapture={claimPanelInput}
           >
+            <AuthoringPanel
+              active={authoring.active}
+              fields={authoring.fields}
+              isDirty={authoring.isDirty}
+              onDiscardDraft={authoring.discardDraft}
+              onResetSelection={authoring.resetSelectionDraft}
+              onSelectTarget={authoring.handlePick}
+              onToggleActive={(nextActive) => {
+                authoring.setAuthoringActive(nextActive);
+                if (nextActive) claimGameInput();
+              }}
+              onUpdateField={authoring.updateField}
+              selection={authoring.selection}
+              selectionLabel={authoring.selectionLabel}
+              snippet={authoring.snippet}
+              targetOptions={authoring.targetOptions}
+            />
             <StageSourcePanel spotCount={resolvedSpots.length} />
             <PreviewPanel
               lastCommandLabel={previewControls.lastCommandLabel}
diff --git a/src/dev/ridgeStageDebugger/components/AuthoringPanel.tsx b/src/dev/ridgeStageDebugger/components/AuthoringPanel.tsx
new file mode 100644
index 00000000..7ac1dd31
--- /dev/null
+++ b/src/dev/ridgeStageDebugger/components/AuthoringPanel.tsx
@@ -0,0 +1,149 @@
+import { PencilLine, RotateCcw, Trash2 } from 'lucide-react';
+import type {
+  StageAuthoringField,
+  StageAuthoringTargetOption
+} from '../hooks/useStageAuthoring';
+import {
+  areStageAuthoringSelectionsEqual,
+  type StageAuthoringSelection
+} from '@/game/scenes/ridge/bridge/stageAuthoring';
+import { ScalarFieldControl } from './ScalarFieldControl';
+
+export function AuthoringPanel({
+  active,
+  fields,
+  isDirty,
+  onDiscardDraft,
+  onResetSelection,
+  onSelectTarget,
+  onToggleActive,
+  onUpdateField,
+  selection,
+  selectionLabel,
+  snippet,
+  targetOptions
+}: {
+  active: boolean;
+  fields: readonly StageAuthoringField[];
+  isDirty: boolean;
+  onDiscardDraft: () => void;
+  onResetSelection: () => void;
+  onSelectTarget: (selection: StageAuthoringSelection) => void;
+  onToggleActive: (active: boolean) => void;
+  onUpdateField: (field: string, value: number) => void;
+  selection: StageAuthoringSelection | null;
+  selectionLabel: string;
+  snippet: string;
+  targetOptions: readonly StageAuthoringTargetOption[];
+}) {
+  return (
+    <section className="border-b-2 border-[#1a1a1a] pb-4">
+      <div className="flex items-center justify-between gap-2">
+        <h2 className="flex items-center gap-2 text-sm font-black uppercase tracking-wider">
+          <PencilLine className="h-4 w-4" aria-hidden />
+          <span>Authoring</span>
+        </h2>
+        <label className="flex min-h-9 items-center gap-2 border-2 border-[#1a1a1a] bg-[#fbfbf9] px-2 py-1 text-xs font-black uppercase tracking-wider">
+          <input
+            aria-label="Stage Authoring Mode"
+            checked={active}
+            className="h-4 w-4 accent-[#1a1a1a]"
+            onChange={(event) => onToggleActive(event.target.checked)}
+            type="checkbox"
+          />
+          <span>Mode</span>
+        </label>
+      </div>
+
+      <p className="mt-3 text-xs font-black uppercase tracking-wider text-[#5a554f]">
+        {active
+          ? 'Drag empty space to pan. Drag markers to move. Shift+drag a spot for offset-only nudges.'
+          : 'Turn on Authoring Mode to select and nudge source-backed markers.'}
+      </p>
+
+      {active ? (
+        <div className="mt-3 grid gap-3">
+          <label className="grid gap-1.5">
+            <span className="font-mono text-[10px] font-black uppercase tracking-widest text-[#5a554f]">
+              Target
+            </span>
+            <select
+              aria-label="Authoring target"
+              className="h-9 w-full border-2 border-[#1a1a1a] bg-[#fbfbf9] px-2 font-mono text-xs font-black"
+              onChange={(event) => {
+                const option = targetOptions.find((candidate) => candidate.key === event.target.value);
+                if (option) onSelectTarget(option.selection);
+              }}
+              value={targetOptions.find((option) =>
+                areStageAuthoringSelectionsEqual(option.selection, selection)
+              )?.key ?? ''}
+            >
+              <option disabled value="">
+                Choose target...
+              </option>
+              {targetOptions.map((option) => (
+                <option key={option.key} value={option.key}>
+                  {option.label}
+                </option>
+              ))}
+            </select>
+          </label>
+
+          <p className="border-2 border-[#1a1a1a] bg-[#f3df8b] px-2 py-1 text-xs font-black uppercase tracking-widest">
+            {selectionLabel}
+          </p>
+
+          {fields.length > 0 ? (
+            <div className="grid gap-3">
+              {fields.map((field) => (
+                <ScalarFieldControl
+                  key={field.field}
+                  inputMax={field.inputMax}
+                  inputMin={field.inputMin}
+                  label={field.label}
+                  max={field.max}
+                  min={field.min}
+                  onChange={(value) => onUpdateField(field.field, value)}
+                  step={field.step}
+                  value={field.value}
+                />
+              ))}
+            </div>
+          ) : null}
+
+          {snippet ? (
+            <textarea
+              aria-label="Copyable Ridge Stage Source replacement snippet"
+              className="min-h-28 w-full border-2 border-[#1a1a1a] bg-[#fbfbf9] px-2 py-1 font-mono text-[10px] font-black"
+              onFocus={(event) => event.currentTarget.select()}
+              readOnly
+              value={snippet}
+            />
+          ) : null}
+
+          <div className="grid gap-1.5">
+            <button
+              className="flex min-h-9 items-center justify-center gap-2 border-2 border-[#1a1a1a] bg-[#fbfbf9] px-2 py-1 text-xs font-black uppercase tracking-wider transition-colors hover:bg-[#1a1a1a] hover:text-[#fbfbf9] disabled:cursor-not-allowed disabled:opacity-50"
+              disabled={!snippet}
+              onClick={onResetSelection}
+              type="button"
+            >
+              <RotateCcw className="h-4 w-4" aria-hidden />
+              Reset Selection
+            </button>
+            <button
+              className="flex min-h-9 items-center justify-center gap-2 border-2 border-[#1a1a1a] bg-[#fbfbf9] px-2 py-1 text-xs font-black uppercase tracking-wider transition-colors hover:bg-[#1a1a1a] hover:text-[#fbfbf9] disabled:cursor-not-allowed disabled:opacity-50"
+              disabled={!isDirty}
+              onClick={onDiscardDraft}
+              type="button"
+            >
+              <Trash2 className="h-4 w-4" aria-hidden />
+              Discard Draft
+            </button>
+          </div>
+        </div>
+      ) : null}
+    </section>
+  );
+}
+
diff --git a/src/dev/ridgeStageDebugger/components/ScalarFieldControl.tsx b/src/dev/ridgeStageDebugger/components/ScalarFieldControl.tsx
new file mode 100644
index 00000000..52824d90
--- /dev/null
+++ b/src/dev/ridgeStageDebugger/components/ScalarFieldControl.tsx
@@ -0,0 +1,97 @@
+import { useId } from 'react';
+
+export function ScalarFieldControl({
+  inputMax,
+  inputMin,
+  label,
+  max,
+  min,
+  onChange,
+  step = 1,
+  value
+}: {
+  inputMax?: number;
+  inputMin?: number;
+  label: string;
+  max: number;
+  min: number;
+  onChange: (value: number) => void;
+  step?: number;
+  value: number;
+}) {
+  const numberMin = inputMin ?? min;
+  const numberMax = inputMax ?? max;
+  const inputId = useId();
+
+  return (
+    <div className="grid gap-1.5">
+      <div className="flex items-center justify-between gap-2">
+        <label className="font-mono text-[10px] font-black uppercase tracking-widest text-[#5a554f]" htmlFor={inputId}>
+          {label}
+        </label>
+        <div className="flex items-center gap-1">
+          <StepButton
+            ariaLabel={`Decrease ${label}`}
+            onClick={() => onChange(clamp(value - step, numberMin, numberMax))}
+          >
+            -
+          </StepButton>
+          <input
+            className="h-8 w-20 border-2 border-[#1a1a1a] bg-[#fbfbf9] px-2 text-right font-mono text-xs font-black"
+            id={inputId}
+            max={numberMax}
+            min={numberMin}
+            onChange={(event) => {
+              const next = Number(event.target.value);
+              if (Number.isFinite(next)) onChange(clamp(next, numberMin, numberMax));
+            }}
+            step={step}
+            type="number"
+            value={Number.isFinite(value) ? value : 0}
+          />
+          <StepButton
+            ariaLabel={`Increase ${label}`}
+            onClick={() => onChange(clamp(value + step, numberMin, numberMax))}
+          >
+            +
+          </StepButton>
+        </div>
+      </div>
+      <input
+        aria-label={`${label} slider`}
+        className="h-2 w-full accent-[#1a1a1a]"
+        max={max}
+        min={min}
+        onChange={(event) => onChange(Number(event.target.value))}
+        step={step}
+        type="range"
+        value={clamp(value, min, max)}
+      />
+    </div>
+  );
+}
+
+function StepButton({
+  ariaLabel,
+  children,
+  onClick
+}: {
+  ariaLabel: string;
+  children: string;
+  onClick: () => void;
+}) {
+  return (
+    <button
+      aria-label={ariaLabel}
+      className="flex h-8 w-8 items-center justify-center border-2 border-[#1a1a1a] bg-[#fbfbf9] text-xs font-black transition-colors hover:bg-[#1a1a1a] hover:text-[#fbfbf9]"
+      onClick={onClick}
+      type="button"
+    >
+      {children}
+    </button>
+  );
+}
+
+function clamp(value: number, min: number, max: number): number {
+  return Math.min(max, Math.max(min, value));
+}
diff --git a/src/dev/ridgeStageDebugger/hooks/useStageAuthoring.ts b/src/dev/ridgeStageDebugger/hooks/useStageAuthoring.ts
new file mode 100644
index 00000000..14b9fe7c
--- /dev/null
+++ b/src/dev/ridgeStageDebugger/hooks/useStageAuthoring.ts
@@ -0,0 +1,249 @@
+import { useCallback, useMemo, useState } from 'react';
+import {
+  BRIDGE_STAGE_SOURCE,
+  resolveBridgeStageObject,
+  type BridgeStageCompositionSource
+} from '@/game/scenes/ridge/bridge/stageComposition';
+import type { RidgeDevAuthoringDragRequest } from '@/game/scenes/ridge/runtime/ridgeDevControls';
+import {
+  applyStageAuthoringDrag,
+  clampStageAuthoringOffset,
+  cloneBridgeStageCompositionSource,
+  formatStageAuthoringSnippet,
+  resetStageAuthoringSelection,
+  serializeStageAuthoringSelection,
+  STAGE_AUTHORING_OFFSET_LIMIT_PX,
+  STAGE_AUTHORING_OFFSET_SLIDER_WINDOW_PX,
+  updateStageAuthoringDraft,
+  type StageAuthoringSelection
+} from '@/game/scenes/ridge/bridge/stageAuthoring';
+
+export interface StageAuthoringTargetOption {
+  key: string;
+  label: string;
+  selection: StageAuthoringSelection;
+}
+
+export interface StageAuthoringField {
+  field: string;
+  inputMax: number;
+  inputMin: number;
+  label: string;
+  max: number;
+  min: number;
+  step: number;
+  value: number;
+}
+
+export function useStageAuthoring() {
+  const [active, setActive] = useState(false);
+  const [draftSource, setDraftSource] = useState(() => cloneBridgeStageCompositionSource());
+  const [selection, setSelection] = useState<StageAuthoringSelection | null>(null);
+  const [isDirty, setIsDirty] = useState(false);
+
+  const handlePick = useCallback((nextSelection: StageAuthoringSelection) => {
+    setSelection(nextSelection);
+  }, []);
+
+  const handleDrag = useCallback((request: RidgeDevAuthoringDragRequest) => {
+    setDraftSource((current) => applyStageAuthoringDrag(
+      current,
+      request.selection,
+      request.worldX,
+      request.worldY,
+      { offsetOnly: request.offsetOnly }
+    ));
+    setSelection(request.selection);
+    setIsDirty(true);
+  }, []);
+
+  const setAuthoringActive = useCallback((nextActive: boolean) => {
+    setActive(nextActive);
+  }, []);
+
+  const updateField = useCallback((field: string, value: number) => {
+    if (!selection) return;
+    setDraftSource((current) => updateStageAuthoringDraft(current, selection, field, value));
+    setIsDirty(true);
+  }, [selection]);
+
+  const discardDraft = useCallback(() => {
+    setDraftSource(cloneBridgeStageCompositionSource());
+    setSelection(null);
+    setIsDirty(false);
+  }, []);
+
+  const resetSelectionDraft = useCallback(() => {
+    if (!selection) return;
+    setDraftSource((current) => resetStageAuthoringSelection(
+      BRIDGE_STAGE_SOURCE,
+      current,
+      selection
+    ));
+    setIsDirty(true);
+  }, [selection]);
+
+  const fields = useMemo(
+    () => (selection ? getAuthoringFields(draftSource, selection) : []),
+    [draftSource, selection]
+  );
+
+  const snippet = useMemo(
+    () => (selection ? formatStageAuthoringSnippet(draftSource, selection) : ''),
+    [draftSource, selection]
+  );
+
+  const selectionLabel = useMemo(
+    () => (selection ? formatSelectionLabel(selection) : 'Select a target below or in the preview'),
+    [selection]
+  );
+
+  const targetOptions = useMemo(
+    () => getAuthoringTargetOptions(draftSource),
+    [draftSource]
+  );
+
+  const resolveCompositionSource = useCallback((): BridgeStageCompositionSource | undefined => {
+    if (!active && !isDirty) return undefined;
+    return draftSource;
+  }, [active, draftSource, isDirty]);
+
+  return {
+    active,
+    discardDraft,
+    draftSource,
+    fields,
+    handleDrag,
+    handlePick,
+    isDirty,
+    resetSelectionDraft,
+    resolveCompositionSource,
+    selection,
+    selectionLabel,
+    setAuthoringActive,
+    setSelection,
+    snippet,
+    targetOptions,
+    updateField
+  };
+}
+
+function getAuthoringTargetOptions(
+  source: BridgeStageCompositionSource
+): StageAuthoringTargetOption[] {
+  const railPoints = source.primaryWalkRail.points.map((point, index) => {
+    const selection = { kind: 'rail-point', index } as const;
+    return {
+      key: serializeStageAuthoringSelection(selection) ?? `rail-point:${index}`,
+      label: `Rail point ${index} @ ${Math.round(point.x)}, ${Math.round(point.y)}`,
+      selection
+    };
+  });
+  const spots = source.spots.map((spot) => {
+    const selection = { kind: 'spot', id: spot.id } as const;
+    return {
+      key: serializeStageAuthoringSelection(selection) ?? `spot:${spot.id}`,
+      label: `Spot ${spot.id}`,
+      selection
+    };
+  });
+  const objects = source.objects.map((object) => {
+    const selection = { kind: 'object', id: object.id } as const;
+    return {
+      key: serializeStageAuthoringSelection(selection) ?? `object:${object.id}`,
+      label: `Object ${object.id}`,
+      selection
+    };
+  });
+
+  return [...railPoints, ...spots, ...objects];
+}
+
+function getAuthoringFields(
+  source: BridgeStageCompositionSource,
+  selection: StageAuthoringSelection
+): StageAuthoringField[] {
+  switch (selection.kind) {
+    case 'rail-point': {
+      const point = source.primaryWalkRail.points[selection.index];
+      if (!point) return [];
+      return [
+        createWorldAxisField('x', Math.round(point.x), source.canvas.x, source.canvas.width),
+        createWorldAxisField('y', Math.round(point.y), source.canvas.y, source.canvas.height)
+      ];
+    }
+    case 'spot': {
+      const spot = source.spots.find((candidate) => candidate.id === selection.id);
+      if (!spot) return [];
+      return [
+        {
+          field: 'railProgress',
+          label: 'railProgress',
+          inputMin: 0,
+          inputMax: 1,
+          min: 0,
+          max: 1,
+          step: 0.001,
+          value: spot.railProgress
+        },
+        createOffsetField('offset.x', spot.offset?.x ?? 0),
+        createOffsetField('offset.y', spot.offset?.y ?? 0)
+      ];
+    }
+    case 'object': {
+      const object = resolveBridgeStageObject(source, selection.id);
+      return [
+        createOffsetField('offset.x', object.offset?.x ?? 0),
+        createOffsetField('offset.y', object.offset?.y ?? 0)
+      ];
+    }
+    default:
+      return [];
+  }
+}
+
+function createWorldAxisField(
+  label: 'x' | 'y',
+  value: number,
+  origin: number,
+  span: number
+): StageAuthoringField {
+  return {
+    field: label,
+    label,
+    inputMin: origin,
+    inputMax: origin + span,
+    min: origin,
+    max: origin + span,
+    step: 1,
+    value
+  };
+}
+
+function createOffsetField(field: 'offset.x' | 'offset.y', rawValue: number): StageAuthoringField {
+  const value = clampStageAuthoringOffset(rawValue);
+  const halfWindow = STAGE_AUTHORING_OFFSET_SLIDER_WINDOW_PX;
+  return {
+    field,
+    label: field,
+    inputMin: -STAGE_AUTHORING_OFFSET_LIMIT_PX,
+    inputMax: STAGE_AUTHORING_OFFSET_LIMIT_PX,
+    min: -halfWindow,
+    max: halfWindow,
+    step: 1,
+    value
+  };
+}
+
+function formatSelectionLabel(selection: StageAuthoringSelection): string {
+  switch (selection.kind) {
+    case 'rail-point':
+      return `Walk Rail point ${selection.index}`;
+    case 'spot':
+      return `Stage Spot ${selection.id}`;
+    case 'object':
+      return `Stage Object ${selection.id}`;
+    default:
+      return 'Selection';
+  }
+}
diff --git a/src/dev/ridgeStageDebugger/resolveRidgePreviewStatus.test.ts b/src/dev/ridgeStageDebugger/resolveRidgePreviewStatus.test.ts
new file mode 100644
index 00000000..e38041ef
--- /dev/null
+++ b/src/dev/ridgeStageDebugger/resolveRidgePreviewStatus.test.ts
@@ -0,0 +1,50 @@
+import { describe, expect, it } from 'vitest';
+import { resolveRidgePreviewStatus } from './resolveRidgePreviewStatus';
+
+describe('resolveRidgePreviewStatus', () => {
+  it('reports debugger inactive when preview is not active', () => {
+    expect(resolveRidgePreviewStatus({
+      activeOverlayId: null,
+      authoringActive: false,
+      inputOwner: 'game',
+      isActive: false,
+      isPaused: false,
+      loadingSceneId: null
+    })).toMatchObject({
+      inputStatusLabel: 'Debugger inactive',
+      pauseReason: 'Debugger inactive',
+      showPausedOverlay: false
+    });
+  });
+
+  it('labels authoring mode and skips the paused overlay', () => {
+    expect(resolveRidgePreviewStatus({
+      activeOverlayId: null,
+      authoringActive: true,
+      inputOwner: 'game',
+      isActive: true,
+      isPaused: true,
+      loadingSceneId: null
+    })).toMatchObject({
+      inputStatusLabel: 'Authoring mode',
+      pauseReason: 'Authoring mode',
+      showPausedOverlay: false
+    });
+  });
+
+  it('shows the paused overlay for panel focus outside authoring', () => {
+    expect(resolveRidgePreviewStatus({
+      activeOverlayId: null,
+      authoringActive: false,
+      inputOwner: 'panel',
+      isActive: true,
+      isPaused: false,
+      loadingSceneId: null
+    })).toMatchObject({
+      inputStatusLabel: 'Panel focus',
+      pauseReason: 'Panel focus',
+      isInputPaused: true,
+      showPausedOverlay: true
+    });
+  });
+});
diff --git a/src/dev/ridgeStageDebugger/resolveRidgePreviewStatus.ts b/src/dev/ridgeStageDebugger/resolveRidgePreviewStatus.ts
new file mode 100644
index 00000000..99bbe674
--- /dev/null
+++ b/src/dev/ridgeStageDebugger/resolveRidgePreviewStatus.ts
@@ -0,0 +1,70 @@
+import type { RidgePreviewInputOwner } from './RidgeRuntimePreview';
+
+export function resolveRidgePreviewStatus(input: {
+  activeOverlayId: string | null;
+  authoringActive: boolean;
+  inputOwner: RidgePreviewInputOwner;
+  isActive: boolean;
+  isPaused: boolean;
+  loadingSceneId: string | null;
+}): {
+  inputStatusLabel: string;
+  isInputPaused: boolean;
+  pauseReason: string;
+  showPausedOverlay: boolean;
+} {
+  const isInputPaused =
+    !input.isActive ||
+    input.isPaused ||
+    input.loadingSceneId !== null ||
+    (input.inputOwner === 'panel' && !input.authoringActive);
+  const showPausedOverlay =
+    input.isActive &&
+    !input.authoringActive &&
+    isInputPaused &&
+    input.loadingSceneId === null &&
+    input.activeOverlayId === null;
+
+  if (!input.isActive) {
+    return {
+      isInputPaused,
+      inputStatusLabel: 'Debugger inactive',
+      pauseReason: 'Debugger inactive',
+      showPausedOverlay
+    };
+  }
+
+  if (input.authoringActive) {
+    return {
+      isInputPaused,
+      inputStatusLabel: 'Authoring mode',
+      pauseReason: 'Authoring mode',
+      showPausedOverlay
+    };
+  }
+
+  if (input.inputOwner === 'panel') {
+    return {
+      isInputPaused,
+      inputStatusLabel: 'Panel focus',
+      pauseReason: 'Panel focus',
+      showPausedOverlay
+    };
+  }
+
+  if (input.isPaused || input.loadingSceneId !== null) {
+    return {
+      isInputPaused,
+      inputStatusLabel: 'Runtime paused',
+      pauseReason: 'Runtime paused',
+      showPausedOverlay
+    };
+  }
+
+  return {
+    isInputPaused,
+    inputStatusLabel: 'Game input',
+    pauseReason: 'Runtime paused',
+    showPausedOverlay
+  };
+}
diff --git a/src/game/scenes/ridge/bridge/BridgeTracerStageRuntime.ts b/src/game/scenes/ridge/bridge/BridgeTracerStageRuntime.ts
index 0f384f8c..86dde3b7 100644
--- a/src/game/scenes/ridge/bridge/BridgeTracerStageRuntime.ts
+++ b/src/game/scenes/ridge/bridge/BridgeTracerStageRuntime.ts
@@ -23,11 +23,13 @@ import {
 } from './bridgeTracerSlice';
 import {
   BRIDGE_STAGE_SOURCE,
+  getBridgeCrossingPlacementSignature,
   resolveBridgeRailRelativeStageDepth,
   resolveBridgeStageObject,
   resolveBridgeStageObjectPlacement,
   resolveBridgeStagePresentation,
   resolveBridgeStageSpot,
+  type BridgeStageCompositionSource,
   type BridgeStagePresentationState
 } from './stageComposition';
 
@@ -51,6 +53,7 @@ type BridgeImageOptions = {
 };
 
 export interface BridgeTracerStageRuntime {
+  applyCompositionSource(source: BridgeStageCompositionSource): void;
   dispose(): void;
   hidePrompt(): void;
   showPrompt(target: BridgeTracerInteractionTarget, x: number, y: number): void;
@@ -72,12 +75,13 @@ export function createBridgeTracerStageRuntime(
 
 class BridgeTracerStageRuntimeImpl implements BridgeTracerStageRuntime {
   private readonly scene: Phaser.Scene;
+  private source: BridgeStageCompositionSource = BRIDGE_STAGE_SOURCE;
+  private currentPresentation: BridgeStagePresentationState = resolveBridgeStagePresentation('intro');
   private blockedBridgeObjects: VisibleGameObject[] = [];
   private completedBridgeObjects: VisibleGameObject[] = [];
   private cickaSprite?: Phaser.GameObjects.Sprite;
   private cickaShadow?: Phaser.GameObjects.Ellipse;
   private toyCar?: Phaser.GameObjects.Image;
-  private toyCarHalo?: Phaser.GameObjects.Graphics;
   private toyCarShadow?: Phaser.GameObjects.Ellipse;
   private bridgeBuilder?: Phaser.GameObjects.Image;
   private handoffNote?: Phaser.GameObjects.Text;
@@ -89,6 +93,7 @@ class BridgeTracerStageRuntimeImpl implements BridgeTracerStageRuntime {
   private builderTalkTween?: Phaser.Tweens.Tween;
   private toyCarTween?: Phaser.Tweens.Tween;
   private toyCarTestRunning = false;
+  private bridgeCrossingPlacementSignature = '';
 
   constructor(scene: Phaser.Scene) {
     this.scene = scene;
@@ -108,11 +113,26 @@ class BridgeTracerStageRuntimeImpl implements BridgeTracerStageRuntime {
     this.createCickaPlaySpot();
     this.createBridgeDraftsperson();
     this.createBridgeCrossingVisuals();
+    this.bridgeCrossingPlacementSignature = getBridgeCrossingPlacementSignature(this.source);
     this.createConcertHandoffNote();
     this.createInteractionPrompt();
     this.createDialoguePanel();
   }
 
+  applyCompositionSource(source: BridgeStageCompositionSource): void {
+    this.source = source;
+    this.syncCickaAndToyCar(this.currentPresentation);
+    this.syncBridgeObjectPlacements();
+
+    const crossingSignature = getBridgeCrossingPlacementSignature(source);
+    if (crossingSignature !== this.bridgeCrossingPlacementSignature) {
+      this.recreateBridgeCrossingVisuals();
+      this.bridgeCrossingPlacementSignature = crossingSignature;
+      this.setVisible(this.blockedBridgeObjects, this.currentPresentation.blockedBridgeVisible);
+      this.setVisible(this.completedBridgeObjects, this.currentPresentation.completedBridgeVisible);
+    }
+  }
+
   dispose(): void {
     this.dialogueHideEvent?.remove(false);
     this.dialogueHideEvent = undefined;
@@ -161,6 +181,7 @@ class BridgeTracerStageRuntimeImpl implements BridgeTracerStageRuntime {
 
   syncBeat(bridgeBeat: RidgeBridgeBeatState): BridgeStagePresentationState {
     const presentation = resolveBridgeStagePresentation(bridgeBeat);
+    this.currentPresentation = presentation;
 
     this.setVisible(this.blockedBridgeObjects, presentation.blockedBridgeVisible);
     this.setVisible(this.completedBridgeObjects, presentation.completedBridgeVisible);
@@ -187,12 +208,12 @@ class BridgeTracerStageRuntimeImpl implements BridgeTracerStageRuntime {
     this.toyCar.setVisible(true);
     this.toyCarShadow?.setVisible(true);
     const testStartPlacement = resolveBridgeStageObjectPlacement(
-      BRIDGE_STAGE_SOURCE,
+      this.source,
       'toy-car',
       { spotId: 'toy-car-test-start' }
     );
     const testEndPlacement = resolveBridgeStageObjectPlacement(
-      BRIDGE_STAGE_SOURCE,
+      this.source,
       'toy-car',
       { spotId: 'toy-car-test-end' }
     );
@@ -226,7 +247,7 @@ class BridgeTracerStageRuntimeImpl implements BridgeTracerStageRuntime {
     paper.fillStyle(0xf7f1df, 1);
     paper.fillRect(0, 0, bounds.width, bounds.height);
 
-    BRIDGE_STAGE_SOURCE.plates.forEach((plate) => {
+    this.source.plates.forEach((plate) => {
       this.addBridgeImage(plate.textureKey, plate.x, plate.y, {
         depth: plate.depth,
         origin: plate.origin,
@@ -265,7 +286,6 @@ class BridgeTracerStageRuntimeImpl implements BridgeTracerStageRuntime {
 
   private createCickaPlaySpot(): void {
     const cickaPlaySpot = this.resolveCickaPlacement('cicka-play');
-    this.addReadabilityPocket(cickaPlaySpot.x + 34, cickaPlaySpot.y - 34, 176, 86, 14);
     this.cickaShadow = this.scene.add.ellipse(
       cickaPlaySpot.x,
       cickaPlaySpot.y - 2,
@@ -288,14 +308,12 @@ class BridgeTracerStageRuntimeImpl implements BridgeTracerStageRuntime {
   }
 
   private createBridgeDraftsperson(): void {
-    const draftsperson = resolveBridgeStageSpot(BRIDGE_STAGE_SOURCE, 'draftsperson');
     const builderPlacement = resolveBridgeStageObjectPlacement(
-      BRIDGE_STAGE_SOURCE,
+      this.source,
       'bridge-draftsperson'
     );
     const builderObject = builderPlacement.object;
 
-    this.addReadabilityPocket(draftsperson.x, draftsperson.y - 80, 104, 176, 22);
     this.bridgeBuilder = this.addBridgeImage(builderObject.textureKey, builderPlacement.x, builderPlacement.y, {
       depth: builderPlacement.depth,
       scale: builderObject.scale
@@ -314,10 +332,10 @@ class BridgeTracerStageRuntimeImpl implements BridgeTracerStageRuntime {
   }
 
   private createBridgeCrossingVisuals(): void {
-    const bridgeObject = resolveBridgeStageObject(BRIDGE_STAGE_SOURCE, 'completed-bridge');
-    const bridgePlacement = resolveBridgeStageObjectPlacement(BRIDGE_STAGE_SOURCE, 'completed-bridge');
-    const leftBank = resolveBridgeStageSpot(BRIDGE_STAGE_SOURCE, bridgeObject.leftSpotId);
-    const rightBank = resolveBridgeStageSpot(BRIDGE_STAGE_SOURCE, bridgeObject.rightSpotId);
+    const bridgeObject = resolveBridgeStageObject(this.source, 'completed-bridge');
+    const bridgePlacement = resolveBridgeStageObjectPlacement(this.source, 'completed-bridge');
+    const leftBank = resolveBridgeStageSpot(this.source, bridgeObject.leftSpotId);
+    const rightBank = resolveBridgeStageSpot(this.source, bridgeObject.rightSpotId);
 
     this.completedBridgeObjects.push(
       this.asVisible(this.createSimpleWoodenBridge(
@@ -330,7 +348,7 @@ class BridgeTracerStageRuntimeImpl implements BridgeTracerStageRuntime {
   }
 
   private createConcertHandoffNote(): void {
-    const handoffPlacement = resolveBridgeStageObjectPlacement(BRIDGE_STAGE_SOURCE, 'handoff-note');
+    const handoffPlacement = resolveBridgeStageObjectPlacement(this.source, 'handoff-note');
     this.handoffNote = createUiText(
       this.scene,
       handoffPlacement.x,
@@ -385,6 +403,24 @@ class BridgeTracerStageRuntimeImpl implements BridgeTracerStageRuntime {
     this.dialogueText = text;
   }
 
+  private syncBridgeObjectPlacements(): void {
+    const builderPlacement = resolveBridgeStageObjectPlacement(this.source, 'bridge-draftsperson');
+    const builderObject = builderPlacement.object;
+    this.bridgeBuilder
+      ?.setPosition(builderPlacement.x, builderPlacement.y)
+      .setDepth(builderPlacement.depth)
+      .setScale(builderObject.scale ?? 1);
+
+    const handoffPlacement = resolveBridgeStageObjectPlacement(this.source, 'handoff-note');
+    this.handoffNote?.setPosition(handoffPlacement.x, handoffPlacement.y);
+  }
+
+  private recreateBridgeCrossingVisuals(): void {
+    this.completedBridgeObjects.forEach((object) => object.destroy());
+    this.completedBridgeObjects = [];
+    this.createBridgeCrossingVisuals();
+  }
+
   private syncCickaAndToyCar(presentation: BridgeStagePresentationState): void {
     const cickaSpot = this.resolveCickaPlacement(presentation.cickaSpotId);
     this.cickaSprite
@@ -398,15 +434,11 @@ class BridgeTracerStageRuntimeImpl implements BridgeTracerStageRuntime {
 
     if (presentation.toyCar.visible && presentation.toyCar.spotId === 'cicka-toy-car') {
       const toyCarPlacement = resolveBridgeStageObjectPlacement(
-        BRIDGE_STAGE_SOURCE,
+        this.source,
         'toy-car',
         { spotId: presentation.toyCar.spotId }
       );
-      this.toyCar.setVisible(true);
-      this.toyCarShadow?.setVisible(true);
-      this.toyCar.setPosition(toyCarPlacement.x, toyCarPlacement.y)
-        .setDepth(toyCarPlacement.depth);
-      this.syncToyCarSupport(this.toyCar.x, this.toyCar.y, true);
+      this.placeToyCarAt(toyCarPlacement);
 
       if (!this.toyCarTween || !this.toyCarTween.isPlaying()) {
         this.toyCarTween?.stop();
@@ -442,17 +474,21 @@ class BridgeTracerStageRuntimeImpl implements BridgeTracerStageRuntime {
       'toy-car',
       { spotId: presentation.toyCar.spotId }
     );
+    this.placeToyCarAt(toyCarPlacement);
+  }
+
+  private placeToyCarAt(placement: { depth: number; x: number; y: number }): void {
+    if (!this.toyCar) return;
     this.toyCar.setVisible(true);
     this.toyCarShadow?.setVisible(true);
-    this.toyCar.setPosition(toyCarPlacement.x, toyCarPlacement.y)
-      .setDepth(toyCarPlacement.depth);
+    this.toyCar.setPosition(placement.x, placement.y)
+      .setDepth(placement.depth);
     this.syncToyCarSupport(this.toyCar.x, this.toyCar.y, true);
   }
 
   private createToyCar(): Phaser.GameObjects.Image {
-    const toyCarPlacement = resolveBridgeStageObjectPlacement(BRIDGE_STAGE_SOURCE, 'toy-car');
+    const toyCarPlacement = resolveBridgeStageObjectPlacement(this.source, 'toy-car');
     const toyCarObject = toyCarPlacement.object;
-    this.toyCarHalo = this.addReadabilityPocket(toyCarPlacement.x, toyCarPlacement.y - 18, 98, 56, 23);
     this.toyCarShadow = this.addGroundContactShadow(
       toyCarPlacement.x,
       toyCarPlacement.y + 2,
@@ -467,7 +503,7 @@ class BridgeTracerStageRuntimeImpl implements BridgeTracerStageRuntime {
   }
 
   private resolveCickaPlacement(spotId: BridgeStagePresentationState['cickaSpotId']) {
-    const spot = resolveBridgeStageSpot(BRIDGE_STAGE_SOURCE, spotId);
+    const spot = resolveBridgeStageSpot(this.source, spotId);
     return {
       ...spot,
       depth: resolveBridgeRailRelativeStageDepth(spot.railPoint, spot)
@@ -475,7 +511,6 @@ class BridgeTracerStageRuntimeImpl implements BridgeTracerStageRuntime {
   }
 
   private syncToyCarSupport(x: number, y: number, visible: boolean): void {
-    this.toyCarHalo?.setVisible(visible).setPosition(x, y - 18);
     this.toyCarShadow?.setVisible(visible).setPosition(x, y + 4);
   }
 
@@ -487,7 +522,7 @@ class BridgeTracerStageRuntimeImpl implements BridgeTracerStageRuntime {
     if (!isTalking) {
       this.builderIdleTween?.resume();
       const builderPlacement = resolveBridgeStageObjectPlacement(
-        BRIDGE_STAGE_SOURCE,
+        this.source,
         'bridge-draftsperson'
       );
       const builderObject = builderPlacement.object;
@@ -597,26 +632,6 @@ class BridgeTracerStageRuntimeImpl implements BridgeTracerStageRuntime {
       .setDepth(depth);
   }
 
-  private addReadabilityPocket(
-    x: number,
-    y: number,
-    width: number,
-    height: number,
-    depth: number
-  ): Phaser.GameObjects.Graphics {
-    const pocket = this.scene.add.graphics().setDepth(depth);
-    pocket.setPosition(x, y);
-    pocket.fillStyle(0xf7f1df, 0.9);
-    pocket.lineStyle(2, 0xffffff, 0.72);
-    pocket.fillEllipse(0, 0, width, height);
-    pocket.strokeEllipse(0, 0, width + 8, height + 8);
-
-    pocket.lineStyle(1, 0x1f1f1d, 0.12);
-    pocket.strokeEllipse(3, -2, width * 0.96, height * 0.9);
-    pocket.lineBetween(-width * 0.32, height * 0.24, width * 0.32, height * 0.18);
-    return pocket;
-  }
-
   private asVisible<GameObject extends VisibleGameObject>(gameObject: GameObject): GameObject {
     return gameObject;
   }
diff --git a/src/game/scenes/ridge/bridge/BridgeWalkRailPlayerRuntime.ts b/src/game/scenes/ridge/bridge/BridgeWalkRailPlayerRuntime.ts
index d562f2c7..488a94c9 100644
--- a/src/game/scenes/ridge/bridge/BridgeWalkRailPlayerRuntime.ts
+++ b/src/game/scenes/ridge/bridge/BridgeWalkRailPlayerRuntime.ts
@@ -16,7 +16,9 @@ import {
   createSideViewCameraRuntime,
   type SideViewCameraRuntime
 } from '@/game/sharedSceneRuntime/camera/sideViewCameraRuntime';
+import { bindSideViewKeyboard } from '@/game/sharedSceneRuntime/input/sceneKeyboard';
 import { readSceneInputCommands } from '@/game/sharedSceneRuntime/input/readSceneInputCommands';
+import type { SceneInputKeys } from '@/game/sharedSceneRuntime/input/readSceneInputCommands';
 import { setSceneKeyboardPaused } from '@/game/sharedSceneRuntime/sceneKeyboardPause';
 import type { ResumeSnapshot } from '@/game/sceneLifecycle/types';
 import {
@@ -62,6 +64,8 @@ export interface BridgeWalkRailPlayerRuntime {
   readonly player: Phaser.Types.Physics.Arcade.SpriteWithDynamicBody;
   readonly cameraRuntime?: SideViewCameraRuntime;
   setPaused(paused: boolean): void;
+  setAuthoringFrozen(frozen: boolean): void;
+  setCompositionSource(source: BridgeStageCompositionSource): void;
   setProgressRange(range: BridgeWalkRailProgressRange): void;
   captureResume(): ResumeSnapshot | null;
   getRailSnapshot(): BridgeWalkRailPlayerSnapshot;
@@ -82,21 +86,6 @@ const GLASSES_TEXTURE_KEY = 'player_glasses';
 const WALK_BOB_PERIOD_MS = 100;
 const WALK_BOB_ANGLE_DEGREES = 5;
 
-function noOpKey(): Phaser.Input.Keyboard.Key {
-  return { isDown: false } as Phaser.Input.Keyboard.Key;
-}
-
-function noOpCursors(): Phaser.Types.Input.Keyboard.CursorKeys {
-  return {
-    left: noOpKey(),
-    right: noOpKey(),
-    up: noOpKey(),
-    shift: noOpKey(),
-    down: noOpKey(),
-    space: noOpKey()
-  } as Phaser.Types.Input.Keyboard.CursorKeys;
-}
-
 export function createBridgeWalkRailPlayerRuntime(
   options: BridgeWalkRailPlayerRuntimeOptions
 ): BridgeWalkRailPlayerRuntime {
@@ -108,23 +97,15 @@ class PhaserBridgeWalkRailPlayerRuntime implements BridgeWalkRailPlayerRuntime {
   readonly cameraRuntime?: SideViewCameraRuntime;
 
   private readonly scene: Phaser.Scene;
-  private readonly source: BridgeStageCompositionSource;
+  private source: BridgeStageCompositionSource;
+  private railLength: number;
   private readonly commands = createInputCommandFrame();
-  private readonly cursors: Phaser.Types.Input.Keyboard.CursorKeys;
-  private readonly wasd: {
-    a: Phaser.Input.Keyboard.Key;
-    d: Phaser.Input.Keyboard.Key;
-    w: Phaser.Input.Keyboard.Key;
-    s: Phaser.Input.Keyboard.Key;
-  };
-  private readonly interactKey: Phaser.Input.Keyboard.Key;
-  private readonly hKey: Phaser.Input.Keyboard.Key;
-  private readonly escapeKey: Phaser.Input.Keyboard.Key;
-  private readonly railLength: number;
+  private readonly inputKeys: SceneInputKeys;
   private progressRange: BridgeWalkRailProgressRange = { min: 0, max: 1 };
   private progress: number;
   private facingLeft = false;
   private isPaused = false;
+  private authoringFrozen = false;
   private hasGlassesSprite: boolean | null = null;
   private lastSample: BridgeRailSample;
 
@@ -149,17 +130,7 @@ class PhaserBridgeWalkRailPlayerRuntime implements BridgeWalkRailPlayerRuntime {
     this.player.body.setImmovable(true);
     this.applySample(this.lastSample);
 
-    const keyboard = this.scene.input.keyboard;
-    this.cursors = keyboard?.createCursorKeys() ?? noOpCursors();
-    this.wasd = {
-      a: keyboard?.addKey(Phaser.Input.Keyboard.KeyCodes.A) ?? noOpKey(),
-      d: keyboard?.addKey(Phaser.Input.Keyboard.KeyCodes.D) ?? noOpKey(),
-      w: keyboard?.addKey(Phaser.Input.Keyboard.KeyCodes.W) ?? noOpKey(),
-      s: keyboard?.addKey(Phaser.Input.Keyboard.KeyCodes.S) ?? noOpKey()
-    };
-    this.interactKey = keyboard?.addKey(Phaser.Input.Keyboard.KeyCodes.E) ?? noOpKey();
-    this.hKey = keyboard?.addKey(Phaser.Input.Keyboard.KeyCodes.H) ?? noOpKey();
-    this.escapeKey = keyboard?.addKey(Phaser.Input.Keyboard.KeyCodes.ESC) ?? noOpKey();
+    this.inputKeys = bindSideViewKeyboard(this.scene.input.keyboard, { includeEscapeKey: true });
 
     this.cameraRuntime = createSideViewCameraRuntime({
       scene: this.scene,
@@ -187,6 +158,20 @@ class PhaserBridgeWalkRailPlayerRuntime implements BridgeWalkRailPlayerRuntime {
     });
   }
 
+  setAuthoringFrozen(frozen: boolean): void {
+    this.authoringFrozen = frozen;
+    if (frozen) {
+      this.player.setVelocity(0, 0);
+    }
+  }
+
+  setCompositionSource(source: BridgeStageCompositionSource): void {
+    this.source = source;
+    this.railLength = getBridgeWalkRailLength(this.source.primaryWalkRail);
+    this.applySample(sampleBridgeWalkRail(this.source.primaryWalkRail, this.progress));
+    this.cameraRuntime?.refresh();
+  }
+
   setProgressRange(range: BridgeWalkRailProgressRange): void {
     this.progressRange = {
       min: clamp01(Math.min(range.min, range.max)),
@@ -223,18 +208,14 @@ class PhaserBridgeWalkRailPlayerRuntime implements BridgeWalkRailPlayerRuntime {
 
   update(deltaMs: number = 16.67): BridgeWalkRailPlayerRuntimeUpdate {
     this.syncAppearance();
-    if (this.isPaused) {
+    if (this.isPaused || this.authoringFrozen) {
       this.player.setVelocity(0, 0);
       return { paused: true };
     }
 
     const commands = readSceneInputCommands({
       frame: this.commands,
-      cursors: this.cursors,
-      wasd: this.wasd,
-      interactKey: this.interactKey,
-      hKey: this.hKey,
-      escapeKey: this.escapeKey,
+      ...this.inputKeys,
       touch: getTouchState(),
       oneShots: bridgeActions.consumeTouchOneShots(),
       allowJump: false,
diff --git a/src/game/scenes/ridge/bridge/bridgeStageDebugOverlay.test.ts b/src/game/scenes/ridge/bridge/bridgeStageDebugOverlay.test.ts
index f7669c28..9136e42a 100644
--- a/src/game/scenes/ridge/bridge/bridgeStageDebugOverlay.test.ts
+++ b/src/game/scenes/ridge/bridge/bridgeStageDebugOverlay.test.ts
@@ -51,6 +51,21 @@ describe('Bridge Stage debug overlay draw commands', () => {
     expect(commands.some((command) => command.id === 'walk-rail:player-progress')).toBe(true);
   });
 
+  it('draws authoring markers for rail points and Stage Objects when authoring mode is active', () => {
+    const commands = createBridgeStageDebugDrawCommands({
+      interactionTargets: [],
+      authoring: {
+        active: true,
+        selection: { kind: 'object', id: 'bridge-draftsperson' }
+      },
+      settings: debugOff
+    });
+
+    expect(commands.some((command) => command.id === 'authoring-rail-point:0')).toBe(true);
+    expect(commands.some((command) => command.id === 'authoring-object:bridge-draftsperson')).toBe(true);
+    expect(commands.some((command) => command.id === 'stage-spot:draftsperson')).toBe(true);
+  });
+
   it('treats graybox mode as a composite Bridge Stage overlay', () => {
     const commands = createBridgeStageDebugDrawCommands({
       interactionTargets: [],
diff --git a/src/game/scenes/ridge/bridge/bridgeStageDebugOverlay.ts b/src/game/scenes/ridge/bridge/bridgeStageDebugOverlay.ts
index b2621702..7a09ae78 100644
--- a/src/game/scenes/ridge/bridge/bridgeStageDebugOverlay.ts
+++ b/src/game/scenes/ridge/bridge/bridgeStageDebugOverlay.ts
@@ -5,8 +5,10 @@ import {
 } from '../debugDrawCommands';
 import type { RidgeDevDebugSettings } from '../runtime/ridgeDevControls';
 import type { BridgeTracerInteractionTarget } from './bridgeTracerSlice';
+import { areStageAuthoringSelectionsEqual, type StageAuthoringSelection } from './stageAuthoring';
 import {
   BRIDGE_STAGE_SOURCE,
+  resolveBridgeStageObjectPlacement,
   resolveBridgeStageSpot,
   sampleBridgeWalkRail,
   type BridgeStageCompositionSource
@@ -27,6 +29,10 @@ export type BridgeStageDebugDrawCommand = RidgeDebugDrawCommand;
 
 export interface BridgeStageDebugDrawCommandOptions {
   source?: BridgeStageCompositionSource;
+  authoring?: {
+    active: boolean;
+    selection: StageAuthoringSelection | null;
+  };
   interactionTargets: readonly BridgeTracerInteractionTarget[];
   player?: BridgeStageDebugOverlayPlayer;
   railProgress?: number;
@@ -49,7 +55,8 @@ export function createBridgeStageDebugDrawCommands(
   const source = options.source ?? BRIDGE_STAGE_SOURCE;
   const commands: BridgeStageDebugDrawCommand[] = [];
   const enabled = getEffectiveDebugSettings(options.settings);
-  if (!isAnyDebugSettingEnabled(enabled)) return commands;
+  const showAuthoringMarkers = options.authoring?.active === true;
+  if (!isAnyDebugSettingEnabled(enabled) && !showAuthoringMarkers) return commands;
 
   if (enabled.graybox) {
     commands.push({
@@ -83,7 +90,9 @@ export function createBridgeStageDebugDrawCommands(
     });
   }
 
-  if (enabled.showTraversalAssists) {
+  const showTraversal = enabled.showTraversalAssists || showAuthoringMarkers;
+
+  if (showTraversal) {
     const points = source.primaryWalkRail.points;
     for (let index = 0; index < points.length - 1; index += 1) {
       const from = points[index];
@@ -100,22 +109,70 @@ export function createBridgeStageDebugDrawCommands(
       });
     }
 
+    if (showAuthoringMarkers) {
+      points.forEach((point, index) => {
+        const selected = areStageAuthoringSelectionsEqual(options.authoring?.selection, {
+          kind: 'rail-point',
+          index
+        });
+        commands.push({
+          kind: 'circle',
+          id: `authoring-rail-point:${index}`,
+          x: point.x,
+          y: point.y,
+          radius: selected ? 12 : 8,
+          fillColor: 0x7aa0d8,
+          fillAlpha: selected ? 0.42 : 0.24,
+          strokeColor: 0x1a1a1a,
+          strokeAlpha: selected ? 1 : 0.78,
+          lineWidth: selected ? 3 : 2
+        });
+      });
+    }
+
     source.spots.forEach((spot) => {
       const resolved = resolveBridgeStageSpot(source, spot.id);
+      const selected = areStageAuthoringSelectionsEqual(options.authoring?.selection, {
+        kind: 'spot',
+        id: spot.id
+      });
       commands.push({
         kind: 'circle',
         id: `stage-spot:${spot.id}`,
         x: resolved.x,
         y: resolved.y,
-        radius: 10,
+        radius: selected ? 12 : 10,
         fillColor: 0xf0d35f,
-        fillAlpha: 0.22,
+        fillAlpha: selected ? 0.36 : 0.22,
         strokeColor: 0x1a1a1a,
-        strokeAlpha: 0.78,
-        lineWidth: 2
+        strokeAlpha: selected ? 1 : 0.78,
+        lineWidth: selected ? 3 : 2
       });
     });
 
+    if (showAuthoringMarkers) {
+      source.objects.forEach((object) => {
+        const placement = resolveBridgeStageObjectPlacement(source, object.id);
+        const selected = areStageAuthoringSelectionsEqual(options.authoring?.selection, {
+          kind: 'object',
+          id: object.id
+        });
+        commands.push({
+          kind: 'rect',
+          id: `authoring-object:${object.id}`,
+          x: placement.contactPoint.x,
+          y: placement.contactPoint.y,
+          width: selected ? 20 : 16,
+          height: selected ? 20 : 16,
+          fillColor: 0x8ec7a7,
+          fillAlpha: selected ? 0.42 : 0.24,
+          strokeColor: 0x1a1a1a,
+          strokeAlpha: selected ? 1 : 0.78,
+          lineWidth: selected ? 3 : 2
+        });
+      });
+    }
+
     if (options.railProgress !== undefined) {
       const sample = sampleBridgeWalkRail(source.primaryWalkRail, options.railProgress);
       commands.push({
@@ -226,3 +283,4 @@ function isAnyDebugSettingEnabled(settings: RidgeDevDebugSettings): boolean {
     settings.showInteractZones ||
     settings.showTraversalAssists;
 }
+
diff --git a/src/game/scenes/ridge/bridge/bridgeTracerSlice.test.ts b/src/game/scenes/ridge/bridge/bridgeTracerSlice.test.ts
index 2af29882..2fcb83a4 100644
--- a/src/game/scenes/ridge/bridge/bridgeTracerSlice.test.ts
+++ b/src/game/scenes/ridge/bridge/bridgeTracerSlice.test.ts
@@ -98,4 +98,20 @@ describe('Bridge Tracer Slice route targets', () => {
       prompt: draftspersonSpot.prompt
     });
   });
+
+  it('resolves interaction anchors from an authored composition source', () => {
+    const draft = structuredClone(BRIDGE_STAGE_SOURCE) as typeof BRIDGE_STAGE_SOURCE;
+    const draftsperson = draft.spots.find((spot) => spot.id === 'draftsperson');
+    if (draftsperson) {
+      draftsperson.offset = { x: 42, y: -18 };
+    }
+
+    const targets = createBridgeTracerInteractionTargets(route('intro'), draft);
+    const draftspersonSpot = resolveBridgeStageSpot(draft, 'draftsperson');
+
+    expect(targets[1]).toMatchObject({
+      x: draftspersonSpot.x,
+      distanceAnchorY: draftspersonSpot.y
+    });
+  });
 });
diff --git a/src/game/scenes/ridge/bridge/bridgeTracerSlice.ts b/src/game/scenes/ridge/bridge/bridgeTracerSlice.ts
index 4dc25f72..f3f99c35 100644
--- a/src/game/scenes/ridge/bridge/bridgeTracerSlice.ts
+++ b/src/game/scenes/ridge/bridge/bridgeTracerSlice.ts
@@ -8,6 +8,7 @@ import {
   BRIDGE_STAGE_DEFAULT_INTERACT_RADIUS,
   BRIDGE_STAGE_SOURCE,
   resolveBridgeStageSpot,
+  type BridgeStageCompositionSource,
   type BridgeStageSpotId
 } from './stageComposition';
 
@@ -76,13 +77,16 @@ export type BridgeTracerInteractionTarget = InteriorInteractionTarget<
   promptLineId: BridgeDialogueLineId;
 };
 
-type BridgeTracerTargetFactory = () => BridgeTracerInteractionTarget;
+type BridgeTracerTargetFactory = (
+  source: BridgeStageCompositionSource
+) => BridgeTracerInteractionTarget;
 
 export function createBridgeTracerInteractionTargets(
-  route: RidgeFirstPlayableRouteState
+  route: RidgeFirstPlayableRouteState,
+  source: BridgeStageCompositionSource = BRIDGE_STAGE_SOURCE
 ): BridgeTracerInteractionTarget[] {
   if (route.activeAreaId !== 'bridge') return [];
-  return BRIDGE_TARGETS_BY_BEAT[route.bridgeBeat].map((createTarget) => createTarget());
+  return BRIDGE_TARGETS_BY_BEAT[route.bridgeBeat].map((createTarget) => createTarget(source));
 }
 
 const BRIDGE_TARGETS_BY_BEAT = {
@@ -98,8 +102,8 @@ const BRIDGE_TARGETS_BY_BEAT = {
   bridge_complete: [createConcertExitTarget]
 } satisfies Record<RidgeBridgeAreaBeatState, readonly BridgeTracerTargetFactory[]>;
 
-function createCickaFirstMeetTarget(): BridgeTracerInteractionTarget {
-  return createSpotTarget({
+function createCickaFirstMeetTarget(source: BridgeStageCompositionSource): BridgeTracerInteractionTarget {
+  return createSpotTarget(source, {
     id: 'cicka',
     kind: 'ridge-bridge-cicka',
     spotId: 'cicka-play',
@@ -115,8 +119,8 @@ function createCickaFirstMeetTarget(): BridgeTracerInteractionTarget {
   });
 }
 
-function createCickaParallelPlayTarget(): BridgeTracerInteractionTarget {
-  return createSpotTarget({
+function createCickaParallelPlayTarget(source: BridgeStageCompositionSource): BridgeTracerInteractionTarget {
+  return createSpotTarget(source, {
     id: 'cicka',
     kind: 'ridge-bridge-cicka',
     spotId: 'cicka-play',
@@ -134,18 +138,19 @@ function createCickaParallelPlayTarget(): BridgeTracerInteractionTarget {
   });
 }
 
-function createIntroMissingSpanTarget(): BridgeTracerInteractionTarget {
-  return createMissingSpanTarget('intro');
+function createIntroMissingSpanTarget(source: BridgeStageCompositionSource): BridgeTracerInteractionTarget {
+  return createMissingSpanTarget(source, 'intro');
 }
 
-function createNeedsToyCarMissingSpanTarget(): BridgeTracerInteractionTarget {
-  return createMissingSpanTarget('needs_toy_car');
+function createNeedsToyCarMissingSpanTarget(source: BridgeStageCompositionSource): BridgeTracerInteractionTarget {
+  return createMissingSpanTarget(source, 'needs_toy_car');
 }
 
 function createMissingSpanTarget(
+  source: BridgeStageCompositionSource,
   bridgeBeat: Extract<RidgeBridgeAreaBeatState, 'intro' | 'needs_toy_car'>
 ): BridgeTracerInteractionTarget {
-  return createSpotTarget({
+  return createSpotTarget(source, {
     id: 'draftsperson',
     kind: 'ridge-bridge-draftsperson',
     spotId: 'draftsperson',
@@ -162,8 +167,8 @@ function createMissingSpanTarget(
   });
 }
 
-function createToyCarTestTarget(): BridgeTracerInteractionTarget {
-  return createSpotTarget({
+function createToyCarTestTarget(source: BridgeStageCompositionSource): BridgeTracerInteractionTarget {
+  return createSpotTarget(source, {
     id: 'draftsperson',
     kind: 'ridge-bridge-draftsperson',
     spotId: 'draftsperson',
@@ -180,8 +185,8 @@ function createToyCarTestTarget(): BridgeTracerInteractionTarget {
   });
 }
 
-function createConcertExitTarget(): BridgeTracerInteractionTarget {
-  return createSpotTarget({
+function createConcertExitTarget(source: BridgeStageCompositionSource): BridgeTracerInteractionTarget {
+  return createSpotTarget(source, {
     id: 'concert-exit',
     kind: 'ridge-bridge-exit',
     spotId: 'concert-exit',
@@ -197,14 +202,17 @@ function createConcertExitTarget(): BridgeTracerInteractionTarget {
   });
 }
 
-function createSpotTarget(options: {
-  id: BridgeTracerTargetId;
-  kind: string;
-  spotId: BridgeStageSpotId;
-  promptLineId: BridgeDialogueLineId;
-  effect: BridgeTracerEffect;
-}): BridgeTracerInteractionTarget {
-  const spot = resolveBridgeStageSpot(BRIDGE_STAGE_SOURCE, options.spotId);
+function createSpotTarget(
+  source: BridgeStageCompositionSource,
+  options: {
+    id: BridgeTracerTargetId;
+    kind: string;
+    spotId: BridgeStageSpotId;
+    promptLineId: BridgeDialogueLineId;
+    effect: BridgeTracerEffect;
+  }
+): BridgeTracerInteractionTarget {
+  const spot = resolveBridgeStageSpot(source, options.spotId);
   return {
     id: options.id,
     kind: options.kind,
diff --git a/src/game/scenes/ridge/bridge/stageAuthoring.test.ts b/src/game/scenes/ridge/bridge/stageAuthoring.test.ts
new file mode 100644
index 00000000..9ef42949
--- /dev/null
+++ b/src/game/scenes/ridge/bridge/stageAuthoring.test.ts
@@ -0,0 +1,190 @@
+import { describe, expect, it } from 'vitest';
+import {
+  BRIDGE_STAGE_SOURCE,
+  resolveBridgeStageObjectPlacement,
+  sampleBridgeWalkRail
+} from './stageComposition';
+import {
+  advanceStageAuthoringPointer,
+  applyStageAuthoringDrag,
+  areStageAuthoringSelectionsEqual,
+  beginStageAuthoringPointer,
+  clampStageAuthoringOffset,
+  cloneBridgeStageCompositionSource,
+  finishStageAuthoringPointer,
+  formatStageAuthoringSnippet,
+  hitTestStageAuthoringTargets,
+  isWorldPointInsideCameraView,
+  resetStageAuthoringSelection,
+  STAGE_AUTHORING_OFFSET_LIMIT_PX,
+  STAGE_AUTHORING_DRAG_THRESHOLD_PX,
+  updateStageAuthoringDraft
+} from './stageAuthoring';
+
+describe('stageAuthoring', () => {
+  it('clones the Bridge Stage Composition Source for draft editing', () => {
+    const draft = cloneBridgeStageCompositionSource();
+    draft.primaryWalkRail.points[0]!.x = 999;
+
+    expect(BRIDGE_STAGE_SOURCE.primaryWalkRail.points[0]?.x).not.toBe(999);
+    expect(draft.primaryWalkRail.points[0]?.x).toBe(999);
+  });
+
+  it('prefers the closest Stage Object pick over overlapping spot and rail markers', () => {
+    const builder = resolveBridgeStageObjectPlacement(BRIDGE_STAGE_SOURCE, 'bridge-draftsperson');
+    const pick = hitTestStageAuthoringTargets(
+      BRIDGE_STAGE_SOURCE,
+      builder.contactPoint.x,
+      builder.contactPoint.y
+    );
+
+    expect(pick).toEqual({ kind: 'object', id: 'bridge-draftsperson' });
+  });
+
+  it('updates draft spot offsets and formats a full replacement snippet', () => {
+    const draft = updateStageAuthoringDraft(
+      cloneBridgeStageCompositionSource(),
+      { kind: 'spot', id: 'draftsperson' },
+      'offset.y',
+      -6
+    );
+    const spot = draft.spots.find((candidate) => candidate.id === 'draftsperson');
+
+    expect(spot?.offset).toEqual({ x: 0, y: -6 });
+    expect(formatStageAuthoringSnippet(draft, { kind: 'spot', id: 'draftsperson' })).toContain(
+      "id: 'draftsperson'"
+    );
+    expect(formatStageAuthoringSnippet(draft, { kind: 'spot', id: 'draftsperson' })).toContain(
+      'offset: { x: 0, y: -6 }'
+    );
+  });
+
+  it('projects spot drags to the rail and keeps rail progress fixed for shift drags', () => {
+    const draft = applyStageAuthoringDrag(
+      cloneBridgeStageCompositionSource(),
+      { kind: 'spot', id: 'draftsperson' },
+      900,
+      500
+    );
+    const shifted = applyStageAuthoringDrag(
+      cloneBridgeStageCompositionSource(),
+      { kind: 'spot', id: 'draftsperson' },
+      900,
+      500,
+      { offsetOnly: true }
+    );
+    const spot = draft.spots.find((candidate) => candidate.id === 'draftsperson');
+    const shiftedSpot = shifted.spots.find((candidate) => candidate.id === 'draftsperson');
+    const committed = BRIDGE_STAGE_SOURCE.spots.find((candidate) => candidate.id === 'draftsperson');
+
+    expect(spot?.railProgress).not.toBe(committed?.railProgress);
+    expect(shiftedSpot?.railProgress).toBe(committed?.railProgress);
+    const railPoint = sampleBridgeWalkRail(
+      BRIDGE_STAGE_SOURCE.primaryWalkRail,
+      committed?.railProgress ?? 0
+    );
+    expect(shiftedSpot?.offset).toEqual({
+      x: 900 - railPoint.x,
+      y: 500 - railPoint.y
+    });
+  });
+
+  it('checks whether a world point is inside the camera view with margin', () => {
+    expect(isWorldPointInsideCameraView(
+      { x: 100, y: 100, right: 500, bottom: 400 },
+      { x: 200, y: 200 }
+    )).toBe(true);
+    expect(isWorldPointInsideCameraView(
+      { x: 100, y: 100, right: 500, bottom: 400 },
+      { x: 20, y: 120 }
+    )).toBe(false);
+  });
+
+  it('clamps authored spot offsets to a sane pixel window', () => {
+    const draft = updateStageAuthoringDraft(
+      cloneBridgeStageCompositionSource(),
+      { kind: 'spot', id: 'draftsperson' },
+      'offset.y',
+      -25000
+    );
+    const spot = draft.spots.find((candidate) => candidate.id === 'draftsperson');
+
+    expect(spot?.offset?.y).toBe(-STAGE_AUTHORING_OFFSET_LIMIT_PX);
+    expect(clampStageAuthoringOffset(25000)).toBe(STAGE_AUTHORING_OFFSET_LIMIT_PX);
+  });
+
+  it('resets only the selected draft entry back to the committed source', () => {
+    const draft = updateStageAuthoringDraft(
+      cloneBridgeStageCompositionSource(),
+      { kind: 'spot', id: 'draftsperson' },
+      'offset.y',
+      -6
+    );
+    const reset = resetStageAuthoringSelection(
+      BRIDGE_STAGE_SOURCE,
+      draft,
+      { kind: 'spot', id: 'draftsperson' }
+    );
+    const spot = reset.spots.find((candidate) => candidate.id === 'draftsperson');
+
+    expect(spot?.offset).toBeUndefined();
+  });
+
+  it('compares selections with serialized keys', () => {
+    expect(areStageAuthoringSelectionsEqual(
+      { kind: 'spot', id: 'draftsperson' },
+      { kind: 'spot', id: 'draftsperson' }
+    )).toBe(true);
+    expect(areStageAuthoringSelectionsEqual(
+      { kind: 'spot', id: 'draftsperson' },
+      { kind: 'object', id: 'bridge-draftsperson' }
+    )).toBe(false);
+  });
+
+  it('steps the authoring pointer FSM from pending click to pick', () => {
+    const pending = beginStageAuthoringPointer({
+      hit: { kind: 'spot', id: 'draftsperson' },
+      offsetOnly: false,
+      scrollX: 0,
+      scrollY: 0,
+      pointerX: 10,
+      pointerY: 10
+    });
+    const finished = finishStageAuthoringPointer(pending);
+
+    expect(finished.intents).toEqual([
+      { kind: 'pick', selection: { kind: 'spot', id: 'draftsperson' } }
+    ]);
+    expect(finished.state.mode).toBe('idle');
+  });
+
+  it('promotes pending drags past the threshold into drag intents', () => {
+    const pending = beginStageAuthoringPointer({
+      hit: { kind: 'rail-point', index: 2 },
+      offsetOnly: true,
+      scrollX: 0,
+      scrollY: 0,
+      pointerX: 0,
+      pointerY: 0
+    });
+    const moved = advanceStageAuthoringPointer(pending, {
+      pointerX: STAGE_AUTHORING_DRAG_THRESHOLD_PX + 2,
+      pointerY: 0,
+      worldX: 520,
+      worldY: 500,
+      zoom: 1
+    });
+
+    expect(moved.state.mode).toBe('drag-marker');
+    expect(moved.intents).toEqual([
+      { kind: 'pick', selection: { kind: 'rail-point', index: 2 } },
+      {
+        kind: 'drag',
+        selection: { kind: 'rail-point', index: 2 },
+        worldX: 520,
+        worldY: 500,
+        offsetOnly: true
+      }
+    ]);
+  });
+});
diff --git a/src/game/scenes/ridge/bridge/stageAuthoring.ts b/src/game/scenes/ridge/bridge/stageAuthoring.ts
new file mode 100644
index 00000000..95a9fdbb
--- /dev/null
+++ b/src/game/scenes/ridge/bridge/stageAuthoring.ts
@@ -0,0 +1,551 @@
+import {
+  BRIDGE_STAGE_SOURCE,
+  projectPointToBridgeWalkRail,
+  resolveBridgeStageObjectPlacement,
+  resolveBridgeStageSpot,
+  sampleBridgeWalkRail,
+  type BridgeStageCompositionSource,
+  type BridgeStageObject,
+  type BridgeStageObjectId,
+  type BridgeStagePoint,
+  type BridgeStageSpot,
+  type BridgeStageSpotId,
+  type BridgeWalkRailPoint
+} from './stageComposition';
+
+export type StageAuthoringSelection =
+  | { kind: 'rail-point'; index: number }
+  | { kind: 'spot'; id: BridgeStageSpotId }
+  | { kind: 'object'; id: BridgeStageObjectId };
+
+export const STAGE_AUTHORING_OFFSET_SLIDER_WINDOW_PX = 200;
+export const STAGE_AUTHORING_OFFSET_LIMIT_PX = 500;
+
+export function clampStageAuthoringOffset(value: number): number {
+  return Math.min(
+    STAGE_AUTHORING_OFFSET_LIMIT_PX,
+    Math.max(-STAGE_AUTHORING_OFFSET_LIMIT_PX, Math.round(value))
+  );
+}
+export const STAGE_AUTHORING_DRAG_THRESHOLD_PX = 5;
+const STAGE_AUTHORING_CAMERA_FOCUS_MARGIN_PX = 48;
+const RAIL_POINT_PICK_RADIUS_PX = 14;
+const SPOT_PICK_RADIUS_PX = 12;
+const OBJECT_PICK_HALF_SIZE_PX = 8;
+
+export function cloneBridgeStageCompositionSource(
+  source: BridgeStageCompositionSource = BRIDGE_STAGE_SOURCE
+): BridgeStageCompositionSource {
+  return structuredClone(source) as BridgeStageCompositionSource;
+}
+
+export function hitTestStageAuthoringTargets(
+  source: BridgeStageCompositionSource,
+  worldX: number,
+  worldY: number
+): StageAuthoringSelection | null {
+  let bestSelection: StageAuthoringSelection | null = null;
+  let bestDistanceSquared = Number.POSITIVE_INFINITY;
+
+  const consider = (
+    selection: StageAuthoringSelection,
+    targetX: number,
+    targetY: number,
+    radius: number
+  ): void => {
+    const dx = worldX - targetX;
+    const dy = worldY - targetY;
+    const distanceSquared = (dx * dx) + (dy * dy);
+    if (distanceSquared > radius * radius) return;
+    if (distanceSquared < bestDistanceSquared) {
+      bestDistanceSquared = distanceSquared;
+      bestSelection = selection;
+    }
+  };
+
+  source.objects.forEach((object) => {
+    const placement = resolveBridgeStageObjectPlacement(source, object.id);
+    consider(
+      { kind: 'object', id: object.id },
+      placement.contactPoint.x,
+      placement.contactPoint.y,
+      OBJECT_PICK_HALF_SIZE_PX
+    );
+  });
+
+  source.spots.forEach((spot) => {
+    const resolved = resolveBridgeStageSpot(source, spot.id);
+    consider({ kind: 'spot', id: spot.id }, resolved.x, resolved.y, SPOT_PICK_RADIUS_PX);
+  });
+
+  source.primaryWalkRail.points.forEach((point, index) => {
+    consider({ kind: 'rail-point', index }, point.x, point.y, RAIL_POINT_PICK_RADIUS_PX);
+  });
+
+  return bestSelection;
+}
+
+export function serializeStageAuthoringSelection(
+  selection: StageAuthoringSelection | null
+): string | null {
+  if (!selection) return null;
+  switch (selection.kind) {
+    case 'rail-point':
+      return `rail-point:${selection.index}`;
+    case 'spot':
+      return `spot:${selection.id}`;
+    case 'object':
+      return `object:${selection.id}`;
+    default:
+      return assertNever(selection);
+  }
+}
+
+export function areStageAuthoringSelectionsEqual(
+  left: StageAuthoringSelection | null | undefined,
+  right: StageAuthoringSelection | null | undefined
+): boolean {
+  return serializeStageAuthoringSelection(left ?? null) ===
+    serializeStageAuthoringSelection(right ?? null);
+}
+
+export type StageAuthoringPointerMode = 'idle' | 'pan' | 'drag-marker' | 'pending';
+
+export interface StageAuthoringPointerState {
+  mode: StageAuthoringPointerMode;
+  moved: boolean;
+  offsetOnly: boolean;
+  selection: StageAuthoringSelection | null;
+  startScrollX: number;
+  startScrollY: number;
+  startX: number;
+  startY: number;
+}
+
+export type StageAuthoringPointerIntent =
+  | { kind: 'pick'; selection: StageAuthoringSelection }
+  | { kind: 'drag'; selection: StageAuthoringSelection; worldX: number; worldY: number; offsetOnly: boolean };
+
+export function createIdleStageAuthoringPointerState(): StageAuthoringPointerState {
+  return {
+    mode: 'idle',
+    moved: false,
+    offsetOnly: false,
+    selection: null,
+    startScrollX: 0,
+    startScrollY: 0,
+    startX: 0,
+    startY: 0
+  };
+}
+
+export function beginStageAuthoringPointer(input: {
+  hit: StageAuthoringSelection | null;
+  offsetOnly: boolean;
+  scrollX: number;
+  scrollY: number;
+  pointerX: number;
+  pointerY: number;
+}): StageAuthoringPointerState {
+  return {
+    mode: input.hit ? 'pending' : 'pan',
+    moved: false,
+    offsetOnly: input.offsetOnly,
+    selection: input.hit,
+    startScrollX: input.scrollX,
+    startScrollY: input.scrollY,
+    startX: input.pointerX,
+    startY: input.pointerY
+  };
+}
+
+export function advanceStageAuthoringPointer(
+  state: StageAuthoringPointerState,
+  input: {
+    pointerX: number;
+    pointerY: number;
+    worldX: number;
+    worldY: number;
+    zoom: number;
+  }
+): {
+  state: StageAuthoringPointerState;
+  intents: StageAuthoringPointerIntent[];
+  panScroll?: { scrollX: number; scrollY: number };
+} {
+  if (state.mode === 'idle') {
+    return { state, intents: [] };
+  }
+
+  const distance = Math.hypot(input.pointerX - state.startX, input.pointerY - state.startY);
+  let nextState = state;
+  const intents: StageAuthoringPointerIntent[] = [];
+
+  if (state.mode === 'pending' && distance >= STAGE_AUTHORING_DRAG_THRESHOLD_PX) {
+    nextState = { ...state, mode: 'drag-marker' };
+    if (nextState.selection) {
+      intents.push({ kind: 'pick', selection: nextState.selection });
+    }
+  }
+
+  if (nextState.mode === 'pan') {
+    return {
+      state: { ...nextState, moved: true },
+      intents,
+      panScroll: {
+        scrollX: nextState.startScrollX - ((input.pointerX - nextState.startX) / input.zoom),
+        scrollY: nextState.startScrollY - ((input.pointerY - nextState.startY) / input.zoom)
+      }
+    };
+  }
+
+  if (nextState.mode === 'drag-marker' && nextState.selection) {
+    intents.push({
+      kind: 'drag',
+      selection: nextState.selection,
+      worldX: input.worldX,
+      worldY: input.worldY,
+      offsetOnly: nextState.offsetOnly
+    });
+    return { state: { ...nextState, moved: true }, intents };
+  }
+
+  return { state: nextState, intents };
+}
+
+export function finishStageAuthoringPointer(
+  state: StageAuthoringPointerState
+): { state: StageAuthoringPointerState; intents: StageAuthoringPointerIntent[] } {
+  const intents: StageAuthoringPointerIntent[] = [];
+  if (state.mode === 'pending' && state.selection && !state.moved) {
+    intents.push({ kind: 'pick', selection: state.selection });
+  }
+  return { state: createIdleStageAuthoringPointerState(), intents };
+}
+
+export function resolveStageAuthoringTargetPoint(
+  source: BridgeStageCompositionSource,
+  selection: StageAuthoringSelection
+): BridgeStagePoint {
+  switch (selection.kind) {
+    case 'rail-point': {
+      const point = source.primaryWalkRail.points[selection.index];
+      if (!point) return { x: 0, y: 0 };
+      return { x: point.x, y: point.y };
+    }
+    case 'spot':
+      return resolveBridgeStageSpot(source, selection.id);
+    case 'object':
+      return resolveBridgeStageObjectPlacement(source, selection.id).contactPoint;
+    default:
+      return assertNever(selection);
+  }
+}
+
+export function isWorldPointInsideCameraView(
+  view: { x: number; y: number; right: number; bottom: number },
+  point: BridgeStagePoint,
+  margin: number = STAGE_AUTHORING_CAMERA_FOCUS_MARGIN_PX
+): boolean {
+  return point.x >= view.x + margin &&
+    point.x <= view.right - margin &&
+    point.y >= view.y + margin &&
+    point.y <= view.bottom - margin;
+}
+
+export interface ApplyStageAuthoringDragOptions {
+  offsetOnly?: boolean;
+}
+
+export function applyStageAuthoringDrag(
+  draft: BridgeStageCompositionSource,
+  selection: StageAuthoringSelection,
+  worldX: number,
+  worldY: number,
+  options: ApplyStageAuthoringDragOptions = {}
+): BridgeStageCompositionSource {
+  const next = cloneBridgeStageCompositionSource(draft);
+  const roundedX = Math.round(worldX);
+  const roundedY = Math.round(worldY);
+
+  switch (selection.kind) {
+    case 'rail-point': {
+      const point = next.primaryWalkRail.points[selection.index];
+      if (!point) return next;
+      point.x = roundedX;
+      point.y = roundedY;
+      return next;
+    }
+    case 'spot': {
+      const spot = next.spots.find((candidate) => candidate.id === selection.id);
+      if (!spot) return next;
+      if (options.offsetOnly) {
+        const railPoint = sampleBridgeWalkRail(next.primaryWalkRail, spot.railProgress);
+        spot.offset = {
+          x: clampStageAuthoringOffset(roundedX - railPoint.x),
+          y: clampStageAuthoringOffset(roundedY - railPoint.y)
+        };
+        return next;
+      }
+      const projected = projectPointToBridgeWalkRail(next.primaryWalkRail, {
+        x: roundedX,
+        y: roundedY
+      });
+      spot.railProgress = projected.progress;
+      spot.offset = {
+        x: clampStageAuthoringOffset(roundedX - projected.x),
+        y: clampStageAuthoringOffset(roundedY - projected.y)
+      };
+      return next;
+    }
+    case 'object': {
+      const object = next.objects.find((candidate) => candidate.id === selection.id);
+      if (!object) return next;
+      const spot = resolveBridgeStageSpot(next, object.spotId);
+      const anchorX = object.depthAnchorOffset?.x ?? 0;
+      const anchorY = object.depthAnchorOffset?.y ?? 0;
+      object.offset = {
+        x: clampStageAuthoringOffset(roundedX - spot.x - anchorX),
+        y: clampStageAuthoringOffset(roundedY - spot.y - anchorY)
+      };
+      return next;
+    }
+    default:
+      return assertNever(selection);
+  }
+}
+
+export function formatStageAuthoringSnippet(
+  source: BridgeStageCompositionSource,
+  selection: StageAuthoringSelection
+): string {
+  switch (selection.kind) {
+    case 'rail-point': {
+      const point = source.primaryWalkRail.points[selection.index];
+      if (!point) return '';
+      return formatRailPointSnippet(point);
+    }
+    case 'spot': {
+      const spot = source.spots.find((candidate) => candidate.id === selection.id);
+      if (!spot) return '';
+      return formatSpotSnippet(spot);
+    }
+    case 'object': {
+      const object = source.objects.find((candidate) => candidate.id === selection.id);
+      if (!object) return '';
+      return formatObjectSnippet(object);
+    }
+    default:
+      return assertNever(selection);
+  }
+}
+
+export function resetStageAuthoringSelection(
+  committed: BridgeStageCompositionSource,
+  draft: BridgeStageCompositionSource,
+  selection: StageAuthoringSelection
+): BridgeStageCompositionSource {
+  const next = cloneBridgeStageCompositionSource(draft);
+
+  switch (selection.kind) {
+    case 'rail-point': {
+      const point = committed.primaryWalkRail.points[selection.index];
+      if (!point) return next;
+      next.primaryWalkRail.points = next.primaryWalkRail.points.map((candidate, index) => (
+        index === selection.index ? cloneRailPoint(point) : candidate
+      ));
+      return next;
+    }
+    case 'spot': {
+      const spot = committed.spots.find((candidate) => candidate.id === selection.id);
+      if (!spot) return next;
+      next.spots = next.spots.map((candidate) => (
+        candidate.id === selection.id ? cloneSpot(spot) : candidate
+      ));
+      return next;
+    }
+    case 'object': {
+      const object = committed.objects.find((candidate) => candidate.id === selection.id);
+      if (!object) return next;
+      next.objects = next.objects.map((candidate) => (
+        candidate.id === selection.id ? cloneObject(object) : candidate
+      ));
+      return next;
+    }
+    default:
+      return assertNever(selection);
+  }
+}
+
+export function updateStageAuthoringDraft(
+  draft: BridgeStageCompositionSource,
+  selection: StageAuthoringSelection,
+  field: string,
+  value: number
+): BridgeStageCompositionSource {
+  const next = cloneBridgeStageCompositionSource(draft);
+
+  switch (selection.kind) {
+    case 'rail-point': {
+      const point = next.primaryWalkRail.points[selection.index];
+      if (!point) return next;
+      if (field === 'x' || field === 'y') {
+        point[field] = value;
+      }
+      return next;
+    }
+    case 'spot': {
+      const spot = next.spots.find((candidate) => candidate.id === selection.id);
+      if (!spot) return next;
+      if (field === 'railProgress') {
+        spot.railProgress = clamp01(value);
+        return next;
+      }
+      if (field === 'offset.x' || field === 'offset.y') {
+        const axis = field === 'offset.x' ? 'x' : 'y';
+        spot.offset = {
+          x: spot.offset?.x ?? 0,
+          y: spot.offset?.y ?? 0,
+          [axis]: clampStageAuthoringOffset(value)
+        };
+        return next;
+      }
+      return next;
+    }
+    case 'object': {
+      const object = next.objects.find((candidate) => candidate.id === selection.id);
+      if (!object) return next;
+      if (field === 'offset.x' || field === 'offset.y') {
+        const axis = field === 'offset.x' ? 'x' : 'y';
+        object.offset = {
+          x: object.offset?.x ?? 0,
+          y: object.offset?.y ?? 0,
+          [axis]: clampStageAuthoringOffset(value)
+        };
+      }
+      return next;
+    }
+    default:
+      return assertNever(selection);
+  }
+}
+
+function formatRailPointSnippet(point: BridgeWalkRailPoint): string {
+  return [
+    '{',
+    `  progress: ${formatNumber(point.progress)},`,
+    `  x: ${Math.round(point.x)},`,
+    `  y: ${Math.round(point.y)},`,
+    '  cue: {',
+    `    scale: ${formatNumber(point.cue.scale)},`,
+    `    depth: ${Math.round(point.cue.depth)},`,
+    `    cameraFollowOffsetY: ${Math.round(point.cue.cameraFollowOffsetY)}`,
+    '  }',
+    '}'
+  ].join('\n');
+}
+
+function formatSpotSnippet(spot: BridgeStageSpot): string {
+  const lines = [
+    '{',
+    `  id: '${spot.id}',`,
+    `  railProgress: ${formatNumber(spot.railProgress)}`
+  ];
+
+  if (spot.offset) {
+    lines.push(`  offset: { x: ${Math.round(spot.offset.x)}, y: ${Math.round(spot.offset.y)} },`);
+  }
+  if (spot.promptOffset) {
+    lines.push(
+      `  promptOffset: { x: ${Math.round(spot.promptOffset.x)}, y: ${Math.round(spot.promptOffset.y)} },`
+    );
+  }
+  if (spot.interactRadius !== undefined) {
+    lines.push(`  interactRadius: ${Math.round(spot.interactRadius)},`);
+  }
+
+  lines.push('}');
+  return lines.join('\n');
+}
+
+function formatObjectSnippet(object: BridgeStageObject): string {
+  const lines = ['{', `  id: '${object.id}',`, `  kind: '${object.kind}',`];
+
+  if (object.kind === 'image') {
+    lines.push(`  textureKey: '${object.textureKey}',`);
+  }
+  if (object.kind === 'procedural-bridge') {
+    lines.push(`  leftSpotId: '${object.leftSpotId}',`);
+    lines.push(`  rightSpotId: '${object.rightSpotId}',`);
+    lines.push(`  deckInset: ${Math.round(object.deckInset)},`);
+  }
+
+  lines.push(`  spotId: '${object.spotId}',`);
+
+  if (object.offset) {
+    lines.push(`  offset: { x: ${Math.round(object.offset.x)}, y: ${Math.round(object.offset.y)} },`);
+  }
+  if (object.scale !== undefined) {
+    lines.push(`  scale: ${formatNumber(object.scale)},`);
+  }
+  if (object.depthAnchorOffset) {
+    lines.push(
+      `  depthAnchorOffset: { x: ${Math.round(object.depthAnchorOffset.x)}, y: ${Math.round(object.depthAnchorOffset.y)} },`
+    );
+  }
+  if (object.origin) {
+    lines.push(`  origin: [${object.origin[0]}, ${object.origin[1]}],`);
+  }
+  if ('depthMode' in object && object.depthMode === 'fixed') {
+    lines.push(`  depthMode: 'fixed',`);
+    lines.push(`  depth: ${Math.round(object.depth)},`);
+  } else if ('depthMode' in object && object.depthMode === 'rail-relative') {
+    lines.push(`  depthMode: 'rail-relative',`);
+    if (object.depthOffset !== undefined) {
+      lines.push(`  depthOffset: ${Math.round(object.depthOffset)},`);
+    }
+  } else if ('depthOffset' in object && object.depthOffset !== undefined) {
+    lines.push(`  depthOffset: ${Math.round(object.depthOffset)},`);
+  }
+
+  lines.push('}');
+  return lines.join('\n');
+}
+
+function cloneRailPoint(point: BridgeWalkRailPoint): BridgeWalkRailPoint {
+  return {
+    progress: point.progress,
+    x: point.x,
+    y: point.y,
+    cue: { ...point.cue }
+  };
+}
+
+function cloneSpot(spot: BridgeStageSpot): BridgeStageSpot {
+  return {
+    ...spot,
+    offset: spot.offset ? { ...spot.offset } : undefined,
+    promptOffset: spot.promptOffset ? { ...spot.promptOffset } : undefined
+  };
+}
+
+function cloneObject(object: BridgeStageObject): BridgeStageObject {
+  return {
+    ...object,
+    offset: object.offset ? { ...object.offset } : undefined,
+    depthAnchorOffset: object.depthAnchorOffset ? { ...object.depthAnchorOffset } : undefined,
+    origin: object.origin ? [...object.origin] as [number, number] : undefined
+  } as BridgeStageObject;
+}
+
+function formatNumber(value: number): string {
+  return Number.isInteger(value) ? String(value) : value.toFixed(3);
+}
+
+function clamp01(value: number): number {
+  return Math.min(1, Math.max(0, value));
+}
+
+function assertNever(value: never): never {
+  throw new Error(`Unhandled stage authoring value: ${JSON.stringify(value)}`);
+}
diff --git a/src/game/scenes/ridge/bridge/stageComposition.test.ts b/src/game/scenes/ridge/bridge/stageComposition.test.ts
index 860d8b0d..781c840f 100644
--- a/src/game/scenes/ridge/bridge/stageComposition.test.ts
+++ b/src/game/scenes/ridge/bridge/stageComposition.test.ts
@@ -2,8 +2,10 @@ import { describe, expect, it } from 'vitest';
 import { BRIDGE_TEXTURE_KEYS } from './assets';
 import {
   BRIDGE_STAGE_SOURCE,
+  getBridgeCrossingPlacementSignature,
   getBridgeWalkRailLength,
   getNearestBridgeStageSpotId,
+  getStageCompositionPlacementSignature,
   projectPointToBridgeWalkRail,
   resolveBridgeRailRelativeStageDepth,
   resolveBridgeStageObject,
@@ -12,6 +14,7 @@ import {
   resolveBridgeStageSpot,
   sampleBridgeWalkRail
 } from './stageComposition';
+import { updateStageAuthoringDraft } from './stageAuthoring';
 
 describe('Bridge Stage Composition Source', () => {
   it('samples the Primary Walk Rail and interpolates Rail Perspective Cues', () => {
@@ -181,4 +184,19 @@ describe('Bridge Stage Composition Source', () => {
     expect(getNearestBridgeStageSpotId(BRIDGE_STAGE_SOURCE, projected.progress)).toBe('draftsperson');
     expect(getBridgeWalkRailLength(BRIDGE_STAGE_SOURCE.primaryWalkRail)).toBeGreaterThan(2000);
   });
+
+  it('tracks spot offset edits in placement signatures without touching bridge crossing', () => {
+    const baseline = getStageCompositionPlacementSignature(BRIDGE_STAGE_SOURCE);
+    const draft = updateStageAuthoringDraft(
+      BRIDGE_STAGE_SOURCE,
+      { kind: 'spot', id: 'draftsperson' },
+      'offset.y',
+      -12
+    );
+
+    expect(getStageCompositionPlacementSignature(draft)).not.toBe(baseline);
+    expect(getBridgeCrossingPlacementSignature(draft)).toBe(
+      getBridgeCrossingPlacementSignature(BRIDGE_STAGE_SOURCE)
+    );
+  });
 });
diff --git a/src/game/scenes/ridge/bridge/stageComposition.ts b/src/game/scenes/ridge/bridge/stageComposition.ts
index 95e37aa3..06b8538e 100644
--- a/src/game/scenes/ridge/bridge/stageComposition.ts
+++ b/src/game/scenes/ridge/bridge/stageComposition.ts
@@ -635,6 +635,34 @@ export function resolveBridgeStageObjectPlacement<ObjectId extends BridgeStageOb
   } as ResolvedBridgeStageObjectPlacement<ObjectId>;
 }
 
+/** Stable placement fingerprint for live authoring sync without object-identity compares. */
+export function getStageCompositionPlacementSignature(
+  source: BridgeStageCompositionSource
+): string {
+  const rail = source.primaryWalkRail.points
+    .map((point) => `${point.x},${point.y}`)
+    .join(';');
+  const spots = source.spots
+    .map((spot) => `${spot.id}:${spot.railProgress},${spot.offset?.x ?? 0},${spot.offset?.y ?? 0}`)
+    .join(';');
+  const objects = source.objects
+    .map((object) => `${object.id}:${object.offset?.x ?? 0},${object.offset?.y ?? 0}`)
+    .join(';');
+  return `${rail}|${spots}|${objects}`;
+}
+
+/** Fingerprint for procedural bridge deck geometry only. */
+export function getBridgeCrossingPlacementSignature(
+  source: BridgeStageCompositionSource
+): string {
+  const bridgeObject = resolveBridgeStageObject(source, 'completed-bridge');
+  if (bridgeObject.kind !== 'procedural-bridge') return '';
+  const left = resolveBridgeStageSpot(source, bridgeObject.leftSpotId);
+  const right = resolveBridgeStageSpot(source, bridgeObject.rightSpotId);
+  const center = resolveBridgeStageSpot(source, bridgeObject.spotId);
+  return `${left.x},${left.y}|${right.x},${right.y}|${center.y}|${bridgeObject.deckInset}`;
+}
+
 /** Resolve visual-only draw order for a rail-relative Stage Contact Point. */
 export function resolveBridgeRailRelativeStageDepth(
   railPoint: BridgeRailSample,
diff --git a/src/game/scenes/ridge/runtime/RidgeScene.ts b/src/game/scenes/ridge/runtime/RidgeScene.ts
index 6553c01d..e6292c03 100644
--- a/src/game/scenes/ridge/runtime/RidgeScene.ts
+++ b/src/game/scenes/ridge/runtime/RidgeScene.ts
@@ -23,6 +23,7 @@ import {
   resolveRidgeDevDebugSettings,
   resolveRidgeDevCameraZoom,
   resolveRidgeDevTeleportPosition,
+  type RidgeDevAuthoringState,
   type RidgeDevControls
 } from './ridgeDevControls';
 import {
@@ -45,9 +46,23 @@ import {
   createBridgeStageDebugOverlay,
   type BridgeStageDebugOverlay
 } from '../bridge/bridgeStageDebugOverlay';
+import {
+  advanceStageAuthoringPointer,
+  beginStageAuthoringPointer,
+  createIdleStageAuthoringPointerState,
+  finishStageAuthoringPointer,
+  hitTestStageAuthoringTargets,
+  isWorldPointInsideCameraView,
+  resolveStageAuthoringTargetPoint,
+  serializeStageAuthoringSelection,
+  type StageAuthoringPointerIntent,
+  type StageAuthoringPointerState
+} from '../bridge/stageAuthoring';
 import {
   BRIDGE_STAGE_SOURCE,
+  getStageCompositionPlacementSignature,
   resolveBridgeStagePresentation,
+  type BridgeStageCompositionSource,
   type BridgeStagePresentationState
 } from '../bridge/stageComposition';
 import { TextureGenerator } from '@/game/sharedSceneRuntime/textures/TextureGenerator';
@@ -57,7 +72,7 @@ interface RidgeSceneStartData {
   onOpenOverlay?: (overlayId: OverlayId, options?: OpenOverlayOptions) => void;
   isPaused?: boolean;
   resumePosition?: { x: number; y: number };
-  ridgeDevControls?: RidgeDevControls;
+  getRidgeDevControls?: () => RidgeDevControls | undefined;
 }
 
 export class RidgeScene extends Phaser.Scene {
@@ -68,13 +83,17 @@ export class RidgeScene extends Phaser.Scene {
   private bridgeDebugOverlay?: BridgeStageDebugOverlay;
   private interactionRuntime?: InteriorInteractionRuntime<BridgeTracerTargetId, BridgeTracerEffect>;
   private bridgeInteractionTargets: BridgeTracerInteractionTarget[] = [];
-  private playerReadabilityHalo?: Phaser.GameObjects.Graphics;
   private onClose: () => void = () => {};
   private isPaused = false;
   private resumePosition?: { x: number; y: number };
-  private ridgeDevControls?: RidgeDevControls;
+  private getRidgeDevControls?: () => RidgeDevControls | undefined;
+  private authoringPointerBound = false;
+  private lastAuthoringActive = false;
+  private lastAuthoringSelectionKey: string | null = null;
+  private authoringPointer: StageAuthoringPointerState = createIdleStageAuthoringPointerState();
   private ridgeSpawnPosition = { ...BRIDGE_TRACER_WORLD.spawn };
   private lastCameraZoom = RIDGE_DEFAULT_CAMERA_ZOOM;
+  private lastCompositionPlacementSignature = getStageCompositionPlacementSignature(BRIDGE_STAGE_SOURCE);
   private bridgePresentation: BridgeStagePresentationState = resolveBridgeStagePresentation('intro');
   private routeState: RidgeFirstPlayableRouteState = {
     activeAreaId: 'bridge',
@@ -89,7 +108,7 @@ export class RidgeScene extends Phaser.Scene {
     this.onClose = data.onClose ?? (() => {});
     this.isPaused = data.isPaused ?? false;
     this.resumePosition = data.resumePosition;
-    this.ridgeDevControls = import.meta.env.DEV ? data.ridgeDevControls : undefined;
+    this.getRidgeDevControls = import.meta.env.DEV ? data.getRidgeDevControls : undefined;
   }
 
   preload(): void {
@@ -111,8 +130,8 @@ export class RidgeScene extends Phaser.Scene {
 
   create(data: RidgeSceneStartData = {}): void {
     this.onClose = data.onClose ?? this.onClose;
-    this.ridgeDevControls = import.meta.env.DEV
-      ? data.ridgeDevControls ?? this.ridgeDevControls
+    this.getRidgeDevControls = import.meta.env.DEV
+      ? data.getRidgeDevControls ?? this.getRidgeDevControls
       : undefined;
     this.routeState = bridgeStore.getState().progress.ridge.firstPlayableRoute;
 
@@ -133,9 +152,10 @@ export class RidgeScene extends Phaser.Scene {
       ? createBridgeStageDebugOverlay(this)
       : undefined;
     this.syncBridgeRouteState();
-    this.createBridgeInteractions();
+    this.syncBridgeInteractionTargets(this.resolveCompositionSource());
     this.setPaused(this.isPaused);
     this.playerRuntime?.syncAppearance();
+    this.bindDevAuthoringPointer();
     this.syncDevRuntimeState();
   }
 
@@ -143,7 +163,6 @@ export class RidgeScene extends Phaser.Scene {
     this.applyDevControls();
 
     const playerUpdate = this.playerRuntime?.update(delta);
-    this.syncPlayerReadabilityHalo();
     if (!playerUpdate || playerUpdate.paused) {
       this.syncDevRuntimeState();
       return;
@@ -193,39 +212,28 @@ export class RidgeScene extends Phaser.Scene {
     this.player = playerRuntime.player;
     this.bridgePresentation = resolveBridgeStagePresentation(this.routeState.bridgeBeat);
     playerRuntime.setProgressRange(this.bridgePresentation.playerProgressRange);
-    this.createPlayerReadabilityHalo();
-  }
-
-  private createPlayerReadabilityHalo(): void {
-    this.playerReadabilityHalo?.destroy();
-    const halo = this.add.graphics().setDepth(29);
-    halo.fillStyle(0xf7f1df, 0.92);
-    halo.lineStyle(2, 0xffffff, 0.78);
-    halo.fillEllipse(0, 0, 58, 78);
-    halo.strokeEllipse(0, 0, 66, 86);
-    halo.lineStyle(1, 0x1f1f1d, 0.14);
-    halo.strokeEllipse(3, -2, 54, 72);
-    halo.lineBetween(-16, 24, 18, 20);
-    this.playerReadabilityHalo = halo;
-    this.syncPlayerReadabilityHalo();
   }
 
-  private syncPlayerReadabilityHalo(): void {
-    if (!this.player || !this.playerReadabilityHalo) return;
-    this.playerReadabilityHalo
-      .setPosition(this.player.x, this.player.y - 34)
-      .setScale(Math.abs(this.player.scaleX))
-      .setDepth(this.player.depth - 1);
-  }
+  private syncBridgeInteractionTargets(source: BridgeStageCompositionSource): void {
+    const nextTargets = createBridgeTracerInteractionTargets(this.routeState, source);
+    const canMutateTargets = this.interactionRuntime &&
+      this.bridgeInteractionTargets.length === nextTargets.length &&
+      this.bridgeInteractionTargets.every((target, index) => target.id === nextTargets[index]?.id);
+
+    if (!this.interactionRuntime || !canMutateTargets) {
+      this.bridgeInteractionTargets = nextTargets;
+      this.interactionRuntime = createInteriorInteractionRuntime<
+        BridgeTracerTargetId,
+        BridgeTracerEffect
+      >({
+        interactRadius: BRIDGE_TRACER_INTERACT_RADIUS,
+        targets: this.bridgeInteractionTargets
+      });
+      return;
+    }
 
-  private createBridgeInteractions(): void {
-    this.bridgeInteractionTargets = createBridgeTracerInteractionTargets(this.routeState);
-    this.interactionRuntime = createInteriorInteractionRuntime<
-      BridgeTracerTargetId,
-      BridgeTracerEffect
-    >({
-      interactRadius: BRIDGE_TRACER_INTERACT_RADIUS,
-      targets: this.bridgeInteractionTargets
+    nextTargets.forEach((nextTarget, index) => {
+      Object.assign(this.bridgeInteractionTargets[index]!, nextTarget);
     });
   }
 
@@ -236,7 +244,7 @@ export class RidgeScene extends Phaser.Scene {
         if (effect.nextBeat) {
           bridgeActions.setRidgeBridgeBeat(effect.nextBeat);
           this.syncBridgeRouteState();
-          this.createBridgeInteractions();
+          this.syncBridgeInteractionTargets(this.resolveCompositionSource());
         }
         return;
       case 'runToyCarTest':
@@ -246,7 +254,7 @@ export class RidgeScene extends Phaser.Scene {
         this.bridgeStage?.showDialogue(effect.lineIds, 7200);
         bridgeActions.triggerRidgeConcertHandoff();
         this.syncBridgeRouteState();
-        this.createBridgeInteractions();
+        this.syncBridgeInteractionTargets(this.resolveCompositionSource());
         return;
       default:
         assertNever(effect);
@@ -260,7 +268,7 @@ export class RidgeScene extends Phaser.Scene {
     this.bridgeStage?.runToyCarTest(effect.lineIds, () => {
       bridgeActions.setRidgeBridgeBeat('bridge_complete');
       this.syncBridgeRouteState();
-      this.createBridgeInteractions();
+      this.syncBridgeInteractionTargets(this.resolveCompositionSource());
     });
   }
 
@@ -272,12 +280,18 @@ export class RidgeScene extends Phaser.Scene {
     this.playerRuntime?.setProgressRange(this.bridgePresentation.playerProgressRange);
   }
 
+  private resolveRidgeDevControls(): RidgeDevControls | undefined {
+    if (!import.meta.env.DEV) return undefined;
+    return this.getRidgeDevControls?.();
+  }
+
   private resolveCameraZoom(): number {
-    return resolveRidgeDevCameraZoom(this.ridgeDevControls?.resolveCameraZoom?.());
+    return resolveRidgeDevCameraZoom(this.resolveRidgeDevControls()?.resolveCameraZoom?.());
   }
 
   private applyDevControls(): void {
-    if (!import.meta.env.DEV || !this.ridgeDevControls) return;
+    const ridgeDevControls = this.resolveRidgeDevControls();
+    if (!import.meta.env.DEV || !ridgeDevControls) return;
 
     const nextCameraZoom = this.resolveCameraZoom();
     if (nextCameraZoom !== this.lastCameraZoom) {
@@ -287,18 +301,18 @@ export class RidgeScene extends Phaser.Scene {
 
     if (!this.player) return;
 
-    const routeBeatRequest = this.ridgeDevControls.consumeRouteBeatRequest?.();
+    const routeBeatRequest = ridgeDevControls.consumeRouteBeatRequest?.();
     if (routeBeatRequest) {
       this.applyDevBridgeBeat(routeBeatRequest.bridgeBeat);
     }
 
-    const resetRequest = this.ridgeDevControls.consumeResetRequest?.();
+    const resetRequest = ridgeDevControls.consumeResetRequest?.();
     if (resetRequest) {
       this.movePlayerForDev(this.ridgeSpawnPosition);
       return;
     }
 
-    const request = this.ridgeDevControls.consumeTeleportRequest?.();
+    const request = ridgeDevControls.consumeTeleportRequest?.();
     if (!request) return;
 
     this.movePlayerForDev(resolveRidgeDevTeleportPosition(request));
@@ -311,17 +325,149 @@ export class RidgeScene extends Phaser.Scene {
       bridgeActions.setRidgeBridgeBeat(bridgeBeat as RidgeBridgeAreaBeatState);
     }
     this.syncBridgeRouteState();
-    this.createBridgeInteractions();
-    this.syncPlayerReadabilityHalo();
+    this.syncBridgeInteractionTargets(this.resolveCompositionSource());
   }
 
   private movePlayerForDev(position: { x: number; y: number }): void {
     this.playerRuntime?.moveToWorldPosition(position);
-    this.syncPlayerReadabilityHalo();
+  }
+
+  private bindDevAuthoringPointer(): void {
+    if (!import.meta.env.DEV || this.authoringPointerBound) return;
+
+    this.authoringPointerBound = true;
+
+    this.input.on('pointerdown', (pointer: Phaser.Input.Pointer) => {
+      const ridgeDevControls = this.resolveRidgeDevControls();
+      const authoring = ridgeDevControls?.resolveAuthoringState?.();
+      if (!authoring?.active) return;
+
+      const source = this.resolveCompositionSource();
+      const hit = hitTestStageAuthoringTargets(source, pointer.worldX, pointer.worldY);
+      const camera = this.cameras.main;
+
+      this.authoringPointer = beginStageAuthoringPointer({
+        hit,
+        offsetOnly: pointer.event?.shiftKey ?? false,
+        scrollX: camera.scrollX,
+        scrollY: camera.scrollY,
+        pointerX: pointer.x,
+        pointerY: pointer.y
+      });
+    });
+
+    this.input.on('pointermove', (pointer: Phaser.Input.Pointer) => {
+      if (this.authoringPointer.mode === 'idle') return;
+
+      const ridgeDevControls = this.resolveRidgeDevControls();
+      const authoring = ridgeDevControls?.resolveAuthoringState?.();
+      if (!authoring?.active) {
+        this.authoringPointer = createIdleStageAuthoringPointerState();
+        return;
+      }
+
+      const camera = this.cameras.main;
+      const step = advanceStageAuthoringPointer(this.authoringPointer, {
+        pointerX: pointer.x,
+        pointerY: pointer.y,
+        worldX: pointer.worldX,
+        worldY: pointer.worldY,
+        zoom: camera.zoom
+      });
+      this.authoringPointer = step.state;
+      this.publishAuthoringPointerIntents(ridgeDevControls, step.intents);
+      if (step.panScroll) {
+        camera.scrollX = step.panScroll.scrollX;
+        camera.scrollY = step.panScroll.scrollY;
+      }
+    });
+
+    this.input.on('pointerup', () => {
+      const ridgeDevControls = this.resolveRidgeDevControls();
+      const finished = finishStageAuthoringPointer(this.authoringPointer);
+      this.authoringPointer = finished.state;
+      this.publishAuthoringPointerIntents(ridgeDevControls, finished.intents);
+    });
+  }
+
+  private publishAuthoringPointerIntents(
+    ridgeDevControls: RidgeDevControls | undefined,
+    intents: readonly StageAuthoringPointerIntent[]
+  ): void {
+    intents.forEach((intent) => {
+      if (intent.kind === 'pick') {
+        ridgeDevControls?.publishAuthoringPick?.(intent.selection);
+        return;
+      }
+      ridgeDevControls?.publishAuthoringDrag?.({
+        selection: intent.selection,
+        worldX: intent.worldX,
+        worldY: intent.worldY,
+        offsetOnly: intent.offsetOnly
+      });
+    });
+  }
+
+  private syncAuthoringCamera(
+    authoring: RidgeDevAuthoringState | undefined,
+    source: BridgeStageCompositionSource
+  ): void {
+    const camera = this.cameras.main;
+    const active = authoring?.active ?? false;
+
+    if (active && !this.lastAuthoringActive) {
+      camera.stopFollow();
+    }
+
+    if (!active && this.lastAuthoringActive && this.player) {
+      camera.startFollow(this.player, true, 0.08, 0.08);
+      this.playerRuntime?.cameraRuntime?.refresh();
+      this.lastAuthoringSelectionKey = null;
+    }
+
+    this.lastAuthoringActive = active;
+    if (!active) return;
+    if (!authoring?.selection) {
+      this.lastAuthoringSelectionKey = null;
+      return;
+    }
+
+    const selectionKey = serializeStageAuthoringSelection(authoring.selection);
+    if (!selectionKey || selectionKey === this.lastAuthoringSelectionKey) return;
+
+    const target = resolveStageAuthoringTargetPoint(source, authoring.selection);
+    if (!isWorldPointInsideCameraView(camera.worldView, target)) {
+      camera.centerOn(target.x, target.y);
+    }
+    this.lastAuthoringSelectionKey = selectionKey;
+  }
+
+  private resolveCompositionSource(): BridgeStageCompositionSource {
+    return this.resolveRidgeDevControls()?.resolveCompositionSource?.() ?? BRIDGE_STAGE_SOURCE;
+  }
+
+  private syncCompositionSource(): void {
+    const source = this.resolveCompositionSource();
+    const placementSignature = getStageCompositionPlacementSignature(source);
+    if (placementSignature === this.lastCompositionPlacementSignature) return;
+
+    this.lastCompositionPlacementSignature = placementSignature;
+    this.playerRuntime?.setCompositionSource(source);
+    this.bridgeStage?.applyCompositionSource(source);
+    this.syncBridgeInteractionTargets(source);
   }
 
   private syncDevRuntimeState(): void {
-    if (!import.meta.env.DEV || !this.ridgeDevControls || !this.player) return;
+    const ridgeDevControls = this.resolveRidgeDevControls();
+    if (!import.meta.env.DEV || !ridgeDevControls || !this.player) return;
+    this.syncCompositionSource();
+
+    const authoring = ridgeDevControls.resolveAuthoringState?.();
+    this.playerRuntime?.setAuthoringFrozen(authoring?.active ?? false);
+
+    const compositionSource = this.resolveCompositionSource();
+    this.syncAuthoringCamera(authoring, compositionSource);
+
     const railSnapshot = this.playerRuntime?.getRailSnapshot();
     const body = this.player.body
       ? {
@@ -332,10 +478,16 @@ export class RidgeScene extends Phaser.Scene {
         }
       : undefined;
     const debugSettings = resolveRidgeDevDebugSettings(
-      this.ridgeDevControls.resolveDebugSettings?.()
+      ridgeDevControls.resolveDebugSettings?.()
     );
     this.bridgeDebugOverlay?.render({
-      source: BRIDGE_STAGE_SOURCE,
+      source: this.resolveCompositionSource(),
+      authoring: authoring
+        ? {
+            active: authoring.active,
+            selection: authoring.selection
+          }
+        : undefined,
       interactionTargets: this.bridgeInteractionTargets,
       player: {
         x: this.player.x,
@@ -345,7 +497,7 @@ export class RidgeScene extends Phaser.Scene {
       railProgress: railSnapshot?.progress,
       settings: debugSettings
     });
-    this.ridgeDevControls.publishPlayerSnapshot?.({
+    ridgeDevControls.publishPlayerSnapshot?.({
       x: this.player.x,
       y: this.player.y,
       railProgress: railSnapshot?.progress,
diff --git a/src/game/scenes/ridge/runtime/ridgeDevControls.ts b/src/game/scenes/ridge/runtime/ridgeDevControls.ts
index bfb05722..66d4e3b1 100644
--- a/src/game/scenes/ridge/runtime/ridgeDevControls.ts
+++ b/src/game/scenes/ridge/runtime/ridgeDevControls.ts
@@ -1,4 +1,6 @@
 import type { RidgeBridgeBeatState } from '@/game/bridge/store';
+import type { BridgeStageCompositionSource } from '../bridge/stageComposition';
+import type { StageAuthoringSelection } from '../bridge/stageAuthoring';
 
 export interface RidgeDevTeleportRequest {
   sequence: number;
@@ -40,12 +42,28 @@ export interface RidgeDevDebugSettings {
   showTraversalAssists: boolean;
 }
 
+export interface RidgeDevAuthoringState {
+  active: boolean;
+  selection: StageAuthoringSelection | null;
+}
+
+export interface RidgeDevAuthoringDragRequest {
+  selection: StageAuthoringSelection;
+  worldX: number;
+  worldY: number;
+  offsetOnly: boolean;
+}
+
 export interface RidgeDevControls {
   resolveCameraZoom?: () => number | undefined;
+  resolveCompositionSource?: () => BridgeStageCompositionSource | undefined;
   resolveDebugSettings?: () => Partial<RidgeDevDebugSettings> | undefined;
+  resolveAuthoringState?: () => RidgeDevAuthoringState | undefined;
   consumeRouteBeatRequest?: () => RidgeDevRouteBeatRequest | null;
   consumeResetRequest?: () => RidgeDevResetRequest | null;
   consumeTeleportRequest?: () => RidgeDevTeleportRequest | null;
+  publishAuthoringPick?: (selection: StageAuthoringSelection) => void;
+  publishAuthoringDrag?: (request: RidgeDevAuthoringDragRequest) => void;
   publishPlayerSnapshot?: (snapshot: RidgeDevPlayerSnapshot) => void;
 }
 
diff --git a/src/game/scenes/ridge/sceneContext.ts b/src/game/scenes/ridge/sceneContext.ts
index 4e4b7040..a58d799e 100644
--- a/src/game/scenes/ridge/sceneContext.ts
+++ b/src/game/scenes/ridge/sceneContext.ts
@@ -27,7 +27,7 @@ export function createRidgeSceneContext(
       onOpenOverlay: options.onOpenOverlay,
       isPaused: false,
       resumePosition: options.getResumePosition(),
-      ridgeDevControls: import.meta.env.DEV ? options.getDevControls?.() : undefined
+      getRidgeDevControls: import.meta.env.DEV ? options.getDevControls : undefined
     })
   };
 }
diff --git a/src/game/sharedSceneRuntime/input/sceneKeyboard.ts b/src/game/sharedSceneRuntime/input/sceneKeyboard.ts
new file mode 100644
index 00000000..284258d1
--- /dev/null
+++ b/src/game/sharedSceneRuntime/input/sceneKeyboard.ts
@@ -0,0 +1,40 @@
+import * as Phaser from 'phaser';
+import type { SceneInputKeys } from './readSceneInputCommands';
+
+function noOpKey(): Phaser.Input.Keyboard.Key {
+  return { isDown: false } as Phaser.Input.Keyboard.Key;
+}
+
+function noOpCursors(): Phaser.Types.Input.Keyboard.CursorKeys {
+  return {
+    left: noOpKey(),
+    right: noOpKey(),
+    up: noOpKey(),
+    shift: noOpKey(),
+    down: noOpKey(),
+    space: noOpKey()
+  } as Phaser.Types.Input.Keyboard.CursorKeys;
+}
+
+export function bindSideViewKeyboard(
+  keyboard: Phaser.Input.Keyboard.KeyboardPlugin | null | undefined,
+  options: { includeEscapeKey?: boolean } = {}
+): SceneInputKeys {
+  const bindings: SceneInputKeys = {
+    cursors: keyboard?.createCursorKeys() ?? noOpCursors(),
+    wasd: {
+      a: keyboard?.addKey(Phaser.Input.Keyboard.KeyCodes.A) ?? noOpKey(),
+      d: keyboard?.addKey(Phaser.Input.Keyboard.KeyCodes.D) ?? noOpKey(),
+      w: keyboard?.addKey(Phaser.Input.Keyboard.KeyCodes.W) ?? noOpKey(),
+      s: keyboard?.addKey(Phaser.Input.Keyboard.KeyCodes.S) ?? noOpKey()
+    },
+    interactKey: keyboard?.addKey(Phaser.Input.Keyboard.KeyCodes.E) ?? noOpKey(),
+    hKey: keyboard?.addKey(Phaser.Input.Keyboard.KeyCodes.H) ?? noOpKey()
+  };
+
+  if (options.includeEscapeKey) {
+    bindings.escapeKey = keyboard?.addKey(Phaser.Input.Keyboard.KeyCodes.ESC) ?? noOpKey();
+  }
+
+  return bindings;
+}
diff --git a/src/game/sharedSceneRuntime/player/SideViewPlayerRuntime.ts b/src/game/sharedSceneRuntime/player/SideViewPlayerRuntime.ts
index 1173e2b8..d9c66983 100644
--- a/src/game/sharedSceneRuntime/player/SideViewPlayerRuntime.ts
+++ b/src/game/sharedSceneRuntime/player/SideViewPlayerRuntime.ts
@@ -7,6 +7,8 @@ import {
   type PlayerStepResult
 } from '../../core/player/PlayerController';
 import type { ResumeSnapshot } from '../../sceneLifecycle/types';
+import { bindSideViewKeyboard } from '../input/sceneKeyboard';
+import type { SceneInputKeys } from '../input/readSceneInputCommands';
 import { readPlayerSceneStep } from '../input/scenePlayerInput';
 import { setSceneKeyboardPaused } from '../sceneKeyboardPause';
 import {
@@ -79,21 +81,6 @@ const DEFAULT_TEXTURE_KEY = 'player_idle';
 const WALK_BOB_PERIOD_MS = 100;
 const WALK_BOB_ANGLE_DEGREES = 5;
 
-function noOpKey(): Phaser.Input.Keyboard.Key {
-  return { isDown: false } as Phaser.Input.Keyboard.Key;
-}
-
-function noOpCursors(): Phaser.Types.Input.Keyboard.CursorKeys {
-  return {
-    left: noOpKey(),
-    right: noOpKey(),
-    up: noOpKey(),
-    shift: noOpKey(),
-    down: noOpKey(),
-    space: noOpKey()
-  } as Phaser.Types.Input.Keyboard.CursorKeys;
-}
-
 function resolveStartPosition(options: SideViewPlayerRuntimeOptions): ResumeSnapshot {
   const raw = options.resumePosition ?? options.start;
   if (!options.resumeClamp) return raw;
@@ -110,16 +97,7 @@ class PhaserSideViewPlayerRuntime implements SideViewPlayerRuntime {
 
   private readonly options: SideViewPlayerRuntimeOptions;
   private readonly inputFrame = createInputCommandFrame();
-  private readonly cursors: Phaser.Types.Input.Keyboard.CursorKeys;
-  private readonly wasd: {
-    a: Phaser.Input.Keyboard.Key;
-    d: Phaser.Input.Keyboard.Key;
-    w: Phaser.Input.Keyboard.Key;
-    s: Phaser.Input.Keyboard.Key;
-  };
-  private readonly interactKey: Phaser.Input.Keyboard.Key;
-  private readonly hKey: Phaser.Input.Keyboard.Key;
-  private readonly escapeKey?: Phaser.Input.Keyboard.Key;
+  private readonly inputKeys: SceneInputKeys;
   private isPaused = false;
   private hasGlassesSprite: boolean | null = null;
 
@@ -140,19 +118,9 @@ class PhaserSideViewPlayerRuntime implements SideViewPlayerRuntime {
     this.controller.mount(this.player);
     this.cameraRuntime = createPlayerCameraRuntime(options, this.player);
 
-    const keyboard = scene.input.keyboard;
-    this.cursors = keyboard?.createCursorKeys() ?? noOpCursors();
-    this.wasd = {
-      a: keyboard?.addKey(Phaser.Input.Keyboard.KeyCodes.A) ?? noOpKey(),
-      d: keyboard?.addKey(Phaser.Input.Keyboard.KeyCodes.D) ?? noOpKey(),
-      w: keyboard?.addKey(Phaser.Input.Keyboard.KeyCodes.W) ?? noOpKey(),
-      s: keyboard?.addKey(Phaser.Input.Keyboard.KeyCodes.S) ?? noOpKey()
-    };
-    this.interactKey = keyboard?.addKey(Phaser.Input.Keyboard.KeyCodes.E) ?? noOpKey();
-    this.hKey = keyboard?.addKey(Phaser.Input.Keyboard.KeyCodes.H) ?? noOpKey();
-    this.escapeKey = options.input.includeEscapeKey
-      ? keyboard?.addKey(Phaser.Input.Keyboard.KeyCodes.ESC) ?? noOpKey()
-      : undefined;
+    this.inputKeys = bindSideViewKeyboard(scene.input.keyboard, {
+      includeEscapeKey: options.input.includeEscapeKey
+    });
   }
 
   setPaused(paused: boolean): void {
@@ -180,11 +148,7 @@ class PhaserSideViewPlayerRuntime implements SideViewPlayerRuntime {
     const { commands, step } = readPlayerSceneStep({
       frame: this.inputFrame,
       controller: this.controller,
-      cursors: this.cursors,
-      wasd: this.wasd,
-      interactKey: this.interactKey,
-      hKey: this.hKey,
-      escapeKey: this.escapeKey,
+      ...this.inputKeys,
       allowJump: this.options.input.allowJump,
       allowSprint: this.options.input.allowSprint
     });