@@ -9,10 +9,7 @@ import { shouldIgnoreHistoryShortcut } from "../utils/studioHelpers";
 import { canSplitElement } from "../utils/timelineElementSplit";
 import { trackStudioEvent } from "../utils/studioTelemetry";
 import { STUDIO_PLAIN_KEYS } from "../player/components/studioShortcuts";
-import {
-  canZoomToSelectedClips,
-  zoomTimelineToSelectedClips,
-} from "../player/components/timelineZoomInput";
+import { zoomTimelineToSelectedClips } from "../player/components/timelineZoomInput";
 import { openAudioGainDialog } from "../player/components/audioGainDialogStore";
 import type { LinkShortcutCallbacks } from "./linkShortcuts";
 
@@ -161,9 +158,8 @@ export function dispatchModifierKey(
 export function dispatchPlainKey(event: KeyboardEvent, key: string, cb: HotkeyCallbacks): void {
   if (ownsPlainKeys(event.target)) return;
   if (key === STUDIO_PLAIN_KEYS.zoomSelection && !event.shiftKey && !event.altKey) {
-    if (!canZoomToSelectedClips(usePlayerStore.getState())) return;
+    if (!zoomTimelineToSelectedClips()) return;
     event.preventDefault();
-    zoomTimelineToSelectedClips();
     return;
   }
 
 
@@ -7,6 +7,10 @@ import { clearAutomationClipboard, copyRange } from "../player/components/automa
 import { VOLUME_RANGE } from "@hyperframes/core/audio-automation";
 import type { TimelineElement } from "../player/store/timelineElement";
 import { useAudioGainDialogStore } from "../player/components/audioGainDialogStore";
+import {
+  cancelTimelineZoom,
+  registerTimelineZoomViewport,
+} from "../player/components/timelineZoomInput";
 
 /** Minimal valid fixture — TimelineElement only requires these five fields. */
 const bgmElement: TimelineElement = {
@@ -501,6 +505,17 @@ describe("dispatchPlainKey — G opens Audio Gain", () => {
   });
 
   it("Z zooms when a clip is selected and does not take the key otherwise", () => {
+    const scroll = document.createElement("div");
+    Object.defineProperties(scroll, {
+      clientWidth: { value: 1080 },
+      scrollWidth: { value: 1080 },
+      scrollLeft: { value: 0, writable: true },
+    });
+    const unregister = registerTimelineZoomViewport({
+      scroll,
+      contentOrigin: 32,
+      publishScroll: () => {},
+    });
     usePlayerStore.setState({
       elements: [bgmElement],
       selectedElementId: "bgm",
@@ -509,6 +524,28 @@ describe("dispatchPlainKey — G opens Audio Gain", () => {
     const event = press("z");
     dispatchPlainKey(event, "z", callbacks());
     expect(event.defaultPrevented).toBe(true);
+    cancelTimelineZoom();
+    unregister();
+
+    const unmounted = press("z");
+    dispatchPlainKey(unmounted, "z", callbacks());
+    expect(unmounted.defaultPrevented).toBe(false);
+
+    const collapsedScroll = document.createElement("div");
+    Object.defineProperties(collapsedScroll, {
+      clientWidth: { value: 32 },
+      scrollWidth: { value: 32 },
+      scrollLeft: { value: 0, writable: true },
+    });
+    const unregisterCollapsed = registerTimelineZoomViewport({
+      scroll: collapsedScroll,
+      contentOrigin: 32,
+      publishScroll: () => {},
+    });
+    const collapsed = press("z");
+    dispatchPlainKey(collapsed, "z", callbacks());
+    expect(collapsed.defaultPrevented).toBe(false);
+    unregisterCollapsed();
 
     usePlayerStore.setState({ selectedElementId: null, selectedElementIds: new Set() });
     const idle = press("z");
 
@@ -470,4 +470,17 @@ describe("zoomTimelineStep", () => {
     // The range's middle, 56 + 1000 / 2, is the playhead.
     expect(laidOutX(60)).toBeCloseTo(556);
   });
+
+  it("still doubles the scale when the timeline is no wider than its headers", () => {
+    const scroll = document.createElement("div");
+    Object.defineProperties(scroll, {
+      clientWidth: { value: 32 },
+      scrollWidth: { value: 32 },
+      scrollLeft: { value: 0, writable: true },
+    });
+    unregisterViewport = registerTimelineZoomViewport({ scroll, contentOrigin: 32, publishScroll });
+    zoomTimelineStep("in");
+    vi.advanceTimersByTime(150);
+    expect(usePlayerStore.getState().timelinePps).toBeCloseTo(20);
+  });
 });
@@ -458,7 +458,8 @@ export function zoomTimelineStep(direction: "in" | "out"): void {
     fitPps,
   );
   const view = viewport;
-  if (!view || !(fitPps > 0)) {
+  // A collapsed timeline has no track to fit a range into, so the step still changes the percent.
+  if (!view || !(fitPps > 0) || !(view.scroll.clientWidth > view.contentOrigin)) {
     requestTimelineZoom(nextPercent);
     return;
   }
@@ -497,14 +498,10 @@ export function canZoomToSelectedClips(state: {
 export function zoomTimelineToSelectedClips(): boolean {
   const view = viewport;
   const state = usePlayerStore.getState();
-  if (!view || !(state.timelineFitPps > 0) || !canZoomToSelectedClips(state)) return false;
-  const zoom = zoomToSelectedClips({
-    clips: selectedClipSpans(state),
-    viewportWidth: view.scroll.clientWidth,
-    contentOrigin: view.contentOrigin,
-    fitPixelsPerSecond: state.timelineFitPps,
-  });
-  if (!zoom) return false;
-  void zoomTimelineToRange(zoom.start, zoom.end);
+  if (!view || !(state.timelineFitPps > 0) || !(view.scroll.clientWidth > view.contentOrigin))
+    return false;
+  const span = positiveClipSpan(selectedClipSpans(state));
+  if (!span) return false;
+  void zoomTimelineToRange(span.start, span.end);
   return true;
 }