From a8c752828e3976c21b124b2382b04d140cc5d5b7 Mon Sep 17 00:00:00 2001
From: Martin Dvorak <dvorak@dvorakmortonxd.dev>
Date: Fri, 9 Oct 2026 10:52:23 +0000
Subject: [PATCH] Drop the sticky bar: the Freeze my deck CTA now sits in the
 flow like the homework one
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

The last visible difference between the two CTAs was the container: the
deck button lived in a full-bleed sticky strip (translucent background,
hairline top border, its own padding), which also tinted the disabled chip
differently. The homework button sits plainly in the page flow.

- The CTA block is now a plain space-y-2 stack at the end of the form:
  full-width button + centred helper line, exactly like /homework.
- /create's page padding switches from the sticky-era .pb-cta (9rem, phone
  override 4.6rem) to .pb-tabbar, and lg:pb-20 to lg:pb-16 — identical to
  the homework page. The now-unused .pb-cta rules are gone.
- Result: same button width (358px @390 / 688px @1280), height, radius,
  helper placement and trailing space on both pages; neither has a sticky
  ancestor any more.

Service worker: freezmo-v16.

Verified: CTA-flow suite 26/26 (below-the-fold at rest, no sticky ancestor,
full-width, helper centred underneath, width/height/radius/trailing-space
parity at 390px and 1280px), desktop regression 74/74, mobile 51/51,
i18n 27/27. Lint + build clean.
---
 app/create/page.tsx         |  2 +-
 app/globals.css             | 11 -----------
 components/UploadScreen.tsx |  6 +++---
 public/sw.js                |  2 +-
 4 files changed, 5 insertions(+), 16 deletions(-)

diff --git a/app/create/page.tsx b/app/create/page.tsx
index 15cc8f9..cb95c90 100644
--- a/app/create/page.tsx
+++ b/app/create/page.tsx
@@ -28,7 +28,7 @@ export default async function CreatePage({
         <MobileSidebar />
         <main className="flex min-h-dvh min-w-0 flex-1 flex-col">
           <AppHeader />
-          <div className="mx-auto w-full max-w-3xl flex-1 px-4 pb-cta lg:px-10 lg:pb-20">
+          <div className="mx-auto w-full max-w-3xl flex-1 px-4 pb-tabbar lg:px-10 lg:pb-16">
             <UploadScreen />
           </div>
           <TabBar />
diff --git a/app/globals.css b/app/globals.css
index a221703..f5b6826 100644
--- a/app/globals.css
+++ b/app/globals.css
@@ -707,17 +707,6 @@ body {
 .pt-safe { padding-top: max(env(safe-area-inset-top), 0.75rem) }
 .pb-safe { padding-bottom: max(env(safe-area-inset-bottom), 0.75rem) }
 .pb-tabbar { padding-bottom: calc(env(safe-area-inset-bottom, 0px) + 5.25rem) }
-/* Trailing room under the sticky "Freeze my deck" strip on /create.
-   Phones: the strip floats one tab-bar height above the viewport bottom (the
-   sticky bottom offset in UploadScreen), so the page only needs that much
-   scroll room under it — the strip settles exactly where it was already
-   floating, and the bottom bar is never double-counted. Keep 4.6rem in sync
-   with the sticky offset. Wider screens: the strip docks to the viewport
-   bottom and keeps the roomier 9rem. */
-.pb-cta { padding-bottom: calc(env(safe-area-inset-bottom, 0px) + 9rem) }
-@media (max-width: 639px) {
-  .pb-cta { padding-bottom: calc(env(safe-area-inset-bottom, 0px) + 4.6rem) }
-}
 
 @media (display-mode: standalone) {
   .standalone-hide { display: none }
diff --git a/components/UploadScreen.tsx b/components/UploadScreen.tsx
index 50dfd83..4154613 100644
--- a/components/UploadScreen.tsx
+++ b/components/UploadScreen.tsx
@@ -719,9 +719,9 @@ export function UploadScreen() {
           </div>
         </section>
 
-        <div className="sticky bottom-[calc(env(safe-area-inset-bottom,0px)+4.6rem)] z-20 -mx-4 space-y-2 border-t border-[var(--hairline)] bg-white/65 px-4 py-3 backdrop-blur-2xl dark:bg-[color-mix(in_oklab,var(--surface)_70%,transparent)] sm:bottom-0 sm:mx-0 sm:rounded-[1.35rem] sm:border sm:px-5">
-          {/* Visually identical to the homework flow's CTA — same icon, shape
-              and helper line — only the label differs. */}
+        {/* Same CTA block as the homework flow: full-width button with the
+            helper line centred underneath, in the page flow — no sticky bar. */}
+        <div className="space-y-2">
           <Button
             size="lg"
             className="touch-target w-full"
diff --git a/public/sw.js b/public/sw.js
index 69d6e6b..8a5b4b0 100644
--- a/public/sw.js
+++ b/public/sw.js
@@ -9,7 +9,7 @@
  *
  * Bumping CACHE_VERSION is how a new deploy invalidates old assets.
  */
-const CACHE_VERSION = "freezmo-v15";
+const CACHE_VERSION = "freezmo-v16";
 const SHELL_CACHE = `${CACHE_VERSION}-shell`;
 const ASSET_CACHE = `${CACHE_VERSION}-assets`;