diff --git a/src/components/wizard/WizardStepper.vue b/src/components/wizard/WizardStepper.vue
index 78fb141..b2af2ee 100644
--- a/src/components/wizard/WizardStepper.vue
+++ b/src/components/wizard/WizardStepper.vue
@@ -1,32 +1,35 @@
 <template>
-  <ol class="flex items-center gap-y-2">
-    <li
-        v-for="(step, index) in steps"
-        :key="step.id"
-        class="flex items-center"
-    >
-      <button
-          type="button"
-          class="flex items-center gap-2 rounded-lg px-1.5 py-1 transition"
-          :class="stepClasses(index)"
-          :disabled="index > maxVisited"
-          @click="emit('goTo', index)"
+  <nav ref="viewportRef" class="wizard-stepper" aria-label="Proposal creation progress">
+    <ol ref="trackRef" class="wizard-stepper-track" :style="trackStyle">
+      <li
+          v-for="(step, index) in steps"
+          :key="step.id"
+          :ref="(el) => setStepRef(el, index)"
+          class="flex shrink-0 items-center"
       >
-        <span
-            class="flex h-6 w-6 items-center justify-center rounded-full text-xs font-semibold"
-            :class="badgeClasses(index)"
+        <button
+            type="button"
+            class="wizard-step"
+            :class="stepClasses(index)"
+            :disabled="index > maxVisited"
+            :aria-current="index === current ? 'step' : undefined"
+            @click="emit('goTo', index)"
         >
-          {{ index + 1 }}
-        </span>
-        <span class="hidden text-sm font-medium sm:inline">{{ step.label }}</span>
-      </button>
-
-      <span v-if="index < steps.length - 1" class="mx-1 h-px w-4 bg-slate-300 sm:w-6" aria-hidden="true" />
-    </li>
-  </ol>
+          <span class="wizard-step-badge" :class="badgeClasses(index)">
+            {{ index + 1 }}
+          </span>
+          <span class="text-sm font-medium">{{ step.label }}</span>
+        </button>
+
+        <span v-if="index < steps.length - 1" class="mx-2 h-px w-5 shrink-0 bg-slate-300 sm:w-8" aria-hidden="true" />
+      </li>
+    </ol>
+  </nav>
 </template>
 
 <script setup lang="ts">
