fix(reader): shrink hidden page-nav buttons on Android so they don't eat long-press (#4501)

On Android, the four 80x80 page-navigation buttons stay mounted on top of the foliate viewer even when hidden (opacity-0). pointer-events:none can't be used on Android (it breaks touch propagation to the iframe), so the prev/next-section buttons already have an h-4 w-4 fallback for the hidden state. The prev-page / next-page buttons were missing this fallback and therefore kept covering ~80x80 hot zones in the lower-left and lower-right of the page, swallowing long-press touches on the first/last words of the bottom two lines so they could neither be highlighted nor open the toolbar. Apply the same h-4 w-4 fallback to those two buttons.

apps/readest-app/src/app/reader/components/PageNavigationButtons.tsx

@@ -111,7 +111,10 @@ const PageNavigationButtons: React.FC<PageNavigationButtonsProps> = ({
         </button>
         <button
           onClick={handleGoLeftPage}
-          className='flex h-20 w-20 items-center justify-center focus:outline-none'
+          className={clsx(
+            'flex h-20 w-20 items-center justify-center focus:outline-none',
+            !isPageNavigationButtonsVisible && appService?.isAndroidApp && 'h-4 w-4',
+          )}
           aria-hidden={false}
           aria-label={getLeftPageLabel()}
           tabIndex={0}
@@ -139,7 +142,10 @@ const PageNavigationButtons: React.FC<PageNavigationButtonsProps> = ({
       >
         <button
           onClick={handleGoRightPage}
-          className='flex h-20 w-20 items-center justify-center focus:outline-none'
+          className={clsx(
+            'flex h-20 w-20 items-center justify-center focus:outline-none',
+            !isPageNavigationButtonsVisible && appService?.isAndroidApp && 'h-4 w-4',
+          )}
           aria-hidden={false}
           aria-label={getRightPageLabel()}
           tabIndex={0}