diff --git a/src/providers/TourProvider/TourContent.tsx b/src/providers/TourProvider/TourContent.tsx
index bcf8f23c6..a6a543efe 100644
--- a/src/providers/TourProvider/TourContent.tsx
+++ b/src/providers/TourProvider/TourContent.tsx
@@ -2,7 +2,7 @@ import { Fragment, type ReactNode } from "react";
 
 const INLINE_TOKEN = /(\*\*[^*]+\*\*|_[^_]+_|`[^`]+`)/g;
 
-function renderInline(text: string): ReactNode[] {
+export function renderInline(text: string): ReactNode[] {
   return text.split(INLINE_TOKEN).map((part, index) => {
     if (part.startsWith("**") && part.endsWith("**")) {
       return <strong key={index}>{part.slice(2, -2)}</strong>;
diff --git a/src/providers/TourProvider/TourNavigation.test.tsx b/src/providers/TourProvider/TourNavigation.test.tsx
new file mode 100644
index 000000000..143f8e4cc
--- /dev/null
+++ b/src/providers/TourProvider/TourNavigation.test.tsx
@@ -0,0 +1,232 @@
+import type { StepType } from "@reactour/tour";
+import { act, render, screen } from "@testing-library/react";
+import type { PropsWithChildren } from "react";
+import { useEffect } from "react";
+import { afterEach, beforeEach, describe, expect, it, vi } from "vitest";
+
+import {
+  renderNextButton,
+  TourAutoAdvance,
+  TourStepChecklist,
+} from "./TourNavigation";
+import { TourProgressProvider, useTourProgress } from "./TourProgressContext";
+
+type TourState = {
+  isOpen: boolean;
+  currentStep: number;
+  steps: unknown[];
+  setCurrentStep: ReturnType<typeof vi.fn>;
+};
+
+let tourState: TourState;
+
+vi.mock("@reactour/tour", () => ({
+  useTour: () => tourState,
+}));
+
+function makeStep(overrides: Record<string, unknown>): StepType {
+  return {
+    selector: "body",
+    content: "step",
+    ...overrides,
+  } as unknown as StepType;
+}
+
+function MarkComplete({ step }: { step: number }) {
+  const { markStepComplete } = useTourProgress();
+  useEffect(() => {
+    markStepComplete(step);
+  }, [step, markStepComplete]);
+  return null;
+}
+
+type NavButtonProps = PropsWithChildren<{
+  onClick?: () => void;
+  kind?: "next" | "prev";
+  hideArrow?: boolean;
+  disabled?: boolean;
+}>;
+
+function FakeButton({ onClick, disabled, children }: NavButtonProps) {
+  return (
+    <button data-testid="next" onClick={onClick} disabled={disabled}>
+      {children ?? "next"}
+    </button>
+  );
+}
+
+function renderNext(opts: {
+  steps: StepType[];
+  currentStep: number;
+  complete?: number;
+}) {
+  const props = {
+    Button: FakeButton,
+    setCurrentStep: vi.fn(),
+    stepsLength: opts.steps.length,
+    currentStep: opts.currentStep,
+    setIsOpen: vi.fn(),
+    steps: opts.steps,
+  };
+  return render(
+    <TourProgressProvider>
+      {opts.complete !== undefined && <MarkComplete step={opts.complete} />}
+      {renderNextButton(props as Parameters<typeof renderNextButton>[0])}
+    </TourProgressProvider>,
+  );
+}
+
+describe("TourStepChecklist", () => {
+  it("renders a labeled row for an interactive step", () => {
+    render(
+      <TourProgressProvider>
+        <TourStepChecklist
+          step={makeStep({ interaction: "select-task" })}
+          stepIndex={0}
+        />
+      </TourProgressProvider>,
+    );
+    expect(
+      screen.getByText("Complete the highlighted action to continue"),
+    ).toBeInTheDocument();
+  });
+
+  it("renders nothing for a non-interactive step", () => {
+    const { container } = render(
+      <TourProgressProvider>
+        <TourStepChecklist step={makeStep({})} stepIndex={0} />
+      </TourProgressProvider>,
+    );
+    expect(container).toBeEmptyDOMElement();
+  });
+
+  it("strikes through the label once the step is complete", () => {
+    render(
+      <TourProgressProvider>
+        <MarkComplete step={1} />
+        <TourStepChecklist
+          step={makeStep({ interaction: "undock-window" })}
+          stepIndex={1}
+        />
+      </TourProgressProvider>,
+    );
+    const label = screen.getByText(
+      "Complete the highlighted action to continue",
+    );
+    expect(label.className).toContain("line-through");
+  });
+});
+
+describe("renderNextButton gating", () => {
+  it("disables Next on an interactive step that is not complete", () => {
+    renderNext({
+      steps: [makeStep({ interaction: "select-task" }), makeStep({})],
+      currentStep: 0,
+    });
+    expect(screen.getByTestId("next")).toBeDisabled();
+  });
+
+  it("enables Next once the interactive step is complete", () => {
+    renderNext({
+      steps: [makeStep({ interaction: "select-task" }), makeStep({})],
+      currentStep: 0,
+      complete: 0,
+    });
+    expect(screen.getByTestId("next")).toBeEnabled();
+  });
+
+  it("enables Next on a non-interactive step", () => {
+    renderNext({
+      steps: [makeStep({}), makeStep({})],
+      currentStep: 0,
+    });
+    expect(screen.getByTestId("next")).toBeEnabled();
+  });
+
+  it("hides the Next button on the last step", () => {
+    const { container } = renderNext({
+      steps: [makeStep({}), makeStep({ interaction: "select-task" })],
+      currentStep: 1,
+    });
+    expect(container.querySelector("[aria-hidden]")).not.toBeNull();
+  });
+});
+
+const progress: { markComplete: (step: number) => void } = {
+  markComplete: () => undefined,
+};
+function CaptureProgress() {
+  const { markStepComplete } = useTourProgress();
+  useEffect(() => {
+    progress.markComplete = markStepComplete;
+  }, [markStepComplete]);
+  return null;
+}
+
+function renderController(currentStep: number, stepCount = 3) {
+  tourState = {
+    isOpen: true,
+    currentStep,
+    steps: Array.from({ length: stepCount }, () => ({})),
+    setCurrentStep: vi.fn(),
+  };
+  const tree = (
+    <TourProgressProvider>
+      <CaptureProgress />
+      <TourAutoAdvance />
+    </TourProgressProvider>
+  );
+  const result = render(tree);
+  const navigateTo = (step: number) => {
+    tourState = { ...tourState, currentStep: step };
+    result.rerender(tree);
+  };
+  return { navigateTo };
+}
+
+describe("TourAutoAdvance", () => {
+  beforeEach(() => vi.useFakeTimers());
+  afterEach(() => {
+    vi.useRealTimers();
+    vi.clearAllMocks();
+  });
+
+  it("auto-advances after a fresh completion, once the delay elapses", () => {
+    renderController(0);
+    act(() => progress.markComplete(0));
+
+    act(() => vi.advanceTimersByTime(500));
+    expect(tourState.setCurrentStep).not.toHaveBeenCalled();
+
+    act(() => vi.advanceTimersByTime(400));
+    expect(tourState.setCurrentStep).toHaveBeenCalledTimes(1);
+  });
+
+  it("does not auto-advance a step that has not been completed", () => {
+    renderController(0);
+    act(() => vi.advanceTimersByTime(2000));
+    expect(tourState.setCurrentStep).not.toHaveBeenCalled();
+  });
+
+  it("does not auto-advance the last step", () => {
+    renderController(2, 3);
+    act(() => progress.markComplete(2));
+    act(() => vi.advanceTimersByTime(2000));
+    expect(tourState.setCurrentStep).not.toHaveBeenCalled();
+  });
+
+  it("does not auto-advance a step already complete on arrival (revisit)", () => {
+    const { navigateTo } = renderController(0);
+
+    act(() => progress.markComplete(0));
+    act(() => vi.advanceTimersByTime(900));
+    expect(tourState.setCurrentStep).toHaveBeenCalledTimes(1);
+    tourState.setCurrentStep.mockClear();
+
+    // Navigate forward, then back to step 0 (which is already complete).
+    act(() => navigateTo(1));
+    act(() => navigateTo(0));
+    act(() => vi.advanceTimersByTime(2000));
+    expect(tourState.setCurrentStep).not.toHaveBeenCalled();
+  });
+});
diff --git a/src/providers/TourProvider/TourNavigation.tsx b/src/providers/TourProvider/TourNavigation.tsx
new file mode 100644
index 000000000..f8a319f28
--- /dev/null
+++ b/src/providers/TourProvider/TourNavigation.tsx
@@ -0,0 +1,299 @@
+import { type ProviderProps, type StepType, useTour } from "@reactour/tour";
+import type { FC, PropsWithChildren, ReactNode } from "react";
+import { useEffect, useRef } from "react";
+
+import { Badge } from "@/components/ui/badge";
+import { Button } from "@/components/ui/button";
+import { Icon } from "@/components/ui/icon";
+import { BlockStack, InlineStack } from "@/components/ui/layout";
+import { Text } from "@/components/ui/typography";
+import { cn } from "@/lib/utils";
+
+import { tourActionLabel } from "./tourActionLabels";
+import { renderInline } from "./TourContent";
+import { useTourProgress } from "./TourProgressContext";
+
+const tourVisitedMax = { value: 0 };
+function recordTourVisited(step: number): void {
+  if (step > tourVisitedMax.value) tourVisitedMax.value = step;
+}
+function getTourVisitedMax(): number {
+  return tourVisitedMax.value;
+}
+export function resetTourVisited(): void {
+  tourVisitedMax.value = 0;
+}
+
+type NextButtonProps = Parameters<NonNullable<ProviderProps["nextButton"]>>[0];
+
+function GatedNextButton(props: NextButtonProps) {
+  const { currentStep, stepsLength, setCurrentStep, steps } = props;
+  const { isStepComplete } = useTourProgress();
+
+  // Runtime Button is always TourNavigation's NavButton (which accepts
+  // `disabled`); reactour's narrower type omits it.
+  const Button = props.Button as FC<PropsWithChildren<NavButtonProps>>;
+
+  const hiddenPlaceholder = (
+    <span aria-hidden style={{ visibility: "hidden", pointerEvents: "none" }}>
+      <Button onClick={() => undefined} kind="next" />
+    </span>
+  );
+
+  const isLastStep = currentStep === stepsLength - 1;
+  if (isLastStep) {
+    return hiddenPlaceholder;
+  }
+
+  const step = steps?.[currentStep];
+  if (!step) {
+    return hiddenPlaceholder;
+  }
+
+  const isRevisit = currentStep < getTourVisitedMax();
+  const advance = () =>
+    setCurrentStep((s: number) => Math.min(s + 1, stepsLength - 1));
+
+  const isInteractive = "interaction" in step && Boolean(step.interaction);
+  const disabled = isInteractive && !isStepComplete(currentStep);
+
+  if (isRevisit) {
+    return <Button onClick={advance} kind="next" disabled={disabled} />;
+  }
+
+  return (
+    <Button onClick={advance} kind="next" hideArrow disabled={disabled}>
+      Next
+    </Button>
+  );
+}
+
+export function renderNextButton(props: NextButtonProps) {
+  return <GatedNextButton {...props} />;
+}
+
+type ComponentsProp = NonNullable<ProviderProps["components"]>;
+type NavigationProps = React.ComponentProps<
+  NonNullable<ComponentsProp["Navigation"]>
+>;
+
+type NavButtonProps = {
+  onClick?: () => void;
+  kind?: "next" | "prev";
+  hideArrow?: boolean;
+  disabled?: boolean;
+};
+
+type ChecklistStep = StepType & {
+  interaction?: string;
+  targetTaskName?: string;
+  targetWindowName?: string;
+  targetFolderName?: string;
+  targetSearchTerm?: string;
+  targetArgumentName?: string;
+  targetMinCount?: number;
+};
+
+export function TourStepChecklist({
+  step,
+  stepIndex,
+}: {
+  step: StepType | undefined;
+  stepIndex: number;
+}) {
+  const { isStepComplete } = useTourProgress();
+  const interactiveStep = step as ChecklistStep | undefined;
+  if (!interactiveStep?.interaction) return null;
+
+  const complete = isStepComplete(stepIndex);
+  return (
+    <InlineStack
+      gap="2"
+      blockAlign="center"
+      className="rounded-md bg-slate-50 px-3 py-2"
+    >
+      <Icon
+        key={complete ? "complete" : "pending"}
+        name={complete ? "CircleCheck" : "Circle"}
+        size="sm"
+        className={cn(
+          "transition-colors",
+          complete
+            ? "text-green-600 animate-in zoom-in-50 duration-300"
+            : "text-zinc-400",
+        )}
+      />
+      <Text
+        size="sm"
+        className={cn(
+          "transition-colors",
+          complete && "text-zinc-500 line-through",
+        )}
+      >
+        {renderInline(tourActionLabel(interactiveStep))}
+      </Text>
+    </InlineStack>
+  );
+}
+
+export function TourNavigation(props: NavigationProps) {
+  const {
+    setCurrentStep,
+    currentStep,
+    steps,
+    nextButton,
+    prevButton,
+    setIsOpen,
+    hideButtons,
+    hideDots,
+    disableAll,
+    rtl,
+  } = props;
+
+  const stepsLength = steps.length;
+
+  recordTourVisited(currentStep);
+  const visited = getTourVisitedMax();
+
+  const NavButton: FC<PropsWithChildren<NavButtonProps>> = ({
+    onClick,
+    kind = "next",
+    hideArrow,
+    disabled,
+    children,
+  }) => {
+    const baseDisabled =
+      kind === "next" ? stepsLength - 1 === currentStep : currentStep === 0;
+    const isDisabled = disableAll ? true : baseDisabled || !!disabled;
+    const handleClick = () => {
+      if (isDisabled) return;
+      if (onClick) onClick();
+      else if (kind === "next")
+        setCurrentStep(Math.min(currentStep + 1, stepsLength - 1));
+      else setCurrentStep(Math.max(currentStep - 1, 0));
+    };
+    const inverted = rtl ? kind === "prev" : kind === "next";
+    return (
+      <Button
+        variant="ghost"
+        size={children ? "sm" : "icon"}
+        onClick={handleClick}
+        disabled={isDisabled}
+        aria-label={`Go to ${kind} step`}
+      >
+        {!hideArrow ? (
+          <Icon name={inverted ? "ChevronRight" : "ChevronLeft"} />
+        ) : null}
+        {children}
+      </Button>
+    );
+  };
+
+  const btnCtx = {
+    Button: NavButton,
+    setCurrentStep,
+    currentStep,
+    stepsLength,
+    setIsOpen,
+    steps,
+  };
+
+  const renderPrev: ReactNode = !hideButtons ? (
+    typeof prevButton === "function" ? (
+      prevButton(btnCtx)
+    ) : (
+      <NavButton kind="prev" />
+    )
+  ) : null;
+
+  const renderNext: ReactNode = !hideButtons ? (
+    typeof nextButton === "function" ? (
+      nextButton(btnCtx)
+    ) : (
+      <NavButton kind="next" />
+    )
+  ) : null;
+
+  return (
+    <BlockStack gap="3" align="stretch" className="mt-6">
+      <TourStepChecklist step={steps[currentStep]} stepIndex={currentStep} />
+      <div
+        dir={rtl ? "rtl" : "ltr"}
+        className="flex flex-row items-center justify-between"
+      >
+        {renderPrev}
+        {!hideDots ? (
+          <div
+            aria-hidden
+            className="flex flex-row items-center justify-between flex-nowrap"
+          >
+            {Array.from({ length: stepsLength }, (_, i) => i).map((index) => {
+              const isCurrent = index === currentStep;
+              const isVisited = index <= visited && !isCurrent;
+              return (
+                <Badge
+                  key={`tour-dot-${index}`}
+                  variant="dot"
+                  className={cn(
+                    "m-1 transition-all",
+                    isCurrent && "text-blue-500 scale-125",
+                    isVisited && "text-blue-300",
+                    !isCurrent && !isVisited && "text-zinc-300",
+                  )}
+                />
+              );
+            })}
+          </div>
+        ) : null}
+        {renderNext}
+      </div>
+    </BlockStack>
+  );
+}
+
+const AUTO_ADVANCE_DELAY_MS = 800;
+
+export function TourAutoAdvance() {
+  const { isOpen, currentStep, steps, setCurrentStep } = useTour();
+  const { completedSteps, isStepComplete } = useTourProgress();
+
+  const armedStepRef = useRef<number | null>(null);
+  const visitedStepRef = useRef<number | null>(null);
+
+  useEffect(() => {
+    if (!isOpen) {
+      visitedStepRef.current = null;
+      armedStepRef.current = null;
+      return undefined;
+    }
+
+    // On arrival at a step, auto-advance only if it isn't already complete.
+    if (visitedStepRef.current !== currentStep) {
+      visitedStepRef.current = currentStep;
+      armedStepRef.current = isStepComplete(currentStep) ? null : currentStep;
+    }
+
+    const isLastStep = currentStep >= steps.length - 1;
+    if (
+      armedStepRef.current !== currentStep ||
+      !isStepComplete(currentStep) ||
+      isLastStep
+    ) {
+      return undefined;
+    }
+
+    const timer = setTimeout(() => {
+      setCurrentStep((s: number) => Math.min(s + 1, steps.length - 1));
+    }, AUTO_ADVANCE_DELAY_MS);
+    return () => clearTimeout(timer);
+  }, [
+    isOpen,
+    currentStep,
+    completedSteps,
+    isStepComplete,
+    steps,
+    setCurrentStep,
+  ]);
+
+  return null;
+}
diff --git a/src/providers/TourProvider/TourPopover.tsx b/src/providers/TourProvider/TourPopover.tsx
index c20c0f598..284d918a2 100644
--- a/src/providers/TourProvider/TourPopover.tsx
+++ b/src/providers/TourProvider/TourPopover.tsx
@@ -1,4 +1,4 @@
-import { type ProviderProps, useTour } from "@reactour/tour";
+import { useTour } from "@reactour/tour";
 import { useNavigate } from "@tanstack/react-router";
 import { useEffect } from "react";
 
@@ -8,8 +8,15 @@ import { BlockStack } from "@/components/ui/layout";
 import { APP_ROUTES } from "@/routes/router";
 import { tracking } from "@/utils/tracking";
 
+import { resetTourVisited } from "./TourNavigation";
+import { useTourProgress } from "./TourProgressContext";
+
 // Matches the step-number badge's ≈13px outside offset plus a small margin.
 const POPOVER_VIEWPORT_MARGIN = 16;
+// Popover padding (40) + prev icon button (~32) + "Next" text button (~60) + buffer.
+const POPOVER_NAV_BASE_WIDTH = 140;
+const POPOVER_DOT_WIDTH = 16;
+const POPOVER_DEFAULT_MAX_WIDTH = 420;
 
 export const POPOVER_STYLES = {
   popover: (base: object) => ({
@@ -17,7 +24,7 @@ export const POPOVER_STYLES = {
     borderRadius: "0.75rem",
     padding: "1.25rem",
     boxShadow: "0 10px 30px rgba(0,0,0,0.12)",
-    maxWidth: "420px",
+    maxWidth: `${POPOVER_DEFAULT_MAX_WIDTH}px`,
   }),
   maskWrapper: (base: object) => ({
     ...base,
@@ -88,8 +95,6 @@ export function computeDefaultPopoverPosition(
   return "bottom";
 }
 
-type NextButtonProps = Parameters<NonNullable<ProviderProps["nextButton"]>>[0];
-
 export function TourCompletionActions() {
   const navigate = useNavigate();
   const { setIsOpen } = useTour();
@@ -114,40 +119,6 @@ export function TourCompletionActions() {
   );
 }
 
-export function renderNextButton(props: NextButtonProps) {
-  const { Button, currentStep, stepsLength, setCurrentStep, steps } = props;
-
-  const hiddenPlaceholder = (
-    <span aria-hidden style={{ visibility: "hidden", pointerEvents: "none" }}>
-      <Button onClick={() => undefined} kind="next" />
-    </span>
-  );
-
-  const isLastStep = currentStep === stepsLength - 1;
-  if (isLastStep) {
-    return hiddenPlaceholder;
-  }
-
-  const step = steps?.[currentStep];
-  if (!step) {
-    return hiddenPlaceholder;
-  }
-
-  // Interaction steps advance via the prompted action, not a Next click.
-  if ("interaction" in step && step.interaction) {
-    return hiddenPlaceholder;
-  }
-
-  return (
-    <Button
-      onClick={() =>
-        setCurrentStep((step: number) => Math.min(step + 1, stepsLength - 1))
-      }
-      kind="next"
-    />
-  );
-}
-
 const TRANSLATE_PATTERN = /translate\(([\d.-]+)px,\s*([\d.-]+)px\)/;
 
 function clampPopoverElement(el: HTMLElement): void {
@@ -170,8 +141,20 @@ function clampPopoverElement(el: HTMLElement): void {
   }
 }
 
+// Reactour has no viewport-padding setting and lets the popover snap flush to
+// edges, which clips our step-number badge. We observe its inline transform
+// and clamp it to stay POPOVER_VIEWPORT_MARGIN inside the viewport.
 export function PopoverClampBridge() {
-  const { isOpen } = useTour();
+  const { isOpen, steps } = useTour();
+  const { reset: resetTourProgress } = useTourProgress();
+  const stepCount = steps?.length ?? 0;
+
+  useEffect(() => {
+    if (isOpen) {
+      resetTourVisited();
+      resetTourProgress();
+    }
+  }, [isOpen, resetTourProgress]);
 
   useEffect(() => {
     if (!isOpen) return undefined;
@@ -179,7 +162,15 @@ export function PopoverClampBridge() {
     let styleObserver: MutationObserver | null = null;
     let findObserver: MutationObserver | null = null;
 
+    const applyMinWidth = (el: HTMLElement) => {
+      const required = POPOVER_NAV_BASE_WIDTH + stepCount * POPOVER_DOT_WIDTH;
+      const width = Math.max(POPOVER_DEFAULT_MAX_WIDTH, required);
+      el.style.minWidth = `${width}px`;
+      el.style.maxWidth = `${width}px`;
+    };
+
     const observe = (el: HTMLElement) => {
+      applyMinWidth(el);
       styleObserver = new MutationObserver(() => clampPopoverElement(el));
       styleObserver.observe(el, {
         attributes: true,
@@ -210,7 +201,7 @@ export function PopoverClampBridge() {
       styleObserver?.disconnect();
       findObserver?.disconnect();
     };
-  }, [isOpen]);
+  }, [isOpen, stepCount]);
 
   return null;
 }
diff --git a/src/providers/TourProvider/TourProgressContext.test.tsx b/src/providers/TourProvider/TourProgressContext.test.tsx
new file mode 100644
index 000000000..f7a7ab1c8
--- /dev/null
+++ b/src/providers/TourProvider/TourProgressContext.test.tsx
@@ -0,0 +1,40 @@
+import { act, renderHook } from "@testing-library/react";
+import type { ReactNode } from "react";
+import { describe, expect, it } from "vitest";
+
+import { TourProgressProvider, useTourProgress } from "./TourProgressContext";
+
+const wrapper = ({ children }: { children: ReactNode }) => (
+  <TourProgressProvider>{children}</TourProgressProvider>
+);
+
+describe("TourProgressContext", () => {
+  it("marks a step complete and reflects it in isStepComplete", () => {
+    const { result } = renderHook(() => useTourProgress(), { wrapper });
+
+    expect(result.current.isStepComplete(2)).toBe(false);
+    act(() => result.current.markStepComplete(2));
+    expect(result.current.isStepComplete(2)).toBe(true);
+    expect(result.current.completedSteps.has(2)).toBe(true);
+  });
+
+  it("reset clears all completed steps", () => {
+    const { result } = renderHook(() => useTourProgress(), { wrapper });
+
+    act(() => {
+      result.current.markStepComplete(0);
+      result.current.markStepComplete(1);
+    });
+    expect(result.current.completedSteps.size).toBe(2);
+
+    act(() => result.current.reset());
+    expect(result.current.completedSteps.size).toBe(0);
+    expect(result.current.isStepComplete(0)).toBe(false);
+  });
+
+  it("throws when used outside of a provider", () => {
+    expect(() => renderHook(() => useTourProgress())).toThrow(
+      /TourProgressContext/,
+    );
+  });
+});
diff --git a/src/providers/TourProvider/TourProgressContext.tsx b/src/providers/TourProvider/TourProgressContext.tsx
new file mode 100644
index 000000000..02230eb60
--- /dev/null
+++ b/src/providers/TourProvider/TourProgressContext.tsx
@@ -0,0 +1,56 @@
+import { type ReactNode, useCallback, useMemo, useState } from "react";
+
+import {
+  createRequiredContext,
+  useRequiredContext,
+} from "@/hooks/useRequiredContext";
+
+export interface TourProgressValue {
+  completedSteps: ReadonlySet<number>;
+  isStepComplete(step: number): boolean;
+  markStepComplete(step: number): void;
+  reset(): void;
+}
+
+const TourProgressContext = createRequiredContext<TourProgressValue>(
+  "TourProgressContext",
+);
+
+export function TourProgressProvider({ children }: { children: ReactNode }) {
+  const [completedSteps, setCompletedSteps] = useState<Set<number>>(
+    () => new Set(),
+  );
+
+  const isStepComplete = useCallback(
+    (step: number) => completedSteps.has(step),
+    [completedSteps],
+  );
+
+  const markStepComplete = useCallback((step: number) => {
+    setCompletedSteps((prev) => {
+      if (prev.has(step)) return prev;
+      const next = new Set(prev);
+      next.add(step);
+      return next;
+    });
+  }, []);
+
+  const reset = useCallback(() => {
+    setCompletedSteps((prev) => (prev.size === 0 ? prev : new Set()));
+  }, []);
+
+  const value = useMemo<TourProgressValue>(
+    () => ({ completedSteps, isStepComplete, markStepComplete, reset }),
+    [completedSteps, isStepComplete, markStepComplete, reset],
+  );
+
+  return (
+    <TourProgressContext.Provider value={value}>
+      {children}
+    </TourProgressContext.Provider>
+  );
+}
+
+export function useTourProgress(): TourProgressValue {
+  return useRequiredContext(TourProgressContext);
+}
diff --git a/src/providers/TourProvider/TourProvider.tsx b/src/providers/TourProvider/TourProvider.tsx
index b4e07130e..b6d836883 100644
--- a/src/providers/TourProvider/TourProvider.tsx
+++ b/src/providers/TourProvider/TourProvider.tsx
@@ -1,31 +1,40 @@
 import { TourProvider as ReactourProvider } from "@reactour/tour";
 import type { ReactNode } from "react";
 
+import {
+  renderNextButton,
+  TourAutoAdvance,
+  TourNavigation,
+} from "./TourNavigation";
 import {
   computeDefaultPopoverPosition,
   POPOVER_STYLES,
   PopoverClampBridge,
-  renderNextButton,
 } from "./TourPopover";
+import { TourProgressProvider } from "./TourProgressContext";
 
 export function TourProvider({ children }: { children: ReactNode }) {
   return (
-    <ReactourProvider
-      steps={[]}
-      styles={POPOVER_STYLES}
-      scrollSmooth
-      showBadge
-      showCloseButton={false}
-      showNavigation
-      showPrevNextButtons
-      disableKeyboardNavigation={["esc"]}
-      padding={{ mask: 0, popover: 10 }}
-      position={computeDefaultPopoverPosition}
-      nextButton={renderNextButton}
-      onClickMask={() => undefined}
-    >
-      <PopoverClampBridge />
-      {children}
-    </ReactourProvider>
+    <TourProgressProvider>
+      <ReactourProvider
+        steps={[]}
+        styles={POPOVER_STYLES}
+        components={{ Navigation: TourNavigation }}
+        scrollSmooth
+        showBadge
+        showCloseButton={false}
+        showNavigation
+        showPrevNextButtons
+        disableKeyboardNavigation={["esc"]}
+        padding={{ mask: 0, popover: 10 }}
+        position={computeDefaultPopoverPosition}
+        nextButton={renderNextButton}
+        onClickMask={() => undefined}
+      >
+        <PopoverClampBridge />
+        <TourAutoAdvance />
+        {children}
+      </ReactourProvider>
+    </TourProgressProvider>
   );
 }
diff --git a/src/providers/TourProvider/tourActionLabels.ts b/src/providers/TourProvider/tourActionLabels.ts
new file mode 100644
index 000000000..4c0d15628
--- /dev/null
+++ b/src/providers/TourProvider/tourActionLabels.ts
@@ -0,0 +1,20 @@
+export interface TourActionLabelInput {
+  interaction?: string;
+  targetTaskName?: string;
+  targetWindowName?: string;
+  targetFolderName?: string;
+  targetSearchTerm?: string;
+  targetArgumentName?: string;
+  targetMinCount?: number;
+}
+
+const GENERIC_LABEL = "Complete the highlighted action to continue";
+
+// Labels may embed **bold** spans (rendered by the checklist via renderInline)
+// to highlight the contextual target, e.g. the task or folder name.
+export function tourActionLabel(step: TourActionLabelInput): string {
+  switch (step.interaction) {
+    default:
+      return GENERIC_LABEL;
+  }
+}