From 1b4c21c289e711ebe55210b9e09f376c63c42744 Mon Sep 17 00:00:00 2001
From: ivorycrayon <ivorycrayon@users.noreply.github.com>
Date: Sun, 24 May 2026 11:29:15 -0700
Subject: [PATCH] fix(success): anchor CTAs to body-top at sm+

---
 src/components/picker/SuccessView.tsx | 11 ++++++++++-
 1 file changed, 10 insertions(+), 1 deletion(-)

diff --git a/src/components/picker/SuccessView.tsx b/src/components/picker/SuccessView.tsx
index 2827dc4..ed9f1fa 100644
--- a/src/components/picker/SuccessView.tsx
+++ b/src/components/picker/SuccessView.tsx
@@ -22,7 +22,16 @@ export function SuccessView({
 }) {
   return (
     <Stage
-      bodyClassName="gap-3 sm:flex-row"
+      // sm:items-start re-anchors the CTAs to body-top in the sm+ row
+      // layout. Stage's base items-center is cross-axis: in flex-col
+      // (mobile) that's horizontal-centre, which is what we want for the
+      // stacked buttons; in flex-row (sm+) it becomes vertical-centre,
+      // and combined with flex-1 the buttons drift to the middle of the
+      // lower zone instead of sitting one row below the hero like the
+      // padding-top reserves them to. Switching to items-start at sm+
+      // puts them back at the padding-top edge. Mobile keeps the inherited
+      // items-center for horizontal centring of the stacked column.
+      bodyClassName="gap-3 sm:flex-row sm:items-start"
       header={
         <>
           <h1