feat(ui): inline conflict resolution with Keep This button

Replace the 'Go to Conflicts Page' link with inline conflict resolution.
Each conflict source now has a 'Keep This' button that resolves the
conflict directly from the book detail page.

- Conflict data now keyed by source name (koreader, web) instead of
  new/existing, with Source and Timestamp fields
- Display percentage scaled correctly (* 100)
- Fix page field name from current_page to page
- Add conflict resolution JavaScript in book-detail.ts
- Add 10-minute cooldown after resolution to prevent re-detection

templates/book_detail_modals.templ

@@ -37,15 +37,8 @@ templ ProgressSyncModal(user User, book handlers.MediaDetail) {
 						⚠️ Conflict Detected
 					</p>
 					<p class="text-sm" style="color: var(--text-secondary);">
-						Progress differs between devices. Review the options below and manually resolve via the Conflicts page.
+						Progress differs between devices. Choose which version to keep.
 					</p>
-					<a
-						href="/conflicts"
-						class="inline-block mt-3 px-4 py-2 rounded-lg text-sm font-semibold"
-						style="background-color: #f59e0b; color: white; text-decoration: none;"
-					>
-						Go to Conflicts Page →
-					</a>
 				</div>
 				<div class="space-y-4">
 					for source, data := range book.ActiveConflict.ConflictData {
@@ -59,21 +52,27 @@ templ ProgressSyncModal(user User, book handlers.MediaDetail) {
 										class="inline-block px-2 py-1 rounded text-xs font-semibold capitalize mb-2"
 										style="background-color: var(--accent); color: white;"
 									>
-										{ source }
+										{ data.Source }
 									</span>
 									<p class="text-xs" style="color: var(--text-secondary);">
 										{ FormatInTimezone(data.Timestamp, user.Timezone) }
 									</p>
 								</div>
 								<div class="text-right">
-									<div class="text-3xl font-bold" style="color: var(--accent);">
-										{ fmt.Sprintf("%.1f", data.Data["percentage"].(float64)) }%
-									</div>
+									if data.Data["percentage"] != nil {
+										<div class="text-3xl font-bold" style="color: var(--accent);">
+											{ fmt.Sprintf("%.1f", data.Data["percentage"].(float64) * 100) }%
+										</div>
+									}
 								</div>
 							</div>
-							if data.Data["current_page"] != nil {
+							if data.Data["page"] != nil {
 								<div class="text-sm" style="color: var(--text-secondary);">
-									Page: { fmt.Sprintf("%.0f", data.Data["current_page"].(float64)) } / { fmt.Sprintf("%.0f", data.Data["total_pages"].(float64)) }
+									if data.Data["total_pages"] != nil {
+										Page: { fmt.Sprintf("%.0f", data.Data["page"].(float64)) } / { fmt.Sprintf("%.0f", data.Data["total_pages"].(float64)) }
+									} else {
+										Page: { fmt.Sprintf("%.0f", data.Data["page"].(float64)) }
+									}
 								</div>
 							}
 							if data.Data["epubcfi"] != nil {
@@ -81,6 +80,15 @@ templ ProgressSyncModal(user User, book handlers.MediaDetail) {
 									CFI: { data.Data["epubcfi"].(string) }
 								</div>
 							}
+							<div class="mt-3">
+								<button
+									@click={"resolveConflict('" + book.ActiveConflict.ID + "', '" + source + "')"}
+									class="px-3 py-1.5 rounded-lg text-sm font-semibold"
+									style="background-color: var(--accent); color: white;"
+								>
+									Keep This
+								</button>
+							</div>
 						</div>
 					}
 				</div>

web/src/book-detail.ts

@@ -104,6 +104,7 @@ interface MetadataEditorState {
   generateCover(): Promise<void>;
   removeCover(): void;
   saveMetadata(): Promise<void>;
+  resolveConflict(conflictId: string, winner: string): Promise<void>;
 }
 
 Alpine.data("bookDetail", () => {
@@ -149,6 +150,33 @@ Alpine.data("bookDetail", () => {
     hideProgressSyncModal,
     hideNotesModal,
 
+    async resolveConflict(conflictId: string, winner: string) {
+      try {
+        const resp = await fetch(`/api/conflicts/${conflictId}/resolve`, {
+          method: "POST",
+          headers: {
+            Authorization: getAuthHeader(),
+            "Content-Type": "application/json",
+          },
+          body: JSON.stringify({ winner }),
+        });
+
+        if (!resp.ok) {
+          const err = await resp.json().catch(() => ({}));
+          throw new Error(err.error || err.message || "Failed to resolve conflict");
+        }
+
+        hideProgressSyncModal();
+        showToast("Conflict resolved successfully", "success");
+        setTimeout(() => window.location.reload(), 500);
+      } catch (e) {
+        showToast(
+          e instanceof Error ? e.message : "Failed to resolve conflict",
+          "error",
+        );
+      }
+    },
+
     init() {
       const link = document.getElementById("back-link");
       if (!link) return;