i think this works for mobile styling now. special for hugging face

pages/index.js

@@ -302,7 +302,7 @@ export default function Home() {
           }
         `}</style>
       </Head>
-      <div className="fixed inset-0 bg-white mt-[90px] sm:mt-0">
+      <div className="fixed inset-0 bg-white mt-[0px] sm:mt-0">
         <Header />
         <ErrorModal 
           isOpen={showErrorModal} 
@@ -311,7 +311,7 @@ export default function Home() {
 
         <div className="absolute inset-0 top-[57px] sm:top-[73px] overflow-y-auto overscroll-y-contain -webkit-overflow-scrolling-touch">
           <div className={`flex flex-col md:flex-row gap-4 max-w-6xl mx-auto pb-20 ${!hasStartedGenerating ? 'justify-center' : ''}`}>
-            <div className={`w-full md:flex-1 py-4 px-3 ${!hasStartedGenerating ? 'md:max-w-2xl mx-auto' : ''}`}>
+            <div className={`w-full md:flex-1 py-12 px-3 ${!hasStartedGenerating ? 'md:max-w-2xl mx-auto' : ''}`}>
               <section className="flex flex-col bg-gray-100 rounded-2xl p-4">
                 <div
                   {...getRootProps()}