docs(site): rebuild the landing page in a keynote register

docs/.vitepress/config.mts

@@ -167,7 +167,8 @@ const zhNav: DefaultTheme.NavItem[] = [
 export default defineConfig({
   title: 'PI-Desktop',
   description: 'A modular desktop workspace for AI agents',
-  appearance: 'dark',
+  // Product shell is dark-base; lock docs to the same charcoal system.
+  appearance: 'force-dark',
   cleanUrls: true,
   lastUpdated: true,
   head: [

docs/.vitepress/theme/Layout.vue

@@ -11,7 +11,7 @@ const { frontmatter, localeIndex } = useData()
 <template>
   <Layout>
     <template #home-hero-image>
-      <HomeHeroVisual v-if="frontmatter.layout === 'home'" :locale="localeIndex" />
+      <HomeHeroVisual v-if="frontmatter.layout === 'home'" />
     </template>
     <template #home-features-after>
       <HomeModules

docs/.vitepress/theme/components/HomeHeroVisual.vue

@@ -1,56 +1,18 @@
 <script setup lang="ts">
-import { computed, ref, watch } from 'vue'
-
-const props = defineProps<{ locale: string }>()
-const isZh = computed(() => props.locale === 'zh-CN')
-
-const shotSrc = '/hero-workspace.webp'
-const loaded = ref(false)
-watch(
-  () => props.locale,
-  () => {
-    loaded.value = false
-  }
-)
-
-const caption = computed(() =>
-  isZh.value
-    ? {
-        title: '本地优先的智能体工作区',
-        meta: '会话 · 子代理 · 文件 · 插件',
-      }
-    : {
-        title: 'A local-first workspace for AI agents',
-        meta: 'Sessions · subagents · files · plugins',
-      }
-)
+const shotSrc = '/readme/home.webp'
 </script>
 
 <template>
-  <div
-    class="home-stage"
-    :aria-label="isZh ? 'PI-Desktop 产品界面预览' : 'PI-Desktop product preview'"
-  >
-    <div class="home-stage__frame">
-      <img
-        class="home-stage__shot"
-        :class="{ 'is-loaded': loaded }"
-        :src="shotSrc"
-        :alt="
-          isZh
-            ? 'PI-Desktop 多智能体协作与文件管理工作区截图'
-            : 'PI-Desktop multi-agent workspace with file manager screenshot'
-        "
-        width="1800"
-        height="1012"
-        decoding="async"
-        fetchpriority="high"
-        @load="loaded = true"
-      />
-    </div>
-    <div class="home-stage__caption">
-      <strong>{{ caption.title }}</strong>
-      <span>{{ caption.meta }}</span>
-    </div>
+  <div class="hero-visual" aria-hidden="false">
+    <div class="hero-visual__glow"></div>
+    <img
+      class="hero-visual__shot"
+      :src="shotSrc"
+      alt="PI-Desktop workspace"
+      width="2560"
+      height="1440"
+      decoding="async"
+      fetchpriority="high"
+    />
   </div>
 </template>