fix(ui): make top PageHeader sticky on new-match screen during scroll

src/app/new-match/new-match-client.tsx

@@ -634,12 +634,14 @@ export default function NewMatchClient() {
       <>
         <PageBackground />
         <main
+          className="-mx-[17px] flex min-h-dvh flex-col px-[18px] text-center"
+        >
+          <div
             style={{
               paddingTop: `${Math.max(12, top + 4)}px`,
             }}
-          className="-mx-[17px] flex min-h-dvh flex-col px-[18px] text-center"
+            className="sticky top-0 z-30 -mx-[18px] px-[18px] pb-2 bg-[#F7F1F0]/90 backdrop-blur-md"
           >
-          <div className="shrink-0 mb-1">
             <PageHeader profile={profile} />
           </div>
 
@@ -721,12 +723,14 @@ export default function NewMatchClient() {
       <PageBackground />
 
       <main
+        className="-mx-[17px] flex min-h-dvh flex-col px-[18px] text-center"
+      >
+        <div
           style={{
             paddingTop: `${Math.max(12, top + 4)}px`,
           }}
-        className="-mx-[17px] flex min-h-dvh flex-col px-[18px] text-center"
+          className="sticky top-0 z-30 -mx-[18px] px-[18px] pb-2 bg-[#F7F1F0]/90 backdrop-blur-md"
         >
-        <div className="shrink-0 mb-1">
           <PageHeader profile={profile} />
         </div>