fix(pwa): align update prompt with app button styles

web/src/core/pwa.ts

@@ -32,6 +32,7 @@ export function watchPwaUpdates(
   message.setAttribute('role', 'status');
   message.textContent = '新版本已准备好';
   const button = document.createElement('button');
+  button.className = 'button primary';
   button.type = 'button';
   button.textContent = '立即更新';
   banner.append(message, button);

web/src/styles/pwa.css

@@ -11,13 +11,23 @@
   flex-wrap: wrap;
   align-items: center;
   justify-content: center;
-  gap: .75rem;
-  padding: .75rem 1rem;
+  gap: 1rem;
+  padding: .625rem .625rem .625rem 1rem;
   border: 1px solid var(--reader-line);
-  border-radius: .75rem;
+  border-radius: 1rem;
   background: var(--reader-surface);
   color: var(--reader-ink);
-  box-shadow: 0 4px 20px #0002;
+  box-shadow: 0 4px 16px #0000000d;
+  font-size: .875rem;
+  line-height: 1.5;
+}
+.pwa-update .button {
+  min-height: 44px;
+  flex: none;
+  padding: .625rem 1rem;
+  border-radius: .75rem;
+  font: inherit;
+  font-weight: 600;
+  white-space: nowrap;
 }
-.pwa-update button { min-height: 44px; padding: .5rem 1rem; }
 .pwa-update button:focus-visible { outline: 2px solid var(--reader-accent); outline-offset: 2px; }

web/tools/pwa/smoke.mjs

@@ -85,6 +85,15 @@ try {
     await page.setViewportSize({ width: 320, height: 640 });
     const updateButton = page.getByRole('button', { name: '立即更新', exact: true });
     await updateButton.waitFor();
+    if (process.env.PWA_SCREENSHOT_DIR) {
+      for (const theme of ['light', 'dark']) {
+        await page.evaluate((value) => { document.documentElement.dataset.theme = value; }, theme);
+        await page.locator('.pwa-update').screenshot({
+          path: `${process.env.PWA_SCREENSHOT_DIR}/reader-pwa-${theme}.png`,
+          style: '.notyf { visibility: hidden !important; }',
+        });
+      }
+    }
     const bounds = await page.locator('.pwa-update').boundingBox();
     assert(bounds && bounds.x >= 0 && bounds.x + bounds.width <= 320);
     await page.evaluate(() => {