diff --git a/components/PageReader.tsx b/components/PageReader.tsx
index 1e79a29..6cc929c 100644
--- a/components/PageReader.tsx
+++ b/components/PageReader.tsx
@@ -42,7 +42,7 @@ export function PageReader({
   const [showUI, setShowUI] = useState(true);
   const [showDrawer, setShowDrawer] = useState(false);
   const [pages, setPages] = useState<PageData[]>([]);
-  const lastScrollY = useRef(0);
+  const hiddenByScrollRef = useRef(false);
   const offsetRef = useRef(0);
   const doneRef = useRef(false);
   const loadingRef = useRef(false);
@@ -127,17 +127,31 @@ export function PageReader({
     []
   );
 
+  // Distinguish tap from scroll on touch devices
+  const touchMovedRef = useRef(false);
+
+  const onTouchStart = useCallback(() => {
+    touchMovedRef.current = false;
+  }, []);
+
+  const onTouchMove = useCallback(() => {
+    touchMovedRef.current = true;
+  }, []);
+
+  const onTap = useCallback(() => {
+    if (touchMovedRef.current) return;
+    setShowUI((v) => !v);
+  }, []);
+
+  // Hide nav on first scroll down; after that, only tap toggles
   useEffect(() => {
     const handleScroll = () => {
-      const currentY = window.scrollY;
-      if (currentY > lastScrollY.current && currentY > 50) {
+      if (!hiddenByScrollRef.current && window.scrollY > 50) {
+        hiddenByScrollRef.current = true;
         setShowUI(false);
-      } else if (currentY < lastScrollY.current) {
-        setShowUI(true);
+        window.removeEventListener("scroll", handleScroll);
       }
-      lastScrollY.current = currentY;
     };
-
     window.addEventListener("scroll", handleScroll, { passive: true });
     return () => window.removeEventListener("scroll", handleScroll);
   }, []);
@@ -178,8 +192,11 @@ export function PageReader({
 
       {/* Pages - vertical scroll (webtoon style, best for mobile) */}
       <div
-        className="max-w-4xl mx-auto leading-[0]"
-        onClick={() => setShowUI(!showUI)}
+        className="max-w-4xl mx-auto leading-[0] select-none"
+        onClick={onTap}
+        onTouchStart={onTouchStart}
+        onTouchMove={onTouchMove}
+        onContextMenu={(e) => e.preventDefault()}
       >
         {pages.map((page, i) => (
           <div
@@ -191,7 +208,8 @@ export function PageReader({
             <img
               src={page.imageUrl}
               alt={`Page ${page.number}`}
-              className="w-full h-auto block align-bottom -mb-px"
+              className="w-full h-auto block align-bottom -mb-px [-webkit-touch-callout:none]"
+              draggable={false}
             />
           </div>
         ))}
diff --git a/next.config.ts b/next.config.ts
index b49e030..9df2194 100644
--- a/next.config.ts
+++ b/next.config.ts
@@ -1,6 +1,7 @@
 import type { NextConfig } from "next";
 
 const nextConfig: NextConfig = {
+  allowedDevOrigins: ["10.8.0.2"],
   images: {
     remotePatterns: [
       {