unstable sharing refactor

src/components/Layout.tsx

@@ -196,10 +196,15 @@ export const Layout: Component<LayoutProps> = (props) => {
                 </Show>
 
                 {/* Main Content Area */}
-                <main class={cn(
-                    "flex-1 min-w-0 overflow-y-auto overflow-x-hidden relative scroll-smooth",
-                    !store.isNotepadMode ? "pb-32 sm:pb-6" : ""
-                )}>
+                <main
+                    class={cn(
+                        "flex-1 min-w-0 overflow-y-auto overflow-x-hidden relative scroll-smooth",
+                        !store.isNotepadMode ? "pb-32 sm:pb-6" : ""
+                    )}
+                    style={{
+                        "padding-bottom": "calc(8px + env(safe-area-inset-bottom, 0px))"
+                    }}
+                >
                     <div class={cn(
                         "w-full h-full mx-auto",
                         !store.isNotepadMode ? "max-w-screen-2xl px-4 sm:px-8 lg:px-12 pt-16 sm:pt-20 pb-8 space-y-6 sm:space-y-8" : "max-w-screen-2xl md:px-8 lg:px-12 md:pt-20 md:pb-8 pt-14"