docs: rebuild README previews from 2x captures

Rework the product preview section around three real screens captured at
deviceScaleFactor 2 instead of the previous 900 px shots taken at a 75%
browser zoom, which read as blurry.

- capture the conversation workspace, the agent customization page and the
  visitor widget, then crop each one to a consistent frame
- drop the tight 480 px widget crop and its leftover gray strip
- restructure the preview section with one lead line and a caption per shot,
  and fold the local start-up steps into a shorter quick start
- keep the browser overlay out of the captures and note the method in the
  asset manifest
- finish the visible ReplyPier rename (sidebar wordmark, widget footer,
  page title, login screen, demo page) so screenshots and UI agree

deploy/local/demo.template.html

@@ -4,7 +4,7 @@
   <meta charset="utf-8">
   <meta name="viewport" content="width=device-width,initial-scale=1">
   <link rel="icon" type="image/svg+xml" href="/favicon.svg?v=paper-boat">
-  <title>ChatterMate 网站客服测试</title>
+  <title>ReplyPier 网站客服测试</title>
   <style>
     * { box-sizing: border-box; }
     body { margin: 0; min-height: 100vh; color: #172033; background: #f5f7fb; font: 17px/1.8 system-ui, sans-serif; }
@@ -22,9 +22,9 @@
 </head>
 <body>
   <main>
-    <div class="eyebrow">CHATTERMATE · 本机测试</div>
+    <div class="eyebrow">REPLYPIER · 本机测试</div>
     <h1>你的网页，接入 AI 与人工客服。</h1>
-    <p>点击右下角悬浮按钮展开对话。这里连接的是本机部署的 ChatterMate 和你配置的 DeepSeek。</p>
+    <p>点击右下角悬浮按钮展开对话。这里连接的是本机部署的 ReplyPier 和你配置的模型。</p>
     <section>
       <h2>按这个顺序试一遍</h2>
       <ol>