fix(ebook-reader): improve image loading, keyboard nav, and progress tracking

- Add enhanced image path lookup (findImageInResources) that tries multiple
  path variations: full path, relative path, filename only, without extension,
  and common extensions (.jpg, .jpeg, .gif, .webp, .svg, .png)
- Fix keyboard navigation by focusing container on reader init
- Implement Kindle-style page display using pageCalculationResult for both
  currentPage and totalPages instead of raw spine index
- Store computed currentPage in state during scroll for UI display
- Extend progress API to send character offset, chapter index, and percentage
  for accurate cross-device sync (backend already supports these fields)

web/src/reader/core/reader-services.ts

@@ -5,17 +5,43 @@ interface ReadingProgress {
   total_pages: number;
 }
 
+interface ExtendedProgress {
+  character?: number;
+  chapter?: number;
+  percentage?: number;
+}
+
 export async function updateReadingProgress(
   mediaItemId: string,
   progress: ReadingProgress,
+  extended?: ExtendedProgress,
 ): Promise<void> {
   if (!mediaItemId || mediaItemId === "undefined") {
     console.warn("Skipping progress update - no valid mediaItemId");
     return;
   }
+  const payload: any = {
+    location: {
+      page: progress.current_page,
+      total_pages: progress.total_pages,
+    },
+  };
+
+  if (extended) {
+    if (extended.character !== undefined) {
+      payload.location.character = extended.character;
+    }
+    if (extended.chapter !== undefined) {
+      payload.location.chapter = extended.chapter;
+    }
+    if (extended.percentage !== undefined) {
+      payload.location.percentage = extended.percentage;
+    }
+  }
+
   const response = await apiPut(
     `/media-items/${mediaItemId}/progress`,
-    progress,
+    payload,
   );
   if (!response.ok) {
     const errorText = await response.text();