style(appShell): 优化应用外壳及底部导航样式与结构

- 在 tailwind 配置中添加应用外壳相关的 safelist 类名
- 替换 App.tsx 中应用外壳容器的类名，去除多余的内边距容器
- 在现代和遗留样式文件中新增移动端全屏、桌面居中列的样式规则
- 新增底部导航外层和内层的样式及响应式布局支持
- appShell.ts 中将样式类改为统一的 x8- 前缀类名
- BottomNav 组件使用新的样式类名以匹配样式调整
- Home 页面 ListRow 组件支持可选缩略图展示，增加界面展示丰富度

client/src/index.legacy.css

@@ -6,9 +6,22 @@
 html,
 body,
 #root {
+  width: 100%;
+  max-width: 100%;
   height: 100%;
 }
 
+@media (max-width: 1023px) {
+  html,
+  body {
+    overflow-x: hidden;
+    overscroll-behavior-x: none;
+  }
+  #root {
+    overflow-x: hidden;
+  }
+}
+
 body {
   background: #000;
   color: #f2f2f2;
@@ -44,6 +57,62 @@ body {
 }
 
 @layer components {
+  /* App shell: mobile full-bleed, desktop centered column (plain CSS for Chrome 91). */
+  .x8-app-shell-outer {
+    min-height: 100vh;
+    min-height: -webkit-fill-available;
+    width: 100%;
+    min-width: 0;
+    display: flex;
+    justify-content: center;
+    background-color: #0d1117;
+    padding-left: 0;
+    padding-right: 0;
+  }
+
+  .x8-app-shell-column {
+    min-height: 100vh;
+    min-height: -webkit-fill-available;
+    width: 100%;
+    min-width: 0;
+    max-width: none;
+  }
+
+  .x8-bottom-nav-outer {
+    pointer-events: none;
+    position: fixed;
+    left: 0;
+    right: 0;
+    bottom: 0;
+    z-index: 50;
+    display: flex;
+    width: 100%;
+    min-width: 0;
+    justify-content: center;
+    padding-left: 0;
+    padding-right: 0;
+  }
+
+  .x8-bottom-nav-inner {
+    pointer-events: auto;
+    width: 100%;
+    min-width: 0;
+    max-width: none;
+  }
+
+  @media (min-width: 1024px) {
+    .x8-app-shell-outer,
+    .x8-bottom-nav-outer {
+      padding-left: 1.5rem;
+      padding-right: 1.5rem;
+    }
+
+    .x8-app-shell-column,
+    .x8-bottom-nav-inner {
+      max-width: 1180px;
+    }
+  }
+
   /* Match modern .cyan-slider styling (input[type=range]) for legacy build. */
   .cyan-slider {
     -webkit-appearance: none;