[FEAT] prevent application to refresh whenit is at end of page (native CSS)

front/src/App.tsx

@@ -1,5 +1,3 @@
-import { useEffect } from 'react';
-
 import { ErrorBoundary } from '@/errors/ErrorBoundary';
 
 import { AudioPlayer } from './components';
@@ -8,19 +6,6 @@ import { AppRoutes } from './scene/AppRoutes';
 import { ServiceContextProvider } from './service/ServiceContext';
 
 export const App = () => {
-  // Prevent reload the page when scroll on mobile
-  useEffect(() => {
-    const preventRefresh = (event: { preventDefault: () => void }) => {
-      if (window.scrollY === 0) {
-        event.preventDefault();
-      }
-    };
-    document.addEventListener('touchmove', preventRefresh, { passive: false });
-    return () => {
-      document.removeEventListener('touchmove', preventRefresh);
-    };
-  }, []);
-
   return (
     <ServiceContextProvider>
       <EnvDevelopment />

front/src/theme/theme.ts

@@ -9,12 +9,20 @@ import { colors } from './colors';
 
 const baseTheme: SystemConfig = {
   globalCss: {
+    ':root': {
+      // permit to "firefox" not reload the page when scroll on top
+      overscrollBehavior: 'contain',
+    },
     body: {
+      // permit to "chromium" not reload the page when scroll on top
+      overscrollBehavior: 'contain',
+      // Prevents text selection
+      userSelect: 'none',
+      // Other ...
       overflowY: 'none',
       bg: { _light: 'back.50', _dark: 'back.700' },
       color: { _light: 'text.900', _dark: 'text.50' },
       fontFamily: 'Roboto, Helvetica, Arial, "sans-serif"',
-      userSelect: 'none' /* Prevents text selection */,
     },
     svg: {
       width: '32px',