优化: UI/UX 走查修复与跨模块样式统一治理

- 前四批:暗色 UA 重置+color-scheme、知识详情窄屏双闸、启动链 6 点加固、原生 tooltip 换 CSS
- 统一治理:新建 --df-pad-page/--df-fs-item/--df-on-accent token 与 .df-seg/.modal-box--sm--md/.df-badge--solid/.empty-icon--sm--xs 公共类
- 收编:status-tag 双规格、AuditLog 容器、模态自建块、空态图标四档、加载更多三实现、圆角/字号/mono 栈字面量约 60 处
- 根修:.page-header h1 加压缩保护(治标题竖排);KnowledgeDetail hover token 笔误

index.html

@@ -5,6 +5,21 @@
     <link rel="icon" type="image/svg+xml" href="/vite.svg" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
     <title>DevFlow</title>
+    <style>
+      /* 启动期加载占位:纯 CSS spinner,Vue mount 后随 #app 内容替换 */
+      .boot-loading {
+        position: fixed; inset: 0;
+        display: flex; align-items: center; justify-content: center;
+      }
+      .boot-spinner {
+        width: 36px; height: 36px;
+        border: 3px solid rgba(123, 111, 240, 0.2);
+        border-top-color: #7b6ff0;
+        border-radius: 50%;
+        animation: boot-spin 0.8s linear infinite;
+      }
+      @keyframes boot-spin { to { transform: rotate(360deg); } }
+    </style>
   </head>
   <body style="background:#0c0e1a">
     <script>
@@ -15,7 +30,9 @@
         document.documentElement.setAttribute('data-theme', 'light');
     </script>
     <script type="module" src="/src/mocks/tauri-shim.ts"></script>
-    <div id="app"></div>
+    <div id="app">
+      <div class="boot-loading"><div class="boot-spinner"></div></div>
+    </div>
     <script type="module" src="/src/main.ts"></script>
   </body>
 </html>