+import { computed, nextTick, onMounted, ref, watch } from "vue";
+import { useWindowSize } from "@vueuse/core";
 import type { WizardStep } from "../../composables/useProposalWizard";
 
 const props = defineProps<{
@@ -39,15 +42,115 @@ const emit = defineEmits<{
   goTo: [index: number];
 }>();
 
+const viewportRef = ref<HTMLElement | null>(null);
+const trackRef = ref<HTMLElement | null>(null);
+const stepRefs = new Map<number, HTMLElement>();
+
+const translateX = ref(0);
+/** Suppresses the transition until the first centering, so the initial position snaps into place. */
+const animated = ref(false);
+
+const setStepRef = (el: Element | any, index: number) => {
+  if (el instanceof HTMLElement) {
+    stepRefs.set(index, el);
+  } else {
+    stepRefs.delete(index);
+  }
+};
+
+/** Centers the current step in the viewport; overflow at the extremities is masked by the fade. */
+const centerCurrentStep = () => {
+  const viewport = viewportRef.value;
+  const track = trackRef.value;
+  const step = stepRefs.get(props.current);
+  if (!viewport || !track || !step) return;
+
+  const stepRect = step.getBoundingClientRect();
+  const trackRect = track.getBoundingClientRect();
+
+  // Rects already include the current transform, so adjust from where the step is now.
+  const stepCenter = stepRect.left + stepRect.width / 2 - trackRect.left;
+  translateX.value += viewport.clientWidth / 2 - stepCenter;
+};
+
+const recenter = async (withAnimation: boolean) => {
+  if (!withAnimation) animated.value = false;
+  await nextTick();
+  centerCurrentStep();
+  if (!withAnimation) {
+    // Re-arm the transition once the snapped position has been painted
+    requestAnimationFrame(() => requestAnimationFrame(() => (animated.value = true)));
+  }
+};
+
+const trackStyle = computed(() => ({
+  transform: `translateX(${translateX.value}px)`,
+  transition: animated.value
+      ? "transform 550ms cubic-bezier(0.22, 1, 0.36, 1)"
+      : "none",
+}));
+
+const { width: windowWidth } = useWindowSize();
+
+watch(() => props.current, () => recenter(true));
+watch(() => props.steps, () => recenter(false), { deep: true });
+watch(windowWidth, () => recenter(false));
+
+onMounted(() => recenter(false));
+
 const stepClasses = (index: number) => {
-  if (index === props.current) return "text-slate-900";
-  if (index <= props.maxVisited) return "text-slate-600 hover:bg-slate-100 cursor-pointer";
-  return "text-slate-400 cursor-not-allowed";
+  if (index === props.current) return "text-slate-900 opacity-100";
+  if (index <= props.maxVisited) return "text-slate-500 opacity-75 hover:opacity-100 cursor-pointer";
+  return "text-slate-400 opacity-60 cursor-not-allowed";
 };
 
 const badgeClasses = (index: number) => {
-  if (index === props.current) return "bg-amber-500 text-white";
+  if (index === props.current) return "bg-amber-500 text-white scale-110";
   if (index < props.current) return "bg-slate-700 text-white";
   return "bg-slate-200 text-slate-500";
 };
 </script>
+
+<style scoped>
+.wizard-stepper {
+  /* Single line; steps that overflow are faded out by the mask, so the extremities
+     show nothing rather than a hard clip or a scrollbar */
+  overflow: hidden;
+  white-space: nowrap;
+  mask-image: linear-gradient(to right, transparent 0, black 18%, black 82%, transparent 100%);
+  -webkit-mask-image: linear-gradient(to right, transparent 0, black 18%, black 82%, transparent 100%);
+}
+
+.wizard-stepper-track {
+  display: flex;
+  align-items: center;
+  width: max-content;
+  will-change: transform;
+}
+
+.wizard-step {
+  display: flex;
+  align-items: center;
+  gap: 0.5rem;
+  border-radius: 0.5rem;
+  padding: 0.375rem 0.5rem;
+  transition: opacity 300ms ease, color 300ms ease, background-color 300ms ease;
+}
+
+.wizard-step:hover:not(:disabled) {
+  background-color: #f1f5f9;
+}
+
+.wizard-step-badge {
+  display: flex;
+  height: 1.5rem;
+  width: 1.5rem;
+  flex-shrink: 0;
+  align-items: center;
+  justify-content: center;
+  border-radius: 9999px;
+  font-size: 0.75rem;
+  font-weight: 600;
+  transition: transform 300ms cubic-bezier(0.22, 1, 0.36, 1), background-color 300ms ease, color 300ms ease;
+}
+</style>
diff --git a/tsconfig.app.tsbuildinfo b/tsconfig.app.tsbuildinfo
index 6de05be..f417628 100644
--- a/tsconfig.app.tsbuildinfo
+++ b/tsconfig.app.tsbuildinfo
@@ -1 +1 @@
-{"root":["./src/main.ts","./src/vite-env.d.ts","./src/components/icons/index.ts","./src/components/icons/types.ts","./src/composables/useFilterNotifier.ts","./src/composables/useLoading.ts","./src/composables/useModal.ts","./src/composables/useSession.ts","./src/generated/typescript/index.ts","./src/generated/typescript/core/ApiError.ts","./src/generated/typescript/core/ApiRequestOptions.ts","./src/generated/typescript/core/ApiResult.ts","./src/generated/typescript/core/CancelablePromise.ts","./src/generated/typescript/core/OpenAPI.ts","./src/generated/typescript/core/request.ts","./src/generated/typescript/models/AddAmendmentRequest.ts","./src/generated/typescript/models/AddCommentRequest.ts","./src/generated/typescript/models/AddProposalRequest.ts","./src/generated/typescript/models/Amendment.ts","./src/generated/typescript/models/AmendmentParagraph.ts","./src/generated/typescript/models/AmendmentStatus.ts","./src/generated/typescript/models/AmendmentVote.ts","./src/generated/typescript/models/AmendmentWithParagraphs.ts","./src/generated/typescript/models/AmendmentWithSummary.ts","./src/generated/typescript/models/Claims.ts","./src/generated/typescript/models/CommentReaction.ts","./src/generated/typescript/models/CommentReactionSummary.ts","./src/generated/typescript/models/CommentWithUser.ts","./src/generated/typescript/models/EditProposalRequest.ts","./src/generated/typescript/models/FreighterLoginRequest.ts","./src/generated/typescript/models/FreighterLoginResponse.ts","./src/generated/typescript/models/LoginRequest.ts","./src/generated/typescript/models/Organization.ts","./src/generated/typescript/models/Proposal.ts","./src/generated/typescript/models/ProposalEdit.ts","./src/generated/typescript/models/ProposalEditParagraph.ts","./src/generated/typescript/models/ProposalParagraph.ts","./src/generated/typescript/models/ProposalParagraphRequest.ts","./src/generated/typescript/models/ProposalSponsor.ts","./src/generated/typescript/models/ProposalState.ts","./src/generated/typescript/models/ProposalVote.ts","./src/generated/typescript/models/ProposalWithParagraphs.ts","./src/generated/typescript/models/ProposalWithSummary.ts","./src/generated/typescript/models/ReactCommentRequest.ts","./src/generated/typescript/models/ReactCommentResponse.ts","./src/generated/typescript/models/ReactionType.ts","./src/generated/typescript/models/RegisterOrganizationRequest.ts","./src/generated/typescript/models/RegisterRequest.ts","./src/generated/typescript/models/RegisteredUser.ts","./src/generated/typescript/models/SelectableAmendment.ts","./src/generated/typescript/models/SelectableComment.ts","./src/generated/typescript/models/SelectableProposal.ts","./src/generated/typescript/models/SetProposalRevisionRequest.ts","./src/generated/typescript/models/SponsorProposalRequest.ts","./src/generated/typescript/models/UserAmendmentVote.ts","./src/generated/typescript/models/UserProposalVotes.ts","./src/generated/typescript/models/VoteAmendmentRequest.ts","./src/generated/typescript/models/VoteAmendmentResponse.ts","./src/generated/typescript/models/VoteChoice.ts","./src/generated/typescript/models/VoteProposalRequest.ts","./src/generated/typescript/schemas/$AddProposalRequest.ts","./src/generated/typescript/schemas/$FreighterLoginRequest.ts","./src/generated/typescript/schemas/$ListProposalsResponse.ts","./src/generated/typescript/schemas/$LoginRequest.ts","./src/generated/typescript/schemas/$ProposalItem.ts","./src/generated/typescript/schemas/$ProposalList.ts","./src/generated/typescript/schemas/$RegisterRequest.ts","./src/generated/typescript/schemas/$VisitProposalRequest.ts","./src/generated/typescript/services/AmendmentService.ts","./src/generated/typescript/services/AuthService.ts","./src/generated/typescript/services/CommentService.ts","./src/generated/typescript/services/OrganizationService.ts","./src/generated/typescript/services/ProposalService.ts","./src/router/index.ts","./src/stores/filterStore.ts","./src/types/color.ts","./src/types/comment.ts","./src/types/dropdown.ts","./src/types/headerletter.ts","./src/types/proposal.ts","./src/types/user.ts","./src/types/vote.ts","./src/utils/amendment.ts","./src/utils/auth.ts","./src/utils/comments.ts","./src/utils/eventBus.ts","./src/utils/markdown.ts","./src/utils/proposalExport.ts","./src/utils/wallet.ts","./src/App.vue","./src/components/AmendmentCarousel.vue","./src/components/BrandBar.vue","./src/components/Chip.vue","./src/components/ColoredHeader.vue","./src/components/CommentThread.vue","./src/components/Dropdown.vue","./src/components/LoadingSpinner.vue","./src/components/PostBuilder.vue","./src/components/ProposalContainer.vue","./src/components/ProposalDetail.vue","./src/components/ProposalEmptyState.vue","./src/components/ProposalExportCard.vue","./src/components/ProposalRevisionDropdown.vue","./src/components/ProposalSponsorCard.vue","./src/components/ProposalVotingCard.vue","./src/components/Sidebar.vue","./src/components/Thread.vue","./src/components/icons/Abstain.vue","./src/components/icons/AppIcon.vue","./src/components/icons/Arrow.vue","./src/components/icons/Cancel.vue","./src/components/icons/Confirm.vue","./src/components/icons/DownArrow.vue","./src/components/icons/Download.vue","./src/components/icons/Filter.vue","./src/components/icons/IconBase.vue","./src/components/icons/Identification.vue","./src/components/icons/Menu.vue","./src/components/icons/Plus.vue","./src/components/icons/SpeechBubbles.vue","./src/components/icons/Stack.vue","./src/components/icons/ThumbsDown.vue","./src/components/icons/ThumbsUp.vue","./src/components/modals/AmendmentModal.vue","./src/components/modals/EditProposalModal.vue","./src/components/modals/FilterModal.vue","./src/components/modals/Modal.vue","./src/components/modals/NewAmendmentModal.vue","./src/components/modals/ProposalModal.vue","./src/components/modals/RegistrationModal.vue","./src/views/HomeView.vue","./src/views/ProposalView.vue"],"version":"5.9.2"}
\ No newline at end of file
+{"root":["./src/main.ts","./src/vite-env.d.ts","./src/components/icons/index.ts","./src/components/icons/types.ts","./src/composables/useFilterNotifier.ts","./src/composables/useLoading.ts","./src/composables/useModal.ts","./src/composables/useProposalWizard.ts","./src/composables/useSession.ts","./src/generated/typescript/index.ts","./src/generated/typescript/core/ApiError.ts","./src/generated/typescript/core/ApiRequestOptions.ts","./src/generated/typescript/core/ApiResult.ts","./src/generated/typescript/core/CancelablePromise.ts","./src/generated/typescript/core/OpenAPI.ts","./src/generated/typescript/core/request.ts","./src/generated/typescript/models/AddAmendmentRequest.ts","./src/generated/typescript/models/AddCommentRequest.ts","./src/generated/typescript/models/AddProposalRequest.ts","./src/generated/typescript/models/Amendment.ts","./src/generated/typescript/models/AmendmentParagraph.ts","./src/generated/typescript/models/AmendmentStatus.ts","./src/generated/typescript/models/AmendmentVote.ts","./src/generated/typescript/models/AmendmentWithParagraphs.ts","./src/generated/typescript/models/AmendmentWithSummary.ts","./src/generated/typescript/models/Claims.ts","./src/generated/typescript/models/CommentReaction.ts","./src/generated/typescript/models/CommentReactionSummary.ts","./src/generated/typescript/models/CommentWithUser.ts","./src/generated/typescript/models/EditProposalRequest.ts","./src/generated/typescript/models/FreighterLoginRequest.ts","./src/generated/typescript/models/FreighterLoginResponse.ts","./src/generated/typescript/models/ListCommentsResponse.ts","./src/generated/typescript/models/LoginRequest.ts","./src/generated/typescript/models/Organization.ts","./src/generated/typescript/models/Proposal.ts","./src/generated/typescript/models/ProposalParagraph.ts","./src/generated/typescript/models/ProposalParagraphRequest.ts","./src/generated/typescript/models/ProposalRevision.ts","./src/generated/typescript/models/ProposalRevisionBlock.ts","./src/generated/typescript/models/ProposalSponsor.ts","./src/generated/typescript/models/ProposalState.ts","./src/generated/typescript/models/ProposalVote.ts","./src/generated/typescript/models/ProposalWithParagraphs.ts","./src/generated/typescript/models/ProposalWithSummary.ts","./src/generated/typescript/models/ReactCommentRequest.ts","./src/generated/typescript/models/ReactCommentResponse.ts","./src/generated/typescript/models/ReactionType.ts","./src/generated/typescript/models/RegisterOrganizationRequest.ts","./src/generated/typescript/models/RegisterRequest.ts","./src/generated/typescript/models/RegisteredUser.ts","./src/generated/typescript/models/SelectableAmendment.ts","./src/generated/typescript/models/SelectableComment.ts","./src/generated/typescript/models/SelectableProposal.ts","./src/generated/typescript/models/SetProposalRevisionRequest.ts","./src/generated/typescript/models/SponsorProposalRequest.ts","./src/generated/typescript/models/UserAmendmentVote.ts","./src/generated/typescript/models/UserProposalVotes.ts","./src/generated/typescript/models/VoteAmendmentRequest.ts","./src/generated/typescript/models/VoteAmendmentResponse.ts","./src/generated/typescript/models/VoteChoice.ts","./src/generated/typescript/models/VoteProposalRequest.ts","./src/generated/typescript/schemas/$AddProposalRequest.ts","./src/generated/typescript/schemas/$FreighterLoginRequest.ts","./src/generated/typescript/schemas/$ListProposalsResponse.ts","./src/generated/typescript/schemas/$LoginRequest.ts","./src/generated/typescript/schemas/$ProposalItem.ts","./src/generated/typescript/schemas/$ProposalList.ts","./src/generated/typescript/schemas/$RegisterRequest.ts","./src/generated/typescript/schemas/$VisitProposalRequest.ts","./src/generated/typescript/services/AmendmentService.ts","./src/generated/typescript/services/AuthService.ts","./src/generated/typescript/services/CommentService.ts","./src/generated/typescript/services/OrganizationService.ts","./src/generated/typescript/services/ProposalService.ts","./src/router/index.ts","./src/stores/filterStore.ts","./src/types/color.ts","./src/types/comment.ts","./src/types/dropdown.ts","./src/types/headerletter.ts","./src/types/proposal.ts","./src/types/proposalWizard.ts","./src/types/user.ts","./src/types/vote.ts","./src/utils/amendment.ts","./src/utils/auth.ts","./src/utils/comments.ts","./src/utils/eventBus.ts","./src/utils/markdown.ts","./src/utils/proposalExport.ts","./src/utils/wallet.ts","./src/App.vue","./src/components/AmendmentCarousel.vue","./src/components/BrandBar.vue","./src/components/Chip.vue","./src/components/ColoredHeader.vue","./src/components/CommentThread.vue","./src/components/Dropdown.vue","./src/components/LoadingSpinner.vue","./src/components/PostBuilder.vue","./src/components/ProposalContainer.vue","./src/components/ProposalDetail.vue","./src/components/ProposalEmptyState.vue","./src/components/ProposalExportCard.vue","./src/components/ProposalRevisionDropdown.vue","./src/components/ProposalSponsorCard.vue","./src/components/ProposalVotingCard.vue","./src/components/Sidebar.vue","./src/components/Thread.vue","./src/components/icons/Abstain.vue","./src/components/icons/AppIcon.vue","./src/components/icons/Arrow.vue","./src/components/icons/Cancel.vue","./src/components/icons/Confirm.vue","./src/components/icons/DownArrow.vue","./src/components/icons/Download.vue","./src/components/icons/Filter.vue","./src/components/icons/IconBase.vue","./src/components/icons/Identification.vue","./src/components/icons/Menu.vue","./src/components/icons/Plus.vue","./src/components/icons/SpeechBubbles.vue","./src/components/icons/Stack.vue","./src/components/icons/ThumbsDown.vue","./src/components/icons/ThumbsUp.vue","./src/components/modals/AmendmentModal.vue","./src/components/modals/EditProposalModal.vue","./src/components/modals/FilterModal.vue","./src/components/modals/Modal.vue","./src/components/modals/NewAmendmentModal.vue","./src/components/modals/ProposalWizardModal.vue","./src/components/modals/RegistrationModal.vue","./src/components/wizard/ListInput.vue","./src/components/wizard/WizardBasicsStep.vue","./src/components/wizard/WizardDecisionStep.vue","./src/components/wizard/WizardFundingStep.vue","./src/components/wizard/WizardNarrativeStep.vue","./src/components/wizard/WizardPolicyStep.vue","./src/components/wizard/WizardReviewStep.vue","./src/components/wizard/WizardScopeStep.vue","./src/components/wizard/WizardStepper.vue","./src/views/HomeView.vue","./src/views/ProposalView.vue"],"version":"5.9.2"}
\ No newline at end of file