diff --git a/src/pages/OnboardingPage.tsx b/src/pages/OnboardingPage.tsx
index d9ba0d1..12b01db 100644
--- a/src/pages/OnboardingPage.tsx
+++ b/src/pages/OnboardingPage.tsx
@@ -160,6 +160,32 @@ export default function OnboardingPage() {
     <Layout>
       <div className="container px-4 py-10 max-w-3xl">
 
+        {/* ── Save your login (critical) — pinned ABOVE the hero right after
+             signup so a new skater sees it immediately, not below the fold.
+             Stays until the login is actually saved (backup-confirmed). ── */}
+        {user && !backupConfirmed && (
+          <Link to="/settings?section=security" className="block mb-6 group">
+            <div className="flex items-center gap-4 p-4 rounded-2xl bg-amber-500/15 border-2 border-amber-500/50 hover:bg-amber-500/20 hover:border-amber-500/70 transition-all shadow-[0_0_24px_rgba(245,158,11,0.15)]">
+              <div className="relative flex-shrink-0">
+                <div className="w-10 h-10 rounded-full bg-amber-500/25 flex items-center justify-center">
+                  <Key className="h-5 w-5 text-amber-400" />
+                </div>
+                <span className="absolute -top-0.5 -right-0.5 w-3 h-3 rounded-full bg-amber-500 border-2 border-black animate-pulse motion-reduce:animate-none" />
+              </div>
+              <div className="flex-1 min-w-0">
+                <p className="font-black text-amber-300 text-sm uppercase tracking-wide">Save your login — do this now</p>
+                <p className="text-xs text-amber-100/80 leading-snug mt-0.5">
+                  Your recovery code is the only way back into your account. No email, no password reset.
+                </p>
+              </div>
+              <div className="flex-shrink-0 flex items-center gap-1.5 rounded-full bg-amber-500 px-3 py-1.5 text-[11px] font-black uppercase tracking-wide text-black group-hover:bg-amber-400 transition-colors">
+                <Download className="h-3.5 w-3.5" />
+                Save
+              </div>
+            </div>
+          </Link>
+        )}
+
         {/* ── Hero ── */}
         <div className="text-center mb-12 relative">
           <div className="absolute inset-0 -z-10 blur-[120px] opacity-20 pointer-events-none"
@@ -229,29 +255,6 @@ export default function OnboardingPage() {
           </div>
         )}
 
-        {/* ── Save your login (critical) — stays until actually backed up ── */}
-        {user && !backupConfirmed && (
-          <Link to="/settings?section=security" className="block mb-8 group">
-            <div className="flex items-center gap-4 p-4 rounded-2xl bg-amber-500/10 border border-amber-500/30 hover:bg-amber-500/15 hover:border-amber-500/45 transition-all">
-              <div className="relative flex-shrink-0">
-                <div className="w-9 h-9 rounded-full bg-amber-500/20 flex items-center justify-center">
-                  <Key className="h-4 w-4 text-amber-400" />
-                </div>
-                <span className="absolute -top-0.5 -right-0.5 w-3 h-3 rounded-full bg-amber-500 border-2 border-black animate-pulse motion-reduce:animate-none" />
-              </div>
-              <div className="flex-1 min-w-0">
-                <p className="font-bold text-amber-300 text-sm">Save your login — do this now</p>
-                <p className="text-xs text-amber-100/70 leading-snug mt-0.5">
-                  It's the only way back into your account. Lose it and there's no reset — no email, no password recovery.
-                </p>
-              </div>
-              <div className="flex-shrink-0 flex items-center gap-1.5 rounded-full bg-amber-500 px-3 py-1.5 text-[11px] font-black uppercase tracking-wide text-black group-hover:bg-amber-400 transition-colors">
-                <Download className="h-3.5 w-3.5" />
-                Save
-              </div>
-            </div>
-          </Link>
-        )}
 
         {/* ── Login saved confirmation ── */}
         {user && backupConfirmed && (