another step just a little remaining

client/src/hooks/layout.ts

@@ -39,7 +39,10 @@ function useIsMobileForNextJs() {
   const [onMobileDelayed, setOnMobileDelayed] = useState(SERVER_SIDE_MOBILE_FIRST);
 
   useEffect(() => {
-    setOnMobileDelayed(onMobile); // Next.js don't allow to use useOnMobileXxx() directly, so we need to use this workaround
+    // Defer the media-query result to after mount so SSR renders the mobile-first value
+    // and the client reconciles without a hydration mismatch. Deliberate setState.
+    // eslint-disable-next-line react-hooks/set-state-in-effect
+    setOnMobileDelayed(onMobile);
   }, [onMobile]);
 
   return onMobileDelayed;