diff --git a/src/App.vue b/src/App.vue
index 5f57b89..c7caca8 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -11,6 +11,7 @@
 
 <script setup>
 import { computed, onBeforeUnmount, onMounted, watch } from 'vue';
+import '@/styles/dark-mode-overrides.css';
 import { useUserStore } from './store/user';
 import { ElConfigProvider } from 'element-plus';
 import zhCn from 'element-plus/es/locale/lang/zh-cn';
@@ -37,7 +38,6 @@ watch(
 );
 
 onMounted(() => {
-  applyDarkModeClass();
   darkModeObserver = new MutationObserver(() => {
     const enabled = Boolean(userStore.darkMode);
     const rootMatches = document.documentElement.classList.contains('dark-mode') === enabled;
@@ -150,71 +150,4 @@ body {
 .common-tabs .el-tabs__active-bar {
   background-color: var(--primary-color);
 }
-
-/* 深色模式下的Element Plus组件样式 */
-.dark-mode {
-
-  /* 输入框文字颜色（EP 变量覆盖不到原生 input） */
-  input[type="text"],
-  input[type="password"],
-  input[type="email"] {
-    color: var(--el-input-text-color);
-  }
-
-  /* message box 背景统一 */
-  .el-message-box,
-  .el-message-box__header,
-  .el-message-box__content,
-  .el-message-box__btns {
-    background-color: var(--el-fill-color-blank);
-  }
-
-  .el-message-box__header { border-bottom: none; }
-  .el-message-box__btns { border-top: none; }
-
-  /* select dropdown 项 */
-  .el-select-dropdown__item.selected {
-    background-color: var(--el-color-primary-light-9);
-    color: var(--el-color-primary);
-  }
-
-  /* date picker panel */
-  .el-picker-panel__body,
-  .el-picker-panel__content {
-    background-color: var(--el-fill-color-blank);
-    color: var(--el-text-color-regular);
-  }
-
-  .el-date-table td.in-range div,
-  .el-date-table td.available:hover div {
-    background-color: var(--bg-medium);
-  }
-
-  /* 数字输入按钮 */
-  .el-input-number__decrease,
-  .el-input-number__increase {
-    background-color: var(--bg-medium);
-    color: var(--text-dark);
-    border-color: var(--border-color);
-  }
-
-  .el-input-number__decrease:hover,
-  .el-input-number__increase:hover {
-    background-color: var(--bg-light);
-  }
-
-  /* 对话框边框 */
-  .el-dialog__header {
-    border-bottom: 1px solid var(--el-border-color);
-  }
-
-  .el-dialog__footer {
-    border-top: 1px solid var(--el-border-color);
-  }
-
-  /* 加载动画 */
-  .el-loading-spinner .path {
-    stroke: var(--primary-color);
-  }
-}
 </style>
diff --git a/src/composables/actions/useApiAction.js b/src/composables/actions/useApiAction.js
index 695e5d9..2492c74 100644
--- a/src/composables/actions/useApiAction.js
+++ b/src/composables/actions/useApiAction.js
@@ -2,9 +2,6 @@ import { ElMessage } from 'element-plus';
 import { useAsyncAction } from '@/composables/actions/useAsyncAction';
 
 export const isActionCancelled = (error) => {
-  if (error === null || error === undefined) {
-    return false;
-  }
   if (typeof error === 'string') {
     return error === 'cancel' || error === 'close';
   }
diff --git a/src/composables/document/editor/rich-text-editor/useRichTextLinkOverlay.js b/src/composables/document/editor/rich-text-editor/useRichTextLinkOverlay.js
index 876ef33..3b80867 100644
--- a/src/composables/document/editor/rich-text-editor/useRichTextLinkOverlay.js
+++ b/src/composables/document/editor/rich-text-editor/useRichTextLinkOverlay.js
@@ -105,8 +105,8 @@ export function useRichTextLinkOverlay(options = {}) {
     const maxTop = container.scrollTop + container.clientHeight - cardHeight - 8;
 
     linkHoverStyle.value = {
-      left: `${Math.max(minLeft, Math.min(rawLeft, Math.max(minLeft, maxLeft)))}px`,
-      top: `${Math.max(minTop, Math.min(rawTop, Math.max(minTop, maxTop)))}px`
+      left: `${Math.max(minLeft, Math.min(rawLeft, maxLeft))}px`,
+      top: `${Math.max(minTop, Math.min(rawTop, maxTop))}px`
     };
     linkHoverHref.value = href;
     hoverAnchorPos.value = resolveAnchorPos(anchorEl);
diff --git a/src/composables/document/editor/useDocumentEditorPolicy.js b/src/composables/document/editor/useDocumentEditorPolicy.js
index 65f231c..2e818b2 100644
--- a/src/composables/document/editor/useDocumentEditorPolicy.js
+++ b/src/composables/document/editor/useDocumentEditorPolicy.js
@@ -16,8 +16,6 @@ export function useDocumentEditorPolicy(options = {}) {
   const isSlideDocument = computed(() => normalizedDocType.value === '3');
   const isRichTextDocument = computed(() => normalizedDocType.value === '4');
 
-  const canManageAttachments = computed(() => hasDocument.value);
-  const canManageSettings = computed(() => hasDocument.value);
   const collabEnabled = computed(
     () => hasDocument.value && (isMarkdownDocument.value || isRichTextDocument.value)
   );
@@ -35,8 +33,6 @@ export function useDocumentEditorPolicy(options = {}) {
     isTableDocument,
     isSlideDocument,
     isRichTextDocument,
-    canManageAttachments,
-    canManageSettings,
     collabEnabled,
     inlineCommentEnabled,
     createDialogKnowledgeBaseId,
diff --git a/src/composables/document/editor/useDocumentRouteContext.js b/src/composables/document/editor/useDocumentRouteContext.js
index 5de81b4..9a12b5b 100644
--- a/src/composables/document/editor/useDocumentRouteContext.js
+++ b/src/composables/document/editor/useDocumentRouteContext.js
@@ -13,7 +13,7 @@ export function useDocumentRouteContext({ props, route }) {
   const collabEnabled = computed(() => !!docId.value);
   const collabRoom = computed(() => (docId.value ? `${docId.value}` : ''));
   const collabUrl = computed(() => '/ws/doc');
-  const collabToken = computed(() => localStorage.getItem('token') || '');
+  const collabToken = localStorage.getItem('token') || '';
   const collabReady = ref(false);
   const lastSyncedDocId = ref('');
 
diff --git a/src/composables/document/tree/useDocumentTreeContextMenu.js b/src/composables/document/tree/useDocumentTreeContextMenu.js
index 1fbee5f..88fbdc0 100644
--- a/src/composables/document/tree/useDocumentTreeContextMenu.js
+++ b/src/composables/document/tree/useDocumentTreeContextMenu.js
@@ -1,17 +1,5 @@
 import { ref } from 'vue';
-
-const resolveBool = (valueOrGetterOrRef, fallback = false) => {
-  if (typeof valueOrGetterOrRef === 'function') {
-    return valueOrGetterOrRef();
-  }
-  if (valueOrGetterOrRef && typeof valueOrGetterOrRef === 'object' && 'value' in valueOrGetterOrRef) {
-    return valueOrGetterOrRef.value;
-  }
-  if (valueOrGetterOrRef === undefined) {
-    return fallback;
-  }
-  return Boolean(valueOrGetterOrRef);
-};
+import { resolveBool } from '@/utils/resolveBool';
 
 export function useDocumentTreeContextMenu(options = {}) {
   const { enabled = true } = options;
diff --git a/src/composables/document/tree/useInlineRename.js b/src/composables/document/tree/useInlineRename.js
index 9f4d818..79698be 100644
--- a/src/composables/document/tree/useInlineRename.js
+++ b/src/composables/document/tree/useInlineRename.js
@@ -1,17 +1,5 @@
 import { nextTick, ref } from 'vue';
-
-const resolveBool = (valueOrGetterOrRef, fallback = false) => {
-  if (typeof valueOrGetterOrRef === 'function') {
-    return valueOrGetterOrRef();
-  }
-  if (valueOrGetterOrRef && typeof valueOrGetterOrRef === 'object' && 'value' in valueOrGetterOrRef) {
-    return valueOrGetterOrRef.value;
-  }
-  if (valueOrGetterOrRef === undefined) {
-    return fallback;
-  }
-  return Boolean(valueOrGetterOrRef);
-};
+import { resolveBool } from '@/utils/resolveBool';
 
 export function useInlineRename(options = {}) {
   const { revertRename = true, onConfirm = null } = options;
diff --git a/src/composables/knowledge-base/useKnowledgeBaseDetailPage.js b/src/composables/knowledge-base/useKnowledgeBaseDetailPage.js
index 14890d5..4409ec3 100644
--- a/src/composables/knowledge-base/useKnowledgeBaseDetailPage.js
+++ b/src/composables/knowledge-base/useKnowledgeBaseDetailPage.js
@@ -11,6 +11,7 @@ import { useTemplateCatalog } from '@/composables/template/useTemplateCatalog';
 import { usePageBoot } from '@/composables/shell/usePageBoot';
 import { useApiAction } from '@/composables/actions/useApiAction';
 import { DEFAULT_DOCUMENT_TYPE, normalizeDocumentType } from '@/utils/documentType';
+import { formatDate as _formatDate } from '@/utils/formatDate';
 
 export function useKnowledgeBaseDetailPage({ t, router, route, userStore, locale }) {
   const { runWithLoading, createApiErrorHandler } = useApiAction({ t });
@@ -73,11 +74,7 @@ export function useKnowledgeBaseDetailPage({ t, router, route, userStore, locale
     { value: 'type', label: t('knowledgeBase.sortByType') }
   ]);
 
-  const formatDate = (dateString) => {
-    if (!dateString) return t('common.unknown');
-    const date = new Date(dateString);
-    return date.toLocaleDateString();
-  };
+  const formatDate = (value) => _formatDate(value, { fallback: t('common.unknown') });
 
   const knowledgeBaseStats = computed(() => [
     { key: 'documents', icon: Document, label: t('knowledgeBase.documentsCount'), value: totalDocuments.value },
@@ -88,16 +85,19 @@ export function useKnowledgeBaseDetailPage({ t, router, route, userStore, locale
   const directoryTreeData = computed(() => {
     if (!knowledgeBaseData.value?.documents) return [];
 
-    const mapDoc = (doc, parentId = null) => ({
-      id: doc.external_id,
-      label: doc.title,
-      type: doc.type,
-      isFolder: doc.hasChildren || (doc.children && doc.children.length > 0),
-      isLeaf: !(doc.hasChildren || (doc.children && doc.children.length > 0)),
-      tags: doc.tags || [],
-      parentId,
-      children: doc.children ? doc.children.map((child) => mapDoc(child, doc.external_id)) : []
-    });
+    const mapDoc = (doc, parentId = null) => {
+      const isFolder = doc.hasChildren || (doc.children && doc.children.length > 0);
+      return {
+        id: doc.external_id,
+        label: doc.title,
+        type: doc.type,
+        isFolder,
+        isLeaf: !isFolder,
+        tags: doc.tags || [],
+        parentId,
+        children: doc.children ? doc.children.map((child) => mapDoc(child, doc.external_id)) : []
+      };
+    };
 
     return knowledgeBaseData.value.documents.map((doc) => mapDoc(doc));
   });
diff --git a/src/composables/knowledge-base/useKnowledgeBaseListPage.js b/src/composables/knowledge-base/useKnowledgeBaseListPage.js
index e704f65..3ce1b89 100644
--- a/src/composables/knowledge-base/useKnowledgeBaseListPage.js
+++ b/src/composables/knowledge-base/useKnowledgeBaseListPage.js
@@ -3,6 +3,7 @@ import * as api from '@/services/api';
 import { usePagedList } from '@/composables/list/usePagedList';
 import { useLazyTabLoader } from '@/composables/list/useLazyTabLoader';
 import { isActionCancelled, useApiAction } from '@/composables/actions/useApiAction';
+import { formatDate as _formatDate } from '@/utils/formatDate';
 
 export function useKnowledgeBaseListPage({ t, router }) {
   const { runApi } = useApiAction({ t });
@@ -39,11 +40,7 @@ export function useKnowledgeBaseListPage({ t, router }) {
     }
   });
 
-  const formatDate = (dateString) => {
-    if (!dateString) return t('common.unknown');
-    const date = new Date(dateString);
-    return date.toLocaleDateString();
-  };
+  const formatDate = (value) => _formatDate(value, { fallback: t('common.unknown') });
 
   const myTagMapper = (kb) => (kb.is_public ? null : { type: 'info', label: t('knowledgeBase.private') });
   const recentTagMapper = (kb) => (kb.is_public ? { type: 'success', label: t('knowledgeBase.public') } : null);
diff --git a/src/composables/layout/createExpiringCache.js b/src/composables/layout/createExpiringCache.js
new file mode 100644
index 0000000..930c4bf
--- /dev/null
+++ b/src/composables/layout/createExpiringCache.js
@@ -0,0 +1,105 @@
+const CACHE_TTL_MS = 24 * 60 * 60 * 1000;
+
+const resolveCurrentUserKey = () => {
+  if (typeof window === 'undefined') return 'guest';
+  try {
+    const raw = localStorage.getItem('userInfo');
+    if (!raw) return 'guest';
+    const userInfo = JSON.parse(raw);
+    return String(userInfo?.external_id || userInfo?.externalId || 'guest').trim() || 'guest';
+  } catch {
+    return 'guest';
+  }
+};
+
+export const createExpiringCache = ({ storageKey, itemsField }) => {
+  const memoryCache = new Map();
+
+  const readStorage = () => {
+    if (typeof window === 'undefined') return {};
+    try {
+      const raw = localStorage.getItem(storageKey);
+      if (!raw) return {};
+      const parsed = JSON.parse(raw);
+      if (!parsed || typeof parsed !== 'object') return {};
+      return parsed;
+    } catch {
+      return {};
+    }
+  };
+
+  const writeStorage = (cacheObj) => {
+    if (typeof window === 'undefined') return;
+    try {
+      localStorage.setItem(storageKey, JSON.stringify(cacheObj));
+    } catch {}
+  };
+
+  const normalizeItems = (items) => {
+    if (!Array.isArray(items)) return [];
+    return items.map((item) => String(item || '').trim()).filter(Boolean);
+  };
+
+  const isEntryExpired = (entry, now = Date.now()) => {
+    const expiresAt = Number(entry?.expiresAt || 0);
+    return !Number.isFinite(expiresAt) || expiresAt <= now;
+  };
+
+  const normalizeEntry = (entry) => {
+    if (Array.isArray(entry)) return null;
+    if (!entry || typeof entry !== 'object') return null;
+    const items = normalizeItems(entry[itemsField]);
+    const expiresAt = Number(entry.expiresAt || 0);
+    if (!Number.isFinite(expiresAt)) return null;
+    return { [itemsField]: items, expiresAt };
+  };
+
+  const purgeExpired = (storageCache, now = Date.now()) => {
+    let changed = false;
+    Object.keys(storageCache || {}).forEach((key) => {
+      const normalized = normalizeEntry(storageCache[key]);
+      if (!normalized || isEntryExpired(normalized, now)) {
+        delete storageCache[key];
+        changed = true;
+      }
+    });
+    if (changed) writeStorage(storageCache);
+  };
+
+  const buildKey = (scope) => {
+    const scopeKey = String(scope || '').trim();
+    if (!scopeKey) return '';
+    return `${resolveCurrentUserKey()}::${scopeKey}`;
+  };
+
+  const get = (scope) => {
+    const key = buildKey(scope);
+    if (!key) return null;
+    const now = Date.now();
+    const memoryValue = normalizeEntry(memoryCache.get(key));
+    if (memoryValue && !isEntryExpired(memoryValue, now)) {
+      return [...memoryValue[itemsField]];
+    }
+    if (memoryValue) memoryCache.delete(key);
+    const storageCache = readStorage();
+    purgeExpired(storageCache, now);
+    const storageEntry = normalizeEntry(storageCache[key]);
+    if (!storageEntry || isEntryExpired(storageEntry, now)) return null;
+    memoryCache.set(key, storageEntry);
+    return [...storageEntry[itemsField]];
+  };
+
+  const set = (scope, items) => {
+    const key = buildKey(scope);
+    if (!key) return;
+    const normalized = normalizeItems(items);
+    const entry = { [itemsField]: normalized, expiresAt: Date.now() + CACHE_TTL_MS };
+    memoryCache.set(key, entry);
+    const storageCache = readStorage();
+    purgeExpired(storageCache);
+    storageCache[key] = entry;
+    writeStorage(storageCache);
+  };
+
+  return { get, set };
+};
diff --git a/src/composables/layout/usePanelSidebar.js b/src/composables/layout/usePanelSidebar.js
index 5eee2e2..f833e47 100644
--- a/src/composables/layout/usePanelSidebar.js
+++ b/src/composables/layout/usePanelSidebar.js
@@ -16,7 +16,7 @@ export function usePanelSidebar(options = {}) {
 
   const toValidWidth = (value) => {
     const dynamicMax = typeof getMaxWidth === 'function' ? getMaxWidth() : maxWidth;
-    const hardMax = Math.max(minWidth, dynamicMax || maxWidth);
+    const hardMax = Math.max(minWidth, dynamicMax ?? maxWidth);
     return Math.min(Math.max(value, minWidth), hardMax);
   };
 
@@ -41,8 +41,8 @@ export function usePanelSidebar(options = {}) {
   });
 
   const resizing = ref(false);
-  const startX = ref(0);
-  const startWidth = ref(width.value);
+  let startX = 0;
+  let startWidth = width.value;
 
   const stopResize = () => {
     if (!resizing.value) return;
@@ -56,17 +56,17 @@ export function usePanelSidebar(options = {}) {
   const onResizeMove = (event) => {
     if (!resizing.value) return;
     const delta = resizeEdge === 'left'
-      ? startX.value - event.clientX
-      : event.clientX - startX.value;
-    width.value = toValidWidth(startWidth.value + delta);
+      ? startX - event.clientX
+      : event.clientX - startX;
+    width.value = toValidWidth(startWidth + delta);
   };
 
   const startResize = (event) => {
     if (collapsed.value) return;
     event.preventDefault();
     resizing.value = true;
-    startX.value = event.clientX;
-    startWidth.value = width.value;
+    startX = event.clientX;
+    startWidth = width.value;
     document.body.style.cursor = 'col-resize';
     document.body.style.userSelect = 'none';
     window.addEventListener('mousemove', onResizeMove);
diff --git a/src/composables/layout/useSideBarDisplayCache.js b/src/composables/layout/useSideBarDisplayCache.js
index b851fc9..23fdffc 100644
--- a/src/composables/layout/useSideBarDisplayCache.js
+++ b/src/composables/layout/useSideBarDisplayCache.js
@@ -1,126 +1,6 @@
-const CACHE_STORAGE_KEY = 'sideNavDisplayTabsCacheV2';
-const CACHE_TTL_MS = 24 * 60 * 60 * 1000;
-const memoryCache = new Map();
+import { createExpiringCache } from './createExpiringCache';
 
-const resolveCurrentUserKey = () => {
-  if (typeof window === 'undefined') return 'guest';
-  try {
-    const raw = localStorage.getItem('userInfo');
-    if (!raw) return 'guest';
-    const userInfo = JSON.parse(raw);
-    return String(userInfo?.external_id || userInfo?.externalId || 'guest').trim() || 'guest';
-  } catch {
-    return 'guest';
-  }
-};
+const cache = createExpiringCache({ storageKey: 'sideNavDisplayTabsCacheV2', itemsField: 'tabs' });
 
-const buildScopedSceneKey = (scene) => {
-  const sceneKey = String(scene || '').trim();
-  if (!sceneKey) return '';
-  return `${resolveCurrentUserKey()}::${sceneKey}`;
-};
-
-const readStorageCache = () => {
-  if (typeof window === 'undefined') return {};
-  try {
-    const raw = localStorage.getItem(CACHE_STORAGE_KEY);
-    if (!raw) return {};
-    const parsed = JSON.parse(raw);
-    if (!parsed || typeof parsed !== 'object') return {};
-    return parsed;
-  } catch {
-    return {};
-  }
-};
-
-const writeStorageCache = (cacheObj) => {
-  if (typeof window === 'undefined') return;
-  try {
-    localStorage.setItem(CACHE_STORAGE_KEY, JSON.stringify(cacheObj));
-  } catch {
-    // ignore storage write errors
-  }
-};
-
-const normalizeTabs = (tabs) => {
-  if (!Array.isArray(tabs)) return [];
-  return tabs
-    .map((item) => String(item || '').trim())
-    .filter(Boolean);
-};
-
-const isEntryExpired = (entry, now = Date.now()) => {
-  const expiresAt = Number(entry?.expiresAt || 0);
-  return !Number.isFinite(expiresAt) || expiresAt <= now;
-};
-
-const normalizeEntry = (entry) => {
-  if (Array.isArray(entry)) {
-    // Backward compatibility for old schema: treat as expired and ignore.
-    return null;
-  }
-  if (!entry || typeof entry !== 'object') return null;
-  const tabs = normalizeTabs(entry.tabs);
-  const expiresAt = Number(entry.expiresAt || 0);
-  if (!Number.isFinite(expiresAt)) return null;
-  return {
-    tabs,
-    expiresAt
-  };
-};
-
-const purgeExpiredStorageEntries = (storageCache, now = Date.now()) => {
-  let changed = false;
-  Object.keys(storageCache || {}).forEach((key) => {
-    const normalized = normalizeEntry(storageCache[key]);
-    if (!normalized || isEntryExpired(normalized, now)) {
-      delete storageCache[key];
-      changed = true;
-    }
-  });
-  if (changed) {
-    writeStorageCache(storageCache);
-  }
-};
-
-export const getSideBarDisplayTabsCache = (scene) => {
-  const key = buildScopedSceneKey(scene);
-  if (!key) return null;
-
-  const now = Date.now();
-
-  const memoryValue = normalizeEntry(memoryCache.get(key));
-  if (memoryValue && !isEntryExpired(memoryValue, now)) {
-    return [...memoryValue.tabs];
-  }
-  if (memoryValue && isEntryExpired(memoryValue, now)) {
-    memoryCache.delete(key);
-  }
-
-  const storageCache = readStorageCache();
-  purgeExpiredStorageEntries(storageCache, now);
-  const storageEntry = normalizeEntry(storageCache[key]);
-  if (!storageEntry || isEntryExpired(storageEntry, now)) {
-    return null;
-  }
-
-  memoryCache.set(key, storageEntry);
-  return [...storageEntry.tabs];
-};
-
-export const setSideBarDisplayTabsCache = (scene, tabs) => {
-  const key = buildScopedSceneKey(scene);
-  if (!key) return;
-
-  const normalized = normalizeTabs(tabs);
-  const entry = {
-    tabs: normalized,
-    expiresAt: Date.now() + CACHE_TTL_MS
-  };
-  memoryCache.set(key, entry);
-
-  const storageCache = readStorageCache();
-  purgeExpiredStorageEntries(storageCache);
-  storageCache[key] = entry;
-  writeStorageCache(storageCache);
-};
+export const getSideBarDisplayTabsCache = (scene) => cache.get(scene);
+export const setSideBarDisplayTabsCache = (scene, tabs) => cache.set(scene, tabs);
diff --git a/src/composables/layout/useTopNavDisplayCache.js b/src/composables/layout/useTopNavDisplayCache.js
index f2c2cde..9d0cd38 100644
--- a/src/composables/layout/useTopNavDisplayCache.js
+++ b/src/composables/layout/useTopNavDisplayCache.js
@@ -1,118 +1,6 @@
-const CACHE_STORAGE_KEY = 'topNavDisplayMenusCacheV1';
-const CACHE_TTL_MS = 24 * 60 * 60 * 1000;
-const memoryCache = new Map();
+import { createExpiringCache } from './createExpiringCache';
 
-const resolveCurrentUserKey = () => {
-  if (typeof window === 'undefined') return 'guest';
-  try {
-    const raw = localStorage.getItem('userInfo');
-    if (!raw) return 'guest';
-    const userInfo = JSON.parse(raw);
-    return String(userInfo?.external_id || userInfo?.externalId || 'guest').trim() || 'guest';
-  } catch {
-    return 'guest';
-  }
-};
+const cache = createExpiringCache({ storageKey: 'topNavDisplayMenusCacheV1', itemsField: 'menus' });
 
-const buildScopedKey = () => `${resolveCurrentUserKey()}::top-nav`;
-
-const readStorageCache = () => {
-  if (typeof window === 'undefined') return {};
-  try {
-    const raw = localStorage.getItem(CACHE_STORAGE_KEY);
-    if (!raw) return {};
-    const parsed = JSON.parse(raw);
-    if (!parsed || typeof parsed !== 'object') return {};
-    return parsed;
-  } catch {
-    return {};
-  }
-};
-
-const writeStorageCache = (cacheObj) => {
-  if (typeof window === 'undefined') return;
-  try {
-    localStorage.setItem(CACHE_STORAGE_KEY, JSON.stringify(cacheObj));
-  } catch {
-    // ignore storage write errors
-  }
-};
-
-const normalizeMenus = (menus) => {
-  if (!Array.isArray(menus)) return [];
-  return menus
-    .map((item) => String(item || '').trim())
-    .filter(Boolean);
-};
-
-const isEntryExpired = (entry, now = Date.now()) => {
-  const expiresAt = Number(entry?.expiresAt || 0);
-  return !Number.isFinite(expiresAt) || expiresAt <= now;
-};
-
-const normalizeEntry = (entry) => {
-  if (Array.isArray(entry)) {
-    // Backward compatibility for old schema: treat as expired.
-    return null;
-  }
-  if (!entry || typeof entry !== 'object') return null;
-  const menus = normalizeMenus(entry.menus);
-  const expiresAt = Number(entry.expiresAt || 0);
-  if (!Number.isFinite(expiresAt)) return null;
-  return {
-    menus,
-    expiresAt
-  };
-};
-
-const purgeExpiredStorageEntries = (storageCache, now = Date.now()) => {
-  let changed = false;
-  Object.keys(storageCache || {}).forEach((key) => {
-    const normalized = normalizeEntry(storageCache[key]);
-    if (!normalized || isEntryExpired(normalized, now)) {
-      delete storageCache[key];
-      changed = true;
-    }
-  });
-  if (changed) {
-    writeStorageCache(storageCache);
-  }
-};
-
-export const getTopNavDisplayMenusCache = () => {
-  const key = buildScopedKey();
-  const now = Date.now();
-
-  const memoryValue = normalizeEntry(memoryCache.get(key));
-  if (memoryValue && !isEntryExpired(memoryValue, now)) {
-    return [...memoryValue.menus];
-  }
-  if (memoryValue && isEntryExpired(memoryValue, now)) {
-    memoryCache.delete(key);
-  }
-
-  const storageCache = readStorageCache();
-  purgeExpiredStorageEntries(storageCache, now);
-  const storageEntry = normalizeEntry(storageCache[key]);
-  if (!storageEntry || isEntryExpired(storageEntry, now)) {
-    return null;
-  }
-
-  memoryCache.set(key, storageEntry);
-  return [...storageEntry.menus];
-};
-
-export const setTopNavDisplayMenusCache = (menus) => {
-  const key = buildScopedKey();
-  const normalized = normalizeMenus(menus);
-  const entry = {
-    menus: normalized,
-    expiresAt: Date.now() + CACHE_TTL_MS
-  };
-  memoryCache.set(key, entry);
-
-  const storageCache = readStorageCache();
-  purgeExpiredStorageEntries(storageCache);
-  storageCache[key] = entry;
-  writeStorageCache(storageCache);
-};
+export const getTopNavDisplayMenusCache = () => cache.get('top-nav');
+export const setTopNavDisplayMenusCache = (menus) => cache.set('top-nav', menus);
diff --git a/src/composables/notification/useNotificationCenter.js b/src/composables/notification/useNotificationCenter.js
index a61f1f5..2197ec1 100644
--- a/src/composables/notification/useNotificationCenter.js
+++ b/src/composables/notification/useNotificationCenter.js
@@ -1,11 +1,12 @@
 import { computed, ref, watch } from 'vue';
 import { listNotifications, markNotificationsRead, markAllNotificationsRead } from '@/services/api';
 import { useApiAction } from '@/composables/actions/useApiAction';
+import { formatDate as _formatDate } from '@/utils/formatDate';
 
 export function useNotificationCenter({ t }) {
   const { runApi, runSilent, runWithLoading } = useApiAction({ t });
-  const runNotificationSilent = (context, action, options = {}) =>
-    runSilent(action, { context, ...options });
+  const runNotificationSilent = (action, options = {}) =>
+    runSilent(action, options);
 
   const activeTab = ref('all');
   const notifications = ref([]);
@@ -23,25 +24,23 @@ export function useNotificationCenter({ t }) {
     { key: 'actions', label: t('common.actions'), minWidth: 160, align: 'center' }
   ]);
 
-  const displayNotifications = computed(() => notifications.value);
-
   const selectAll = computed(() => {
-    if (!displayNotifications.value.length) return false;
-    return displayNotifications.value.every((item) => selectedIds.value.includes(item.external_id));
+    if (!notifications.value.length) return false;
+    return notifications.value.every((item) => selectedIds.value.includes(item.external_id));
   });
 
   const selectIndeterminate = computed(() => {
-    const selectedCount = displayNotifications.value.filter((item) => selectedIds.value.includes(item.external_id)).length;
-    return selectedCount > 0 && selectedCount < displayNotifications.value.length;
+    const selectedCount = notifications.value.filter((item) => selectedIds.value.includes(item.external_id)).length;
+    return selectedCount > 0 && selectedCount < notifications.value.length;
   });
 
   const toggleSelectAll = (value) => {
     if (value) {
-      selectedIds.value = displayNotifications.value.map((item) => item.external_id);
+      selectedIds.value = notifications.value.map((item) => item.external_id);
       return;
     }
     selectedIds.value = selectedIds.value.filter(
-      (id) => !displayNotifications.value.some((item) => item.external_id === id)
+      (id) => !notifications.value.some((item) => item.external_id === id)
     );
   };
 
@@ -67,12 +66,7 @@ export function useNotificationCenter({ t }) {
     return row.title || row.content || '-';
   };
 
-  const formatDate = (value) => {
-    if (!value) return '-';
-    const date = new Date(value);
-    if (Number.isNaN(date.getTime())) return value;
-    return date.toLocaleString();
-  };
+  const formatDate = (value) => _formatDate(value, { fallback: '-', useLocaleString: true });
 
   const emitUnread = (hasUnread) => {
     window.dispatchEvent(new CustomEvent('notifications:unread', { detail: { hasUnread } }));
@@ -80,7 +74,6 @@ export function useNotificationCenter({ t }) {
 
   const refreshUnreadStatus = async () => {
     await runNotificationSilent(
-      'refreshUnreadStatus',
       () => listNotifications({ page: 1, page_size: 1, status: 'unread' }),
       {
         onSuccess: (resp) => {
@@ -97,7 +90,6 @@ export function useNotificationCenter({ t }) {
     await runWithLoading(
       loading,
       () => runNotificationSilent(
-        'loadNotifications',
         () =>
           listNotifications({
             page: currentPage.value,
@@ -177,11 +169,11 @@ export function useNotificationCenter({ t }) {
 
   return {
     activeTab,
+    notifications,
     totalCount,
     currentPage,
     pageSize,
     columns,
-    displayNotifications,
     selectedIds,
     selectAll,
     selectIndeterminate,
diff --git a/src/composables/template/useTemplateListPage.js b/src/composables/template/useTemplateListPage.js
index e6ca901..3b5805b 100644
--- a/src/composables/template/useTemplateListPage.js
+++ b/src/composables/template/useTemplateListPage.js
@@ -8,6 +8,7 @@ import { useLazyTabLoader } from '@/composables/list/useLazyTabLoader';
 import { useTemplateCatalog } from '@/composables/template/useTemplateCatalog';
 import { useApiAction } from '@/composables/actions/useApiAction';
 import { DEFAULT_DOCUMENT_TYPE, normalizeDocumentType } from '@/utils/documentType';
+import { formatDate as _formatDate } from '@/utils/formatDate';
 
 export function useTemplateListPage({ t, router }) {
   const { runWithLoading, createApiErrorHandler } = useApiAction({ t });
@@ -55,12 +56,7 @@ export function useTemplateListPage({ t, router }) {
     onError: handleTemplateLoadError
   });
 
-  const formatDate = (value) => {
-    if (!value) return t('common.unknown');
-    const date = new Date(value);
-    if (Number.isNaN(date.getTime())) return value;
-    return date.toLocaleDateString();
-  };
+  const formatDate = (value) => _formatDate(value, { fallback: t('common.unknown') });
 
   const openTemplate = (tpl) => {
     if (!tpl?.id) return;
diff --git a/src/composables/template/useTemplatePreviewPage.js b/src/composables/template/useTemplatePreviewPage.js
index 40c08d5..4a9d271 100644
--- a/src/composables/template/useTemplatePreviewPage.js
+++ b/src/composables/template/useTemplatePreviewPage.js
@@ -3,6 +3,7 @@ import { ElMessage } from 'element-plus';
 import { createDocument as createDocumentApi, getTemplate } from '@/services/api';
 import { useApiAction } from '@/composables/actions/useApiAction';
 import { DEFAULT_DOCUMENT_TYPE, normalizeDocumentType } from '@/utils/documentType';
+import { formatDate as _formatDate } from '@/utils/formatDate';
 
 export function useTemplatePreviewPage({ t, route, router }) {
   const { runWithLoading } = useApiAction({ t });
@@ -14,11 +15,7 @@ export function useTemplatePreviewPage({ t, route, router }) {
 
   const templateId = computed(() => route.params.templateId || route.params.id);
 
-  const formatDate = (dateString) => {
-    if (!dateString) return t('common.unknown');
-    const date = new Date(dateString);
-    return date.toLocaleDateString();
-  };
+  const formatDate = (value) => _formatDate(value, { fallback: t('common.unknown') });
 
   const scopeLabel = computed(() => {
     const scope = template.value?.scope;
diff --git a/src/config/baseUrl.js b/src/config/baseUrl.js
index c172d9c..4dc1c08 100644
--- a/src/config/baseUrl.js
+++ b/src/config/baseUrl.js
@@ -8,7 +8,7 @@ const defaultBaseURL = (() => {
   return '';
 })();
 
-export const API_BASE_URL = trimTrailingSlash(import.meta.env.VITE_API_BASE_URL || defaultBaseURL);
+const API_BASE_URL = trimTrailingSlash(import.meta.env.VITE_API_BASE_URL || defaultBaseURL);
 
 export const resolveWithApiBase = (target = '') => {
   const value = String(target || '').trim();
diff --git a/src/i18n/index.js b/src/i18n/index.js
index 6ff2c1d..6923198 100644
--- a/src/i18n/index.js
+++ b/src/i18n/index.js
@@ -14,8 +14,7 @@ const i18n = createI18n({
   fallbackLocale: 'en',
   messages: {
     en: enUS,
-    zh: zhCN,
-    'zh-CN': zhCN
+    zh: zhCN
   }
 });
 
diff --git a/src/i18n/locales/en-US.js b/src/i18n/locales/en-US.js
index 50f3c56..1e38642 100644
--- a/src/i18n/locales/en-US.js
+++ b/src/i18n/locales/en-US.js
@@ -408,7 +408,6 @@ export default {
     documentsCount: 'Documents Count',
     createdAt: 'Created At',
     updatedAt: 'Updated At',
-    owner: 'Owner: {owner}',
     access: 'Access',
     view: 'View Details',
     fetchError: 'Failed to fetch knowledge bases',
@@ -434,7 +433,6 @@ export default {
     template: 'Template',
     selectTemplate: 'Select template',
     createDocumentSuccess: 'Document created successfully',
-    documentCreatedSuccessfully: 'Document created successfully',
     createDocumentError: 'Failed to create document',
     newDocument: 'New Document',
     treeRefreshed: 'Tree structure refreshed',
diff --git a/src/i18n/locales/zh-CN.js b/src/i18n/locales/zh-CN.js
index 0c29737..01476bf 100644
--- a/src/i18n/locales/zh-CN.js
+++ b/src/i18n/locales/zh-CN.js
@@ -406,7 +406,6 @@ export default {
     documentsCount: '文档数量',
     createdAt: '创建时间',
     updatedAt: '更新时间',
-    owner: '所有者: {owner}',
     access: '访问',
     view: '查看详情',
     fetchError: '获取知识库失败',
@@ -432,7 +431,6 @@ export default {
     template: '模板',
     selectTemplate: '请选择模板',
     createDocumentSuccess: '文档创建成功',
-    documentCreatedSuccessfully: '文档创建成功',
     createDocumentError: '创建文档失败',
     newDocument: '新文档',
     treeRefreshed: '树形结构已刷新',
diff --git a/src/router/index.js b/src/router/index.js
index de8d13e..f22bc4f 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -6,6 +6,40 @@ const { t } = i18n.global;
 
 const APP_NAME = 'Yoresee';
 
+const makeDocumentChildRoutes = (basePath, namePrefix, propsFactory) => [
+  {
+    path: `${basePath}/:docId`,
+    name: `${namePrefix}Editor`,
+    component: () => import('../views/document/DocumentEditor.vue'),
+    meta: { requiresAuth: true, dynamicTitle: true },
+    props: propsFactory
+  },
+  {
+    path: `${basePath}/:docId/attachments`,
+    name: `${namePrefix}Attachments`,
+    component: () => import('../views/document/DocumentAttachments.vue'),
+    meta: { requiresAuth: true, titleKey: 'document.attachments.title' }
+  },
+  {
+    path: `${basePath}/:docId/history`,
+    name: `${namePrefix}History`,
+    component: () => import('../views/document/DocumentHistory.vue'),
+    meta: { requiresAuth: true, titleKey: 'history.title' }
+  },
+  {
+    path: `${basePath}/:docId/setting`,
+    name: `${namePrefix}Settings`,
+    component: () => import('../views/document/DocumentSettings.vue'),
+    meta: { requiresAuth: true, titleKey: 'document.settings.title' }
+  },
+  {
+    path: `${basePath}/:docId/attachment/:attachmentId`,
+    name: `${namePrefix}AttachmentOpen`,
+    component: () => import('../views/document/DocumentAttachmentOpen.vue'),
+    meta: { requiresAuth: true, titleKey: 'document.attachments.previewTitle' }
+  }
+];
+
 const router = createRouter({
   history: createWebHistory(),
   routes: [
@@ -38,37 +72,7 @@ const router = createRouter({
       name: 'MyDocumentsAlias',
       redirect: '/mydocuments'
     },
-    {
-      path: '/mydocument/:docId',
-      name: 'MyDocumentEditor',
-      component: () => import('../views/document/DocumentEditor.vue'),
-      meta: { requiresAuth: true, dynamicTitle: true },
-      props: (route) => ({ kbId: 'personal', docId: route.params.docId })
-    },
-    {
-      path: '/mydocument/:docId/attachments',
-      name: 'MyDocumentAttachments',
-      component: () => import('../views/document/DocumentAttachments.vue'),
-      meta: { requiresAuth: true, titleKey: 'document.attachments.title' }
-    },
-    {
-      path: '/mydocument/:docId/history',
-      name: 'MyDocumentHistory',
-      component: () => import('../views/document/DocumentHistory.vue'),
-      meta: { requiresAuth: true, titleKey: 'history.title' }
-    },
-    {
-      path: '/mydocument/:docId/setting',
-      name: 'MyDocumentSettings',
-      component: () => import('../views/document/DocumentSettings.vue'),
-      meta: { requiresAuth: true, titleKey: 'document.settings.title' }
-    },
-    {
-      path: '/mydocument/:docId/attachment/:attachmentId',
-      name: 'MyDocumentAttachmentOpen',
-      component: () => import('../views/document/DocumentAttachmentOpen.vue'),
-      meta: { requiresAuth: true, titleKey: 'document.attachments.previewTitle' }
-    },
+    ...makeDocumentChildRoutes('/mydocument', 'MyDocument', (route) => ({ kbId: 'personal', docId: route.params.docId })),
     {
       path: '/knowledge-base',
       name: 'KnowledgeBase',
@@ -100,37 +104,7 @@ const router = createRouter({
       meta: { requiresAuth: true, dynamicTitle: true },
       props: true
     },
-    {
-      path: '/knowledge-base/:kbId/document/:docId',
-      name: 'KnowledgeBaseDocumentEditor',
-      component: () => import('../views/document/DocumentEditor.vue'),
-      meta: { requiresAuth: true, dynamicTitle: true },
-      props: true
-    },
-    {
-      path: '/knowledge-base/:kbId/document/:docId/attachments',
-      name: 'KnowledgeBaseDocumentAttachments',
-      component: () => import('../views/document/DocumentAttachments.vue'),
-      meta: { requiresAuth: true, titleKey: 'document.attachments.title' }
-    },
-    {
-      path: '/knowledge-base/:kbId/document/:docId/history',
-      name: 'KnowledgeBaseDocumentHistory',
-      component: () => import('../views/document/DocumentHistory.vue'),
-      meta: { requiresAuth: true, titleKey: 'history.title' }
-    },
-    {
-      path: '/knowledge-base/:kbId/document/:docId/setting',
-      name: 'KnowledgeBaseDocumentSettings',
-      component: () => import('../views/document/DocumentSettings.vue'),
-      meta: { requiresAuth: true, titleKey: 'document.settings.title' }
-    },
-    {
-      path: '/knowledge-base/:kbId/document/:docId/attachment/:attachmentId',
-      name: 'KnowledgeBaseDocumentAttachmentOpen',
-      component: () => import('../views/document/DocumentAttachmentOpen.vue'),
-      meta: { requiresAuth: true, titleKey: 'document.attachments.previewTitle' }
-    },
+    ...makeDocumentChildRoutes('/knowledge-base/:kbId/document', 'KnowledgeBaseDocument', true),
     {
       path: '/user_info/profile',
       name: 'UserProfile',
diff --git a/src/services/api.js b/src/services/api.js
index 290a31b..3275665 100644
--- a/src/services/api.js
+++ b/src/services/api.js
@@ -6,23 +6,3 @@ export * from './api/invitation';
 export * from './api/setting';
 export * from './api/notification';
 export * from './api/comment';
-
-import * as knowledgeBaseApi from './api/knowledgeBase';
-import * as documentApi from './api/document';
-import * as templateApi from './api/template';
-import * as membershipApi from './api/membership';
-import * as invitationApi from './api/invitation';
-import * as settingApi from './api/setting';
-import * as notificationApi from './api/notification';
-import * as commentApi from './api/comment';
-
-export default {
-  ...knowledgeBaseApi,
-  ...documentApi,
-  ...templateApi,
-  ...membershipApi,
-  ...invitationApi,
-  ...settingApi,
-  ...notificationApi,
-  ...commentApi
-};
diff --git a/src/services/api/knowledgeBase.js b/src/services/api/knowledgeBase.js
index 16509ba..811b168 100644
--- a/src/services/api/knowledgeBase.js
+++ b/src/services/api/knowledgeBase.js
@@ -91,10 +91,9 @@ export const getRecentKnowledgeBases = async (params = {}) => {
 
 export const getKnowledgeBaseDocuments = async (knowledgeBaseExternalID, params = {}) => {
   return getKnowledgeBaseDetail(knowledgeBaseExternalID, {
+    ...params,
     record_recent_log: false,
-    page: 1,
-    page_size: 1000,
-    directory_only: params.directory_only || false,
-    ...params
+    page: params.page ?? 1,
+    page_size: params.page_size ?? 1000
   });
 };
diff --git a/src/services/api/shared.js b/src/services/api/shared.js
index c6eeab5..29e5c94 100644
--- a/src/services/api/shared.js
+++ b/src/services/api/shared.js
@@ -36,7 +36,9 @@ export function handleResponse(base, data) {
   if (base.code === 0) {
     return { ...base, ...data };
   }
-  throw new Error('request failed');
+  const err = new Error(base.message || 'request failed');
+  err.code = base.code;
+  throw err;
 }
 
 export function toTimeRange(input) {
@@ -162,8 +164,7 @@ export function mapInvitationRecord(rec) {
     used_by: rec.usedBy,
     used_by_external_id: rec.usedByExternalId ?? null,
     used_at: rec.usedAt,
-    status: rec.status,
-    row_key: `${rec.code || ''}_${rec.usedAt || ''}_${rec.status || ''}`
+    status: rec.status
   };
 }
 
@@ -176,8 +177,7 @@ export function mapNotification(item) {
     title: item.title,
     content: item.content,
     payload: item.payload,
-    created_at: item.createdAt,
-    read: item.status === 'read'
+    created_at: item.createdAt
   };
 }
 
diff --git a/src/services/api/template.js b/src/services/api/template.js
index 803aa06..a23404e 100644
--- a/src/services/api/template.js
+++ b/src/services/api/template.js
@@ -6,7 +6,7 @@ import {
   handleResponse,
   mapTemplate
 } from './shared';
-import { normalizeDocumentType } from '@/utils/documentType';
+import { toDocumentTypeNumber } from '@/utils/documentType';
 
 const {
   CreateTemplateRequest,
@@ -23,24 +23,12 @@ const containerMap = {
   public: CreateTemplateContainer.PUBLIC_TEMPLATE
 };
 
-const resolveDocumentType = (type) => {
-  const normalized = normalizeDocumentType(type, '');
-  if (!normalized) {
-    return undefined;
-  }
-  const parsed = Number(normalized);
-  if (!Number.isFinite(parsed)) {
-    return undefined;
-  }
-  return parsed;
-};
-
 export const createTemplate = async (data = {}) => {
   const req = new CreateTemplateRequest({
     targetContainer: containerMap[data.target_container] ?? CreateTemplateContainer.OWN_TEMPLATE,
     knowledgeBaseId: data.knowledge_base_id || '',
     templateContent: data.template_content || '',
-    type: resolveDocumentType(data.type)
+    type: toDocumentTypeNumber(data.type)
   });
 
   const resp = await unaryCall(documentClient, 'createTemplate', req);
@@ -52,7 +40,7 @@ export const listTemplates = async (params = {}) => {
   const req = new ListTemplatesRequest({
     onlyMine: Boolean(params.only_mine),
     targetContainer: params.target_container ? containerMap[params.target_container] : undefined,
-    type: resolveDocumentType(params.type),
+    type: toDocumentTypeNumber(params.type),
     knowledgeBaseId: params.knowledge_base_id || undefined,
     nameKeyword: params.name_keyword || undefined,
     orderBy: params.order_by || undefined,
diff --git a/src/services/grpc_client.js b/src/services/grpc_client.js
index 07002c5..a916263 100644
--- a/src/services/grpc_client.js
+++ b/src/services/grpc_client.js
@@ -29,7 +29,7 @@ const settingClient = createPromiseClient(SettingService, transport);
 const systemClient = createPromiseClient(SystemService, transport);
 const invitationClient = createPromiseClient(InvitationService, transport);
 
-export function buildHeaders() {
+function buildHeaders() {
   const token = localStorage.getItem('token');
   const language = localStorage.getItem('language') || 'en';
   const headers = {
@@ -46,7 +46,7 @@ export async function unaryCall(client, method, request) {
     return await client[method](request, { headers: buildHeaders() });
   } catch (err) {
     const code = err?.code;
-    if (code === Code.Unauthenticated || code === 'unauthenticated') {
+    if (code === Code.Unauthenticated) {
       localStorage.removeItem('token');
       localStorage.removeItem('userInfo');
       window.location.href = '/login';
diff --git a/src/styles/auth-form.css b/src/styles/auth-form.css
new file mode 100644
index 0000000..7071e30
--- /dev/null
+++ b/src/styles/auth-form.css
@@ -0,0 +1,60 @@
+.auth-form {
+  width: 100%;
+}
+
+.auth-form .el-form-item {
+  margin-bottom: var(--spacing-md);
+}
+
+.auth-form .el-input {
+  height: 40px;
+  border-radius: var(--border-radius-md);
+}
+
+.auth-form .el-input__wrapper {
+  box-shadow: none;
+}
+
+.auth-form .el-input__wrapper.is-focus {
+  box-shadow: 0 0 0 2px var(--primary-light);
+}
+
+.auth-form .login-button {
+  width: 100%;
+  height: 40px;
+  border-radius: var(--border-radius-md);
+  font-size: 14px;
+  font-weight: 500;
+  background-color: var(--primary-color);
+  border-color: var(--primary-color);
+}
+
+.auth-form .login-button:hover,
+.auth-form .login-button:active {
+  background-color: var(--primary-dark);
+  border-color: var(--primary-dark);
+}
+
+.auth-form .error-message {
+  margin-bottom: var(--spacing-md);
+}
+
+.auth-form .error-alert {
+  padding: 8px 12px;
+  font-size: 12px;
+}
+
+.auth-form .register-link {
+  text-align: center;
+  margin-top: var(--spacing-md);
+}
+
+.auth-form .register-link a {
+  color: var(--primary-color);
+  font-size: 14px;
+  text-decoration: none;
+}
+
+.auth-form .register-link a:hover {
+  text-decoration: underline;
+}
diff --git a/src/styles/dark-mode-overrides.css b/src/styles/dark-mode-overrides.css
new file mode 100644
index 0000000..36c461a
--- /dev/null
+++ b/src/styles/dark-mode-overrides.css
@@ -0,0 +1,58 @@
+.dark-mode {
+
+  input[type="text"],
+  input[type="password"],
+  input[type="email"] {
+    color: var(--el-input-text-color);
+  }
+
+  .el-message-box,
+  .el-message-box__header,
+  .el-message-box__content,
+  .el-message-box__btns {
+    background-color: var(--el-fill-color-blank);
+  }
+
+  .el-message-box__header { border-bottom: none; }
+  .el-message-box__btns { border-top: none; }
+
+  .el-select-dropdown__item.selected {
+    background-color: var(--el-color-primary-light-9);
+    color: var(--el-color-primary);
+  }
+
+  .el-picker-panel__body,
+  .el-picker-panel__content {
+    background-color: var(--el-fill-color-blank);
+    color: var(--el-text-color-regular);
+  }
+
+  .el-date-table td.in-range div,
+  .el-date-table td.available:hover div {
+    background-color: var(--bg-medium);
+  }
+
+  .el-input-number__decrease,
+  .el-input-number__increase {
+    background-color: var(--bg-medium);
+    color: var(--text-dark);
+    border-color: var(--border-color);
+  }
+
+  .el-input-number__decrease:hover,
+  .el-input-number__increase:hover {
+    background-color: var(--bg-light);
+  }
+
+  .el-dialog__header {
+    border-bottom: 1px solid var(--el-border-color);
+  }
+
+  .el-dialog__footer {
+    border-top: 1px solid var(--el-border-color);
+  }
+
+  .el-loading-spinner .path {
+    stroke: var(--primary-color);
+  }
+}
diff --git a/src/utils/documentRoute.js b/src/utils/documentRoute.js
new file mode 100644
index 0000000..cb99118
--- /dev/null
+++ b/src/utils/documentRoute.js
@@ -0,0 +1,11 @@
+import { unref } from 'vue';
+
+export const navigateToDocument = (router, kbId, docId) => {
+  const kb = unref(kbId);
+  const doc = unref(docId);
+  if (kb === 'personal') {
+    router.push(`/mydocument/${doc}`);
+    return;
+  }
+  router.push(`/knowledge-base/${kb}/document/${doc}`);
+};
diff --git a/src/utils/formatDate.js b/src/utils/formatDate.js
new file mode 100644
index 0000000..7b0a458
--- /dev/null
+++ b/src/utils/formatDate.js
@@ -0,0 +1,6 @@
+export const formatDate = (value, { fallback = '-', useLocaleString = false } = {}) => {
+  if (!value) return fallback;
+  const date = new Date(value);
+  if (Number.isNaN(date.getTime())) return value;
+  return useLocaleString ? date.toLocaleString() : date.toLocaleDateString();
+};
diff --git a/src/utils/resolveBool.js b/src/utils/resolveBool.js
new file mode 100644
index 0000000..cbee937
--- /dev/null
+++ b/src/utils/resolveBool.js
@@ -0,0 +1,12 @@
+export const resolveBool = (valueOrGetterOrRef, fallback = false) => {
+  if (typeof valueOrGetterOrRef === 'function') {
+    return valueOrGetterOrRef();
+  }
+  if (valueOrGetterOrRef && typeof valueOrGetterOrRef === 'object' && 'value' in valueOrGetterOrRef) {
+    return valueOrGetterOrRef.value;
+  }
+  if (valueOrGetterOrRef === undefined) {
+    return fallback;
+  }
+  return Boolean(valueOrGetterOrRef);
+};
diff --git a/src/views/auth/Login.vue b/src/views/auth/Login.vue
index d81d2dd..e896884 100644
--- a/src/views/auth/Login.vue
+++ b/src/views/auth/Login.vue
@@ -11,7 +11,7 @@
       :model="loginForm"
       :rules="loginRules"
       ref="loginFormRef"
-      class="login-form"
+      class="auth-form"
     >
       <el-form-item prop="email">
         <el-input
@@ -67,6 +67,7 @@ import { useI18n } from 'vue-i18n';
 import AuthLayout from '@/components/layout/AuthLayout.vue';
 import { useAuthShell } from '@/composables/shell/useAuthShell';
 import { usePageBoot } from '@/composables/shell/usePageBoot';
+import '@/styles/auth-form.css';
 
 const router = useRouter();
 const route = useRoute();
@@ -130,65 +131,3 @@ onMounted(() => {
 });
 </script>
 
-<style scoped>
-.login-form {
-  width: 100%;
-}
-
-.login-form .el-form-item {
-  margin-bottom: var(--spacing-md);
-}
-
-.login-form .el-input {
-  height: 40px;
-  border-radius: var(--border-radius-md);
-}
-
-.login-form .el-input__wrapper {
-  box-shadow: none;
-}
-
-.login-form .el-input__wrapper.is-focus {
-  box-shadow: 0 0 0 2px var(--primary-light);
-}
-
-.login-button {
-  width: 100%;
-  height: 40px;
-  border-radius: var(--border-radius-md);
-  font-size: 14px;
-  font-weight: 500;
-  background-color: var(--primary-color);
-  border-color: var(--primary-color);
-}
-
-.login-button:hover,
-.login-button:active {
-  background-color: var(--primary-dark);
-  border-color: var(--primary-dark);
-}
-
-.error-message {
-  margin-bottom: var(--spacing-md);
-}
-
-.error-alert {
-  padding: 8px 12px;
-  font-size: 12px;
-}
-
-.register-link {
-  text-align: center;
-  margin-top: var(--spacing-md);
-}
-
-.register-link a {
-  color: var(--primary-color);
-  font-size: 14px;
-  text-decoration: none;
-}
-
-.register-link a:hover {
-  text-decoration: underline;
-}
-</style>
diff --git a/src/views/auth/Register.vue b/src/views/auth/Register.vue
index 07f3c87..a72c0c3 100644
--- a/src/views/auth/Register.vue
+++ b/src/views/auth/Register.vue
@@ -7,7 +7,7 @@
     @change-language="handleLanguageChange"
     @toggle-theme="toggleTheme"
   >
-    <el-form :model="registerForm" :rules="registerRules" ref="registerFormRef" class="register-form">
+    <el-form :model="registerForm" :rules="registerRules" ref="registerFormRef"       class="auth-form">
       <el-form-item prop="username">
         <el-input
           v-model="registerForm.username"
@@ -89,6 +89,7 @@ import { useI18n } from 'vue-i18n';
 import AuthLayout from '@/components/layout/AuthLayout.vue';
 import { useAuthShell } from '@/composables/shell/useAuthShell';
 import { usePageBoot } from '@/composables/shell/usePageBoot';
+import '@/styles/auth-form.css';
 
 const router = useRouter();
 const userStore = useUserStore();
@@ -194,65 +195,3 @@ onMounted(() => {
 });
 </script>
 
-<style scoped>
-.register-form {
-  width: 100%;
-}
-
-.register-form .el-form-item {
-  margin-bottom: var(--spacing-md);
-}
-
-.register-form .el-input {
-  height: 40px;
-  border-radius: var(--border-radius-md);
-}
-
-.register-form .el-input__wrapper {
-  box-shadow: none;
-}
-
-.register-form .el-input__wrapper.is-focus {
-  box-shadow: 0 0 0 2px var(--primary-light);
-}
-
-.login-button {
-  width: 100%;
-  height: 40px;
-  border-radius: var(--border-radius-md);
-  font-size: 14px;
-  font-weight: 500;
-  background-color: var(--primary-color);
-  border-color: var(--primary-color);
-}
-
-.login-button:hover,
-.login-button:active {
-  background-color: var(--primary-dark);
-  border-color: var(--primary-dark);
-}
-
-.error-message {
-  margin-bottom: var(--spacing-md);
-}
-
-.error-alert {
-  padding: 8px 12px;
-  font-size: 12px;
-}
-
-.register-link {
-  text-align: center;
-  margin-top: var(--spacing-md);
-}
-
-.register-link a {
-  color: var(--primary-color);
-  font-size: 14px;
-  text-decoration: none;
-}
-
-.register-link a:hover {
-  text-decoration: underline;
-}
-</style>
diff --git a/src/views/document/DocumentAttachments.vue b/src/views/document/DocumentAttachments.vue
index 36070e9..3e111f2 100644
--- a/src/views/document/DocumentAttachments.vue
+++ b/src/views/document/DocumentAttachments.vue
@@ -202,13 +202,9 @@ const formatSize = (bytes) => {
   return `${(value / (1024 * 1024)).toFixed(1)} MB`;
 };
 
-const goBackToDocument = () => {
-  if (kbId.value === 'personal') {
-    router.push(`/mydocument/${docId.value}`);
-    return;
-  }
-  router.push(`/knowledge-base/${kbId.value}/document/${docId.value}`);
-};
+import { navigateToDocument } from '@/utils/documentRoute';
+
+const goBackToDocument = () => navigateToDocument(router, kbId, docId);
 
 onMounted(async () => {
   await initLanguage();
diff --git a/src/views/document/DocumentEditor.vue b/src/views/document/DocumentEditor.vue
index 53d0453..c562370 100644
--- a/src/views/document/DocumentEditor.vue
+++ b/src/views/document/DocumentEditor.vue
@@ -341,8 +341,7 @@ const {
   isTableDocument,
   isSlideDocument,
   isRichTextDocument,
-  canManageAttachments,
-  canManageSettings,
+  hasDocument,
   collabEnabled,
   inlineCommentEnabled,
   createDialogKnowledgeBaseId,
@@ -352,6 +351,8 @@ const {
   docId,
   currentDocType
 });
+const canManageAttachments = computed(() => hasDocument.value);
+const canManageSettings = computed(() => hasDocument.value);
 const {
   isEditingTitle,
   pendingTitle,
@@ -532,21 +533,6 @@ watch(collabReady, async (ready) => {
   color: var(--text-dark);
 }
 
-.editor-footer {
-  display: flex;
-  justify-content: space-between;
-  align-items: center;
-  padding: var(--spacing-sm) var(--spacing-lg);
-  border-top: 1px solid var(--border-color);
-  font-size: 12px;
-  color: var(--text-light);
-}
-
-.dark-mode .editor-footer {
-  border-color: var(--border-color);
-  color: var(--text-light);
-}
-
 .editor-fullscreen-header-btn {
   color: var(--text-medium);
 }
diff --git a/src/views/document/DocumentHistory.vue b/src/views/document/DocumentHistory.vue
index c13183c..7e1d9e8 100644
--- a/src/views/document/DocumentHistory.vue
+++ b/src/views/document/DocumentHistory.vue
@@ -248,13 +248,9 @@ const handleSizeChange = async (size) => {
   await fetchVersions();
 };
 
-const goBackToDocument = () => {
-  if (kbId.value === 'personal') {
-    router.push(`/mydocument/${docId.value}`);
-    return;
-  }
-  router.push(`/knowledge-base/${kbId.value}/document/${docId.value}`);
-};
+import { navigateToDocument } from '@/utils/documentRoute';
+
+const goBackToDocument = () => navigateToDocument(router, kbId, docId);
 
 onMounted(async () => {
   await initLanguage();
diff --git a/src/views/document/DocumentSettings.vue b/src/views/document/DocumentSettings.vue
index 7708a83..4e23a64 100644
--- a/src/views/document/DocumentSettings.vue
+++ b/src/views/document/DocumentSettings.vue
@@ -97,13 +97,9 @@ const settings = reactive({
   isPublic: false
 });
 
-const goBackToDocument = () => {
-  if (kbId.value === 'personal') {
-    router.push(`/mydocument/${docId.value}`);
-    return;
-  }
-  router.push(`/knowledge-base/${kbId.value}/document/${docId.value}`);
-};
+import { navigateToDocument } from '@/utils/documentRoute';
+
+const goBackToDocument = () => navigateToDocument(router, kbId, docId);
 
 const loadSettings = async () => {
   if (!docId.value) {
diff --git a/src/views/knowledge-base/KnowledgeBase.vue b/src/views/knowledge-base/KnowledgeBase.vue
index 40753c9..2fa768e 100644
--- a/src/views/knowledge-base/KnowledgeBase.vue
+++ b/src/views/knowledge-base/KnowledgeBase.vue
@@ -142,111 +142,10 @@ onMounted(() => {
 </script>
 
 <style scoped>
-/* 垂直布局 */
 .knowledge-base-vertical-layout {
   display: flex;
   flex-direction: column;
   gap: var(--spacing-lg);
   height: auto;
 }
-
-/* 深色模式支持 */
-.dark-mode .search-input :deep(.el-input__wrapper) {
-  background-color: var(--input-bg);
-  border-color: var(--input-border);
-  color: var(--input-text);
-}
-
-.dark-mode .search-input :deep(.el-input__inner) {
-  background-color: var(--input-bg);
-  border-color: var(--input-border);
-  color: var(--input-text);
-}
-
-.dark-mode .filter-select :deep(.el-input__wrapper) {
-  background-color: var(--select-bg);
-  border-color: var(--select-border);
-  color: var(--select-text);
-}
-
-.dark-mode .filter-select :deep(.el-input__inner) {
-  background-color: var(--select-bg);
-  border-color: var(--select-border);
-  color: var(--select-text);
-}
-
-.dark-mode .filter-select :deep(.el-select__dropdown) {
-  background-color: var(--select-bg);
-  border-color: var(--select-border);
-}
-
-.dark-mode .filter-select :deep(.el-popper) {
-  background-color: var(--select-bg);
-  border-color: var(--select-border);
-  color: var(--select-text);
-}
-
-.dark-mode .filter-select :deep(.el-select-dropdown__item) {
-  background-color: var(--select-option-bg);
-  color: var(--select-text);
-}
-
-.dark-mode .filter-select :deep(.el-select-dropdown__item:hover) {
-  background-color: var(--select-option-hover);
-}
-
-.dark-mode .el-pagination :deep(.el-pager li) {
-  background-color: var(--bg-white);
-  color: var(--text-primary);
-  border-color: var(--border-color);
-}
-
-.dark-mode .el-pagination :deep(button) {
-  background-color: var(--bg-white);
-  color: var(--text-primary);
-  border-color: var(--border-color);
-}
-
-.dark-mode .el-pagination.is-background :deep(.btn-next),
-.dark-mode .el-pagination.is-background :deep(.btn-prev),
-.dark-mode .el-pagination.is-background :deep(.el-pager li) {
-  background-color: var(--bg-medium);
-  color: var(--text-primary);
-}
-
-.dark-mode .el-pagination.is-background :deep(.el-pager li:not(.is-disabled):hover) {
-  color: var(--primary-color);
-}
-
-.dark-mode .el-pagination.is-background :deep(.el-pager li.is-active) {
-  background-color: var(--primary-color);
-  color: white;
-}
-
-.dark-mode .el-button {
-  border-color: var(--border-color);
-  color: var(--text-primary);
-}
-
-.dark-mode .el-button--primary {
-  background-color: var(--primary-color);
-  border-color: var(--primary-color);
-  color: white;
-}
-
-.dark-mode .el-button--primary:hover {
-  background-color: var(--primary-light);
-  border-color: var(--primary-light);
-  color: white;
-}
-
-.dark-mode .column {
-  background-color: var(--bg-medium);
-  border: 1px solid var(--border-color);
-}
-
-.dark-mode .column-header {
-  background-color: var(--bg-medium);
-  border-bottom: 1px solid var(--border-color);
-}
 </style>
diff --git a/src/views/manage/SystemManageOrganization.vue b/src/views/manage/SystemManageOrganization.vue
index bd9334d..d3f07a3 100644
--- a/src/views/manage/SystemManageOrganization.vue
+++ b/src/views/manage/SystemManageOrganization.vue
@@ -25,7 +25,7 @@
       :section-title="t('system.organization.placeholderTitle')"
       body-padding="md"
       mode="tree"
-      :rows="pagedOrgNodes"
+      :rows="orgTreeData"
       :columns="orgColumns"
       :is-dark="isDarkMode"
       row-key="external_id"
@@ -259,8 +259,6 @@ const orgColumns = computed(() => [
 const pageSizes = [6, 10, 20];
 const paginationLayout = 'total, prev, pager, next';
 
-const pagedOrgNodes = computed(() => orgTreeData.value);
-
 const dialogTitle = computed(() => {
   if (createParent.value?.name) {
     return t('system.organization.createChildWith', { name: createParent.value.name });
diff --git a/src/views/user/UserNotifications.vue b/src/views/user/UserNotifications.vue
index ed6f31b..fd47751 100644
--- a/src/views/user/UserNotifications.vue
+++ b/src/views/user/UserNotifications.vue
@@ -21,7 +21,7 @@
     </el-tabs>
 
     <CommonList
-      :rows="displayNotifications"
+      :rows="notifications"
       :columns="columns"
       :is-dark="isDarkMode"
       row-key="external_id"
@@ -127,7 +127,7 @@ const {
   currentPage,
   pageSize,
   columns,
-  displayNotifications,
+  notifications,
   selectedIds,
   selectAll,
   selectIndeterminate,