Integrated capacitor, adjusted the fetch urls and UI elements position to fit the safe area on mobile

src/client/styles.css

@@ -17,6 +17,22 @@
   box-sizing: border-box;
 }
 
+/* Add safe-area offsets for iOS native mobile device */
+@supports (-webkit-touch-callout: none) {
+  .safe-pt {
+    padding-top: env(safe-area-inset-top);
+  }
+  .safe-pb {
+    padding-bottom: env(safe-area-inset-bottom);
+  }
+  .safe-top {
+    top: env(safe-area-inset-top);
+  }
+  .safe-mb {
+    margin-bottom: env(safe-area-inset-bottom);
+  }
+}
+
 /* Add custom scrollbar styles */
 ::-webkit-scrollbar {
   width: 8px;