fix(reader): fit duokan-page-fullscreen cover image without cropping (#4328)

Closes #3914. Switch the page-fullscreen image to object-fit: contain
(and SVG preserveAspectRatio meet) so cover images fit the page and
center without cropping. Also adds a duokan-image-gallery-cell layout
helper and drops the mobile marginBottomPx override.

Co-authored-by: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

apps/readest-app/src/__tests__/services/constants.test.ts

@@ -553,7 +553,6 @@ describe('services/constants', () => {
       expect(DEFAULT_MOBILE_VIEW_SETTINGS.fullJustification).toBe(false);
       expect(DEFAULT_MOBILE_VIEW_SETTINGS.animated).toBe(true);
       expect(typeof DEFAULT_MOBILE_VIEW_SETTINGS.defaultFont).toBe('string');
-      expect(typeof DEFAULT_MOBILE_VIEW_SETTINGS.marginBottomPx).toBe('number');
       expect(DEFAULT_MOBILE_VIEW_SETTINGS.disableDoubleClick).toBe(true);
       expect(typeof DEFAULT_MOBILE_VIEW_SETTINGS.spreadMode).toBe('string');
     });

apps/readest-app/src/services/constants.ts

@@ -290,7 +290,6 @@ export const DEFAULT_MOBILE_VIEW_SETTINGS: Partial<ViewSettings> = {
   fullJustification: false,
   animated: true,
   defaultFont: 'Sans-serif',
-  marginBottomPx: 16,
   disableDoubleClick: true,
   spreadMode: 'none',
 };

apps/readest-app/src/utils/style.ts

@@ -323,6 +323,14 @@ const getPageLayoutStyles = (
     display: none;
   }
 
+  .duokan-image-gallery-cell {
+    height: calc(var(--available-height) * 1px);
+  }
+
+  .duokan-image-gallery-cell img {
+    height: 90%;
+  }
+
   div:has(> img, > svg) {
     max-width: 100% !important;
   }