diff --git a/api/storage.js b/api/storage.js
new file mode 100644
index 00000000..9cce2b8a
--- /dev/null
+++ b/api/storage.js
@@ -0,0 +1,410 @@
+// 统一存储接口 v2.4 - 修复分类移动/置顶后数据不一致问题
+// 支持 EdgeOne Pages / Cloudflare Workers
+
+import { getKV, getCorsHeaders, verifyAuth, jsonResponse } from './_kvAdapter.js';
+
+const STORAGE_KEYS = {
+  CONFIG_KEY: 'config',
+  CATEGORIES_CONFIG_KEY: 'cate_config',
+};
+
+const CONFIG_SECTIONS = ['ai', 'website', 'mastodon', 'weather', 'search', 'icon', 'view', 'ui'];
+
+async function readConfigSection(kv, section) {
+  const sectionStr = await kv.get(`config:${section}`);
+  if (sectionStr) return JSON.parse(sectionStr);
+  const configStr = await kv.get('config');
+  const config = configStr ? JSON.parse(configStr) : {};
+  return config[section] || null;
+}
+
+async function mergeAllConfigSections(kv) {
+  const merged = {};
+  let hasAnyIndividual = false;
+  const results = await Promise.all(CONFIG_SECTIONS.map(async (s) => {
+    const v = await kv.get(`config:${s}`);
+    if (v) { hasAnyIndividual = true; return [s, JSON.parse(v)]; }
+    return null;
+  }));
+  for (const r of results) {
+    if (r) merged[r[0]] = r[1];
+  }
+  if (hasAnyIndividual) {
+    const configStr = await kv.get('config');
+    if (configStr) {
+      const legacy = JSON.parse(configStr);
+      for (const s of CONFIG_SECTIONS) {
+        if (!merged[s] && legacy[s]) merged[s] = legacy[s];
+      }
+    }
+    return merged;
+  }
+  const configStr = await kv.get('config');
+  return configStr ? JSON.parse(configStr) : {};
+}
+
+function categoryLinksKey(categoryId) {
+  return `links:${categoryId}`;
+}
+
+// 读取所有分类链接（带密码过滤 + 私人书签过滤）
+async function readAllCategoryLinks(kv, categories, unlockedCategories = new Set(), isAdmin = false) {
+  if (categories.length === 0) return [];
+
+  const linkPromises = categories.map(async (cat) => {
+    const hasPassword = cat.password && cat.password.trim() !== '';
+    const isUnlocked = unlockedCategories.has(cat.id);
+
+    if (hasPassword && !isUnlocked && !isAdmin) {
+      return [];
+    }
+
+    const data = await kv.get(categoryLinksKey(cat.id));
+    return data ? JSON.parse(data) : [];
+  });
+
+  const linkArrays = await Promise.all(linkPromises);
+  return linkArrays.flat();
+}
+
+// ===== 修复：保存链接时，先清理所有旧的分类链接数据，再重新写入 =====
+async function saveCategoryLinks(kv, links, categories) {
+  // 1. 先获取当前所有存在的分类 ID（包括传入的 categories 中的分类）
+  const validCategoryIds = new Set(categories.map(c => c.id));
+
+  // 2. 从 links 中提取所有被引用的分类 ID
+  const referencedCategoryIds = new Set(links.map(l => l.categoryId || 'common'));
+
+  // 3. 清理：删除所有不再有效的分类链接 key
+  // 先读取现有的所有分类，找出那些已经不存在于 categories 数组中的分类
+  const existingCategoriesData = await kv.get(STORAGE_KEYS.CATEGORIES_CONFIG_KEY);
+  const existingCategories = existingCategoriesData ? JSON.parse(existingCategoriesData) : [];
+  const allKnownCategoryIds = new Set([
+    ...existingCategories.map(c => c.id),
+    ...validCategoryIds,
+  ]);
+
+  // 4. 删除所有旧的 links:* key（确保没有残留数据）
+  const deletePromises = [];
+  for (const catId of allKnownCategoryIds) {
+    deletePromises.push(kv.delete(categoryLinksKey(catId)));
+  }
+  await Promise.all(deletePromises);
+
+  // 5. 按新的 categoryId 分组链接
+  const grouped = {};
+  for (const link of links) {
+    const catId = link.categoryId || 'common';
+    if (!grouped[catId]) grouped[catId] = [];
+    grouped[catId].push(link);
+  }
+
+  // 6. 写入新的分组数据
+  const writes = [];
+  for (const [catId, catLinks] of Object.entries(grouped)) {
+    writes.push(kv.put(categoryLinksKey(catId), JSON.stringify(catLinks)));
+  }
+
+  // 7. 对于空分类（没有链接的分类），写入空数组，确保 key 存在但为空
+  for (const catId of validCategoryIds) {
+    if (!grouped[catId]) {
+      writes.push(kv.put(categoryLinksKey(catId), JSON.stringify([])));
+    }
+  }
+
+  await Promise.all(writes);
+}
+
+export async function onRequest(context) {
+  const { request, env } = context;
+  const corsHeaders = getCorsHeaders(env);
+  const url = new URL(request.url);
+
+  if (request.method === 'OPTIONS') {
+    return new Response(null, { status: 204, headers: corsHeaders });
+  }
+
+  try {
+    const kv = getKV(env);
+
+    if (request.method === 'GET') {
+      const checkAuth = url.searchParams.get('checkAuth');
+      const getConfig = url.searchParams.get('getConfig');
+      const key = url.searchParams.get('key');
+      const readOnly = url.searchParams.get('readOnly');
+      const category = url.searchParams.get('category');
+      const categoryPassword = url.searchParams.get('catPassword');
+
+      if (checkAuth === 'true') {
+        return jsonResponse({
+          hasPassword: !!env.PASSWORD,
+          requiresAuth: !!env.PASSWORD,
+          readOnlyAccess: true,
+          capabilities: { upload: true },
+        }, 200, corsHeaders);
+      }
+
+      if (getConfig && getConfig.includes(',')) {
+        const requestedSections = getConfig.split(',').filter(s => CONFIG_SECTIONS.includes(s) || s === 'true');
+        const configMap = {};
+
+        if (requestedSections.includes('true') || requestedSections.length === 0) {
+          const categoriesData = await kv.get(STORAGE_KEYS.CATEGORIES_CONFIG_KEY);
+          const allCategories = categoriesData ? JSON.parse(categoriesData) : [];
+
+          let unlockedCategories = new Set();
+          const unlockedParam = url.searchParams.get('unlocked');
+          if (unlockedParam) {
+            try { unlockedCategories = new Set(JSON.parse(unlockedParam)); } catch (e) {}
+          }
+
+          const providedPassword = request.headers.get('x-auth-password');
+          const isAdmin = await verifyAuth({ providedPassword, serverPassword: env.PASSWORD, kv });
+
+          const links = await readAllCategoryLinks(kv, allCategories, unlockedCategories, isAdmin);
+          const sanitizedCategories = allCategories.map(({ password, ...rest }) => ({
+            ...rest,
+            hasPassword: !!(password && password.trim() !== '')
+          }));
+
+          const allConfig = await mergeAllConfigSections(kv);
+
+          return jsonResponse({
+            links,
+            categories: sanitizedCategories,
+            configs: allConfig,
+          }, 200, corsHeaders);
+        }
+
+        await Promise.all(requestedSections.map(async (section) => {
+          const val = await readConfigSection(kv, section);
+          const configKey = section === 'mastodon' ? 'ticker' : section;
+          configMap[configKey] = val || {};
+        }));
+
+        return jsonResponse(configMap, 200, corsHeaders);
+      }
+
+      if (CONFIG_SECTIONS.includes(getConfig)) {
+        const sectionVal = await readConfigSection(kv, getConfig);
+        const defaults = {
+          website: { passwordExpiry: { value: 1, unit: 'week' } },
+        };
+        return jsonResponse(sectionVal || defaults[getConfig] || {}, 200, corsHeaders);
+      }
+
+      if (getConfig === 'favicon') {
+        const domain = url.searchParams.get('domain');
+        if (!domain) {
+          return jsonResponse({ error: 'Domain parameter is required' }, 400, corsHeaders);
+        }
+        const cachedIcon = await kv.get(`favicon:${domain}`);
+        return jsonResponse({ icon: cachedIcon || null, cached: !!cachedIcon }, 200, corsHeaders);
+      }
+
+      if (getConfig === 'categories') {
+        const data = await kv.get(STORAGE_KEYS.CATEGORIES_CONFIG_KEY);
+        const categories = data ? JSON.parse(data) : [];
+        const sanitized = categories.map(({ password, ...rest }) => ({
+          ...rest,
+          hasPassword: !!(password && password.trim() !== '')
+        }));
+        return jsonResponse(sanitized, 200, corsHeaders);
+      }
+
+      let unlockedCategories = new Set();
+      const unlockedParam = url.searchParams.get('unlocked');
+      if (unlockedParam) {
+        try {
+          unlockedCategories = new Set(JSON.parse(unlockedParam));
+        } catch (e) {}
+      }
+
+      const providedPassword = request.headers.get('x-auth-password');
+      const isAdmin = await verifyAuth({
+        providedPassword,
+        serverPassword: env.PASSWORD,
+        kv,
+      });
+
+      if (getConfig === 'links') {
+        const categoriesData = await kv.get(STORAGE_KEYS.CATEGORIES_CONFIG_KEY);
+        const categories = categoriesData ? JSON.parse(categoriesData) : [];
+
+        if (category) {
+          const cat = categories.find(c => c.id === category);
+          if (!cat) {
+            return jsonResponse({ error: '分类不存在' }, 404, corsHeaders);
+          }
+
+          const hasPassword = cat.password && cat.password.trim() !== '';
+          let isUnlocked = unlockedCategories.has(category);
+
+          if (categoryPassword && hasPassword && !isUnlocked && !isAdmin) {
+            const inputPwd = categoryPassword.trim();
+            const storedPwd = (cat.password || '').trim();
+            if (inputPwd === storedPwd) {
+              isUnlocked = true;
+            } else {
+              return jsonResponse({ error: '密码错误' }, 403, corsHeaders);
+            }
+          }
+
+          if (hasPassword && !isUnlocked && !isAdmin) {
+            return jsonResponse({ error: '该分类需要密码访问' }, 403, corsHeaders);
+          }
+
+          const data = await kv.get(categoryLinksKey(category));
+          const links = data ? JSON.parse(data) : [];
+          return jsonResponse(links, 200, corsHeaders);
+        }
+
+        const links = await readAllCategoryLinks(kv, categories, unlockedCategories, isAdmin);
+        return jsonResponse(links, 200, corsHeaders);
+      }
+
+      if (key) {
+        if (key === STORAGE_KEYS.CONFIG_KEY) {
+          const merged = await mergeAllConfigSections(kv);
+          return jsonResponse({ key, value: JSON.stringify(merged) }, 200, corsHeaders);
+        }
+        const value = await kv.get(key);
+        return jsonResponse({ key, value }, 200, corsHeaders);
+      }
+
+      if (getConfig === 'true') {
+        const categoriesData = await kv.get(STORAGE_KEYS.CATEGORIES_CONFIG_KEY);
+        const allCategories = categoriesData ? JSON.parse(categoriesData) : [];
+
+        const sanitizedCategories = allCategories.map(({ password, ...rest }) => ({
+          ...rest,
+          hasPassword: !!(password && password.trim() !== '')
+        }));
+
+        const links = await readAllCategoryLinks(kv, allCategories, unlockedCategories, isAdmin);
+
+        return jsonResponse({
+          links,
+          categories: sanitizedCategories,
+        }, 200, corsHeaders);
+      }
+
+      return jsonResponse({ links: [], categories: [] }, 200, corsHeaders);
+    }
+
+    if (request.method === 'POST') {
+      const body = await request.json();
+      const readOnlyOperations = ['favicon'];
+
+      if (readOnlyOperations.includes(body.operation) || body.saveConfig === 'favicon') {
+        if (body.saveConfig === 'favicon') {
+          const { domain, icon } = body;
+          if (!domain || !icon) {
+            return jsonResponse({ error: 'Domain and icon are required' }, 400, corsHeaders);
+          }
+          await kv.put(`favicon:${domain}`, icon, { expirationTtl: 30 * 24 * 60 * 60 });
+          return jsonResponse({ success: true }, 200, corsHeaders);
+        }
+      }
+
+      const providedPassword = request.headers.get('x-auth-password');
+      const isAuthenticated = await verifyAuth({
+        providedPassword,
+        serverPassword: env.PASSWORD,
+        kv,
+      });
+
+      if (!isAuthenticated) {
+        return jsonResponse({ error: '管理操作需要密码验证' }, 401, corsHeaders);
+      }
+
+      if (body.authOnly) {
+        await kv.put('last_auth_time', Date.now().toString());
+        return jsonResponse({ success: true }, 200, corsHeaders);
+      }
+
+      if (CONFIG_SECTIONS.includes(body.saveConfig)) {
+        await kv.put(`config:${body.saveConfig}`, JSON.stringify(body.config));
+        return jsonResponse({ success: true }, 200, corsHeaders);
+      }
+
+      if (body.saveConfig === 'categories') {
+        const existingData = await kv.get(STORAGE_KEYS.CATEGORIES_CONFIG_KEY);
+        const existingCategories = existingData ? JSON.parse(existingData) : [];
+        const existingPasswords = new Map(existingCategories.map(c => [c.id, c.password]));
+
+        const mergedCategories = body.categories.map(cat => ({
+          ...cat,
+          password: cat.password || existingPasswords.get(cat.id) || undefined,
+        }));
+
+        await kv.put(STORAGE_KEYS.CATEGORIES_CONFIG_KEY, JSON.stringify(mergedCategories));
+        return jsonResponse({ success: true }, 200, corsHeaders);
+      }
+
+      if (body.saveConfig === 'links') {
+        if (body.categoryId) {
+          await kv.put(categoryLinksKey(body.categoryId), JSON.stringify(body.links));
+        } else {
+          // 需要传入 categories 才能正确清理
+          const categoriesData = await kv.get(STORAGE_KEYS.CATEGORIES_CONFIG_KEY);
+          const categories = categoriesData ? JSON.parse(categoriesData) : [];
+          await saveCategoryLinks(kv, body.links, categories);
+        }
+        return jsonResponse({ success: true }, 200, corsHeaders);
+      }
+
+      if (body.key === STORAGE_KEYS.CONFIG_KEY && body.value) {
+        await kv.put('config', body.value);
+        return jsonResponse({ success: true }, 200, corsHeaders);
+      }
+
+      if (body.key && body.value && body.key !== STORAGE_KEYS.CONFIG_KEY) {
+        await kv.put(body.key, body.value);
+        return jsonResponse({ success: true }, 200, corsHeaders);
+      }
+
+      // ===== 修复：同时保存 links 和 categories 时，传入 categories 进行完整清理 =====
+      if (body.links && body.categories) {
+        await saveCategoryLinks(kv, body.links, body.categories);
+
+        const existingData = await kv.get(STORAGE_KEYS.CATEGORIES_CONFIG_KEY);
+        const existingCategories = existingData ? JSON.parse(existingData) : [];
+        const existingPasswords = new Map(existingCategories.map(c => [c.id, c.password]));
+
+        const mergedCategories = body.categories.map(cat => ({
+          ...cat,
+          password: cat.password || existingPasswords.get(cat.id) || undefined,
+        }));
+
+        await kv.put(STORAGE_KEYS.CATEGORIES_CONFIG_KEY, JSON.stringify(mergedCategories));
+        return jsonResponse({ success: true }, 200, corsHeaders);
+      } else if (body.links) {
+        const categoriesData = await kv.get(STORAGE_KEYS.CATEGORIES_CONFIG_KEY);
+        const categories = categoriesData ? JSON.parse(categoriesData) : [];
+        await saveCategoryLinks(kv, body.links, categories);
+        return jsonResponse({ success: true }, 200, corsHeaders);
+      } else if (body.categories) {
+        const existingData = await kv.get(STORAGE_KEYS.CATEGORIES_CONFIG_KEY);
+        const existingCategories = existingData ? JSON.parse(existingData) : [];
+        const existingPasswords = new Map(existingCategories.map(c => [c.id, c.password]));
+
+        const mergedCategories = body.categories.map(cat => ({
+          ...cat,
+          password: cat.password || existingPasswords.get(cat.id) || undefined,
+        }));
+
+        await kv.put(STORAGE_KEYS.CATEGORIES_CONFIG_KEY, JSON.stringify(mergedCategories));
+        return jsonResponse({ success: true }, 200, corsHeaders);
+      }
+
+      return jsonResponse({ error: 'Invalid data format' }, 400, corsHeaders);
+    }
+
+    return jsonResponse({ error: 'Method Not Allowed' }, 405, corsHeaders);
+
+  } catch (err) {
+    console.error('Storage API error:', err);
+    return jsonResponse({ error: 'Failed to fetch data', details: err.message }, 500, corsHeaders);
+  }
+}
diff --git a/components/BackupModal.tsx b/components/BackupModal.tsx
index 838e2f85..6284168d 100644
--- a/components/BackupModal.tsx
+++ b/components/BackupModal.tsx
@@ -512,4 +512,4 @@ const BackupModal: React.FC<BackupModalProps> = ({
   );
 };
 
-export default BackupModal;
\ No newline at end of file
+export default BackupModal;
diff --git a/components/CategoryActionAuthModal.tsx b/components/CategoryActionAuthModal.tsx
index 94c03e68..5b7fc9d4 100644
--- a/components/CategoryActionAuthModal.tsx
+++ b/components/CategoryActionAuthModal.tsx
@@ -1,86 +1,73 @@
 import React, { useState } from 'react';
-import { X, Lock, AlertCircle } from 'lucide-react';
+import { Lock, ArrowRight, Loader2, X } from 'lucide-react';
+import { Category } from '../types';
+import { API_ENDPOINTS } from '../src/constants';
 
-interface CategoryActionAuthModalProps {
+interface CategoryAuthModalProps {
   isOpen: boolean;
   onClose: () => void;
-  onVerify: (password: string) => Promise<boolean>;
-  onVerified: () => void;
-  actionType: 'edit' | 'delete';
-  categoryName: string;
+  category: Category | null;
+  onUnlock: (categoryId: string) => void;
 }
 
-const CategoryActionAuthModal: React.FC<CategoryActionAuthModalProps> = ({ 
-  isOpen, 
-  onClose, 
-  onVerify,
-  onVerified,
-  actionType,
-  categoryName
-}) => {
+const CategoryAuthModal: React.FC<CategoryAuthModalProps> = ({ isOpen, onClose, category, onUnlock }) => {
   const [password, setPassword] = useState('');
-  const [isVerifying, setIsVerifying] = useState(false);
   const [error, setError] = useState('');
+  const [isLoading, setIsLoading] = useState(false);
 
-  if (!isOpen) return null;
+  if (!isOpen || !category) return null;
 
   const handleSubmit = async (e: React.FormEvent) => {
     e.preventDefault();
-    if (!password.trim()) {
-      setError('请输入密码');
-      return;
-    }
+    if (!password.trim()) return;
 
-    setIsVerifying(true);
+    setIsLoading(true);
     setError('');
-    
+
     try {
-      const success = await onVerify(password);
-      if (success) {
-        setPassword('');
-        onVerified();
-      } else {
-        setError('密码错误，请重试');
+      // 调用后端验证分类密码
+      const res = await fetch(`${API_ENDPOINTS.STORAGE}?getConfig=links&category=${encodeURIComponent(category.id)}&catPassword=${encodeURIComponent(password.trim())}`);
+
+      if (res.status === 403) {
+        setError('密码错误');
+        setIsLoading(false);
+        return;
       }
+
+      if (!res.ok) {
+        setError('验证失败，请重试');
+        setIsLoading(false);
+        return;
+      }
+
+      // 密码正确，解锁分类
+      onUnlock(category.id);
+      setPassword('');
+      setError('');
+      setIsLoading(false);
+      onClose();
     } catch (err) {
-      setError('验证失败，请重试');
-    } finally {
-      setIsVerifying(false);
+      console.error('Category auth error:', err);
+      setError('网络错误，请重试');
+      setIsLoading(false);
     }
   };
 
-  const handleClose = () => {
-    setPassword('');
-    setError('');
-    onClose();
-  };
-
-  const actionText = actionType === 'edit' ? '编辑' : '删除';
-  const colorClass = actionType === 'edit' 
-    ? 'amber' 
-    : 'red';
-
   return (
     <div className="fixed inset-0 z-[60] flex items-center justify-center p-4 bg-black/60 backdrop-blur-sm">
       <div className="bg-white dark:bg-slate-800 rounded-2xl shadow-2xl w-full max-w-sm overflow-hidden border border-slate-200 dark:border-slate-700 p-6 relative">
-        <button onClick={handleClose} className="absolute top-4 right-4 p-1 hover:bg-slate-100 dark:hover:bg-slate-700 rounded-full">
+        <button onClick={onClose} className="absolute top-4 right-4 p-1 hover:bg-slate-100 dark:hover:bg-slate-700 rounded-full">
             <X size={20} className="text-slate-400" />
         </button>
 
         <div className="flex flex-col items-center mb-6">
-          <div className={`w-14 h-14 bg-${colorClass}-100 dark:bg-${colorClass}-900/30 rounded-full flex items-center justify-center mb-4 text-${colorClass}-600 dark:text-${colorClass}-400`}>
+          <div className="w-14 h-14 bg-amber-100 dark:bg-amber-900/30 rounded-full flex items-center justify-center mb-4 text-amber-600 dark:text-amber-400">
             <Lock size={28} />
           </div>
-          <h2 className="text-lg font-bold dark:text-white">验证操作权限</h2>
+          <h2 className="text-lg font-bold dark:text-white">解锁 "{category.name}"</h2>
           <p className="text-sm text-slate-500 dark:text-slate-400 text-center mt-2">
-            您正在{actionText}分类 "<span className="font-medium">{categoryName}</span>"
+            该目录受密码保护，请输入密码访问
           </p>
-          <div className="flex items-center gap-2 mt-2 p-2 bg-amber-50 dark:bg-amber-900/20 rounded-lg">
-            <AlertCircle size={16} className="text-amber-600 dark:text-amber-400" />
-            <p className="text-xs text-amber-700 dark:text-amber-300">
-              请输入部署时设置的密码进行验证
-            </p>
-          </div>
         </div>
 
         <form onSubmit={handleSubmit} className="space-y-4">
@@ -89,41 +76,32 @@ const CategoryActionAuthModal: React.FC<CategoryActionAuthModalProps> = ({
               type="password"
               value={password}
               onChange={(e) => setPassword(e.target.value)}
-              className={`w-full p-3 rounded-xl border border-slate-300 dark:border-slate-600 dark:bg-slate-700 dark:text-white focus:ring-2 focus:ring-${colorClass}-500 outline-none transition-all text-center tracking-widest`}
-              placeholder="请输入密码"
+              className="w-full p-3 rounded-xl border border-slate-300 dark:border-slate-600 dark:bg-slate-700 dark:text-white focus:ring-2 focus:ring-amber-500 outline-none transition-all text-center tracking-widest"
+              placeholder="目录密码"
               autoFocus
-              disabled={isVerifying}
+              disabled={isLoading}
             />
           </div>
-          
+
           {error && (
-            <div className={`p-2 bg-${colorClass}-50 dark:bg-${colorClass}-900/20 rounded-lg flex items-center gap-2`}>
-              <AlertCircle size={16} className={`text-${colorClass}-600 dark:text-${colorClass}-400`} />
-              <p className={`text-sm text-${colorClass}-700 dark:text-${colorClass}-300`}>{error}</p>
+            <div className="text-red-500 text-sm text-center font-medium animate-pulse">
+              {error}
             </div>
           )}
-          
-          <div className="flex gap-2">
-            <button
-              type="button"
-              onClick={handleClose}
-              className="flex-1 px-4 py-2.5 bg-slate-100 dark:bg-slate-700 text-slate-700 dark:text-slate-300 rounded-xl hover:bg-slate-200 dark:hover:bg-slate-600 transition-colors font-medium"
-              disabled={isVerifying}
-            >
-              取消
-            </button>
-            <button
-              type="submit"
-              className={`flex-1 px-4 py-2.5 bg-${colorClass}-600 text-white rounded-xl hover:bg-${colorClass}-700 transition-colors font-medium disabled:opacity-50`}
-              disabled={isVerifying}
-            >
-              {isVerifying ? '验证中...' : `确认${actionText}`}
-            </button>
-          </div>
+
+          <button
+            type="submit"
+            disabled={!password || isLoading}
+            className="w-full bg-amber-500 hover:bg-amber-600 disabled:bg-amber-300 text-white font-bold py-3 px-4 rounded-xl transition-colors shadow-lg shadow-amber-500/30 flex items-center justify-center gap-2"
+          >
+            {isLoading ? <Loader2 size={18} className="animate-spin" /> : <>
+              解锁 <ArrowRight size={18} />
+            </>}
+          </button>
         </form>
       </div>
     </div>
   );
 };
 
-export default CategoryActionAuthModal;
\ No newline at end of file
+export default CategoryAuthModal;
diff --git a/components/CategoryAuthModal.tsx b/components/CategoryAuthModal.tsx
index 33f253df..29095eb2 100644
--- a/components/CategoryAuthModal.tsx
+++ b/components/CategoryAuthModal.tsx
@@ -1,6 +1,7 @@
 import React, { useState } from 'react';
 import { Lock, ArrowRight, Loader2, X } from 'lucide-react';
 import { Category } from '../types';
+import { API_ENDPOINTS } from '../src/constants';
 
 interface CategoryAuthModalProps {
   isOpen: boolean;
@@ -12,18 +13,45 @@ interface CategoryAuthModalProps {
 const CategoryAuthModal: React.FC<CategoryAuthModalProps> = ({ isOpen, onClose, category, onUnlock }) => {
   const [password, setPassword] = useState('');
   const [error, setError] = useState('');
+  const [isLoading, setIsLoading] = useState(false);
 
   if (!isOpen || !category) return null;
 
-  const handleSubmit = (e: React.FormEvent) => {
+  const handleSubmit = async (e: React.FormEvent) => {
     e.preventDefault();
-    if (password === category.password) {
-        onUnlock(category.id);
-        setPassword('');
-        setError('');
-        onClose();
-    } else {
+    if (!password.trim()) return;
+
+    setIsLoading(true);
+    setError('');
+
+    try {
+      // 调用后端验证分类密码
+      const res = await fetch(
+        `${API_ENDPOINTS.STORAGE}?getConfig=links&category=${encodeURIComponent(category.id)}&catPassword=${encodeURIComponent(password.trim())}`
+      );
+
+      if (res.status === 403) {
         setError('密码错误');
+        setIsLoading(false);
+        return;
+      }
+
+      if (!res.ok) {
+        setError('验证失败，请重试');
+        setIsLoading(false);
+        return;
+      }
+
+      // 密码正确，解锁分类
+      onUnlock(category.id);
+      setPassword('');
+      setError('');
+      setIsLoading(false);
+      onClose();
+    } catch (err) {
+      console.error('Category auth error:', err);
+      setError('网络错误，请重试');
+      setIsLoading(false);
     }
   };
 
@@ -53,6 +81,7 @@ const CategoryAuthModal: React.FC<CategoryAuthModalProps> = ({ isOpen, onClose,
               className="w-full p-3 rounded-xl border border-slate-300 dark:border-slate-600 dark:bg-slate-700 dark:text-white focus:ring-2 focus:ring-amber-500 outline-none transition-all text-center tracking-widest"
               placeholder="目录密码"
               autoFocus
+              disabled={isLoading}
             />
           </div>
 
@@ -64,10 +93,12 @@ const CategoryAuthModal: React.FC<CategoryAuthModalProps> = ({ isOpen, onClose,
 
           <button
             type="submit"
-            disabled={!password}
-            className="w-full bg-amber-500 hover:bg-amber-600 text-white font-bold py-3 px-4 rounded-xl transition-colors shadow-lg shadow-amber-500/30 flex items-center justify-center gap-2"
+            disabled={!password || isLoading}
+            className="w-full bg-amber-500 hover:bg-amber-600 disabled:bg-amber-300 text-white font-bold py-3 px-4 rounded-xl transition-colors shadow-lg shadow-amber-500/30 flex items-center justify-center gap-2"
           >
-            解锁 <ArrowRight size={18} />
+            {isLoading ? <Loader2 size={18} className="animate-spin" /> : <>
+              解锁 <ArrowRight size={18} />
+            </>}
           </button>
         </form>
       </div>
@@ -75,4 +106,4 @@ const CategoryAuthModal: React.FC<CategoryAuthModalProps> = ({ isOpen, onClose,
   );
 };
 
-export default CategoryAuthModal;
\ No newline at end of file
+export default CategoryAuthModal;
diff --git a/components/CategoryManagerModal.tsx b/components/CategoryManagerModal.tsx
index a14a44d1..43d7eb7e 100644
--- a/components/CategoryManagerModal.tsx
+++ b/components/CategoryManagerModal.tsx
@@ -1,5 +1,6 @@
 import React, { useState, useEffect } from 'react';
 import { X, ArrowUp, ArrowDown, Trash2, Edit2, Plus, Check, Lock, Unlock, Palette, Save } from 'lucide-react';
+import { toast } from './Toast';
 import { Category } from '../types';
 import Icon from './Icon';
 import IconSelector from './IconSelector';
@@ -9,8 +10,10 @@ interface CategoryManagerModalProps {
   isOpen: boolean;
   onClose: () => void;
   categories: Category[];
+  links: { id: string; categoryId: string; title: string }[];
   onUpdateCategories: (newCategories: Category[]) => void;
   onDeleteCategory: (id: string) => void;
+  onUpdateLinks?: (links: { id: string; categoryId: string; title: string }[]) => void;
   onVerifyPassword?: (password: string) => Promise<boolean>;
 }
 
@@ -18,8 +21,10 @@ const CategoryManagerModal: React.FC<CategoryManagerModalProps> = ({
   isOpen,
   onClose,
   categories,
+  links,
   onUpdateCategories,
   onDeleteCategory,
+  onUpdateLinks,
   onVerifyPassword
 }) => {
   // 本地编辑状态 - 不直接修改原始数据
@@ -140,6 +145,7 @@ const CategoryManagerModal: React.FC<CategoryManagerModalProps> = ({
 
       onUpdateCategories(sorted);
       setHasChanges(false);
+      toast.success('分类更改已保存');
       onClose();
     } catch (e) {
       console.error('Save failed:', e);
@@ -172,6 +178,16 @@ const CategoryManagerModal: React.FC<CategoryManagerModalProps> = ({
     if (!onVerifyPassword || hasVerifiedPermissions) {
       if (confirm(`确定删除"${cat.name}"分类吗？该分类下的书签将移动到"常用推荐"。`)) {
         const newCats = localCategories.filter(c => c.id !== cat.id);
+        // 迁移该分类下的书签到 common
+        if (onUpdateLinks && links) {
+          const linksToMigrate = links.filter(l => l.categoryId === cat.id);
+          if (linksToMigrate.length > 0) {
+            const migratedLinks = links.map(l =>
+              l.categoryId === cat.id ? { ...l, categoryId: 'common' } : l
+            );
+            onUpdateLinks(migratedLinks);
+          }
+        }
         markChanged(newCats);
       }
       return;
@@ -189,7 +205,17 @@ const CategoryManagerModal: React.FC<CategoryManagerModalProps> = ({
       if (cat) startEdit(cat);
     } else if (pendingAction.type === 'delete') {
       const cat = localCategories.find(c => c.id === pendingAction.categoryId);
-      if (cat && confirm(`确定删除"${cat.name}"分类吗？`)) {
+      if (cat && confirm(`确定删除"${cat.name}"分类吗？该分类下的书签将移动到"常用推荐"。`)) {
+        // 迁移该分类下的书签到 common
+        if (onUpdateLinks && links) {
+          const linksToMigrate = links.filter(l => l.categoryId === cat.id);
+          if (linksToMigrate.length > 0) {
+            const migratedLinks = links.map(l =>
+              l.categoryId === cat.id ? { ...l, categoryId: 'common' } : l
+            );
+            onUpdateLinks(migratedLinks);
+          }
+        }
         markChanged(localCategories.filter(c => c.id !== cat.id));
       }
     }
@@ -227,6 +253,7 @@ const CategoryManagerModal: React.FC<CategoryManagerModalProps> = ({
       return c;
     });
     markChanged(newCats);
+    toast.success(`已更新分类「${editName.trim()}」`);
     setEditingId(null);
     setEditParentId('');
   };
@@ -244,6 +271,7 @@ const CategoryManagerModal: React.FC<CategoryManagerModalProps> = ({
       weight: maxWeight + 1,
     };
     markChanged([...localCategories, newCat]);
+    toast.success(`已添加分类「${newCat.name}」`);
     setNewCatName('');
     setNewCatPassword('');
     setNewCatIcon('Folder');
diff --git a/components/ImportModal.tsx b/components/ImportModal.tsx
index 69f74f8e..8a646071 100644
--- a/components/ImportModal.tsx
+++ b/components/ImportModal.tsx
@@ -981,4 +981,4 @@ const ImportModal: React.FC<ImportModalProps> = ({
   );
 };
 
-export default ImportModal;
\ No newline at end of file
+export default ImportModal;
diff --git a/components/LinkModal.tsx b/components/LinkModal.tsx
index 8cc60db5..32c95c70 100644
--- a/components/LinkModal.tsx
+++ b/components/LinkModal.tsx
@@ -24,6 +24,7 @@ const LinkModal: React.FC<LinkModalProps> = ({ isOpen, onClose, onSave, onDelete
   const [description, setDescription] = useState('');
   const [categoryId, setCategoryId] = useState(categories[0]?.id || 'common');
   const [pinned, setPinned] = useState(false);
+  const [isPrivate, setIsPrivate] = useState(false);
   const [icon, setIcon] = useState('');
   const [iconType, setIconType] = useState<IconSourceType>('google');
   const [isUploading, setIsUploading] = useState(false);
@@ -209,6 +210,7 @@ const LinkModal: React.FC<LinkModalProps> = ({ isOpen, onClose, onSave, onDelete
         setDescription(initialData.description || '');
         setCategoryId(initialData.categoryId);
         setPinned(initialData.pinned || false);
+        setIsPrivate(initialData.isPrivate || false);
         setIcon(initialData.icon || '');
         setWeight(initialData.weight || 0);
         setPinnedOrder(initialData.pinnedOrder || 0);
@@ -224,8 +226,13 @@ const LinkModal: React.FC<LinkModalProps> = ({ isOpen, onClose, onSave, onDelete
         } else {
           if (initialData.icon?.includes('faviconextractor.com')) {
             detectedType = 'faviconextractor';
-          } else if (initialData.icon?.includes('google.com/s2/favicons') || initialData.icon?.includes('/api/favicon?domain=')) {
+          } else if (initialData.icon?.includes('google.com/s2/favicons')) {
             detectedType = 'google';
+          } else if (initialData.icon?.includes('/api/favicon?domain=')) {
+            // 兼容旧数据
+            detectedType = 'google';
+          } else if (initialData.icon?.includes('api.xinac.net/icon')) {
+            detectedType = 'xinac';
           } else if (initialData.icon?.includes('/api/favicon?key=')) {
             detectedType = 'upload-edgeone';
           } else if (initialData.icon) {
@@ -269,6 +276,7 @@ const LinkModal: React.FC<LinkModalProps> = ({ isOpen, onClose, onSave, onDelete
           setCategoryId(firstAvailableCategory?.id || 'common');
         }
         setPinned(false);
+        setIsPrivate(false);
         setIcon('');
         setIconType('google');
         setCustomIconUrl('');
@@ -294,6 +302,7 @@ const LinkModal: React.FC<LinkModalProps> = ({ isOpen, onClose, onSave, onDelete
   const handleDelete = () => {
     if (!initialData) return;
     onDelete && onDelete(initialData.id);
+    toast.success(`「${initialData.title}」已删除`);
     onClose();
   };
 
@@ -355,8 +364,15 @@ const LinkModal: React.FC<LinkModalProps> = ({ isOpen, onClose, onSave, onDelete
       iconConfig: iconType === 'customapi' ? { iconType, customApiUrl, customApiParam } : undefined,
       customIconUrl,
       edgeoneBlobUrl,
-      cloudflareR2Url
+      cloudflareR2Url,
+      isPrivate
     });
+
+    if (!batchMode) {
+      toast.success(initialData ? `「${title}」已更新` : `「${title}」已添加`);
+    } else {
+      toast.success(`「${title}」已添加，可继续添加下一个`);
+    }
     
     // 如果有自定义图标URL，缓存到KV空间
     if (icon && !icon.startsWith('/api/favicon') && !icon.includes('faviconextractor.com')) {
@@ -438,11 +454,16 @@ const LinkModal: React.FC<LinkModalProps> = ({ isOpen, onClose, onSave, onDelete
       // 根据选择的图标类型生成图标URL
       switch (iconType) {
         case 'faviconextractor':
+          iconUrl = `https://faviconextractor.com/favicon/${domain}`;
+          break;
         case 'google':
-          iconUrl = `/api/favicon?domain=${domain}`;
+          iconUrl = `https://www.google.com/s2/favicons?domain=${domain}&sz=128`;
+          break;
+        case 'xinac':
+          iconUrl = `https://api.xinac.net/icon/?url=${encodeURIComponent(url)}`;
           break;
         default:
-          iconUrl = `/api/favicon?domain=${domain}`;
+          iconUrl = `https://www.google.com/s2/favicons?domain=${domain}&sz=128`;
       }
 
       setIcon(iconUrl);
@@ -457,10 +478,10 @@ const LinkModal: React.FC<LinkModalProps> = ({ isOpen, onClose, onSave, onDelete
   if (!isOpen) return null;
 
   return (
-    <div className="fixed inset-0 z-50 flex items-center justify-center p-4 bg-black/50 backdrop-blur-sm">
-      <div className="bg-white dark:bg-slate-800 rounded-2xl shadow-2xl w-full max-w-md overflow-hidden border border-slate-200 dark:border-slate-700">
-        <div className="flex justify-between items-center p-4 border-b border-slate-200 dark:border-slate-700">
-          <div className="flex items-center gap-2">
+    <div className="fixed inset-0 z-[60] flex items-start sm:items-center justify-center p-2 sm:p-4 bg-black/50 backdrop-blur-sm overflow-y-auto">
+      <div className="bg-white dark:bg-slate-800 rounded-2xl shadow-2xl w-full max-w-md max-h-[92vh] sm:max-h-[85vh] overflow-hidden flex flex-col border border-slate-200 dark:border-slate-700 my-auto">
+        <div className="flex justify-between items-start sm:items-center p-4 border-b border-slate-200 dark:border-slate-700 gap-2">
+          <div className="flex items-center gap-2 flex-wrap">
             <h3 className="text-lg font-semibold dark:text-white">
               {initialData ? '编辑链接' : '添加新链接'}
             </h3>
@@ -477,6 +498,19 @@ const LinkModal: React.FC<LinkModalProps> = ({ isOpen, onClose, onSave, onDelete
               <Pin size={14} className={pinned ? "fill-current" : ""} />
               <span className="text-xs font-medium">置顶</span>
             </button>
+            <button
+              type="button"
+              onClick={() => setIsPrivate(!isPrivate)}
+              className={`flex items-center gap-1 px-2 py-1 rounded-md border transition-all ${
+                isPrivate
+                ? 'bg-purple-100 border-purple-200 text-purple-600 dark:bg-purple-900/40 dark:border-purple-800 dark:text-purple-300'
+                : 'bg-slate-50 border-slate-200 text-slate-500 dark:bg-slate-700 dark:border-slate-600 dark:text-slate-400'
+              }`}
+              title={isPrivate ? "取消私人书签" : "设为私人书签"}
+            >
+              <span className="text-xs font-medium">{isPrivate ? '🔒 私人' : '🔓 私人'}</span>
+            </button>
+
             {!initialData && (
               <div className="flex items-center gap-1 px-2 py-1 rounded-md border bg-slate-50 border-slate-200 dark:bg-slate-700 dark:border-slate-600">
                 <input
@@ -510,7 +544,7 @@ const LinkModal: React.FC<LinkModalProps> = ({ isOpen, onClose, onSave, onDelete
           </button>
         </div>
 
-        <form onSubmit={handleSave} className="p-4 space-y-4">
+        <form onSubmit={handleSave} noValidate className="p-4 space-y-4 overflow-y-auto flex-1">
           <div>
             <label className="block text-sm font-medium mb-1 dark:text-slate-300">标题</label>
             <input
@@ -518,7 +552,7 @@ const LinkModal: React.FC<LinkModalProps> = ({ isOpen, onClose, onSave, onDelete
               required
               value={title}
               onChange={(e) => setTitle(e.target.value)}
-              className="w-full p-2 rounded-lg border border-slate-300 dark:border-slate-600 dark:bg-slate-700 dark:text-white focus:ring-2 focus:ring-blue-500 outline-none transition-all"
+              className="w-full p-2 rounded-lg border border-slate-300 dark:border-slate-600 dark:bg-slate-700 dark:text-white focus:ring-2 focus:ring-blue-500 outline-none transition-all text-base"
               placeholder="网站名称"
             />
           </div>
@@ -531,7 +565,7 @@ const LinkModal: React.FC<LinkModalProps> = ({ isOpen, onClose, onSave, onDelete
                 required
                 value={url}
                 onChange={(e) => setUrl(e.target.value)}
-                className="w-full p-2 rounded-lg border border-slate-300 dark:border-slate-600 dark:bg-slate-700 dark:text-white focus:ring-2 focus:ring-blue-500 outline-none transition-all"
+                className="w-full p-2 rounded-lg border border-slate-300 dark:border-slate-600 dark:bg-slate-700 dark:text-white focus:ring-2 focus:ring-blue-500 outline-none transition-all text-base"
                 placeholder="example.com 或 https://..."
               />
             </div>
@@ -553,14 +587,17 @@ const LinkModal: React.FC<LinkModalProps> = ({ isOpen, onClose, onSave, onDelete
                       setIcon(edgeoneBlobUrl);
                     } else if (newType === 'upload-cloudflare') {
                       setIcon(cloudflareR2Url);
+                    } else if (newType === 'xinac') {
+                      setIcon('');
                     } else {
                       setIcon('');
                     }
                   }}
-                  className="w-full p-2 rounded-lg border border-slate-300 dark:border-slate-600 dark:bg-slate-700 dark:text-white focus:ring-2 focus:ring-blue-500 outline-none transition-all"
+                  className="w-full p-2 rounded-lg border border-slate-300 dark:border-slate-600 dark:bg-slate-700 dark:text-white focus:ring-2 focus:ring-blue-500 outline-none transition-all text-base"
                 >
                   <option value="google">Google Favicon API (默认)</option>
                   <option value="faviconextractor">Favicon Extractor</option>
+                  <option value="xinac">Xinac 图标 API</option>
                   <option value="customurl">自定义图片URL</option>
                   <option value="customapi">自定义API</option>
                   {supportsUpload && <option value="upload-edgeone">上传到 Edgeone Pages Blob</option>}
@@ -578,7 +615,7 @@ const LinkModal: React.FC<LinkModalProps> = ({ isOpen, onClose, onSave, onDelete
                         setIcon(e.target.value);
                         setCustomIconUrl(e.target.value);
                       }}
-                      className="flex-1 p-2 rounded-lg border border-slate-300 dark:border-slate-600 dark:bg-slate-700 dark:text-white focus:ring-2 focus:ring-blue-500 outline-none transition-all"
+                      className="flex-1 p-2 rounded-lg border border-slate-300 dark:border-slate-600 dark:bg-slate-700 dark:text-white focus:ring-2 focus:ring-blue-500 outline-none transition-all text-base"
                       placeholder="https://example.com/icon.png"
                     />
                   </div>
@@ -612,13 +649,13 @@ const LinkModal: React.FC<LinkModalProps> = ({ isOpen, onClose, onSave, onDelete
                       type="url"
                       value={customApiUrl}
                       onChange={(e) => setCustomApiUrl(e.target.value)}
-                      className="flex-1 p-2 rounded-lg border border-slate-300 dark:border-slate-600 dark:bg-slate-700 dark:text-white focus:ring-2 focus:ring-blue-500 outline-none transition-all"
+                      className="flex-1 p-2 rounded-lg border border-slate-300 dark:border-slate-600 dark:bg-slate-700 dark:text-white focus:ring-2 focus:ring-blue-500 outline-none transition-all text-base"
                       placeholder="https://api.example.com/icon"
                     />
                     <select
                       value={customApiParam}
                       onChange={(e) => setCustomApiParam(e.target.value as 'URL' | 'DOMAIN')}
-                      className="p-2 rounded-lg border border-slate-300 dark:border-slate-600 dark:bg-slate-700 dark:text-white focus:ring-2 focus:ring-blue-500 outline-none transition-all"
+                      className="p-2 rounded-lg border border-slate-300 dark:border-slate-600 dark:bg-slate-700 dark:text-white focus:ring-2 focus:ring-blue-500 outline-none transition-all text-base"
                     >
                       <option value="URL">URL参数</option>
                       <option value="DOMAIN">DOMAIN参数</option>
@@ -630,7 +667,7 @@ const LinkModal: React.FC<LinkModalProps> = ({ isOpen, onClose, onSave, onDelete
                         type="url"
                         value={icon}
                         readOnly
-                        className="flex-1 p-2 rounded-lg border border-slate-200 dark:border-slate-600 bg-slate-50 dark:bg-slate-700 dark:text-slate-400 text-sm"
+                        className="flex-1 p-2 rounded-lg border border-slate-200 dark:border-slate-600 bg-slate-50 dark:bg-slate-700 dark:text-slate-400 text-base"
                         placeholder={`生成的图标地址: ${customApiUrl}?${customApiParam.toLowerCase()}=${customApiParam === 'URL' ? encodeURIComponent(url) : new URL(url).hostname}`}
                       />
                       <button
@@ -655,7 +692,7 @@ const LinkModal: React.FC<LinkModalProps> = ({ isOpen, onClose, onSave, onDelete
                       type="url"
                       value={icon}
                       readOnly
-                      className="flex-1 p-2 rounded-lg border border-slate-200 bg-slate-50 dark:border-slate-600 dark:bg-slate-700 dark:text-slate-400 text-sm"
+                      className="flex-1 p-2 rounded-lg border border-slate-200 bg-slate-50 dark:border-slate-600 dark:bg-slate-700 dark:text-slate-400 text-base"
                       placeholder="上传图标后将自动生成路径"
                     />
                     <label className="cursor-pointer px-4 py-2 bg-blue-600 hover:bg-blue-700 text-white rounded-lg text-sm transition-colors flex items-center gap-1 font-medium shrink-0">
@@ -678,13 +715,13 @@ const LinkModal: React.FC<LinkModalProps> = ({ isOpen, onClose, onSave, onDelete
                 </div>
               )}
 
-              {(iconType === 'faviconextractor' || iconType === 'google') && (
+              {(iconType === 'faviconextractor' || iconType === 'google' || iconType === 'xinac') && (
                 <div className="flex gap-2">
                   <input
                     type="url"
                     value={icon}
                     onChange={(e) => setIcon(e.target.value)}
-                    className="flex-1 p-2 rounded-lg border border-slate-300 dark:border-slate-600 dark:bg-slate-700 dark:text-white focus:ring-2 focus:ring-blue-500 outline-none transition-all"
+                    className="flex-1 p-2 rounded-lg border border-slate-300 dark:border-slate-600 dark:bg-slate-700 dark:text-white focus:ring-2 focus:ring-blue-500 outline-none transition-all text-base"
                     placeholder="留空自动获取图标"
                   />
                   <button
@@ -737,7 +774,7 @@ const LinkModal: React.FC<LinkModalProps> = ({ isOpen, onClose, onSave, onDelete
             <textarea
               value={description}
               onChange={(e) => setDescription(e.target.value)}
-              className="w-full p-2 rounded-lg border border-slate-300 dark:border-slate-600 dark:bg-slate-700 dark:text-white focus:ring-2 focus:ring-blue-500 outline-none transition-all h-20 resize-none"
+              className="w-full p-2 rounded-lg border border-slate-300 dark:border-slate-600 dark:bg-slate-700 dark:text-white focus:ring-2 focus:ring-blue-500 outline-none transition-all h-20 resize-none text-base"
               placeholder="简短描述..."
             />
           </div>
@@ -747,7 +784,7 @@ const LinkModal: React.FC<LinkModalProps> = ({ isOpen, onClose, onSave, onDelete
             <select
             value={categoryId}
             onChange={(e) => setCategoryId(e.target.value)}
-            className="w-full p-2 rounded-lg border border-slate-300 dark:border-slate-600 dark:bg-slate-700 dark:text-white focus:ring-2 focus:ring-blue-500 outline-none transition-all"
+            className="w-full p-2 rounded-lg border border-slate-300 dark:border-slate-600 dark:bg-slate-700 dark:text-white focus:ring-2 focus:ring-blue-500 outline-none transition-all text-base"
             >
             {categories
                 .filter(cat => !cat.isSubcategory ? !hasSubCategories(cat.id) : true)
@@ -765,7 +802,7 @@ const LinkModal: React.FC<LinkModalProps> = ({ isOpen, onClose, onSave, onDelete
               type="number"
               value={weight}
               onChange={(e) => setWeight(parseInt(e.target.value) || 0)}
-              className="w-full p-2 rounded-lg border border-slate-300 dark:border-slate-600 dark:bg-slate-700 dark:text-white focus:ring-2 focus:ring-blue-500 outline-none transition-all"
+              className="w-full p-2 rounded-lg border border-slate-300 dark:border-slate-600 dark:bg-slate-700 dark:text-white focus:ring-2 focus:ring-blue-500 outline-none transition-all text-base"
               placeholder="数值越小越靠前"
             />
             <p className="text-[10px] text-slate-400 mt-1">控制在分类中的排序，数值越小越靠前。</p>
@@ -778,7 +815,7 @@ const LinkModal: React.FC<LinkModalProps> = ({ isOpen, onClose, onSave, onDelete
                 type="number"
                 value={pinnedOrder}
                 onChange={(e) => setPinnedOrder(parseInt(e.target.value) || 0)}
-                className="w-full p-2 rounded-lg border border-slate-300 dark:border-slate-600 dark:bg-slate-700 dark:text-white focus:ring-2 focus:ring-blue-500 outline-none transition-all"
+                className="w-full p-2 rounded-lg border border-slate-300 dark:border-slate-600 dark:bg-slate-700 dark:text-white focus:ring-2 focus:ring-blue-500 outline-none transition-all text-base"
                 placeholder="数值越小越靠前"
               />
               <p className="text-[10px] text-slate-400 mt-1">控制在置顶区域的排序，数值越小越靠前。</p>
diff --git a/components/MastodonTicker.tsx b/components/MastodonTicker.tsx
index 9ad8823f..5d723658 100644
--- a/components/MastodonTicker.tsx
+++ b/components/MastodonTicker.tsx
@@ -51,20 +51,24 @@ const MastodonTicker: React.FC<TickerProps> = ({ config, isCollapsed }) => {
         let fetchedItems: TickerItem[] = [];
 
         if (config.source === 'mastodon' && config.mastodonInstance && config.mastodonUsername) {
-          fetchedItems = await fetchMastodon(config);
-        } else if (config.source === 'memos' && config.memosHost) {
-          fetchedItems = await fetchMemos(config);
-        } else if (config.source === 'custom' && config.customItems) {
-          fetchedItems = config.customItems
-            .filter(item => item.trim())
-            .map((item, i) => ({ 
-              id: `custom-${i}`, 
-              content: processTickerContent(item), 
-              url: '' 
-            }));
-        } else {
-          fetchedItems = defaultItems;
-        }
+  fetchedItems = await fetchMastodon(config);
+} else if (config.source === 'memos' && config.memosHost) {
+  fetchedItems = await fetchMemos(config);
+} else if (config.source === 'jinrishici') {
+  fetchedItems = await fetchJinrishici(config);
+} else if (config.source === 'hitokoto') {
+  fetchedItems = await fetchHitokoto(config);
+} else if (config.source === 'custom' && config.customItems) {
+  fetchedItems = config.customItems
+    .filter(item => item.trim())
+    .map((item, i) => ({ 
+      id: `custom-${i}`, 
+      content: processTickerContent(item), 
+      url: '' 
+    }));
+} else {
+  fetchedItems = defaultItems;
+}
 
         setItems(fetchedItems);
         setLoading(false);
@@ -275,5 +279,30 @@ async function fetchMemos(config: any): Promise<TickerItem[]> {
     };
   }).filter((m: TickerItem) => m.content.length > 0);
 }
+// 今日诗词数据获取
+async function fetchJinrishici(config: any): Promise<TickerItem[]> {
+  const url = config.jinrishiciUrl || 'https://v1.jinrishici.com/all.json';
+  const res = await fetch(url);
+  if (!res.ok) throw new Error('Jinrishici fetch failed');
+  const data = await res.json();
+  const content = data.content || data.data?.content || '';
+  const author = data.author || data.data?.origin?.author || '';
+  const title = data.title || data.data?.origin?.title || '';
+  const fullText = title ? `${content} —— ${author}《${title}》` : `${content} —— ${author}`;
+  return [{ id: 'jinrishici-1', content: fullText, url: '' }];
+}
 
+// 一言数据获取
+async function fetchHitokoto(config: any): Promise<TickerItem[]> {
+  const url = config.hitokotoUrl || 'https://v1.hitokoto.cn/?encode=json';
+  const res = await fetch(url);
+  if (!res.ok) throw new Error('Hitokoto fetch failed');
+  const data = await res.json();
+  const text = data.hitokoto || '';
+  const from = data.from || '';
+  const fromWho = data.from_who || '';
+  const author = fromWho || from;
+  const fullText = author ? `${text} —— ${author}` : text;
+  return [{ id: 'hitokoto-1', content: fullText, url: '' }];
+}
 export default MastodonTicker;
diff --git a/components/SettingsModal.tsx b/components/SettingsModal.tsx
index aa2f598d..a087cfca 100644
--- a/components/SettingsModal.tsx
+++ b/components/SettingsModal.tsx
@@ -427,6 +427,8 @@ const SettingsModal: React.FC<SettingsModalProps> = ({
                         <select value={settings.ticker.source} onChange={(e) => update('ticker', { ...settings.ticker, source: e.target.value as TickerSource })} className="w-full h-11 px-3 py-2.5 rounded-lg border border-slate-300 dark:border-slate-600 dark:bg-slate-700 dark:text-white focus:ring-2 focus:ring-blue-500 outline-none">
                           <option value="mastodon">Mastodon</option>
                           <option value="memos">Memos</option>
+                          <option value="jinrishici">今日诗词</option>
+                          <option value="hitokoto">一言 (Hitokoto)</option>
                           <option value="custom">自定义</option>
                         </select>
                       </div>
@@ -486,6 +488,28 @@ const SettingsModal: React.FC<SettingsModalProps> = ({
                         </div>
                       )}
 
+{/* 今日诗词配置 */}
+{settings.ticker.source === 'jinrishici' && (
+  <div className="space-y-3">
+    <div>
+      <label className="block text-xs font-medium text-slate-500 mb-1">API 地址（可选，留空使用默认）</label>
+      <input type="text" value={settings.ticker.jinrishiciUrl || ''} onChange={(e) => update('ticker', { ...settings.ticker, jinrishiciUrl: e.target.value })} placeholder="https://v1.jinrishici.com/all.json" className="w-full h-11 px-3 py-2.5 rounded-lg border border-slate-300 dark:border-slate-600 dark:bg-slate-700 dark:text-white focus:ring-2 focus:ring-blue-500 outline-none" />
+      <p className="text-[10px] text-slate-400 mt-1">留空使用默认接口：https://v1.jinrishici.com/all.json</p>
+    </div>
+  </div>
+)}
+
+{/* 一言配置 */}
+{settings.ticker.source === 'hitokoto' && (
+  <div className="space-y-3">
+    <div>
+      <label className="block text-xs font-medium text-slate-500 mb-1">API 地址（可选，留空使用默认）</label>
+      <input type="text" value={settings.ticker.hitokotoUrl || ''} onChange={(e) => update('ticker', { ...settings.ticker, hitokotoUrl: e.target.value })} placeholder="https://v1.hitokoto.cn/?encode=json" className="w-full h-11 px-3 py-2.5 rounded-lg border border-slate-300 dark:border-slate-600 dark:bg-slate-700 dark:text-white focus:ring-2 focus:ring-blue-500 outline-none" />
+      <p className="text-[10px] text-slate-400 mt-1">留空使用默认接口：https://v1.hitokoto.cn/?encode=json</p>
+    </div>
+  </div>
+)}
+
                       {/* 自定义配置 */}
                       {settings.ticker.source === 'custom' && (
                         <div className="space-y-2">
diff --git a/components/WeatherDisplay.tsx b/components/WeatherDisplay.tsx
index c776c556..1aa7c0ce 100644
--- a/components/WeatherDisplay.tsx
+++ b/components/WeatherDisplay.tsx
@@ -99,12 +99,12 @@ const WeatherDisplay: React.FC<WeatherDisplayProps> = ({ config }) => {
 
   return (
     <div
-      className="relative flex items-center gap-2 bg-slate-200 dark:bg-slate-700 rounded-full px-3 py-2 h-9 min-w-10 leading-none cursor-default group"
+      className="relative flex items-center gap-2 bg-slate-200 dark:bg-slate-700 rounded-full px-3 py-2 h-9 min-w-10 leading-none cursor-default group max-w-[120px] sm:max-w-none"
       onMouseEnter={() => setIsHovering(true)}
       onMouseLeave={() => setIsHovering(false)}
     >
       {getWeatherIcon(weatherText)}
-      <span className="text-xs text-slate-700 dark:text-slate-300 whitespace-nowrap">
+      <span className="text-[10px] sm:text-xs text-slate-700 dark:text-slate-300 whitespace-nowrap truncate">
         {weatherText}
       </span>
       {isHovering && region && (
diff --git a/functions/api/storage.js b/functions/api/storage.js
index acced84f..fdb4f044 100644
--- a/functions/api/storage.js
+++ b/functions/api/storage.js
@@ -1,6 +1,5 @@
-// 统一存储接口
+// 统一存储接口 v2.3 - 性能优化版
 // 支持 EdgeOne Pages / Cloudflare Workers
-// 支持按分类拆分链接存储
 
 import { getKV, getCorsHeaders, verifyAuth, jsonResponse } from './_kvAdapter.js';
 
@@ -44,34 +43,32 @@ async function mergeAllConfigSections(kv) {
   return configStr ? JSON.parse(configStr) : {};
 }
 
-// 生成分类链接 key
 function categoryLinksKey(categoryId) {
   return `links:${categoryId}`;
 }
 
-// 读取所有分类链接
-async function readAllCategoryLinks(kv) {
-  // 1. 获取所有分类
-  const categoriesStr = await kv.get(STORAGE_KEYS.CATEGORIES_CONFIG_KEY);
-  const categories = categoriesStr ? JSON.parse(categoriesStr) : [];
-
+// 读取所有分类链接（带密码过滤 + 私人书签过滤）
+async function readAllCategoryLinks(kv, categories, unlockedCategories = new Set(), isAdmin = false) {
   if (categories.length === 0) return [];
 
-  // 2. 并行读取每个分类的链接
   const linkPromises = categories.map(async (cat) => {
+    const hasPassword = cat.password && cat.password.trim() !== '';
+    const isUnlocked = unlockedCategories.has(cat.id);
+
+    if (hasPassword && !isUnlocked && !isAdmin) {
+      return [];
+    }
+
     const data = await kv.get(categoryLinksKey(cat.id));
     return data ? JSON.parse(data) : [];
   });
 
   const linkArrays = await Promise.all(linkPromises);
-
-  // 3. 合并所有链接
   return linkArrays.flat();
 }
 
 // 保存链接到对应的分类 key
 async function saveCategoryLinks(kv, links) {
-  // 按 categoryId 分组
   const grouped = {};
   for (const link of links) {
     const catId = link.categoryId || 'common';
@@ -79,7 +76,6 @@ async function saveCategoryLinks(kv, links) {
     grouped[catId].push(link);
   }
 
-  // 并行写入每个分类
   const writes = Object.entries(grouped).map(([catId, catLinks]) =>
     kv.put(categoryLinksKey(catId), JSON.stringify(catLinks))
   );
@@ -99,15 +95,14 @@ export async function onRequest(context) {
   try {
     const kv = getKV(env);
 
-    // ==================== GET ====================
     if (request.method === 'GET') {
       const checkAuth = url.searchParams.get('checkAuth');
       const getConfig = url.searchParams.get('getConfig');
       const key = url.searchParams.get('key');
       const readOnly = url.searchParams.get('readOnly');
       const category = url.searchParams.get('category');
+      const categoryPassword = url.searchParams.get('catPassword');
 
-      // 检查认证需求
       if (checkAuth === 'true') {
         return jsonResponse({
           hasPassword: !!env.PASSWORD,
@@ -117,7 +112,50 @@ export async function onRequest(context) {
         }, 200, corsHeaders);
       }
 
-      // 获取子配置（优先读独立 key，fallback 到旧 config 的子字段）
+      // 优化：支持批量获取多个配置 ?getConfig=search,website,ai
+      if (getConfig && getConfig.includes(',')) {
+        const requestedSections = getConfig.split(',').filter(s => CONFIG_SECTIONS.includes(s) || s === 'true');
+        const configMap = {};
+
+        if (requestedSections.includes('true') || requestedSections.length === 0) {
+          // 获取全部配置 + 链接 + 分类
+          const categoriesData = await kv.get(STORAGE_KEYS.CATEGORIES_CONFIG_KEY);
+          const allCategories = categoriesData ? JSON.parse(categoriesData) : [];
+
+          let unlockedCategories = new Set();
+          const unlockedParam = url.searchParams.get('unlocked');
+          if (unlockedParam) {
+            try { unlockedCategories = new Set(JSON.parse(unlockedParam)); } catch (e) {}
+          }
+
+          const providedPassword = request.headers.get('x-auth-password');
+          const isAdmin = await verifyAuth({ providedPassword, serverPassword: env.PASSWORD, kv });
+
+          const links = await readAllCategoryLinks(kv, allCategories, unlockedCategories, isAdmin);
+          const sanitizedCategories = allCategories.map(({ password, ...rest }) => ({
+            ...rest,
+            hasPassword: !!(password && password.trim() !== '')
+          }));
+
+          // 同时获取所有配置
+          const allConfig = await mergeAllConfigSections(kv);
+
+          return jsonResponse({
+            links,
+            categories: sanitizedCategories,
+            configs: allConfig,
+          }, 200, corsHeaders);
+        }
+
+        await Promise.all(requestedSections.map(async (section) => {
+          const val = await readConfigSection(kv, section);
+          const configKey = section === 'mastodon' ? 'ticker' : section;
+          configMap[configKey] = val || {};
+        }));
+
+        return jsonResponse(configMap, 200, corsHeaders);
+      }
+
       if (CONFIG_SECTIONS.includes(getConfig)) {
         const sectionVal = await readConfigSection(kv, getConfig);
         const defaults = {
@@ -126,7 +164,6 @@ export async function onRequest(context) {
         return jsonResponse(sectionVal || defaults[getConfig] || {}, 200, corsHeaders);
       }
 
-      // 获取 Favicon 缓存
       if (getConfig === 'favicon') {
         const domain = url.searchParams.get('domain');
         if (!domain) {
@@ -136,31 +173,67 @@ export async function onRequest(context) {
         return jsonResponse({ icon: cachedIcon || null, cached: !!cachedIcon }, 200, corsHeaders);
       }
 
-      // 获取分类（密码脱敏）
       if (getConfig === 'categories') {
         const data = await kv.get(STORAGE_KEYS.CATEGORIES_CONFIG_KEY);
         const categories = data ? JSON.parse(data) : [];
-        const sanitized = categories.map(({ password, ...rest }) => rest);
+        const sanitized = categories.map(({ password, ...rest }) => ({
+          ...rest,
+          hasPassword: !!(password && password.trim() !== '')
+        }));
         return jsonResponse(sanitized, 200, corsHeaders);
       }
 
-      // 获取链接
+      let unlockedCategories = new Set();
+      const unlockedParam = url.searchParams.get('unlocked');
+      if (unlockedParam) {
+        try {
+          unlockedCategories = new Set(JSON.parse(unlockedParam));
+        } catch (e) {}
+      }
+
+      const providedPassword = request.headers.get('x-auth-password');
+      const isAdmin = await verifyAuth({
+        providedPassword,
+        serverPassword: env.PASSWORD,
+        kv,
+      });
+
       if (getConfig === 'links') {
-        // 按分类读取
+        const categoriesData = await kv.get(STORAGE_KEYS.CATEGORIES_CONFIG_KEY);
+        const categories = categoriesData ? JSON.parse(categoriesData) : [];
+
         if (category) {
+          const cat = categories.find(c => c.id === category);
+          if (!cat) {
+            return jsonResponse({ error: '分类不存在' }, 404, corsHeaders);
+          }
+
+          const hasPassword = cat.password && cat.password.trim() !== '';
+          let isUnlocked = unlockedCategories.has(category);
+
+          if (categoryPassword && hasPassword && !isUnlocked && !isAdmin) {
+            const inputPwd = categoryPassword.trim();
+            const storedPwd = (cat.password || '').trim();
+            if (inputPwd === storedPwd) {
+              isUnlocked = true;
+            } else {
+              return jsonResponse({ error: '密码错误' }, 403, corsHeaders);
+            }
+          }
+
+          if (hasPassword && !isUnlocked && !isAdmin) {
+            return jsonResponse({ error: '该分类需要密码访问' }, 403, corsHeaders);
+          }
+
           const data = await kv.get(categoryLinksKey(category));
-          return new Response(data || '[]', {
-            headers: { 'Content-Type': 'application/json', ...corsHeaders },
-          });
+          const links = data ? JSON.parse(data) : [];
+          return jsonResponse(links, 200, corsHeaders);
         }
 
-        // 读取所有分类链接
-        const links = await readAllCategoryLinks(kv);
-
+        const links = await readAllCategoryLinks(kv, categories, unlockedCategories, isAdmin);
         return jsonResponse(links, 200, corsHeaders);
       }
 
-      // 按 Key 读取
       if (key) {
         if (key === STORAGE_KEYS.CONFIG_KEY) {
           const merged = await mergeAllConfigSections(kv);
@@ -170,18 +243,16 @@ export async function onRequest(context) {
         return jsonResponse({ key, value }, 200, corsHeaders);
       }
 
-      // 获取全部数据
       if (getConfig === 'true') {
         const categoriesData = await kv.get(STORAGE_KEYS.CATEGORIES_CONFIG_KEY);
-        const categories = categoriesData ? JSON.parse(categoriesData) : [];
+        const allCategories = categoriesData ? JSON.parse(categoriesData) : [];
 
-        // 只读模式下分类密码脱敏
-        const sanitizedCategories = readOnly
-          ? categories.map(({ password, ...rest }) => rest)
-          : categories;
+        const sanitizedCategories = allCategories.map(({ password, ...rest }) => ({
+          ...rest,
+          hasPassword: !!(password && password.trim() !== '')
+        }));
 
-        // 读取所有分类链接
-        const links = await readAllCategoryLinks(kv);
+        const links = await readAllCategoryLinks(kv, allCategories, unlockedCategories, isAdmin);
 
         return jsonResponse({
           links,
@@ -192,12 +263,10 @@ export async function onRequest(context) {
       return jsonResponse({ links: [], categories: [] }, 200, corsHeaders);
     }
 
-    // ==================== POST ====================
     if (request.method === 'POST') {
       const body = await request.json();
       const readOnlyOperations = ['favicon'];
 
-      // 无需认证的操作
       if (readOnlyOperations.includes(body.operation) || body.saveConfig === 'favicon') {
         if (body.saveConfig === 'favicon') {
           const { domain, icon } = body;
@@ -209,7 +278,6 @@ export async function onRequest(context) {
         }
       }
 
-      // 认证检查
       const providedPassword = request.headers.get('x-auth-password');
       const isAuthenticated = await verifyAuth({
         providedPassword,
@@ -221,58 +289,76 @@ export async function onRequest(context) {
         return jsonResponse({ error: '管理操作需要密码验证' }, 401, corsHeaders);
       }
 
-      // 仅验证密码
       if (body.authOnly) {
         await kv.put('last_auth_time', Date.now().toString());
         return jsonResponse({ success: true }, 200, corsHeaders);
       }
 
-      // 保存子配置（写入独立 KV key，避免读取全量 config）
       if (CONFIG_SECTIONS.includes(body.saveConfig)) {
         await kv.put(`config:${body.saveConfig}`, JSON.stringify(body.config));
         return jsonResponse({ success: true }, 200, corsHeaders);
       }
 
-      // 保存分类
       if (body.saveConfig === 'categories') {
-        await kv.put(STORAGE_KEYS.CATEGORIES_CONFIG_KEY, JSON.stringify(body.categories));
+        const existingData = await kv.get(STORAGE_KEYS.CATEGORIES_CONFIG_KEY);
+        const existingCategories = existingData ? JSON.parse(existingData) : [];
+        const existingPasswords = new Map(existingCategories.map(c => [c.id, c.password]));
+
+        const mergedCategories = body.categories.map(cat => ({
+          ...cat,
+          password: cat.password || existingPasswords.get(cat.id) || undefined,
+        }));
+
+        await kv.put(STORAGE_KEYS.CATEGORIES_CONFIG_KEY, JSON.stringify(mergedCategories));
         return jsonResponse({ success: true }, 200, corsHeaders);
       }
 
-      // 保存链接（按分类拆分存储）
       if (body.saveConfig === 'links') {
-        // 如果指定了分类，只保存该分类的链接
         if (body.categoryId) {
           await kv.put(categoryLinksKey(body.categoryId), JSON.stringify(body.links));
         } else {
-          // 保存所有链接（按 categoryId 拆分）
           await saveCategoryLinks(kv, body.links);
         }
         return jsonResponse({ success: true }, 200, corsHeaders);
       }
 
-      // 同步统一配置
       if (body.key === STORAGE_KEYS.CONFIG_KEY && body.value) {
         await kv.put('config', body.value);
         return jsonResponse({ success: true }, 200, corsHeaders);
       }
 
-      // 写入任意 key（用于设置等独立 KV 项）
       if (body.key && body.value && body.key !== STORAGE_KEYS.CONFIG_KEY) {
         await kv.put(body.key, body.value);
         return jsonResponse({ success: true }, 200, corsHeaders);
       }
 
-      // 同时保存链接和分类
       if (body.links && body.categories) {
         await saveCategoryLinks(kv, body.links);
-        await kv.put(STORAGE_KEYS.CATEGORIES_CONFIG_KEY, JSON.stringify(body.categories));
+        const existingData = await kv.get(STORAGE_KEYS.CATEGORIES_CONFIG_KEY);
+        const existingCategories = existingData ? JSON.parse(existingData) : [];
+        const existingPasswords = new Map(existingCategories.map(c => [c.id, c.password]));
+
+        const mergedCategories = body.categories.map(cat => ({
+          ...cat,
+          password: cat.password || existingPasswords.get(cat.id) || undefined,
+        }));
+
+        await kv.put(STORAGE_KEYS.CATEGORIES_CONFIG_KEY, JSON.stringify(mergedCategories));
         return jsonResponse({ success: true }, 200, corsHeaders);
       } else if (body.links) {
         await saveCategoryLinks(kv, body.links);
         return jsonResponse({ success: true }, 200, corsHeaders);
       } else if (body.categories) {
-        await kv.put(STORAGE_KEYS.CATEGORIES_CONFIG_KEY, JSON.stringify(body.categories));
+        const existingData = await kv.get(STORAGE_KEYS.CATEGORIES_CONFIG_KEY);
+        const existingCategories = existingData ? JSON.parse(existingData) : [];
+        const existingPasswords = new Map(existingCategories.map(c => [c.id, c.password]));
+
+        const mergedCategories = body.categories.map(cat => ({
+          ...cat,
+          password: cat.password || existingPasswords.get(cat.id) || undefined,
+        }));
+
+        await kv.put(STORAGE_KEYS.CATEGORIES_CONFIG_KEY, JSON.stringify(mergedCategories));
         return jsonResponse({ success: true }, 200, corsHeaders);
       }
 
diff --git a/index.html b/index.html
index 5e020c1d..6a446b10 100644
--- a/index.html
+++ b/index.html
@@ -3,11 +3,11 @@
   <head>
     <meta charset="UTF-8" />
     <link rel="icon" type="image/x-icon" href="/favicon.ico" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0, viewport-fit=cover, user-scalable=no" />
     <meta name="description" content="蜗牛个人导航 - 一个现代化的云端导航页面，帮助您管理和快速访问常用网站链接" />
     <meta name="keywords" content="导航,书签,云导航,网站导航,书签管理,CloudNav" />
     <meta name="author" content="eallion" />
-    <meta name="theme-color" content="#3b82f6" />
+    <meta name="theme-color" content="#ffffff" />
 
     <!-- Open Graph -->
     <meta property="og:title" content="蜗牛个人导航" />
diff --git a/public/_routes.json b/public/_routes.json
index 4626e1dd..19c4b93e 100644
--- a/public/_routes.json
+++ b/public/_routes.json
@@ -1,5 +1,5 @@
 {
   "version": 1,
-  "include": ["/api/*"],
-  "exclude": []
+  "include": ["/*"],
+  "exclude": ["/assets/*"]
 }
diff --git a/services/iconService.ts b/services/iconService.ts
index 203cda4f..d50cbb6d 100644
--- a/services/iconService.ts
+++ b/services/iconService.ts
@@ -15,6 +15,8 @@ export class IconService {
           return await this.getFaviconExtractorIcon(url);
         case 'google':
           return await this.getGoogleIcon(url);
+        case 'xinac':
+          return this.getXinacIcon(url);
         case 'customapi':
           return await this.getCustomApiIcon(url);
         case 'customurl':
@@ -41,6 +43,11 @@ export class IconService {
     return `https://www.google.com/s2/favicons?domain=${domain}&sz=64`;
   }
 
+  // 2.5 Xinac 图标 API
+  private getXinacIcon(url: string): string {
+    return `https://api.xinac.net/icon/?url=${encodeURIComponent(url)}`;
+  }
+
   // 3. 自定义API
   private async getCustomApiIcon(url: string): Promise<string> {
     if (!this.config.customapi?.url) {
@@ -104,4 +111,4 @@ export const DEFAULT_ICON_CONFIG: IconConfig = {
     enabled: false,
     url: ''
   }
-};
\ No newline at end of file
+};
diff --git a/src/components/category/CategorySection.tsx b/src/components/category/CategorySection.tsx
index d0991bf9..a4d8d035 100644
--- a/src/components/category/CategorySection.tsx
+++ b/src/components/category/CategorySection.tsx
@@ -1,5 +1,4 @@
 import React from 'react';
-import { DndContext, closestCenter, DragEndEvent, SensorDescriptor } from '@dnd-kit/core';
 import { SortableContext, rectSortingStrategy } from '@dnd-kit/sortable';
 import { LinkItem, Category } from '../../../types';
 import { CategoryWithChildren } from '../../contexts/CategoriesContext';
@@ -16,8 +15,6 @@ interface CategorySectionProps {
   onEditLink: (link: LinkItem) => void;
   onDeleteLink: (id: string) => void;
   onContextMenu: (e: React.MouseEvent, link: LinkItem) => void;
-  onDragEnd: (event: DragEndEvent, categoryId: string) => void;
-  sensors: SensorDescriptor<any>[];
   authToken?: string | null;
   isDraggable?: boolean;
   isEditMode?: boolean;
@@ -27,17 +24,13 @@ interface CategorySectionProps {
 export function CategorySection({
   category, links, subcategoryLinks, viewMode,
   isBatchEditMode, selectedLinks, onToggleSelection,
-  onEditLink, onDeleteLink, onContextMenu, onDragEnd, sensors,
+  onEditLink, onDeleteLink, onContextMenu,
   authToken, isDraggable = false, isEditMode = false, onWeightChange,
 }: CategorySectionProps) {
   const allLinks = [...links, ...subcategoryLinks];
 
   if (allLinks.length === 0) return null;
 
-  const handleDragEnd = (event: DragEndEvent) => {
-    onDragEnd(event, category.id);
-  };
-
   const gridClass = viewMode === 'detailed'
     ? 'grid-cols-2 sm:grid-cols-3 md:grid-cols-3 lg:grid-cols-4 xl:grid-cols-5 2xl:grid-cols-6'
     : 'grid-cols-2 sm:grid-cols-3 md:grid-cols-4 lg:grid-cols-5 xl:grid-cols-6 2xl:grid-cols-8 3xl:grid-cols-10';
@@ -51,34 +44,32 @@ export function CategorySection({
         </span>
       </h2>
 
-      {/* Category's own links */}
+      {/* Category's own links - no DndContext here, handled by parent */}
       {links.length > 0 && (
-        <DndContext sensors={sensors} collisionDetection={closestCenter} onDragEnd={handleDragEnd}>
-          <SortableContext items={links.map(l => l.id)} strategy={rectSortingStrategy}>
-            <div className={`grid gap-3 ${gridClass}`}>
-              {links.map(link => (
-                <LinkCard
-                  key={link.id}
-                  link={link}
-                  viewMode={viewMode}
-                  isBatchEditMode={isBatchEditMode}
-                  isSelected={selectedLinks.has(link.id)}
-                  onToggleSelection={onToggleSelection}
-                  onEdit={onEditLink}
-                  onDelete={onDeleteLink}
-                  onContextMenu={onContextMenu}
-                  authToken={authToken}
-                  isDraggable={isDraggable}
-                  isEditMode={isEditMode}
-                  onWeightChange={onWeightChange}
-                />
-              ))}
-            </div>
-          </SortableContext>
-        </DndContext>
+        <SortableContext items={links.map(l => l.id)} strategy={rectSortingStrategy}>
+          <div className={`grid gap-3 ${gridClass}`}>
+            {links.map(link => (
+              <LinkCard
+                key={link.id}
+                link={link}
+                viewMode={viewMode}
+                isBatchEditMode={isBatchEditMode}
+                isSelected={selectedLinks.has(link.id)}
+                onToggleSelection={onToggleSelection}
+                onEdit={onEditLink}
+                onDelete={onDeleteLink}
+                onContextMenu={onContextMenu}
+                authToken={authToken}
+                isDraggable={isDraggable}
+                isEditMode={isEditMode}
+                onWeightChange={onWeightChange}
+              />
+            ))}
+          </div>
+        </SortableContext>
       )}
 
-      {/* Subcategory links */}
+      {/* Subcategory links - no DndContext here either */}
       {category.children?.map(child => {
         const childLinks = subcategoryLinks.filter(l => l.categoryId === child.id);
         if (childLinks.length === 0) return null;
@@ -91,29 +82,27 @@ export function CategorySection({
                 {childLinks.length}
               </span>
             </h3>
-            <DndContext sensors={sensors} collisionDetection={closestCenter} onDragEnd={(e) => onDragEnd(e, child.id)}>
-              <SortableContext items={childLinks.map(l => l.id)} strategy={rectSortingStrategy}>
-                <div className={`grid gap-3 ${gridClass}`}>
-                  {childLinks.map(link => (
-                    <LinkCard
-                      key={link.id}
-                      link={link}
-                      viewMode={viewMode}
-                      isBatchEditMode={isBatchEditMode}
-                      isSelected={selectedLinks.has(link.id)}
-                      onToggleSelection={onToggleSelection}
-                      onEdit={onEditLink}
-                      onDelete={onDeleteLink}
-                      onContextMenu={onContextMenu}
-                      authToken={authToken}
-                      isDraggable={isDraggable}
-                      isEditMode={isEditMode}
-                      onWeightChange={onWeightChange}
-                    />
-                  ))}
-                </div>
-              </SortableContext>
-            </DndContext>
+            <SortableContext items={childLinks.map(l => l.id)} strategy={rectSortingStrategy}>
+              <div className={`grid gap-3 ${gridClass}`}>
+                {childLinks.map(link => (
+                  <LinkCard
+                    key={link.id}
+                    link={link}
+                    viewMode={viewMode}
+                    isBatchEditMode={isBatchEditMode}
+                    isSelected={selectedLinks.has(link.id)}
+                    onToggleSelection={onToggleSelection}
+                    onEdit={onEditLink}
+                    onDelete={onDeleteLink}
+                    onContextMenu={onContextMenu}
+                    authToken={authToken}
+                    isDraggable={isDraggable}
+                    isEditMode={isEditMode}
+                    onWeightChange={onWeightChange}
+                  />
+                ))}
+              </div>
+            </SortableContext>
           </div>
         );
       })}
diff --git a/src/components/layout/AppLayout.tsx b/src/components/layout/AppLayout.tsx
index f5924072..81b383c6 100644
--- a/src/components/layout/AppLayout.tsx
+++ b/src/components/layout/AppLayout.tsx
@@ -1,10 +1,11 @@
-import React, { useState, useEffect, Suspense, lazy, useCallback } from 'react';
+import React, { useState, useEffect, Suspense, lazy, useCallback, useRef } from 'react';
 import { useAuthContext } from '../../contexts/AuthContext';
 import { useLinksContext } from '../../contexts/LinksContext';
 import { useCategoriesContext } from '../../contexts/CategoriesContext';
 import { useConfigContext } from '../../contexts/ConfigContext';
 import { useSearch } from '../../hooks/useSearch';
 import { useDataSync } from '../../hooks/useDataSync';
+import { toast } from '../../../components/Toast';
 import { Header } from './Header';
 import { Sidebar } from './Sidebar';
 import { MainContent } from './MainContent';
@@ -23,30 +24,25 @@ const ContextMenu = lazy(() => import('../../../components/ContextMenu'));
 const QRCodeModal = lazy(() => import('../../../components/QRCodeModal'));
 
 export function AppLayout() {
-  // Contexts
   const { authToken, requiresAuth, isCheckingAuth, capabilities, login, logout } = useAuthContext();
   const { links = [], addLink, updateLink, deleteLink, deleteLinks, setLinksAndSync } = useLinksContext();
-  const { categories = [], categoryTree = [], setCategoriesAndSync, unlockedCategoryIds = new Set(), unlockCategory } = useCategoriesContext();
+  const { categories = [], categoryTree = [], setCategoriesAndSync, unlockedCategoryIds, unlockCategory } = useCategoriesContext();
   const { ai: aiConfig, icon: iconConfig, viewMode, showPinnedWebsites, ticker, weather, website, webdav, search, setAI, setIcon, setWebsite, setShowPinned, setMastodon, setWeather, setWebDav, setSearch, setViewMode } = useConfigContext();
 
-  // Hooks
-  const { 
-    searchQuery, setSearchQuery, searchResults, isMobileSearchOpen, setIsMobileSearchOpen, 
+  const {
+    searchQuery, setSearchQuery, searchResults, isMobileSearchOpen, setIsMobileSearchOpen,
     isSearchExpanded, setIsSearchExpanded,
-    isInternal, setIsInternal, handleSearch, visitorEngineId, setVisitorEngineId 
+    isInternal, setIsInternal, handleSearch, visitorEngineId, setVisitorEngineId
   } = useSearch();
   const { initData } = useDataSync();
 
-  // UI State
   const [sidebarOpen, setSidebarOpen] = useState(false);
   const [isInitialLoading, setIsInitialLoading] = useState(true);
   const [activeCategoryId, setActiveCategoryId] = useState<string | null>(null);
 
-  // Toggle States
   const [isDragSortMode, setIsDragSortMode] = useState(false);
   const [isEditMode, setIsEditMode] = useState(false);
 
-  // Modal States
   const [isModalOpen, setIsModalOpen] = useState(false);
   const [isAuthOpen, setIsAuthOpen] = useState(false);
   const [isCatManagerOpen, setIsCatManagerOpen] = useState(false);
@@ -56,361 +52,250 @@ export function AppLayout() {
   const [isSearchConfigModalOpen, setIsSearchConfigModalOpen] = useState(false);
   const [catAuthModalData, setCatAuthModalData] = useState<Category | null>(null);
 
-  // Edit State
   const [editingLink, setEditingLink] = useState<LinkItem | undefined>(undefined);
   const [prefillLink, setPrefillLink] = useState<Partial<LinkItem> | undefined>(undefined);
 
-  // Batch Edit State
   const [isBatchEditMode, setIsBatchEditMode] = useState(false);
   const [selectedLinks, setSelectedLinks] = useState<Set<string>>(new Set());
 
-  // Context Menu State
   const [contextMenu, setContextMenu] = useState<{
     isOpen: boolean;
     position: { x: number; y: number };
     link: LinkItem | null;
   }>({ isOpen: false, position: { x: 0, y: 0 }, link: null });
 
-  // QR Code Modal State
   const [qrCodeModal, setQrCodeModal] = useState<{
     isOpen: boolean; url: string; title: string;
   }>({ isOpen: false, url: '', title: '' });
 
-  // Drag sort confirmation state
   const [pendingDragLinks, setPendingDragLinks] = useState<{ links: LinkItem[]; categories: Category[] } | null>(null);
 
-  // Initialize data
+  const [dragOffset, setDragOffset] = useState(0);
+  const [isDragging, setIsDragging] = useState(false);
+  const dragState = useRef({
+    startX: 0, startY: 0, currentX: 0, startTime: 0, sidebarWasOpen: false, isActive: false,
+  });
+  const SIDEBAR_WIDTH = 256;
+  const EDGE_THRESHOLD = 30;
+  const OPEN_THRESHOLD = 80;
+  const CLOSE_THRESHOLD = 80;
+
+  const handleTouchStart = useCallback((e: TouchEvent) => {
+    if (e.touches.length !== 1) return;
+    const touch = e.touches[0];
+    const isEdge = touch.clientX < EDGE_THRESHOLD;
+    const isInSidebar = sidebarOpen && touch.clientX < SIDEBAR_WIDTH;
+    if (!isEdge && !isInSidebar) return;
+    dragState.current = {
+      startX: touch.clientX, startY: touch.clientY, currentX: touch.clientX,
+      startTime: Date.now(), sidebarWasOpen: sidebarOpen, isActive: true,
+    };
+    setIsDragging(true);
+    setDragOffset(0);
+  }, [sidebarOpen]);
+
+  const handleTouchMove = useCallback((e: TouchEvent) => {
+    const state = dragState.current;
+    if (!state.isActive || e.touches.length !== 1) return;
+    const touch = e.touches[0];
+    const deltaX = touch.clientX - state.startX;
+    const deltaY = touch.clientY - state.startY;
+    if (Math.abs(deltaY) > Math.abs(deltaX) && Math.abs(deltaY) > 10) {
+      state.isActive = false; setIsDragging(false); setDragOffset(0); return;
+    }
+    if (Math.abs(deltaX) < 5) return;
+    state.currentX = touch.clientX;
+    if (state.sidebarWasOpen) {
+      setDragOffset(Math.max(-SIDEBAR_WIDTH, Math.min(0, deltaX)));
+    } else {
+      setDragOffset(Math.max(0, Math.min(SIDEBAR_WIDTH, deltaX)));
+    }
+  }, []);
+
+  const handleTouchEnd = useCallback(() => {
+    const state = dragState.current;
+    if (!state.isActive) return;
+    state.isActive = false;
+    const deltaX = state.currentX - state.startX;
+    const elapsed = Date.now() - state.startTime;
+    const velocity = Math.abs(deltaX) / (elapsed || 1);
+    setIsDragging(false);
+    if (state.sidebarWasOpen) {
+      if (deltaX < -CLOSE_THRESHOLD || (deltaX < -20 && velocity > 0.5)) setSidebarOpen(false);
+    } else {
+      if (deltaX > OPEN_THRESHOLD || (deltaX > 20 && velocity > 0.5)) setSidebarOpen(true);
+    }
+    setDragOffset(0);
+  }, []);
+
+  useEffect(() => {
+    const isMobile = window.innerWidth < 1024;
+    if (!isMobile) return;
+    document.addEventListener('touchstart', handleTouchStart, { passive: true, capture: true });
+    document.addEventListener('touchmove', handleTouchMove, { passive: true, capture: true });
+    document.addEventListener('touchend', handleTouchEnd, { passive: true, capture: true });
+    document.addEventListener('touchcancel', handleTouchEnd, { passive: true, capture: true });
+    return () => {
+      document.removeEventListener('touchstart', handleTouchStart, true);
+      document.removeEventListener('touchmove', handleTouchMove, true);
+      document.removeEventListener('touchend', handleTouchEnd, true);
+      document.removeEventListener('touchcancel', handleTouchEnd, true);
+    };
+  }, [handleTouchStart, handleTouchMove, handleTouchEnd]);
+
   useEffect(() => {
     const init = async () => {
-      await initData();
+      await initData(unlockedCategoryIds);
       setIsInitialLoading(false);
     };
-
-    // Global keyboard listener for search focus
     const handleGlobalKeyDown = (e: KeyboardEvent) => {
-      // Ignore if user is already typing in an input/textarea
       const activeElement = document.activeElement;
-      const isInput = activeElement?.tagName === 'INPUT' || 
-                     activeElement?.tagName === 'TEXTAREA' || 
-                     (activeElement as HTMLElement)?.isContentEditable;
-      
+      const isInput = activeElement?.tagName === 'INPUT' || activeElement?.tagName === 'TEXTAREA' || (activeElement as HTMLElement)?.isContentEditable;
       if (isInput) return;
-
-      // Global Escape handler to close and clear search
       if (e.key === 'Escape') {
-        if (isSearchExpanded) {
-          setIsSearchExpanded(false);
-          setSearchQuery('');
-          document.getElementById('search-input')?.blur();
-        }
+        if (isSearchExpanded) { setIsSearchExpanded(false); setSearchQuery(''); document.getElementById('search-input')?.blur(); }
         return;
       }
-
-      // Ignore modifier keys and special keys
       if (e.ctrlKey || e.metaKey || e.altKey) return;
-      if (e.key.length !== 1 && e.key !== 'Process') return; // 'Process' is for IME
-
-      // Don't trigger if any modal is open or in edit modes
-      if (isModalOpen || isAuthOpen || isCatManagerOpen || isBackupModalOpen || 
-          isImportModalOpen || isSettingsModalOpen || isSearchConfigModalOpen ||
-          isEditMode || isBatchEditMode || isDragSortMode) {
-        return;
-      }
-
-      // Open search if collapsed
-      if (!isSearchExpanded && !isMobileSearchOpen) {
-        setIsSearchExpanded(true);
-      }
-
-      // If it's a normal English character, the browser's keypress event is usually swallowed
-      // because the focus is moving from the body to the input. We must manually capture it.
-      if (e.key !== 'Process') {
-        setSearchQuery(prev => prev + e.key);
-        e.preventDefault(); // Prevent double insertion just in case
-      }
-
-      // Delay micro-seconds to focus, allowing the character to naturally fall into the input box to wake up the IME
-      setTimeout(() => {
-        const searchInput = document.getElementById('search-input');
-        if (searchInput) {
-          searchInput.focus();
-        }
-      }, 0);
+      if (e.key.length !== 1 && e.key !== 'Process') return;
+      if (isModalOpen || isAuthOpen || isCatManagerOpen || isBackupModalOpen || isImportModalOpen || isSettingsModalOpen || isSearchConfigModalOpen || isEditMode || isBatchEditMode || isDragSortMode) return;
+      if (!isSearchExpanded && !isMobileSearchOpen) setIsSearchExpanded(true);
+      if (e.key !== 'Process') { setSearchQuery(prev => prev + e.key); e.preventDefault(); }
+      setTimeout(() => document.getElementById('search-input')?.focus(), 0);
     };
-
     window.addEventListener('keydown', handleGlobalKeyDown);
     init();
     return () => window.removeEventListener('keydown', handleGlobalKeyDown);
-  }, [initData]);
+  }, [initData, unlockedCategoryIds]);
 
-  // Apply dynamic website title and favicon
   useEffect(() => {
     if (aiConfig) {
       document.title = aiConfig.websiteTitle || '蜗牛个人导航';
-      
       let link = document.querySelector("link[rel~='icon']") as HTMLLinkElement;
-      if (!link) {
-        link = document.createElement('link');
-        link.rel = 'icon';
-        document.head.appendChild(link);
-      }
+      if (!link) { link = document.createElement('link'); link.rel = 'icon'; document.head.appendChild(link); }
       link.href = aiConfig.faviconUrl || '/favicon.ico';
     }
   }, [aiConfig?.websiteTitle, aiConfig?.faviconUrl]);
 
-  // Close auth modal on login
-  useEffect(() => {
-    if (authToken) {
-      setIsAuthOpen(false);
-    }
-  }, [authToken]);
+  useEffect(() => { if (authToken) setIsAuthOpen(false); }, [authToken]);
 
-  // Handle URL params for bookmarklet
   useEffect(() => {
     const urlParams = new URLSearchParams(window.location.search);
     const addUrl = urlParams.get('add_url');
     if (addUrl) {
-      const addTitle = urlParams.get('add_title') || '';
       window.history.replaceState({}, '', window.location.pathname);
-      setPrefillLink({ title: addTitle, url: addUrl, categoryId: 'common' });
+      setPrefillLink({ title: urlParams.get('add_title') || '', url: addUrl, categoryId: 'common' });
       setEditingLink(undefined);
       setIsModalOpen(true);
     }
   }, []);
 
-  // --- Handlers ---
   const handleAddLink = useCallback(() => {
-    setEditingLink(undefined);
-    setPrefillLink(undefined);
-    setIsModalOpen(true);
+    setEditingLink(undefined); setPrefillLink(undefined); setIsModalOpen(true);
   }, []);
 
   const handleEditLink = useCallback((link: LinkItem) => {
-    setEditingLink(link);
-    setPrefillLink(undefined);
-    setIsModalOpen(true);
+    setEditingLink(link); setPrefillLink(undefined); setIsModalOpen(true);
   }, []);
 
   const handleDeleteLink = useCallback((id: string) => {
-    if (confirm('确定删除此链接吗？')) {
-      const linkToDelete = links.find(l => l.id === id);
-      if (linkToDelete) {
-        // 1. 清理 EdgeOne Blob 历史图标
-        if (linkToDelete.edgeoneBlobUrl && linkToDelete.edgeoneBlobUrl.startsWith('/api/favicon?key=')) {
-          try {
-            const url = new URL(linkToDelete.edgeoneBlobUrl, window.location.origin);
-            const key = url.searchParams.get('key');
-            if (key) {
-              fetch(`/api/upload?key=${encodeURIComponent(key)}&platform=edgeone`, {
-                method: 'DELETE',
-                headers: { 'x-auth-password': authToken || '' }
-              }).catch(err => console.error('Failed to delete edgeone historical icon:', err));
-            }
-          } catch (e) {
-            console.error(e);
-          }
-        }
-        // 2. 清理 Cloudflare R2 历史图标
-        if (linkToDelete.cloudflareR2Url && linkToDelete.cloudflareR2Url.startsWith('/api/favicon?key=')) {
-          try {
-            const url = new URL(linkToDelete.cloudflareR2Url, window.location.origin);
-            const key = url.searchParams.get('key');
-            if (key) {
-              fetch(`/api/upload?key=${encodeURIComponent(key)}&platform=cloudflare`, {
-                method: 'DELETE',
-                headers: { 'x-auth-password': authToken || '' }
-              }).catch(err => console.error('Failed to delete cloudflare historical icon:', err));
-            }
-          } catch (e) {
-            console.error(e);
-          }
-        }
-        // 3. 兼容旧版本数据或当前选中的图标（如果没有被前面的历史记录覆盖）
-        if (linkToDelete.icon && linkToDelete.icon.startsWith('/api/favicon?key=') &&
-            linkToDelete.icon !== linkToDelete.edgeoneBlobUrl &&
-            linkToDelete.icon !== linkToDelete.cloudflareR2Url) {
-          try {
-            const url = new URL(linkToDelete.icon, window.location.origin);
-            const key = url.searchParams.get('key');
-            if (key) {
-              const platform = linkToDelete.iconType === 'upload-cloudflare' ? 'cloudflare' : 'edgeone';
-              fetch(`/api/upload?key=${encodeURIComponent(key)}&platform=${platform}`, {
-                method: 'DELETE',
-                headers: { 'x-auth-password': authToken || '' }
-              }).catch(err => console.error('Failed to delete current icon:', err));
-            }
-          } catch (e) {
-            console.error(e);
-          }
-        }
+    if (!confirm('确定删除此链接吗？')) return;
+    const linkToDelete = links.find(l => l.id === id);
+    if (linkToDelete) {
+      // Cleanup icon storage...
+      if (linkToDelete.edgeoneBlobUrl?.startsWith('/api/favicon?key=')) {
+        try { const u = new URL(linkToDelete.edgeoneBlobUrl, window.location.origin); const key = u.searchParams.get('key');
+          if (key) fetch(`/api/upload?key=${encodeURIComponent(key)}&platform=edgeone`, { method: 'DELETE', headers: { 'x-auth-password': authToken || '' } }).catch(()=>{});
+        } catch(e){}
+      }
+      if (linkToDelete.cloudflareR2Url?.startsWith('/api/favicon?key=')) {
+        try { const u = new URL(linkToDelete.cloudflareR2Url, window.location.origin); const key = u.searchParams.get('key');
+          if (key) fetch(`/api/upload?key=${encodeURIComponent(key)}&platform=cloudflare`, { method: 'DELETE', headers: { 'x-auth-password': authToken || '' } }).catch(()=>{});
+        } catch(e){}
       }
-      deleteLink(id);
-      setLinksAndSync(links.filter(l => l.id !== id), categories);
     }
-  }, [deleteLink, links, categories, setLinksAndSync, authToken]);
+    const deletedTitle = linkToDelete?.title || '书签';
+    const newLinks = links.filter(l => l.id !== id);
+    setLinksAndSync(newLinks, categories);
+    toast.success(`「${deletedTitle}」已删除`);
+  }, [links, categories, setLinksAndSync, authToken]);
+
+  const toggleLinkSelection = useCallback((id: string) => {
+    setSelectedLinks(prev => { const next = new Set(prev); if (next.has(id)) next.delete(id); else next.add(id); return next; });
+  }, []);
+
+  const toggleBatchEditMode = useCallback(() => {
+    setIsBatchEditMode(prev => !prev); setSelectedLinks(new Set());
+  }, []);
+
+  // ===== 修复：确保保存时 id 有效，且使用最新的 links 状态 =====
+  const handleSaveLink = useCallback((link: LinkItem) => {
+    // 确保 id 有效，如果无效则生成新 id
+    const validLink = {
+      ...link,
+      id: link.id && link.id.trim() !== '' ? link.id : `${Date.now()}-${Math.random().toString(36).substring(2, 11)}`,
+    };
 
-  const handleSaveLink = useCallback((data: Omit<LinkItem, 'id' | 'createdAt'>) => {
     if (editingLink) {
-      const updated = links.map(l => l.id === editingLink.id ? { ...l, ...data } : l);
-      setLinksAndSync(updated, categories);
+      // 编辑现有链接：使用函数式更新避免 stale closure
+      setLinksAndSync(
+        links.map(l => l.id === validLink.id ? validLink : l),
+        categories
+      );
+      toast.success(`已更新「${validLink.title}」`);
     } else {
-      const newLink: LinkItem = {
-        ...data,
-        id: Date.now().toString(),
-        createdAt: Date.now(),
-      };
-      setLinksAndSync([newLink, ...links], categories);
+      // 新建链接
+      setLinksAndSync([...links, validLink], categories);
+      toast.success(`已添加「${validLink.title}」`);
     }
-    setIsModalOpen(false);
-    setEditingLink(undefined);
-    setPrefillLink(undefined);
-  }, [editingLink, links, categories, setLinksAndSync, authToken]);
+    setIsModalOpen(false); setEditingLink(undefined); setPrefillLink(undefined);
+  }, [editingLink, links, categories, setLinksAndSync]);
 
-  // Context menu handlers
   const handleContextMenu = useCallback((e: React.MouseEvent, link: LinkItem) => {
     if (isBatchEditMode || !authToken) return;
-    e.preventDefault();
-    e.stopPropagation();
+    e.preventDefault(); e.stopPropagation();
     setContextMenu({ isOpen: true, position: { x: e.clientX, y: e.clientY }, link });
   }, [isBatchEditMode, authToken]);
 
-  const closeContextMenu = useCallback(() => {
-    setContextMenu({ isOpen: false, position: { x: 0, y: 0 }, link: null });
-  }, []);
-
-  const deleteLinkFromContextMenu = useCallback(() => {
-    if (!contextMenu.link) return;
-    if (confirm(`确定要删除"${contextMenu.link.title}"吗？`)) {
-      handleDeleteLink(contextMenu.link.id);
-    }
-    closeContextMenu();
-  }, [contextMenu.link, handleDeleteLink, closeContextMenu]);
-
-  const editLinkFromContextMenu = useCallback(() => {
-    if (!contextMenu.link) return;
-    handleEditLink(contextMenu.link);
-    closeContextMenu();
-  }, [contextMenu.link, handleEditLink, closeContextMenu]);
-
-  const togglePinFromContextMenu = useCallback(() => {
-    if (!contextMenu.link) return;
-    const updated = links.map(l => {
-      if (l.id === contextMenu.link!.id) {
-        const isPinned = !l.pinned;
-        return { ...l, pinned: isPinned, pinnedOrder: isPinned ? links.filter(link => link.pinned).length : undefined };
-      }
-      return l;
-    });
-    setLinksAndSync(updated, categories);
-    closeContextMenu();
-  }, [contextMenu.link, links, categories, setLinksAndSync, closeContextMenu]);
-
-  // Batch edit handlers
-  const toggleBatchEditMode = useCallback(() => {
-    setIsBatchEditMode(prev => !prev);
-    setSelectedLinks(new Set());
-  }, []);
-
-  const toggleLinkSelection = useCallback((linkId: string) => {
-    setSelectedLinks(prev => {
-      const next = new Set(prev);
-      if (next.has(linkId)) next.delete(linkId);
-      else next.add(linkId);
-      return next;
-    });
-  }, []);
-
   const handleBatchDelete = useCallback(() => {
-    if (selectedLinks.size === 0) return;
-    if (confirm(`确定要删除选中的 ${selectedLinks.size} 个链接吗？`)) {
-      // 批量删除关联的自定义及历史图标
-      links.forEach(l => {
-        if (selectedLinks.has(l.id)) {
-          // 1. 清理 EdgeOne Blob 历史图标
-          if (l.edgeoneBlobUrl && l.edgeoneBlobUrl.startsWith('/api/favicon?key=')) {
-            try {
-              const url = new URL(l.edgeoneBlobUrl, window.location.origin);
-              const key = url.searchParams.get('key');
-              if (key) {
-                fetch(`/api/upload?key=${encodeURIComponent(key)}&platform=edgeone`, {
-                  method: 'DELETE',
-                  headers: { 'x-auth-password': authToken || '' }
-                }).catch(err => console.error('Failed to delete edgeone historical icon during batch delete:', err));
-              }
-            } catch (e) {
-              console.error(e);
-            }
-          }
-          // 2. 清理 Cloudflare R2 历史图标
-          if (l.cloudflareR2Url && l.cloudflareR2Url.startsWith('/api/favicon?key=')) {
-            try {
-              const url = new URL(l.cloudflareR2Url, window.location.origin);
-              const key = url.searchParams.get('key');
-              if (key) {
-                fetch(`/api/upload?key=${encodeURIComponent(key)}&platform=cloudflare`, {
-                  method: 'DELETE',
-                  headers: { 'x-auth-password': authToken || '' }
-                }).catch(err => console.error('Failed to delete cloudflare historical icon during batch delete:', err));
-              }
-            } catch (e) {
-              console.error(e);
-            }
-          }
-          // 3. 兼容旧版本数据或当前图标
-          if (l.icon && l.icon.startsWith('/api/favicon?key=') &&
-              l.icon !== l.edgeoneBlobUrl &&
-              l.icon !== l.cloudflareR2Url) {
-            try {
-              const url = new URL(l.icon, window.location.origin);
-              const key = url.searchParams.get('key');
-              if (key) {
-                const platform = l.iconType === 'upload-cloudflare' ? 'cloudflare' : 'edgeone';
-                fetch(`/api/upload?key=${encodeURIComponent(key)}&platform=${platform}`, {
-                  method: 'DELETE',
-                  headers: { 'x-auth-password': authToken || '' }
-                }).catch(err => console.error('Failed to delete current icon during batch delete:', err));
-              }
-            } catch (e) {
-              console.error(e);
-            }
-          }
-        }
-      });
-      const newLinks = links.filter(l => !selectedLinks.has(l.id));
-      setLinksAndSync(newLinks, categories);
-      setSelectedLinks(new Set());
-      setIsBatchEditMode(false);
-    }
-  }, [selectedLinks, links, categories, setLinksAndSync, authToken]);
+    if (!confirm(`确定删除选中的 ${selectedLinks.size} 个链接吗？`)) return;
+    const newLinks = links.filter(l => !selectedLinks.has(l.id));
+    setLinksAndSync(newLinks, categories);
+    setSelectedLinks(new Set()); setIsBatchEditMode(false);
+    toast.success(`已批量删除 ${selectedLinks.size} 个书签`);
+  }, [selectedLinks, links, categories, setLinksAndSync]);
 
-  // Weight change handler
   const handleWeightChange = useCallback((linkId: string, weight: number) => {
     const updated = links.map(l => l.id === linkId ? { ...l, weight } : l);
     setLinksAndSync(updated, categories);
   }, [links, categories, setLinksAndSync]);
 
-  // Toggle handlers
-  const toggleDragSortMode = useCallback(() => {
-    setIsDragSortMode(prev => !prev);
-  }, []);
+  const toggleDragSortMode = useCallback(() => setIsDragSortMode(prev => !prev), []);
+  const toggleEditMode = useCallback(() => setIsEditMode(prev => !prev), []);
 
-  const toggleEditMode = useCallback(() => {
-    setIsEditMode(prev => !prev);
-  }, []);
+  const handleUnlockCategory = useCallback((cat: Category) => {
+    if (cat.hasPassword && !unlockedCategoryIds.has(cat.id)) setCatAuthModalData(cat);
+    else document.getElementById(`cat-${cat.id}`)?.scrollIntoView();
+  }, [unlockedCategoryIds]);
+
+  const handleCategoryUnlock = useCallback((id: string) => {
+    unlockCategory(id); setCatAuthModalData(null);
+    const newUnlocked = new Set([...unlockedCategoryIds, id]);
+    initData(newUnlocked);
+  }, [unlockCategory, unlockedCategoryIds, initData]);
 
-  // Loading state
   if (isInitialLoading) {
     return (
-      <div className="flex h-screen bg-slate-50 dark:bg-slate-900 overflow-hidden text-slate-900 dark:text-slate-50">
+      <div className="flex h-[100dvh] bg-slate-50 dark:bg-slate-900 overflow-hidden text-slate-900 dark:text-slate-50">
         <aside className="hidden lg:flex w-48 xl:w-64 bg-white dark:bg-slate-800 border-r border-slate-200 dark:border-slate-700 flex-col">
           <div className="h-16 flex items-center px-6 border-b border-slate-100 dark:border-slate-700">
             <div className="h-6 bg-slate-200 dark:bg-slate-700 rounded w-24 animate-pulse" />
           </div>
           <div className="flex-1 p-4 space-y-2">
-            {[1, 2, 3, 4, 5].map(i => (
+            {[1,2,3,4,5].map(i => (
               <div key={i} className="flex items-center gap-3 px-4 py-2.5">
                 <div className="w-8 h-8 rounded-lg bg-slate-200 dark:bg-slate-700 animate-pulse" />
-                <div className="h-4 bg-slate-200 dark:bg-slate-700 rounded animate-pulse" style={{ width: `${50 + i * 10}%` }} />
+                <div className="h-4 bg-slate-200 dark:bg-slate-700 rounded animate-pulse" style={{ width: `${50+i*10}%` }} />
               </div>
             ))}
           </div>
@@ -418,13 +303,8 @@ export function AppLayout() {
         <div className="flex-1 flex flex-col min-w-0">
           <header className="sticky top-0 z-30 bg-white/80 dark:bg-slate-800/80 backdrop-blur-md border-b border-slate-200 dark:border-slate-700 h-16 flex items-center px-4 lg:px-8">
             <div className="h-6 bg-slate-200 dark:bg-slate-700 rounded w-24 animate-pulse" />
-            <div className="flex-1 max-w-lg mx-4">
-              <div className="h-9 bg-slate-200 dark:bg-slate-700 rounded-full animate-pulse" />
-            </div>
-            <div className="flex gap-2">
-              <div className="w-9 h-9 bg-slate-200 dark:bg-slate-700 rounded-full animate-pulse" />
-              <div className="w-9 h-9 bg-slate-200 dark:bg-slate-700 rounded-full animate-pulse" />
-            </div>
+            <div className="flex-1 max-w-lg mx-4"><div className="h-9 bg-slate-200 dark:bg-slate-700 rounded-full animate-pulse" /></div>
+            <div className="flex gap-2"><div className="w-9 h-9 bg-slate-200 dark:bg-slate-700 rounded-full animate-pulse" /><div className="w-9 h-9 bg-slate-200 dark:bg-slate-700 rounded-full animate-pulse" /></div>
           </header>
           <ContentSkeleton viewMode="detailed" />
         </div>
@@ -433,199 +313,44 @@ export function AppLayout() {
   }
 
   return (
-    <div className="flex h-screen bg-slate-50 dark:bg-slate-900 overflow-hidden text-slate-900 dark:text-slate-50">
-      {/* Sidebar */}
-      <Sidebar
-        isOpen={sidebarOpen}
-        onClose={() => setSidebarOpen(false)}
-        activeCategoryId={activeCategoryId}
-        onOpenCatManager={() => setIsCatManagerOpen(true)}
-        onOpenBackup={() => setIsBackupModalOpen(true)}
-        onUnlockCategory={(cat) => {
-          setCatAuthModalData(cat);
-          setSidebarOpen(false);
-        }}
-      />
-
-      {/* Main area */}
+    <div className="flex h-[100dvh] bg-slate-50 dark:bg-slate-900 overflow-hidden text-slate-900 dark:text-slate-50">
+      <Sidebar isOpen={sidebarOpen} onClose={() => setSidebarOpen(false)} activeCategoryId={activeCategoryId} onOpenCatManager={() => setIsCatManagerOpen(true)} onOpenBackup={() => setIsBackupModalOpen(true)} onUnlockCategory={handleUnlockCategory} dragOffset={dragOffset} isDragging={isDragging} />
       <div className="flex-1 flex flex-col min-w-0">
-        <Header
-          searchQuery={searchQuery}
-          onSearchChange={setSearchQuery}
-          isInternal={isInternal}
-          onInternalChange={setIsInternal}
-          onSearch={handleSearch}
-          onAddLink={handleAddLink}
-          onOpenSettings={() => setIsSettingsModalOpen(true)}
-          onOpenCatManager={() => setIsCatManagerOpen(true)}
-          onOpenBackup={() => setIsBackupModalOpen(true)}
-          onOpenImport={() => setIsImportModalOpen(true)}
-          onOpenAuth={() => setIsAuthOpen(true)}
-          onToggleSidebar={() => setSidebarOpen(prev => !prev)}
-          isBatchEditMode={isBatchEditMode}
-          onToggleBatchEditMode={toggleBatchEditMode}
-          isMobileSearchOpen={isMobileSearchOpen}
-          onToggleMobileSearch={() => setIsMobileSearchOpen(prev => !prev)}
-          isSearchExpanded={isSearchExpanded}
-          setIsSearchExpanded={setIsSearchExpanded}
-          isDragSortMode={isDragSortMode}
-          onToggleDragSortMode={toggleDragSortMode}
-          isEditMode={isEditMode}
-          onToggleEditMode={toggleEditMode}
-          visitorEngineId={visitorEngineId}
-          onVisitorEngineChange={setVisitorEngineId}
-        />
-
-        <MainContent
-          searchQuery={searchQuery}
-          searchResults={searchResults}
-          isBatchEditMode={isBatchEditMode}
-          selectedLinks={selectedLinks}
-          onToggleSelection={toggleLinkSelection}
-          onEditLink={handleEditLink}
-          onDeleteLink={handleDeleteLink}
-          onContextMenu={handleContextMenu}
-          isDragSortMode={isDragSortMode}
-          isEditMode={isEditMode}
-          onWeightChange={handleWeightChange}
-          isInternal={isInternal}
-        />
+        <Header searchQuery={searchQuery} onSearchChange={setSearchQuery} isInternal={isInternal} onInternalChange={setIsInternal} onSearch={handleSearch} onAddLink={handleAddLink} onOpenSettings={() => setIsSettingsModalOpen(true)} onOpenCatManager={() => setIsCatManagerOpen(true)} onOpenBackup={() => setIsBackupModalOpen(true)} onOpenImport={() => setIsImportModalOpen(true)} onOpenAuth={() => setIsAuthOpen(true)} onToggleSidebar={() => setSidebarOpen(prev => !prev)} isBatchEditMode={isBatchEditMode} onToggleBatchEditMode={toggleBatchEditMode} isMobileSearchOpen={isMobileSearchOpen} onToggleMobileSearch={() => setIsMobileSearchOpen(prev => !prev)} isSearchExpanded={isSearchExpanded} setIsSearchExpanded={setIsSearchExpanded} isDragSortMode={isDragSortMode} onToggleDragSortMode={toggleDragSortMode} isEditMode={isEditMode} onToggleEditMode={toggleEditMode} visitorEngineId={visitorEngineId} onVisitorEngineChange={setVisitorEngineId} />
+        <MainContent searchQuery={searchQuery} searchResults={searchResults} isBatchEditMode={isBatchEditMode} selectedLinks={selectedLinks} onToggleSelection={toggleLinkSelection} onEditLink={handleEditLink} onDeleteLink={handleDeleteLink} onContextMenu={handleContextMenu} isDragSortMode={isDragSortMode} isEditMode={isEditMode} onWeightChange={handleWeightChange} isInternal={isInternal} />
       </div>
-
-      {/* Auth Modal */}
-      <AuthModal
-        isOpen={isAuthOpen}
-        onLogin={login}
-        onClose={() => setIsAuthOpen(false)}
-      />
-
-      {/* Other Modals */}
+      <AuthModal isOpen={isAuthOpen} onLogin={login} onClose={() => setIsAuthOpen(false)} />
       <Suspense fallback={null}>
-        {isModalOpen && (
-          <LinkModal
-            isOpen={isModalOpen}
-            onClose={() => { setIsModalOpen(false); setEditingLink(undefined); setPrefillLink(undefined); }}
-            onSave={handleSaveLink}
-            onDelete={editingLink ? () => handleDeleteLink(editingLink.id) : undefined}
-            categories={categories}
-            initialData={editingLink || prefillLink as LinkItem}
-            aiConfig={aiConfig}
-            defaultCategoryId={undefined}
-            iconConfig={iconConfig}
-            supportsUpload={capabilities?.upload ?? true}
-          />
-        )}
-
-        {isCatManagerOpen && (
-          <CategoryManagerModal
-            isOpen={isCatManagerOpen}
-            onClose={() => setIsCatManagerOpen(false)}
-            categories={categories}
-            onUpdateCategories={(newCats) => setCategoriesAndSync(newCats, links)}
-            onDeleteCategory={(id) => {
-              const newCats = categories.filter(c => c.id !== id);
-              setCategoriesAndSync(newCats, links);
-            }}
-          />
-        )}
-
-        {isBackupModalOpen && (
-          <BackupModal
-            isOpen={isBackupModalOpen}
-            onClose={() => setIsBackupModalOpen(false)}
-            links={links}
-            categories={categories}
-            onRestore={(newLinks, newCats) => setLinksAndSync(newLinks, newCats)}
-            webDavConfig={webdav || { url: '', username: '', password: '', enabled: false }}
-            onSaveWebDavConfig={setWebDav}
-            searchConfig={search || { mode: 'internal', externalSources: [] }}
-            onRestoreSearchConfig={setSearch}
-            aiConfig={aiConfig}
-            onRestoreAIConfig={setAI}
-          />
-        )}
-
-        {isImportModalOpen && (
-          <ImportModal
-            isOpen={isImportModalOpen}
-            onClose={() => setIsImportModalOpen(false)}
-            existingLinks={links}
-            categories={categories}
-            onImport={(newLinks, newCats) => setLinksAndSync(newLinks, newCats)}
-          />
-        )}
-
-        {isSettingsModalOpen && (
-          <SettingsModal
-            isOpen={isSettingsModalOpen}
-            onClose={() => setIsSettingsModalOpen(false)}
-            authToken={authToken}
-            onSettingsLoaded={(settings) => {
-              setAI(settings.ai);
-              setWebsite({ ...website, passwordExpiry: settings.passwordExpiry });
-              setMastodon(settings.ticker);
-              setWeather(settings.weather);
-              setShowPinned(settings.showPinnedWebsites);
-              if (settings.defaultViewMode) {
-                setViewMode(settings.defaultViewMode);
-              }
-              if (settings.icon) {
-                setIcon(settings.icon);
-              }
-            }}
-            onImportClick={() => { setIsImportModalOpen(true); setIsSettingsModalOpen(false); }}
-            onBackupClick={() => { setIsBackupModalOpen(true); setIsSettingsModalOpen(false); }}
-            supportsUpload={capabilities?.upload ?? true}
-          />
-        )}
-
-        {isSearchConfigModalOpen && (
-          <SearchConfigModal
-            isOpen={isSearchConfigModalOpen}
-            onClose={() => setIsSearchConfigModalOpen(false)}
-          />
-        )}
-
-        {catAuthModalData && (
-          <CategoryAuthModal
-            isOpen={true}
-            category={catAuthModalData}
-            onClose={() => setCatAuthModalData(null)}
-            onUnlock={(id) => { unlockCategory(id); setCatAuthModalData(null); }}
-          />
-        )}
-
-        {contextMenu.isOpen && (
-          <ContextMenu
-            isOpen={contextMenu.isOpen}
-            position={contextMenu.position}
-            link={contextMenu.link}
-            onClose={closeContextMenu}
-            onEdit={editLinkFromContextMenu}
-            onDelete={deleteLinkFromContextMenu}
-            onTogglePin={togglePinFromContextMenu}
-            onShowQRCode={(url, title) => {
-              setQrCodeModal({ isOpen: true, url, title });
-              closeContextMenu();
-            }}
-            onCopyLink={() => {
-              if (contextMenu.link) {
-                navigator.clipboard.writeText(contextMenu.link.url);
-              }
-              closeContextMenu();
-            }}
-          />
-        )}
-
-        {qrCodeModal.isOpen && (
-          <QRCodeModal
-            isOpen={qrCodeModal.isOpen}
-            url={qrCodeModal.url}
-            title={qrCodeModal.title}
-            onClose={() => setQrCodeModal({ isOpen: false, url: '', title: '' })}
-          />
+        {isModalOpen && <LinkModal isOpen={isModalOpen} onClose={() => { setIsModalOpen(false); setEditingLink(undefined); setPrefillLink(undefined); }} onSave={handleSaveLink} onDelete={editingLink ? () => handleDeleteLink(editingLink.id) : undefined} categories={categories} initialData={editingLink || prefillLink as LinkItem} aiConfig={aiConfig} defaultCategoryId={undefined} iconConfig={iconConfig} supportsUpload={capabilities?.upload ?? true} />}
+        {isCatManagerOpen && <CategoryManagerModal isOpen={isCatManagerOpen} onClose={() => setIsCatManagerOpen(false)} categories={categories} links={links} onUpdateCategories={(newCats) => setCategoriesAndSync(newCats, links)} onDeleteCategory={(id) => { const newCats = categories.filter(c => c.id !== id); setCategoriesAndSync(newCats, links); }} onUpdateLinks={(newLinks) => setLinksAndSync(newLinks, categories)} />}
+        {isBackupModalOpen && <BackupModal isOpen={isBackupModalOpen} onClose={() => setIsBackupModalOpen(false)} links={links} categories={categories} onRestore={(newLinks, newCats) => setLinksAndSync(newLinks, newCats)} webDavConfig={webdav || { url: '', username: '', password: '', enabled: false }} onSaveWebDavConfig={setWebDav} searchConfig={search || { mode: 'internal', externalSources: [] }} onRestoreSearchConfig={setSearch} aiConfig={aiConfig} onRestoreAIConfig={setAI} />}
+        {isImportModalOpen && <ImportModal isOpen={isImportModalOpen} onClose={() => setIsImportModalOpen(false)} existingLinks={links} categories={categories} onImport={(newLinks, newCats) => setLinksAndSync(newLinks, newCats)} />}
+        {isSettingsModalOpen && <SettingsModal isOpen={isSettingsModalOpen} onClose={() => setIsSettingsModalOpen(false)} authToken={authToken} onSettingsLoaded={(settings) => { setAI(settings.ai); setWebsite({ ...website, passwordExpiry: settings.passwordExpiry }); setMastodon(settings.ticker); setWeather(settings.weather); setShowPinned(settings.showPinnedWebsites); if (settings.defaultViewMode) setViewMode(settings.defaultViewMode); }} />}
+        {isSearchConfigModalOpen && <SearchConfigModal isOpen={isSearchConfigModalOpen} onClose={() => setIsSearchConfigModalOpen(false)} />}
+        {contextMenu.isOpen && contextMenu.link && (
+          <ContextMenu isOpen={contextMenu.isOpen} position={contextMenu.position} link={contextMenu.link} onClose={() => setContextMenu(prev => ({ ...prev, isOpen: false }))} onCopyLink={() => { navigator.clipboard.writeText(contextMenu.link!.url); setContextMenu(prev => ({ ...prev, isOpen: false })); }} onShowQRCode={(url, title) => { setQrCodeModal({ isOpen: true, url, title }); setContextMenu(prev => ({ ...prev, isOpen: false })); }} onEdit={() => { setEditingLink(contextMenu.link!); setIsModalOpen(true); setContextMenu(prev => ({ ...prev, isOpen: false })); }} onDelete={() => { handleDeleteLink(contextMenu.link!.id); setContextMenu(prev => ({ ...prev, isOpen: false })); }} onTogglePin={() => {
+            const targetLink = contextMenu.link!;
+            const newPinned = !targetLink.pinned;
+            setLinksAndSync(
+              links.map(l => l.id === targetLink.id ? { ...l, pinned: newPinned } : l),
+              categories
+            );
+            setContextMenu(prev => ({ ...prev, isOpen: false }));
+            toast.success(newPinned ? `「${targetLink.title}」已置顶` : `「${targetLink.title}」已取消置顶`);
+          }} />
         )}
+        {qrCodeModal.isOpen && <QRCodeModal isOpen={qrCodeModal.isOpen} url={qrCodeModal.url} title={qrCodeModal.title} onClose={() => setQrCodeModal({ isOpen: false, url: '', title: '' })} />}
       </Suspense>
+      {catAuthModalData && <CategoryAuthModal isOpen={!!catAuthModalData} category={catAuthModalData} onClose={() => setCatAuthModalData(null)} onUnlock={handleCategoryUnlock} />}
+      {isBatchEditMode && selectedLinks.size > 0 && (
+        <div className="fixed bottom-0 left-0 right-0 z-50 bg-white/95 dark:bg-slate-800/95 border-t border-slate-200 dark:border-slate-700 px-4 py-3 flex items-center justify-between shadow-lg">
+          <span className="text-sm text-slate-600 dark:text-slate-300">已选中 <span className="font-bold text-blue-600 dark:text-blue-400">{selectedLinks.size}</span> 个链接</span>
+          <div className="flex items-center gap-2">
+            <button onClick={() => { setSelectedLinks(new Set()); setIsBatchEditMode(false); }} className="px-4 py-2 text-sm text-slate-600 dark:text-slate-300 hover:bg-slate-100 dark:hover:bg-slate-700 rounded-lg transition-colors">取消</button>
+            <button onClick={handleBatchDelete} className="px-4 py-2 text-sm bg-red-500 hover:bg-red-600 text-white rounded-lg transition-colors">删除选中</button>
+          </div>
+        </div>
+      )}
     </div>
   );
 }
diff --git a/src/components/layout/Header.tsx b/src/components/layout/Header.tsx
index fc7735a6..e8f31194 100644
--- a/src/components/layout/Header.tsx
+++ b/src/components/layout/Header.tsx
@@ -167,7 +167,7 @@ export function Header({
   const { authToken, logout } = useAuthContext();
   const { syncStatus } = useLinksContext();
   const [showDropdown, setShowDropdown] = useState(false);
-  const [isToolsExpanded, setIsToolsExpanded] = useState(false);
+  const [isToolsExpanded, setIsToolsExpanded] = useState(true);
   const dropdownTimer = useRef<NodeJS.Timeout | null>(null);
 
   const engine = visitorEngineId || search?.defaultEngine || 'internal';
@@ -187,10 +187,10 @@ export function Header({
   }, [authToken]);
 
   return (
-    <header className="sticky top-0 z-30 bg-white/95 dark:bg-slate-800/95 md:bg-white/80 md:dark:bg-slate-800/50 md:backdrop-blur-md border-b border-slate-200 dark:border-slate-700">
+    <header className="sticky top-0 z-30 bg-white/95 dark:bg-slate-800/95 md:bg-white/80 md:dark:bg-slate-800/50 md:backdrop-blur-md border-b border-slate-200 dark:border-slate-700 safe-area-top">
       <div className="relative flex items-center justify-between px-4 lg:px-8 h-16">
         {/* Left: Menu + Logo */}
-        <div className="flex items-center gap-3">
+        <div className={`flex items-center ${isMobileSearchOpen ? 'gap-0' : 'gap-1 sm:gap-3'}`}>
           <button onClick={onToggleSidebar} className="lg:hidden p-2 -ml-2 text-slate-600 dark:text-slate-300 hover:bg-slate-50 dark:hover:bg-slate-700 rounded-lg transition-colors">
             <Menu size={24} />
           </button>
@@ -201,8 +201,8 @@ export function Header({
 
         {/* Mobile Search Bar - Expands to fill space */}
         {isMobileSearchOpen && (
-          <div className="flex-1 flex items-center gap-2 md:hidden ml-2">
-            <div className="relative flex-1">
+          <div className="flex-1 flex items-center gap-1.5 md:hidden ml-0 min-w-0">
+            <div className="relative flex-1 min-w-0">
               <div 
                 className="absolute left-3 top-1/2 -translate-y-1/2 flex items-center h-full"
                 onMouseEnter={handleMouseEnter}
@@ -237,12 +237,13 @@ export function Header({
                 onChange={(e) => onSearchChange(e.target.value)}
                 onKeyDown={(e) => e.key === 'Enter' && onSearch(searchQuery)}
                 placeholder={isInternal ? "搜索站内链接，点击图标（彩色时）搜索互联网" : "搜索互联网，点击图标（灰色时）站内搜索"}
-                className="w-full pl-9 pr-4 py-2 h-[36px] rounded-full bg-slate-200 dark:bg-slate-700 border-none text-xs focus:ring-2 focus:ring-blue-500 dark:text-white placeholder-slate-400 outline-none transition-all leading-none"
-                style={{ fontSize: '16px' }}
+                className="w-full pl-9 pr-3 py-2 h-[36px] rounded-full bg-slate-200 dark:bg-slate-700 border-none text-base focus:ring-2 focus:ring-blue-500 dark:text-white placeholder-slate-400 outline-none transition-all leading-none"
                 inputMode="search"
                 enterKeyHint="search"
               />
             </div>
+
+            {/* 站内切换 - 简化 */}
             <label className="flex items-center gap-1 cursor-pointer select-none shrink-0">
               <div className="relative">
                 <input
@@ -256,17 +257,33 @@ export function Header({
               </div>
               <span className="text-[10px] font-medium text-slate-500 dark:text-slate-400">站内</span>
             </label>
-            <button onClick={onToggleMobileSearch} className="p-1 text-slate-500 text-xs whitespace-nowrap">
+
+            {/* "+" 添加按钮 */}
+            <button onClick={onAddLink} className="flex items-center justify-center p-1.5 rounded-full text-blue-600 dark:text-blue-400 hover:bg-blue-50 dark:hover:bg-blue-900/20 h-[32px] min-w-[32px] cursor-pointer flex-shrink-0" title="添加链接">
+              <Plus size={18} />
+            </button>
+
+            {/* 展开/折叠工具栏 */}
+            <button 
+              onClick={() => setIsToolsExpanded(!isToolsExpanded)}
+              className={`flex items-center justify-center p-1 rounded-lg text-slate-400 hover:text-slate-600 dark:hover:text-slate-200 hover:bg-slate-100 dark:hover:bg-slate-700 transition-all flex-shrink-0 ${isToolsExpanded ? 'rotate-180' : 'rotate-0'}`}
+              title={isToolsExpanded ? "折叠工具栏" : "展开工具栏"}
+            >
+              <ChevronLeft size={18} />
+            </button>
+
+            {/* 取消按钮 */}
+            <button onClick={onToggleMobileSearch} className="p-1 text-slate-500 text-xs whitespace-nowrap flex-shrink-0">
               取消
             </button>
           </div>
         )}
 
-        {/* Middle: Spacer */}
-        <div className={`${isMobileSearchOpen ? 'hidden md:flex' : 'flex-1'}`} />
+        {/* Middle: Spacer - PC端占用空间，移动端不占用 */}
+        <div className={`${isMobileSearchOpen ? 'hidden md:flex' : 'hidden md:flex flex-1'}`} />
 
         {/* Right: Actions */}
-        <div className="flex items-center gap-2">
+        <div className={`flex items-center gap-1 sm:gap-2 flex-wrap sm:flex-nowrap ${isMobileSearchOpen ? 'hidden md:flex' : 'justify-start md:justify-end'}`}>
           {/* Ticker & Search Shared Container */}
           <div className="hidden md:flex items-center gap-2 w-[240px] lg:w-[360px] xl:w-[512px] shrink-0">
             {/* 1. Ticker (Now First) */}
@@ -298,7 +315,7 @@ export function Header({
           )}
 
           {/* Weather display */}
-          <div className="shrink-0">
+          <div className={`shrink-0 ${isToolsExpanded ? 'hidden' : ''}`}>
             <WeatherDisplay config={weather} />
           </div>
 
@@ -306,138 +323,127 @@ export function Header({
 
           {/* View mode toggle */}
           <div 
-            className={`${isMobileSearchOpen ? 'hidden' : 'flex'} items-center bg-slate-200 dark:bg-slate-700 rounded-full h-[36px] shrink-0 border border-slate-300/50 p-0.5`}
-            style={darkMode ? { border: 'none' } : {}}
+            className={`${isMobileSearchOpen || isToolsExpanded ? 'hidden' : 'flex'} items-center bg-slate-200 dark:bg-slate-700 rounded-full h-[28px] sm:h-[36px] shrink-0 p-0.5`}
           >
             <button
               onClick={() => setViewMode('compact')}
-              className={`px-3 py-2 text-xs font-medium rounded-full transition-all flex items-center justify-center h-full min-w-[40px] leading-none cursor-pointer ${
+              className={`px-1.5 sm:px-3 py-1 sm:py-2 text-[10px] sm:text-xs font-medium rounded-full transition-all flex items-center justify-center h-full min-w-[28px] sm:min-w-[40px] leading-none cursor-pointer ${
                 viewMode === 'compact'
-                  ? 'bg-white dark:bg-slate-600 text-blue-600 dark:text-blue-400 shadow-sm border border-slate-200/50'
+                  ? 'bg-white dark:bg-slate-600 text-blue-600 dark:text-blue-400 shadow-sm'
                   : 'text-slate-600 dark:text-slate-300 hover:text-slate-800 dark:hover:text-slate-100'
               }`}
-              style={darkMode && viewMode === 'compact' ? { border: 'none' } : {}}
               title="简约版视图"
-            >简约</button>
+            ><span className="hidden sm:inline">简约</span><span className="sm:hidden">简</span></button>
             <button
               onClick={() => setViewMode('detailed')}
-              className={`px-3 py-2 text-xs font-medium rounded-full transition-all flex items-center justify-center h-full min-w-[40px] leading-none cursor-pointer ${
+              className={`px-1.5 sm:px-3 py-1 sm:py-2 text-[10px] sm:text-xs font-medium rounded-full transition-all flex items-center justify-center h-full min-w-[28px] sm:min-w-[40px] leading-none cursor-pointer ${
                 viewMode === 'detailed'
-                  ? 'bg-white dark:bg-slate-600 text-blue-600 dark:text-blue-400 shadow-sm border border-slate-200/50'
+                  ? 'bg-white dark:bg-slate-600 text-blue-600 dark:text-blue-400 shadow-sm'
                   : 'text-slate-600 dark:text-slate-300 hover:text-slate-800 dark:hover:text-slate-100'
               }`}
-              style={darkMode && viewMode === 'detailed' ? { border: 'none' } : {}}
               title="详情版视图"
-            >详情</button>
+            ><span className="hidden sm:inline">详情</span><span className="sm:hidden">详</span></button>
           </div>
 
           {/* Theme toggle */}
-          <button onClick={() => setDarkMode(!darkMode)} className={`${isMobileSearchOpen ? 'hidden' : 'flex'} items-center justify-center p-2 rounded-full text-slate-600 dark:text-slate-300 hover:bg-slate-50 dark:hover:bg-slate-700 h-[36px] min-w-[36px] cursor-pointer`}>
+          <button onClick={() => setDarkMode(!darkMode)} className={`${isMobileSearchOpen || isToolsExpanded ? 'hidden' : 'flex'} items-center justify-center p-1.5 sm:p-2 rounded-full text-slate-600 dark:text-slate-300 hover:bg-slate-50 dark:hover:bg-slate-700 h-[32px] sm:h-[36px] min-w-[32px] sm:min-w-[36px] cursor-pointer`}>
             {darkMode ? <Sun size={18} /> : <Moon size={18} />}
           </button>
 
-          {/* GitHub link */}
-          <a
-            href="https://github.com/eallion/favorite"
-            target="_blank"
-            rel="noopener noreferrer"
-            className={`${isMobileSearchOpen ? 'hidden' : 'flex'} items-center justify-center p-2 rounded-full text-slate-600 dark:text-slate-300 hover:bg-slate-50 dark:hover:bg-slate-700 h-[36px] min-w-[36px] transition-colors`}
-            title="Favorite on GitHub"
-          >
-            <svg xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 24 24"><path fill="currentColor" d="M12 .297c-6.63 0-12 5.373-12 12c0 5.303 3.438 9.8 8.205 11.385c.6.113.82-.258.82-.577c0-.285-.01-1.04-.015-2.04c-3.338.724-4.042-1.61-4.042-1.61C4.422 18.07 3.633 17.7 3.633 17.7c-1.087-.744.084-.729.084-.729c1.205.084 1.838 1.236 1.838 1.236c1.07 1.835 2.809 1.305 3.495.998c.108-.776.417-1.305.76-1.605c-2.665-.3-5.466-1.332-5.466-5.93c0-1.31.465-2.38 1.235-3.22c-.135-.303-.54-1.523.105-3.176c0 0 1.005-.322 3.3 1.23c.96-.267 1.98-.399 3-.405c1.02.006 2.04.138 3 .405c2.28-1.552 3.285-1.23 3.285-1.23c.645 1.653.24 2.873.12 3.176c.765.84 1.23 1.91 1.23 3.22c0 4.61-2.805 5.625-5.475 5.92c.42.36.81 1.096.81 2.22c0 1.606-.015 2.896-.015 3.286c0 .315.21.69.825.57C20.565 22.092 24 17.592 24 12.297c0-6.627-5.373-12-12-12"/></svg>
-          </a>
-
           {/* Removed sync status indicator block */}
 
           {authToken ? (
-            <div className={`${isMobileSearchOpen ? 'hidden' : 'flex'} items-center gap-1`}>
+            <div className={`${isMobileSearchOpen ? 'hidden' : 'flex'} flex-wrap sm:flex-nowrap items-center gap-1 sm:gap-1 max-w-[calc(100vw-180px)] sm:max-w-none`}>
               {/* Add link - Always visible as primary action */}
-              <button onClick={onAddLink} className="flex items-center justify-center p-2 rounded-full text-blue-600 dark:text-blue-400 hover:bg-blue-50 dark:hover:bg-blue-900/20 h-[36px] min-w-[36px] cursor-pointer" title="添加链接">
-                <Plus size={20} />
+              <button onClick={onAddLink} className="flex items-center justify-center p-1.5 sm:p-2 rounded-full text-blue-600 dark:text-blue-400 hover:bg-blue-50 dark:hover:bg-blue-900/20 h-[32px] sm:h-[36px] min-w-[32px] sm:min-w-[36px] cursor-pointer flex-shrink-0" title="添加链接">
+                <Plus size={18} className="sm:w-5 sm:h-5" />
               </button>
 
-              <div className="h-4 w-[1px] bg-slate-300 dark:bg-slate-600 mx-1" />
+              <div className="h-4 w-[1px] bg-slate-300 dark:bg-slate-600 mx-0.5 sm:mx-1 flex-shrink-0" />
+
+              {/* Toggle Button */}
+              <button 
+                onClick={() => setIsToolsExpanded(!isToolsExpanded)}
+                className={`flex items-center justify-center p-1 rounded-lg text-slate-400 hover:text-slate-600 dark:hover:text-slate-200 hover:bg-slate-100 dark:hover:bg-slate-700 transition-all flex-shrink-0 ${isToolsExpanded ? 'rotate-180' : 'rotate-0'}`}
+                title={isToolsExpanded ? "折叠工具栏" : "展开工具栏"}
+              >
+                <ChevronLeft size={18} />
+              </button>
 
               {/* Collapsible Tools Area */}
               <div 
-                className={`flex items-center gap-1 transition-all duration-500 ease-in-out overflow-hidden ${
-                  isToolsExpanded ? 'max-w-[400px] opacity-100' : 'max-w-0 opacity-0'
+                className={`flex items-center gap-0.5 sm:gap-1 transition-all duration-500 ease-in-out ${
+                  isToolsExpanded ? 'opacity-100' : 'max-w-0 opacity-0 overflow-hidden'
                 }`}
               >
-                <div className="flex items-center gap-1 pr-1">
+                <div className="flex items-center gap-0.5 sm:gap-1 pr-0.5 sm:pr-1">
+
                   {/* Settings */}
                   <button
                     onClick={onOpenSettings}
-                    className="flex items-center justify-center p-2 rounded-full text-slate-600 dark:text-slate-300 hover:bg-slate-50 dark:hover:bg-slate-700 h-[36px] min-w-[36px] cursor-pointer"
+                    className="flex items-center justify-center p-1.5 sm:p-2 rounded-full text-slate-600 dark:text-slate-300 hover:bg-slate-50 dark:hover:bg-slate-700 h-[32px] sm:h-[36px] min-w-[32px] sm:min-w-[36px] cursor-pointer flex-shrink-0"
                     title="系统设置"
                   >
-                    <Settings size={18} />
+                    <Settings size={16} className="sm:w-[18px] sm:h-[18px]" />
                   </button>
 
                   {/* Manage Categories */}
                   <button
                     onClick={onOpenCatManager}
-                    className="flex items-center justify-center p-2 rounded-full text-slate-600 dark:text-slate-300 hover:bg-slate-50 dark:hover:bg-slate-700 h-[36px] min-w-[36px] cursor-pointer"
+                    className="flex items-center justify-center p-1.5 sm:p-2 rounded-full text-slate-600 dark:text-slate-300 hover:bg-slate-50 dark:hover:bg-slate-700 h-[32px] sm:h-[36px] min-w-[32px] sm:min-w-[36px] cursor-pointer flex-shrink-0"
                     title="分类管理"
                   >
-                    <Layers size={18} />
+                    <Layers size={16} className="sm:w-[18px] sm:h-[18px]" />
                   </button>
 
                   {/* Backup/Restore */}
                   <button
                     onClick={onOpenBackup}
-                    className="flex items-center justify-center p-2 rounded-full text-slate-600 dark:text-slate-300 hover:bg-slate-50 dark:hover:bg-slate-700 h-[36px] min-w-[36px] cursor-pointer"
+                    className="flex items-center justify-center p-1.5 sm:p-2 rounded-full text-slate-600 dark:text-slate-300 hover:bg-slate-50 dark:hover:bg-slate-700 h-[32px] sm:h-[36px] min-w-[32px] sm:min-w-[36px] cursor-pointer flex-shrink-0"
                     title="备份恢复"
                   >
-                    <Upload size={18} />
+                    <Upload size={16} className="sm:w-[18px] sm:h-[18px]" />
                   </button>
 
                   {/* Drag sort toggle */}
                   <button
                     onClick={onToggleDragSortMode}
-                    className={`flex items-center justify-center p-2 rounded-full h-[36px] min-w-[36px] cursor-pointer transition-colors ${
+                    className={`flex items-center justify-center p-1.5 sm:p-2 rounded-full h-[32px] sm:h-[36px] min-w-[32px] sm:min-w-[36px] cursor-pointer transition-colors flex-shrink-0 ${
                       isDragSortMode
                         ? 'bg-amber-100 dark:bg-amber-900/30 text-amber-600 dark:text-amber-400'
                         : 'text-slate-600 dark:text-slate-300 hover:bg-slate-50 dark:hover:bg-slate-700'
                     }`}
                     title={isDragSortMode ? '退出拖动排序' : '拖动排序'}
                   >
-                    <GripVertical size={18} />
+                    <GripVertical size={16} className="sm:w-[18px] sm:h-[18px]" />
                   </button>
 
                   {/* Edit mode toggle */}
                   <button
                     onClick={onToggleEditMode}
-                    className={`flex items-center justify-center p-2 rounded-full h-[36px] min-w-[36px] cursor-pointer transition-colors ${
+                    className={`flex items-center justify-center p-1.5 sm:p-2 rounded-full h-[32px] sm:h-[36px] min-w-[32px] sm:min-w-[36px] cursor-pointer transition-colors flex-shrink-0 ${
                       isEditMode
                         ? 'bg-green-100 dark:bg-green-900/30 text-green-600 dark:text-green-400'
                         : 'text-slate-600 dark:text-slate-300 hover:bg-slate-50 dark:hover:bg-slate-700'
                     }`}
                     title={isEditMode ? '退出编辑卡片' : '编辑卡片'}
                   >
-                    <Edit3 size={18} />
+                    <Edit3 size={16} className="sm:w-[18px] sm:h-[18px]" />
                   </button>
 
                   {/* Batch edit */}
-                  <button onClick={onToggleBatchEditMode} className={`flex items-center justify-center p-2 rounded-full h-[36px] min-w-[36px] cursor-pointer ${isBatchEditMode ? 'bg-blue-100 dark:bg-blue-900/30 text-blue-600 dark:text-blue-400' : 'text-slate-600 dark:text-slate-300 hover:bg-slate-50 dark:hover:bg-slate-700'}`} title="批量编辑">
-                    <CheckSquare size={18} />
+                  <button onClick={onToggleBatchEditMode} className={`flex items-center justify-center p-1.5 sm:p-2 rounded-full h-[32px] sm:h-[36px] min-w-[32px] sm:min-w-[36px] cursor-pointer flex-shrink-0 ${isBatchEditMode ? 'bg-blue-100 dark:bg-blue-900/30 text-blue-600 dark:text-blue-400' : 'text-slate-600 dark:text-slate-300 hover:bg-slate-50 dark:hover:bg-slate-700'}`} title="批量编辑">
+                    <CheckSquare size={16} className="sm:w-[18px] sm:h-[18px]" />
                   </button>
 
                   {/* Logout */}
-                  <button onClick={logout} className="flex items-center justify-center p-2 rounded-full text-red-500 hover:bg-red-50 dark:hover:bg-red-900/20 h-[36px] min-w-[36px] cursor-pointer" title="退出登录">
-                    <LogOut size={18} />
+                  <button onClick={logout} className="flex items-center justify-center p-1.5 sm:p-2 rounded-full text-red-500 hover:bg-red-50 dark:hover:bg-red-900/20 h-[32px] sm:h-[36px] min-w-[32px] sm:min-w-[36px] cursor-pointer flex-shrink-0" title="退出登录">
+                    <LogOut size={16} className="sm:w-[18px] sm:h-[18px]" />
                   </button>
+
                 </div>
               </div>
 
-              {/* Toggle Button */}
-              <button 
-                onClick={() => setIsToolsExpanded(!isToolsExpanded)}
-                className={`flex items-center justify-center p-1 rounded-lg text-slate-400 hover:text-slate-600 dark:hover:text-slate-200 hover:bg-slate-100 dark:hover:bg-slate-700 transition-all ${isToolsExpanded ? 'rotate-180' : 'rotate-0'}`}
-                title={isToolsExpanded ? "折叠工具栏" : "展开工具栏"}
-              >
-                <ChevronLeft size={20} />
-              </button>
             </div>
           ) : (
             <button
diff --git a/src/components/layout/MainContent.tsx b/src/components/layout/MainContent.tsx
index e9c96c12..9810828a 100644
--- a/src/components/layout/MainContent.tsx
+++ b/src/components/layout/MainContent.tsx
@@ -1,4 +1,5 @@
-import React, { useEffect, useState, useCallback } from 'react';
+import React, { useEffect, useState, useCallback, useMemo, useRef } from 'react';
+import { DndContext, closestCenter, DragEndEvent, SensorDescriptor } from '@dnd-kit/core';
 import { useLinksContext } from '../../contexts/LinksContext';
 import { useCategoriesContext } from '../../contexts/CategoriesContext';
 import { useConfigContext } from '../../contexts/ConfigContext';
@@ -30,18 +31,33 @@ export function MainContent({
   isDragSortMode, isEditMode, onWeightChange, isInternal,
 }: MainContentProps) {
   const { links = [], pinnedLinks = [], getLinksByCategory } = useLinksContext();
-  const { categoryTree = [], categories = [] } = useCategoriesContext();
+  const { categoryTree = [], categories = [], unlockedCategoryIds } = useCategoriesContext();
   const { showPinnedWebsites = true, viewMode = 'compact' } = useConfigContext();
   const { authToken } = useAuthContext();
   const { sensors, handleDragEnd, handlePinnedDragEnd } = useDragSort();
   const [activeCategory, setActiveCategory] = useState<string | null>(null);
+  const observerRef = useRef<IntersectionObserver | null>(null);
 
   const safeGetLinksByCategory = useCallback((categoryId: string) => {
     return getLinksByCategory ? getLinksByCategory(categoryId) : [];
   }, [getLinksByCategory]);
 
-  // Intersection Observer for active category highlighting
+  // 过滤搜索结果中的私人书签
+  const filteredSearchResults = useMemo(() => {
+    if (authToken) return searchResults;
+    return searchResults.filter(link => !link.isPrivate);
+  }, [searchResults, authToken]);
+
+  // 优化：使用 ref 缓存 sections，避免每次 re-render 都 querySelectorAll
+  const sectionsRef = useRef<NodeListOf<Element> | null>(null);
+
   useEffect(() => {
+    // 先断开旧的 observer
+    if (observerRef.current) {
+      observerRef.current.disconnect();
+      observerRef.current = null;
+    }
+
     const observer = new IntersectionObserver(
       (entries) => {
         for (const entry of entries) {
@@ -53,18 +69,25 @@ export function MainContent({
       },
       { rootMargin: '-20% 0px -60% 0px' }
     );
+    observerRef.current = observer;
 
-    const sections = document.querySelectorAll('[id^="cat-"]');
-    sections.forEach(section => observer.observe(section));
+    // 使用 setTimeout 将 DOM 查询推迟到渲染完成后
+    const timeoutId = setTimeout(() => {
+      sectionsRef.current = document.querySelectorAll('[id^="cat-"]');
+      sectionsRef.current.forEach(section => observer.observe(section));
+    }, 0);
 
-    return () => observer.disconnect();
-  }, [links, categories]);
+    return () => {
+      clearTimeout(timeoutId);
+      observer.disconnect();
+      observerRef.current = null;
+    };
+  }, []); // 只在挂载时执行，不依赖 links/categories 变化
 
   const gridClass = viewMode === 'detailed'
     ? 'grid-cols-2 sm:grid-cols-3 md:grid-cols-3 lg:grid-cols-4 xl:grid-cols-5 2xl:grid-cols-6'
     : 'grid-cols-2 sm:grid-cols-3 md:grid-cols-4 lg:grid-cols-5 xl:grid-cols-6 2xl:grid-cols-8 3xl:grid-cols-10';
 
-  // Search mode: Only show results if internal search is checked
   if (searchQuery.trim() && isInternal) {
     return (
       <main className="flex-1 overflow-y-auto p-4 lg:p-8 space-y-8">
@@ -72,11 +95,11 @@ export function MainContent({
           <h2 className="text-sm font-bold uppercase tracking-wider text-slate-500 dark:text-slate-400 flex items-center gap-2 mb-4">
             搜索结果
             <span className="ml-2 px-2 py-0.5 text-xs font-medium bg-blue-100 dark:bg-blue-900/30 text-blue-600 dark:text-blue-300 rounded-full">
-              {searchResults.length}
+              {filteredSearchResults.length}
             </span>
           </h2>
           <div className={`grid gap-3 ${gridClass}`}>
-            {searchResults.map(link => (
+            {filteredSearchResults.map(link => (
               <LinkCard
                 key={link.id}
                 link={link}
@@ -94,7 +117,7 @@ export function MainContent({
               />
             ))}
           </div>
-          {searchResults.length === 0 && (
+          {filteredSearchResults.length === 0 && (
             <p className="text-slate-500 text-center py-12">未找到匹配的链接</p>
           )}
         </section>
@@ -103,56 +126,57 @@ export function MainContent({
   }
 
   return (
-    <main className="flex-1 overflow-y-auto p-4 lg:p-8 space-y-8">
-      {/* Pinned section */}
-      {showPinnedWebsites && pinnedLinks.length > 0 && (
-        <section id="cat-pinned">
-          <PinnedSection
-            links={pinnedLinks}
-            viewMode={viewMode}
-            isBatchEditMode={isBatchEditMode}
-            selectedLinks={selectedLinks}
-            onToggleSelection={onToggleSelection}
-            onEditLink={onEditLink}
-            onDeleteLink={onDeleteLink}
-            onContextMenu={onContextMenu}
-            onDragEnd={handlePinnedDragEnd}
-            sensors={sensors}
-            authToken={authToken}
-            isDraggable={isDragSortMode}
-            isEditMode={isEditMode}
-            onWeightChange={onWeightChange}
-          />
-        </section>
-      )}
+    <DndContext sensors={sensors} collisionDetection={closestCenter} onDragEnd={handleDragEnd}>
+      <main className="flex-1 overflow-y-auto p-4 lg:p-8 space-y-8">
+        {showPinnedWebsites && pinnedLinks.length > 0 && (
+          <section id="cat-pinned">
+            <PinnedSection
+              links={pinnedLinks}
+              viewMode={viewMode}
+              isBatchEditMode={isBatchEditMode}
+              selectedLinks={selectedLinks}
+              onToggleSelection={onToggleSelection}
+              onEditLink={onEditLink}
+              onDeleteLink={onDeleteLink}
+              onContextMenu={onContextMenu}
+              onDragEnd={handlePinnedDragEnd}
+              sensors={sensors}
+              authToken={authToken}
+              isDraggable={isDragSortMode}
+              isEditMode={isEditMode}
+              onWeightChange={onWeightChange}
+            />
+          </section>
+        )}
+
+        {categoryTree.map(cat => {
+          const isLocked = cat.hasPassword && !unlockedCategoryIds.has(cat.id);
+          if (isLocked) return null;
 
-      {/* All categories */}
-      {categoryTree.map(cat => {
-        const catLinks = safeGetLinksByCategory(cat.id);
-        const subcategoryLinks = cat.children?.flatMap(child => safeGetLinksByCategory(child.id)) || [];
+          const catLinks = safeGetLinksByCategory(cat.id);
+          const subcategoryLinks = cat.children?.flatMap(child => safeGetLinksByCategory(child.id)) || [];
 
-        return (
-          <CategorySection
-            key={cat.id}
-            category={cat}
-            links={catLinks}
-            subcategoryLinks={subcategoryLinks}
-            viewMode={viewMode}
-            isBatchEditMode={isBatchEditMode}
-            selectedLinks={selectedLinks}
-            onToggleSelection={onToggleSelection}
-            onEditLink={onEditLink}
-            onDeleteLink={onDeleteLink}
-            onContextMenu={onContextMenu}
-            onDragEnd={handleDragEnd}
-            sensors={sensors}
-            authToken={authToken}
-            isDraggable={isDragSortMode}
-            isEditMode={isEditMode}
-            onWeightChange={onWeightChange}
-          />
-        );
-      })}
-    </main>
+          return (
+            <CategorySection
+              key={cat.id}
+              category={cat}
+              links={catLinks}
+              subcategoryLinks={subcategoryLinks}
+              viewMode={viewMode}
+              isBatchEditMode={isBatchEditMode}
+              selectedLinks={selectedLinks}
+              onToggleSelection={onToggleSelection}
+              onEditLink={onEditLink}
+              onDeleteLink={onDeleteLink}
+              onContextMenu={onContextMenu}
+              authToken={authToken}
+              isDraggable={isDragSortMode}
+              isEditMode={isEditMode}
+              onWeightChange={onWeightChange}
+            />
+          );
+        })}
+      </main>
+    </DndContext>
   );
 }
diff --git a/src/components/layout/Sidebar.tsx b/src/components/layout/Sidebar.tsx
index 97562197..6038a19d 100644
--- a/src/components/layout/Sidebar.tsx
+++ b/src/components/layout/Sidebar.tsx
@@ -1,5 +1,5 @@
 import React, { useCallback, useState } from 'react';
-import { LayoutGrid, Settings, Upload, X, Loader2, CheckCircle2, AlertCircle, Lock, ChevronDown, ChevronRight, PanelLeftClose, PanelLeftOpen } from 'lucide-react';
+import { LayoutGrid, Settings, X, Lock, ChevronDown, ChevronRight, PanelLeftClose, PanelLeftOpen } from 'lucide-react';
 import { useCategoriesContext, CategoryWithChildren } from '../../contexts/CategoriesContext';
 import { useConfigContext } from '../../contexts/ConfigContext';
 import { useAuthContext } from '../../contexts/AuthContext';
@@ -14,9 +14,20 @@ interface SidebarProps {
   onOpenCatManager: () => void;
   onOpenBackup: () => void;
   onUnlockCategory: (cat: Category) => void;
+  dragOffset?: number;
+  isDragging?: boolean;
 }
 
-export function Sidebar({ isOpen, onClose, activeCategoryId, onOpenCatManager, onOpenBackup, onUnlockCategory }: SidebarProps) {
+export function Sidebar({
+  isOpen,
+  onClose,
+  activeCategoryId,
+  onOpenCatManager,
+  onOpenBackup,
+  onUnlockCategory,
+  dragOffset = 0,
+  isDragging = false,
+}: SidebarProps) {
   const { categoryTree, expandedCategories, toggleExpand, unlockedCategoryIds } = useCategoriesContext();
   const { showPinnedWebsites, ai } = useConfigContext();
   const { authToken } = useAuthContext();
@@ -24,21 +35,27 @@ export function Sidebar({ isOpen, onClose, activeCategoryId, onOpenCatManager, o
   const [isCollapsed, setIsCollapsed] = useState(false);
 
   const handleCategoryClick = useCallback((cat: CategoryWithChildren) => {
+    const isLocked = cat.hasPassword && !unlockedCategoryIds.has(cat.id);
+    if (isLocked) {
+      onUnlockCategory(cat as Category);
+      return;
+    }
+
     if (cat.children && cat.children.length > 0) {
       toggleExpand(cat.id);
       const targetId = cat.children[0]?.id || cat.id;
-      document.getElementById(`cat-${targetId}`)?.scrollIntoView({ behavior: 'smooth' });
+      document.getElementById(`cat-${targetId}`)?.scrollIntoView();
     } else {
-      document.getElementById(`cat-${cat.id}`)?.scrollIntoView({ behavior: 'smooth' });
+      document.getElementById(`cat-${cat.id}`)?.scrollIntoView();
     }
     onClose();
-  }, [toggleExpand, onClose]);
+  }, [toggleExpand, onClose, unlockedCategoryIds, onUnlockCategory]);
 
   const renderCategoryNode = (cat: CategoryWithChildren, level: number = 0) => {
     const isExpanded = expandedCategories.has(cat.id);
     const isActive = activeCategoryId === cat.id;
     const hasChildren = cat.children && cat.children.length > 0;
-    const isLocked = cat.password && !unlockedCategoryIds.has(cat.id);
+    const isLocked = cat.hasPassword && !unlockedCategoryIds.has(cat.id);
 
     return (
       <div key={cat.id}>
@@ -59,7 +76,7 @@ export function Sidebar({ isOpen, onClose, activeCategoryId, onOpenCatManager, o
           </div>
           <div className={`flex flex-1 items-center overflow-hidden transition-all ease-in-out ${isCollapsed ? 'max-w-0 opacity-0 ml-0 duration-150' : 'max-w-[200px] opacity-100 ml-3 duration-300 delay-150'}`}>
             <span className="truncate flex-1 text-left">{cat.name}</span>
-            {hasChildren && (
+            {hasChildren && !isLocked && (
               <span className="text-slate-400 ml-2">
                 {isExpanded ? <ChevronDown size={14} /> : <ChevronRight size={14} />}
               </span>
@@ -68,7 +85,7 @@ export function Sidebar({ isOpen, onClose, activeCategoryId, onOpenCatManager, o
           </div>
         </button>
 
-        {hasChildren && isExpanded && !isCollapsed && (
+        {hasChildren && isExpanded && !isCollapsed && !isLocked && (
           <div className="space-y-1 mt-1">
             {cat.children.map(child => renderCategoryNode(child, level + 1))}
           </div>
@@ -77,20 +94,67 @@ export function Sidebar({ isOpen, onClose, activeCategoryId, onOpenCatManager, o
     );
   };
 
+  const MOBILE_SIDEBAR_WIDTH = 256;
+
+  // 计算移动端 transform
+  // 桌面端 (lg:static) 不需要 transform，直接返回 undefined
+  const getTransform = () => {
+    // 桌面端：lg:static 定位，不需要 transform
+    if (typeof window !== 'undefined' && window.innerWidth >= 1024) {
+      return undefined;
+    }
+    // 移动端
+    if (isOpen) {
+      return `translateX(${Math.min(0, dragOffset)}px)`;
+    }
+    if (isDragging && dragOffset > 0) {
+      return `translateX(${-MOBILE_SIDEBAR_WIDTH + dragOffset}px)`;
+    }
+    return `translateX(-${MOBILE_SIDEBAR_WIDTH}px)`;
+  };
+
+  // 遮罩层透明度
+  const getOverlayOpacity = () => {
+    if (!isOpen && isDragging && dragOffset > 0) {
+      return Math.min(dragOffset / MOBILE_SIDEBAR_WIDTH, 1) * 0.5;
+    }
+    if (isOpen && isDragging && dragOffset < 0) {
+      return 0.5 * (1 - Math.min(Math.abs(dragOffset) / MOBILE_SIDEBAR_WIDTH, 1));
+    }
+    return isOpen ? 0.5 : 0;
+  };
+
+  const overlayOpacity = getOverlayOpacity();
+  const showOverlay = overlayOpacity > 0;
+
   return (
     <>
-      {/* Overlay */}
-      {isOpen && (
-        <div className="fixed inset-0 z-20 bg-black/50 lg:hidden backdrop-blur-sm cursor-pointer" onClick={onClose} />
+      {/* 遮罩层 - 仅移动端，点击关闭 */}
+      {showOverlay && (
+        <div
+          className="fixed inset-0 z-20 lg:hidden cursor-pointer"
+          style={{
+            backgroundColor: `rgba(0, 0, 0, ${overlayOpacity})`,
+            transition: isDragging ? 'none' : 'background-color 0.3s ease',
+          }}
+          onClick={onClose}
+        />
       )}
 
-      {/* Sidebar */}
-      <aside className={`fixed lg:static inset-y-0 left-0 z-30 ${isCollapsed ? 'w-16' : 'w-64 lg:w-48 xl:w-64'} transform transition-all duration-300 ease-in-out bg-white dark:bg-slate-800 border-r border-slate-200 dark:border-slate-700 flex flex-col overflow-x-hidden ${
-        isOpen ? 'translate-x-0' : '-translate-x-full lg:translate-x-0'
-      }`}>
-        {/* Logo */}
+      {/* 侧边栏 */}
+      <aside
+        className={`fixed lg:static inset-y-0 left-0 z-30 ${isCollapsed ? 'w-16' : 'w-64 lg:w-48 xl:w-64'} bg-white dark:bg-slate-800 border-r border-slate-200 dark:border-slate-700 flex flex-col overflow-x-hidden`}
+        style={{
+          // 移动端：内联 transform 控制显示/隐藏/拖动
+          // 桌面端：由 lg:static 自动定位，transform 不生效
+          transform: getTransform(),
+          transition: isDragging ? 'none' : 'transform 0.3s ease-in-out',
+          willChange: isDragging ? 'transform' : 'auto',
+        }}
+      >
+        {/* 头部 */}
         <div className="h-16 flex items-center justify-center relative border-b border-slate-100 dark:border-slate-700 shrink-0 transition-all duration-300">
-          <span 
+          <span
             className={`text-xl font-bold bg-gradient-to-r from-blue-500 to-purple-500 bg-clip-text text-transparent flex items-center h-full whitespace-nowrap overflow-hidden transition-all ease-in-out ${
               isCollapsed ? 'max-w-0 opacity-0 duration-150' : 'max-w-[200px] opacity-100 duration-300 delay-150'
             }`}
@@ -112,13 +176,12 @@ export function Sidebar({ isOpen, onClose, activeCategoryId, onOpenCatManager, o
           </button>
         </div>
 
-        {/* Categories List */}
+        {/* 内容 */}
         <div className="flex-1 overflow-y-auto p-4 space-y-1 scrollbar-hide">
-          {/* 置顶网站 */}
           {showPinnedWebsites && (
             <button
               onClick={() => {
-                document.getElementById('cat-pinned')?.scrollIntoView({ behavior: 'smooth' });
+                document.getElementById('cat-pinned')?.scrollIntoView();
                 onClose();
               }}
               className={`w-full flex items-center py-3 rounded-xl transition-all cursor-pointer ${
@@ -133,7 +196,6 @@ export function Sidebar({ isOpen, onClose, activeCategoryId, onOpenCatManager, o
             </button>
           )}
 
-          {/* 分类目录标题 */}
           <div className={`flex items-center justify-between px-4 transition-all duration-300 overflow-hidden ${isCollapsed ? 'h-0 opacity-0 mt-0 mb-0' : 'h-10 mt-4 mb-2 opacity-100'}`}>
             <span className="text-xs font-semibold text-slate-400 uppercase tracking-wider whitespace-nowrap">分类目录</span>
             {authToken && (
@@ -148,11 +210,9 @@ export function Sidebar({ isOpen, onClose, activeCategoryId, onOpenCatManager, o
           </div>
           <div className={`mx-2 border-b border-slate-100 dark:border-slate-700/50 transition-all duration-300 ${isCollapsed ? 'mb-4 mt-2' : 'mb-0 mt-0 h-0 border-transparent opacity-0'}`}></div>
 
-          {/* 分类树 */}
           {categoryTree.map(cat => renderCategoryNode(cat, 0))}
         </div>
 
-        {/* Footer - Spacer or simple copyright if needed */}
         <div className="flex-shrink-0" />
       </aside>
     </>
diff --git a/src/components/link/LinkCard.tsx b/src/components/link/LinkCard.tsx
index fa178963..3fbdae95 100644
--- a/src/components/link/LinkCard.tsx
+++ b/src/components/link/LinkCard.tsx
@@ -1,9 +1,8 @@
-import React, { useState, useEffect, useRef, useCallback } from 'react';
+import React, { useState, useRef, useCallback } from 'react';
 import { useSortable } from '@dnd-kit/sortable';
 import { CSS } from '@dnd-kit/utilities';
 import { GripVertical } from 'lucide-react';
 import { LinkItem } from '../../../types';
-import { extractColorFromImage, generateColorFromText, ExtractedColor } from '../../../src/utils/colorExtractor';
 
 interface LinkCardProps {
   link: LinkItem;
@@ -20,18 +19,26 @@ interface LinkCardProps {
   onWeightChange?: (linkId: string, weight: number) => void;
 }
 
+// 从文本生成颜色（纯计算，无异步）
+function generateColorFromText(text: string): string {
+  let hash = 0;
+  for (let i = 0; i < text.length; i++) {
+    hash = text.charCodeAt(i) + ((hash << 5) - hash);
+  }
+  const hue = Math.abs(hash % 360);
+  return `hsl(${hue}, 70%, 45%)`;
+}
+
 export function LinkCard({
   link, viewMode, isBatchEditMode, isSelected,
   onToggleSelection, onEdit, onDelete, onContextMenu,
   isDraggable = true, authToken, isEditMode = false, onWeightChange,
 }: LinkCardProps) {
   const [imgError, setImgError] = useState(false);
-  const [color, setColor] = useState<ExtractedColor | null>(null);
+  const touchTimerRef = useRef<ReturnType<typeof setTimeout> | null>(null);
   const [isEditingWeight, setIsEditingWeight] = useState(false);
   const [weightValue, setWeightValue] = useState(link.weight?.toString() || '0');
-  const [isVisible, setIsVisible] = useState(false);
   const cardRef = useRef<HTMLDivElement>(null);
-  const observerRef = useRef<IntersectionObserver | null>(null);
 
   const {
     attributes, listeners, setNodeRef, transform, transition, isDragging,
@@ -44,67 +51,13 @@ export function LinkCard({
     transform: CSS.Transform.toString(transform),
     transition,
     opacity: isDragging ? 0.5 : 1,
-    ...(color ? {
-      '--icon-color': color.hex,
-      '--icon-color-rgb': color.rgb,
-    } as React.CSSProperties : {}),
   };
 
   const isDetailedView = viewMode === 'detailed';
   const iconSrc = link.icon && !imgError ? link.icon : null;
 
-  // 观察可见性，离屏卡片延迟执行颜色提取
-  useEffect(() => {
-    const el = cardRef.current;
-    if (!el) return;
-    if (typeof IntersectionObserver === 'undefined') {
-      setIsVisible(true);
-      return;
-    }
-    observerRef.current = new IntersectionObserver(
-      ([entry]) => {
-        if (entry.isIntersecting) {
-          setIsVisible(true);
-          observerRef.current?.disconnect();
-        }
-      },
-      { rootMargin: '200px' }
-    );
-    observerRef.current.observe(el);
-    return () => observerRef.current?.disconnect();
-  }, []);
-
-  // 提取图标颜色 - 仅在卡片可见时执行
-  useEffect(() => {
-    if (!isVisible) return;
-    if (!iconSrc) {
-      setColor(generateColorFromText(link.title));
-      return;
-    }
-
-    extractColorFromImage(iconSrc).then(result => {
-      if (result) {
-        setColor(result);
-      }
-    });
-  }, [iconSrc, link.title, isVisible]);
-
-  // 鼠标位置追踪
-  const rafRef = useRef<number | null>(null);
-  const handleMouseMove = useCallback((e: React.MouseEvent<HTMLDivElement>) => {
-    if (rafRef.current) return;
-    rafRef.current = requestAnimationFrame(() => {
-      const card = cardRef.current;
-      if (card) {
-        const rect = card.getBoundingClientRect();
-        const x = (e.clientX - rect.left) / rect.width;
-        const y = (e.clientY - rect.top) / rect.height;
-        card.style.setProperty('--pointer-x', `${x}`);
-        card.style.setProperty('--pointer-y', `${y}`);
-      }
-      rafRef.current = null;
-    });
-  }, []);
+  // 同步生成颜色，无需 useEffect + Canvas
+  const fallbackColor = generateColorFromText(link.title);
 
   const mergedRef = useCallback((node: HTMLDivElement | null) => {
     setNodeRef(node);
@@ -127,11 +80,53 @@ export function LinkCard({
     setIsEditingWeight(false);
   };
 
+  const handleTouchStart = (e: React.TouchEvent<HTMLDivElement>) => {
+    if (isBatchEditMode || isEditMode) return;
+    e.preventDefault();
+    const touch = e.touches[0];
+    (e.currentTarget as any).dataset.touchX = String(touch.clientX);
+    (e.currentTarget as any).dataset.touchY = String(touch.clientY);
+
+    touchTimerRef.current = setTimeout(() => {
+      const syntheticEvent = {
+        preventDefault: () => {},
+        stopPropagation: () => {},
+        clientX: touch.clientX,
+        clientY: touch.clientY,
+        currentTarget: e.currentTarget,
+        target: e.target,
+      } as unknown as React.MouseEvent<HTMLDivElement>;
+      onContextMenu(syntheticEvent, link);
+    }, 600);
+  };
+
+  const handleTouchEnd = () => {
+    if (touchTimerRef.current) {
+      clearTimeout(touchTimerRef.current);
+      touchTimerRef.current = null;
+    }
+  };
+
+  const handleTouchMove = (e: React.TouchEvent<HTMLDivElement>) => {
+    if (!touchTimerRef.current) return;
+    const touch = e.touches[0];
+    const startX = parseFloat((e.currentTarget as any).dataset.touchX || '0');
+    const startY = parseFloat((e.currentTarget as any).dataset.touchY || '0');
+    if (Math.abs(touch.clientX - startX) > 10 || Math.abs(touch.clientY - startY) > 10) {
+      clearTimeout(touchTimerRef.current);
+      touchTimerRef.current = null;
+    }
+  };
+
   return (
     <div
       ref={mergedRef}
-      style={style}
-      data-color-ready={!!color || undefined}
+      style={{
+        ...style,
+        WebkitUserSelect: 'none',
+        userSelect: 'none',
+        WebkitTouchCallout: 'none',
+      }}
       className={`link-card group relative transition-all duration-200 ${
         isSelected
           ? 'bg-red-50 dark:bg-red-900/30 border-red-200 dark:border-red-800'
@@ -143,16 +138,20 @@ export function LinkCard({
       } ${isDragging ? 'shadow-2xl scale-105' : ''}`}
       onClick={handleClick}
       onContextMenu={(e) => onContextMenu(e, link)}
-      onMouseMove={handleMouseMove}
+      onTouchStart={handleTouchStart}
+      onTouchEnd={handleTouchEnd}
+      onTouchMove={handleTouchMove}
       {...(isDraggable && !isBatchEditMode ? attributes : {})}
       {...(isDraggable && !isBatchEditMode ? listeners : {})}
     >
-      {/* 背景模糊图标 */}
+      {/* 背景模糊图标 - 使用 CSS 颜色而非提取 */}
       <div className="icon-bg">
         {iconSrc ? (
           <img src={iconSrc} alt="" loading="lazy" onError={() => setImgError(true)} />
         ) : (
-          <span style={{ fontSize: '48px', fontWeight: 'bold' }}>{link.title.charAt(0).toUpperCase()}</span>
+          <span style={{ fontSize: '48px', fontWeight: 'bold', color: fallbackColor }}>
+            {link.title.charAt(0).toUpperCase()}
+          </span>
         )}
       </div>
 
@@ -207,8 +206,14 @@ export function LinkCard({
           <>
             <div className="flex flex-col md:flex-row md:items-start gap-3 w-full min-w-0">
               <div className="flex items-center gap-3 w-full md:hidden">
-                <div className="text-blue-600 dark:text-blue-400 flex items-center justify-center text-sm font-bold uppercase shrink-0 w-10 h-10 rounded-xl bg-gradient-to-br from-slate-50 to-slate-100 dark:from-slate-700 dark:to-slate-800 shadow-sm">
-                  {iconSrc ? <img src={iconSrc} alt="" className="w-6 h-6" loading="lazy" onError={() => setImgError(true)} /> : link.title.charAt(0).toUpperCase()}
+                <div className="relative shrink-0">
+                  <div className="flex items-center justify-center text-sm font-bold uppercase w-10 h-10 rounded-xl bg-gradient-to-br from-slate-50 to-slate-100 dark:from-slate-700 dark:to-slate-800 shadow-sm"
+                    style={{ color: fallbackColor }}>
+                    {iconSrc ? <img src={iconSrc} alt="" className="w-6 h-6" loading="lazy" onError={() => setImgError(true)} /> : link.title.charAt(0).toUpperCase()}
+                  </div>
+                  {link.isPrivate && (
+                    <span className="absolute top-0.5 right-0.5 text-[10px] leading-none" title="私人书签">🔒</span>
+                  )}
                 </div>
                 <h3 className="flex-1 min-w-0 text-slate-800 dark:text-slate-200 text-base font-medium overflow-hidden text-ellipsis whitespace-nowrap group-hover:text-blue-600 dark:group-hover:text-blue-400 transition-colors" title={link.title}>
                   {link.title}
@@ -219,8 +224,14 @@ export function LinkCard({
                   {link.description}
                 </p>
               )}
-              <div className="hidden md:flex text-blue-600 dark:text-blue-400 items-center justify-center text-sm font-bold uppercase shrink-0 w-14 h-14 rounded-2xl bg-gradient-to-br from-slate-50 to-slate-100 dark:from-slate-700 dark:to-slate-800 shadow-sm">
-                {iconSrc ? <img src={iconSrc} alt="" className="w-10 h-10" loading="lazy" onError={() => setImgError(true)} /> : link.title.charAt(0).toUpperCase()}
+              <div className="relative hidden md:flex shrink-0">
+                <div className="flex items-center justify-center text-sm font-bold uppercase w-14 h-14 rounded-2xl bg-gradient-to-br from-slate-50 to-slate-100 dark:from-slate-700 dark:to-slate-800 shadow-sm"
+                  style={{ color: fallbackColor }}>
+                  {iconSrc ? <img src={iconSrc} alt="" className="w-10 h-10" loading="lazy" onError={() => setImgError(true)} /> : link.title.charAt(0).toUpperCase()}
+                </div>
+                {link.isPrivate && (
+                  <span className="absolute top-1 right-1 text-xs leading-none" title="私人书签">🔒</span>
+                )}
               </div>
               <div className="hidden md:flex flex-1 min-w-0 flex-col justify-start w-full">
                 <h3 className="text-slate-800 dark:text-slate-200 text-base font-medium w-full min-w-0 overflow-hidden text-ellipsis whitespace-nowrap group-hover:text-blue-600 dark:group-hover:text-blue-400 transition-colors" title={link.title}>
@@ -236,38 +247,39 @@ export function LinkCard({
           </>
         ) : (
           <>
-            <div className="flex items-center gap-3 w-full">
-              <div className="text-blue-600 dark:text-blue-400 flex items-center justify-center text-sm font-bold uppercase shrink-0 w-8 h-8 rounded-lg bg-slate-50 dark:bg-slate-700">
-                {iconSrc ? <img src={iconSrc} alt="" className="w-5 h-5" loading="lazy" onError={() => setImgError(true)} /> : link.title.charAt(0).toUpperCase()}
+            <div className="relative shrink-0 mr-3">
+              <div className="flex items-center justify-center text-sm font-bold uppercase w-10 h-10 rounded-xl bg-gradient-to-br from-slate-50 to-slate-100 dark:from-slate-700 dark:to-slate-800 shadow-sm"
+                style={{ color: fallbackColor }}>
+                {iconSrc ? <img src={iconSrc} alt="" className="w-6 h-6" loading="lazy" onError={() => setImgError(true)} /> : link.title.charAt(0).toUpperCase()}
               </div>
-              <h3 className="text-sm font-medium text-slate-800 dark:text-slate-200 truncate whitespace-nowrap overflow-hidden text-ellipsis group-hover:text-blue-600 dark:group-hover:text-blue-400 transition-colors" title={link.title}>
+              {link.isPrivate && (
+                <span className="absolute top-0.5 right-0.5 text-[10px] leading-none" title="私人书签">🔒</span>
+              )}
+            </div>
+            <div className="flex-1 min-w-0">
+              <h3 className="text-slate-800 dark:text-slate-200 text-sm font-medium overflow-hidden text-ellipsis whitespace-nowrap group-hover:text-blue-600 dark:group-hover:text-blue-400 transition-colors" title={link.title}>
                 {link.title}
               </h3>
+              {link.description && (
+                <p className="text-xs text-slate-500 dark:text-slate-400 overflow-hidden text-ellipsis whitespace-nowrap" title={link.description}>
+                  {link.description}
+                </p>
+              )}
             </div>
-            {link.description && (
-              <div className="tooltip-custom absolute left-0 -top-8 w-max max-w-[200px] bg-black text-white text-xs p-2 rounded opacity-0 invisible group-hover:visible group-hover:opacity-100 transition-all z-20 pointer-events-none truncate">
-                {link.description}
-              </div>
-            )}
           </>
         )}
       </div>
 
-      {/* Hover actions - 只在编辑模式下显示 */}
-      {!isBatchEditMode && authToken && isEditMode && (
-        <div className={`flex items-center justify-center gap-1 opacity-0 group-hover:opacity-100 transition-opacity bg-white/90 dark:bg-slate-800/90 backdrop-blur-sm rounded-md p-1 absolute z-10 ${
-          isDetailedView ? 'top-3 right-3' : 'top-1/2 -translate-y-1/2 right-2'
-        }`}>
-          <button
-            onClick={(e) => { e.preventDefault(); e.stopPropagation(); onEdit(link); }}
-            className="p-1 text-slate-400 hover:text-blue-500 hover:bg-slate-100 dark:hover:bg-slate-700 rounded-md"
-            title="编辑"
-          >
-            <svg width="18" height="18" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
-              <path d="M12 15.5A3.5 3.5 0 0 1 8.5 12A3.5 3.5 0 0 1 12 8.5a3.5 3.5 0 0 1 3.5 3.5a3.5 3.5 0 0 1-3.5 3.5m7.43-2.53c.04-.32.07-.64.07-.97c0-.33-.03-.65-.07-.97l2.11-1.63c.19-.15.24-.42.12-.64l-2-3.46c-.12-.22-.39-.3-.61-.22l-2.49 1c-.52-.39-1.06-.73-1.69-.98l-.37-2.65A.506.506 0 0 0 14 2h-4c-.25 0-.46.18-.5.42l-.37 2.65c-.63.25-1.17.59-1.69.98l-2.49-1c-.22-.08-.49 0-.61.22l-2 3.46c-.13.22-.07.49.12.64L4.57 11c-.04.32-.07.64-.07.97c0 .33.03.65.07.97l-2.11 1.63c-.19.15-.24.42-.12.64l2 3.46c.12.22.39.3.61.22l2.49-1c.52.39 1.06.73 1.69.98l.37 2.65c.04.24.25.42.5.42h4c.25 0 .46-.18.5-.42l.37-2.65c.63-.25 1.17-.59 1.69-.98l2.49 1c.22.08.49 0 .61-.22l2-3.46c.13-.22.07-.49-.12-.64l-2.11-1.63Z" fill="currentColor"/>
-            </svg>
-          </button>
-        </div>
+      {/* Drag handle */}
+      {isDraggable && !isBatchEditMode && (
+        <button
+          {...attributes}
+          {...listeners}
+          className="opacity-0 group-hover:opacity-100 transition-opacity p-1 text-slate-400 hover:text-slate-600 dark:hover:text-slate-300 cursor-grab active:cursor-grabbing"
+          onClick={(e) => e.stopPropagation()}
+        >
+          <GripVertical size={16} />
+        </button>
       )}
     </div>
   );
diff --git a/src/components/link/PinnedSection.tsx b/src/components/link/PinnedSection.tsx
index c77ff9ea..5bb19591 100644
--- a/src/components/link/PinnedSection.tsx
+++ b/src/components/link/PinnedSection.tsx
@@ -1,5 +1,4 @@
 import React from 'react';
-import { DndContext, closestCenter, DragEndEvent, SensorDescriptor } from '@dnd-kit/core';
 import { SortableContext, rectSortingStrategy } from '@dnd-kit/sortable';
 import { Pin } from 'lucide-react';
 import { LinkItem } from '../../../types';
@@ -14,8 +13,6 @@ interface PinnedSectionProps {
   onEditLink: (link: LinkItem) => void;
   onDeleteLink: (id: string) => void;
   onContextMenu: (e: React.MouseEvent, link: LinkItem) => void;
-  onDragEnd: (event: DragEndEvent) => void;
-  sensors: SensorDescriptor<any>[];
   authToken?: string | null;
   isDraggable?: boolean;
   isEditMode?: boolean;
@@ -24,10 +21,14 @@ interface PinnedSectionProps {
 
 export function PinnedSection({
   links, viewMode = 'compact', isBatchEditMode, selectedLinks, onToggleSelection,
-  onEditLink, onDeleteLink, onContextMenu, onDragEnd, sensors, authToken,
+  onEditLink, onDeleteLink, onContextMenu, authToken,
   isDraggable = false, isEditMode = false, onWeightChange,
 }: PinnedSectionProps) {
-  const sortedLinks = [...(links || [])].sort((a, b) => (a.pinnedOrder ?? 0) - (b.pinnedOrder ?? 0));
+  const sortedLinks = [...(links || [])].sort((a, b) => {
+    const weightDiff = (b.weight ?? 0) - (a.weight ?? 0);
+    if (weightDiff !== 0) return weightDiff;
+    return (a.pinnedOrder ?? 0) - (b.pinnedOrder ?? 0);
+  });
 
   const gridClass = viewMode === 'detailed'
     ? 'grid-cols-2 sm:grid-cols-3 md:grid-cols-3 lg:grid-cols-4 xl:grid-cols-5 2xl:grid-cols-6'
@@ -44,29 +45,27 @@ export function PinnedSection({
           {links.length}
         </span>
       </div>
-      <DndContext sensors={sensors} collisionDetection={closestCenter} onDragEnd={onDragEnd}>
-        <SortableContext items={sortedLinks.map(l => l.id)} strategy={rectSortingStrategy}>
-          <div className={`grid gap-3 ${gridClass}`}>
-            {sortedLinks.map(link => (
-              <LinkCard
-                key={link.id}
-                link={link}
-                viewMode={viewMode}
-                isBatchEditMode={isBatchEditMode}
-                isSelected={selectedLinks.has(link.id)}
-                onToggleSelection={onToggleSelection}
-                onEdit={onEditLink}
-                onDelete={onDeleteLink}
-                onContextMenu={onContextMenu}
-                authToken={authToken}
-                isDraggable={isDraggable}
-                isEditMode={isEditMode}
-                onWeightChange={onWeightChange}
-              />
-            ))}
-          </div>
-        </SortableContext>
-      </DndContext>
+      <SortableContext items={sortedLinks.map(l => l.id)} strategy={rectSortingStrategy}>
+        <div className={`grid gap-3 ${gridClass}`}>
+          {sortedLinks.map(link => (
+            <LinkCard
+              key={link.id}
+              link={link}
+              viewMode={viewMode}
+              isBatchEditMode={isBatchEditMode}
+              isSelected={selectedLinks.has(link.id)}
+              onToggleSelection={onToggleSelection}
+              onEdit={onEditLink}
+              onDelete={onDeleteLink}
+              onContextMenu={onContextMenu}
+              authToken={authToken}
+              isDraggable={isDraggable}
+              isEditMode={isEditMode}
+              onWeightChange={onWeightChange}
+            />
+          ))}
+        </div>
+      </SortableContext>
     </div>
   );
 }
diff --git a/src/contexts/CategoriesContext.tsx b/src/contexts/CategoriesContext.tsx
index bcec8b1a..fc3409bc 100644
--- a/src/contexts/CategoriesContext.tsx
+++ b/src/contexts/CategoriesContext.tsx
@@ -2,6 +2,7 @@ import React, { createContext, useContext, useReducer, useCallback, useMemo } fr
 import { Category, LinkItem, DEFAULT_CATEGORIES } from '../../types';
 import { STORAGE_KEYS, API_ENDPOINTS } from '../constants';
 import { useAuthContext } from './AuthContext';
+import { toast } from '../../components/Toast';
 
 // --- Types ---
 interface CategoriesState {
@@ -82,7 +83,7 @@ function buildCategoryTree(cats: Category[]): CategoryWithChildren[] {
 export function CategoriesProvider({ children }: { children: React.ReactNode }) {
   const [state, dispatch] = useReducer(categoriesReducer, {
     categories: [],
-    unlockedCategoryIds: new Set(),
+    unlockedCategoryIds: new Set(JSON.parse(localStorage.getItem('unlocked_categories') || '[]')),
     expandedCategories: new Set(),
   });
 
@@ -94,19 +95,24 @@ export function CategoriesProvider({ children }: { children: React.ReactNode })
 
   const addCategory = useCallback((cat: Category) => {
     dispatch({ type: 'ADD_CATEGORY', payload: cat });
+    toast.success(`已添加分类「${cat.name}」`);
   }, []);
 
   const updateCategory = useCallback((cat: Category) => {
     dispatch({ type: 'UPDATE_CATEGORY', payload: cat });
+    toast.success(`已更新分类「${cat.name}」`);
   }, []);
 
   const deleteCategory = useCallback((id: string) => {
     dispatch({ type: 'DELETE_CATEGORY', payload: id });
+    toast.success('分类已删除');
   }, []);
 
   const unlockCategory = useCallback((id: string) => {
+    const newSet = new Set([...state.unlockedCategoryIds, id]);
+    localStorage.setItem('unlocked_categories', JSON.stringify(Array.from(newSet)));
     dispatch({ type: 'UNLOCK_CATEGORY', payload: id });
-  }, []);
+  }, [state.unlockedCategoryIds]);
 
   const toggleExpand = useCallback((id: string) => {
     dispatch({ type: 'TOGGLE_EXPAND', payload: id });
diff --git a/src/contexts/LinksContext.tsx b/src/contexts/LinksContext.tsx
index 6eaf1b05..728ede99 100644
--- a/src/contexts/LinksContext.tsx
+++ b/src/contexts/LinksContext.tsx
@@ -1,7 +1,8 @@
-import React, { createContext, useContext, useReducer, useCallback, useMemo } from 'react';
+import React, { createContext, useContext, useReducer, useCallback, useMemo, useRef } from 'react';
 import { LinkItem, Category } from '../../types';
 import { STORAGE_KEYS, API_ENDPOINTS } from '../constants';
 import { useAuthContext } from './AuthContext';
+import { toast } from '../../components/Toast';
 
 // --- Types ---
 interface LinksState {
@@ -61,104 +62,126 @@ export function LinksProvider({ children }: { children: React.ReactNode }) {
 
   const { authToken } = useAuthContext();
 
-  // 初始化（不触发同步）
+  // 防抖定时器 ref
+  const syncTimeoutRef = useRef<ReturnType<typeof setTimeout> | null>(null);
+  const pendingSyncRef = useRef<{ links: LinkItem[]; categories: Category[] } | null>(null);
+
   const initLinks = useCallback((links: LinkItem[]) => {
     dispatch({ type: 'SET_LINKS', payload: links });
   }, []);
 
-  // 同步到云端
-  const syncToCloud = useCallback(async (links: LinkItem[], categories: Category[], token: string) => {
-    dispatch({ type: 'SET_SYNC_STATUS', payload: 'saving' });
-    try {
-      const res = await fetch(API_ENDPOINTS.STORAGE, {
-        method: 'POST',
-        headers: {
-          'Content-Type': 'application/json',
-          'x-auth-password': token,
-        },
-        body: JSON.stringify({ links, categories }),
-      });
-      if (res.status === 401) {
-        dispatch({ type: 'SET_SYNC_STATUS', payload: 'error' });
-        return false;
-      }
-      if (!res.ok) throw new Error('Sync failed');
-      dispatch({ type: 'SET_SYNC_STATUS', payload: 'saved' });
-      setTimeout(() => dispatch({ type: 'SET_SYNC_STATUS', payload: 'idle' }), 2000);
-      return true;
-    } catch (e) {
-      console.error('Sync failed:', e);
-      dispatch({ type: 'SET_SYNC_STATUS', payload: 'error' });
-      return false;
-    }
-  }, []);
-
-  // 持久化：本地 + 云端
-  const persist = useCallback((links: LinkItem[], categories: Category[]) => {
-    localStorage.setItem(STORAGE_KEYS.LOCAL_STORAGE_KEY, JSON.stringify({ links, categories }));
-    if (authToken) {
-      syncToCloud(links, categories, authToken);
-    }
-  }, [authToken, syncToCloud]);
-
   const addLink = useCallback((data: Omit<LinkItem, 'id' | 'createdAt'>) => {
     const newLink: LinkItem = {
       ...data,
-      id: Date.now().toString(),
+      id: `${Date.now()}-${Math.random().toString(36).substring(2, 11)}`,
       createdAt: Date.now(),
     };
     dispatch({ type: 'ADD_LINK', payload: newLink });
+    toast.success(`已添加书签「${data.title}」`);
   }, []);
 
   const updateLink = useCallback((link: LinkItem) => {
     dispatch({ type: 'UPDATE_LINK', payload: link });
+    toast.success(`已更新书签「${link.title}」`);
   }, []);
 
   const deleteLink = useCallback((id: string) => {
     dispatch({ type: 'DELETE_LINK', payload: id });
+    toast.success('书签已删除');
   }, []);
 
   const deleteLinks = useCallback((ids: Set<string>) => {
     dispatch({ type: 'DELETE_LINKS', payload: ids });
+    toast.success(`已删除 ${ids.size} 个书签`);
   }, []);
 
   const updateLinks = useCallback((links: LinkItem[]) => {
     dispatch({ type: 'SET_LINKS', payload: links });
   }, []);
 
-  // 设置链接并同步（用于 updateData 场景）
+  // 防抖同步到云端：500ms 内多次修改只发一次请求
   const setLinksAndSync = useCallback((links: LinkItem[], categories: Category[]) => {
-    dispatch({ type: 'SET_LINKS', payload: links });
-    persist(links, categories);
-  }, [persist]);
-
-  // 置顶链接
-  const pinnedLinks = useMemo(() =>
-    state.links
-      .filter(l => l.pinned)
-      .sort((a, b) => (a.pinnedOrder ?? 0) - (b.pinnedOrder ?? 0)),
-    [state.links]
-  );
+    // 过滤掉无效链接（没有 id 的）
+    const validLinks = links.filter(l => l.id && l.id.trim() !== '');
+
+    dispatch({ type: 'SET_LINKS', payload: validLinks });
+    localStorage.setItem(STORAGE_KEYS.LOCAL_STORAGE_KEY, JSON.stringify({ links: validLinks, categories }));
 
-  // 按分类获取链接（按 weight 排序，weight 相同按 order 排序）
-  const getLinksByCategory = useCallback((categoryId: string) =>
-    state.links
+    if (!authToken) return;
+
+    // 保存待同步数据
+    pendingSyncRef.current = { links: validLinks, categories };
+
+    // 清除旧的定时器
+    if (syncTimeoutRef.current) {
+      clearTimeout(syncTimeoutRef.current);
+    }
+
+    dispatch({ type: 'SET_SYNC_STATUS', payload: 'saving' });
+
+    // 500ms 防抖后执行同步
+    syncTimeoutRef.current = setTimeout(() => {
+      const pending = pendingSyncRef.current;
+      if (!pending) return;
+
+      fetch(API_ENDPOINTS.STORAGE, {
+        method: 'POST',
+        headers: {
+          'Content-Type': 'application/json',
+          'x-auth-password': authToken,
+        },
+        body: JSON.stringify(pending),
+      })
+      .then(() => {
+        dispatch({ type: 'SET_SYNC_STATUS', payload: 'saved' });
+        toast.success('数据已同步到云端');
+        setTimeout(() => {
+          dispatch({ type: 'SET_SYNC_STATUS', payload: 'idle' });
+        }, 2000);
+      })
+      .catch(e => {
+        console.error('Sync links failed:', e);
+        dispatch({ type: 'SET_SYNC_STATUS', payload: 'error' });
+        toast.error('同步失败，请检查网络');
+      });
+
+      pendingSyncRef.current = null;
+    }, 500);
+  }, [authToken]);
+
+  // 过滤私人书签：未登录时隐藏
+  const visibleLinks = useMemo(() => {
+    if (authToken) return state.links;
+    return state.links.filter(link => !link.isPrivate);
+  }, [state.links, authToken]);
+
+  const pinnedLinks = useMemo(() => {
+    const pinned = visibleLinks.filter(l => l.pinned);
+    return [...pinned].sort((a, b) => {
+      const weightDiff = (b.weight ?? 0) - (a.weight ?? 0);
+      if (weightDiff !== 0) return weightDiff;
+      return (a.pinnedOrder ?? 0) - (b.pinnedOrder ?? 0);
+    });
+  }, [visibleLinks]);
+
+  const getLinksByCategory = useCallback((categoryId: string) => {
+    return visibleLinks
       .filter(l => l.categoryId === categoryId)
       .sort((a, b) => {
-        const wa = a.weight ?? Infinity;
-        const wb = b.weight ?? Infinity;
-        if (wa !== wb) return wa - wb;
+        const weightDiff = (b.weight ?? 0) - (a.weight ?? 0);
+        if (weightDiff !== 0) return weightDiff;
         return (a.order ?? 0) - (b.order ?? 0);
-      }),
-    [state.links]
-  );
+      });
+  }, [visibleLinks]);
 
   return (
     <LinksContext.Provider value={{
       ...state,
       initLinks,
-      addLink, updateLink, deleteLink, deleteLinks,
-      updateLinks, setLinksAndSync, pinnedLinks, getLinksByCategory,
+      addLink, updateLink, deleteLink, deleteLinks, updateLinks,
+      setLinksAndSync,
+      pinnedLinks,
+      getLinksByCategory,
     }}>
       {children}
     </LinksContext.Provider>
diff --git a/src/hooks/useDataSync.ts b/src/hooks/useDataSync.ts
index 8451c09f..716224e7 100644
--- a/src/hooks/useDataSync.ts
+++ b/src/hooks/useDataSync.ts
@@ -10,7 +10,7 @@ import { useConfigContext } from '../contexts/ConfigContext';
  */
 export function useDataSync() {
   const { links = [], initLinks, setLinksAndSync } = useLinksContext();
-  const { categories = [], initCategories } = useCategoriesContext();
+  const { categories = [], initCategories, unlockedCategoryIds } = useCategoriesContext();
   const { initConfig } = useConfigContext();
   const initialized = useRef(false);
 
@@ -22,7 +22,6 @@ export function useDataSync() {
         const parsed = JSON.parse(stored);
         let cats: Category[] = parsed.categories || DEFAULT_CATEGORIES;
 
-        // 确保 common 分类存在且排第一
         if (!cats.some((c: Category) => c.id === 'common')) {
           cats = [{ id: 'common', name: '常用推荐', icon: 'Star' }, ...cats];
         } else {
@@ -33,7 +32,6 @@ export function useDataSync() {
           }
         }
 
-        // 修复无效 categoryId
         const validIds = new Set(cats.map((c: Category) => c.id));
         let lnks: LinkItem[] = (parsed.links || INITIAL_LINKS).map((l: LinkItem) =>
           validIds.has(l.categoryId) ? l : { ...l, categoryId: 'common' }
@@ -47,10 +45,11 @@ export function useDataSync() {
     return { links: INITIAL_LINKS, categories: DEFAULT_CATEGORIES };
   }, []);
 
-  // 从 KV 加载链接和分类
-  const loadFromCloud = useCallback(async (): Promise<{ links: LinkItem[]; categories: Category[] } | null> => {
+  // 从 KV 加载链接和分类（带密码过滤）
+  const loadFromCloud = useCallback(async (unlockedCats?: Set<string>): Promise<{ links: LinkItem[]; categories: Category[] } | null> => {
     try {
-      const res = await fetch(`${API_ENDPOINTS.STORAGE}?getConfig=true&readOnly=true`);
+      const unlockedArray = unlockedCats ? Array.from(unlockedCats) : [];
+      const res = await fetch(`${API_ENDPOINTS.STORAGE}?getConfig=true&readOnly=true&unlocked=${encodeURIComponent(JSON.stringify(unlockedArray))}`);
       if (!res.ok) return null;
       const data = await res.json();
       if (data.links?.length > 0 || data.categories?.length > 0) {
@@ -63,35 +62,33 @@ export function useDataSync() {
     }
   }, []);
 
-  // 从 KV 加载各个配置
+  // 优化：从单个请求加载所有配置
   const loadConfigsFromCloud = useCallback(async () => {
-    const configKeys = ['search', 'website', 'ai', 'weather', 'mastodon', 'icon'];
-    const configMap: Record<string, any> = {};
-
-    await Promise.all(configKeys.map(async (key) => {
-      try {
-        const res = await fetch(`${API_ENDPOINTS.STORAGE}?getConfig=${key}`);
-        if (res.ok) {
-          const data = await res.json();
-          if (data && Object.keys(data).length > 0) {
-            // 将后端命名的 'mastodon' 映射为前端统一使用的 'ticker'
-            const configKey = key === 'mastodon' ? 'ticker' : key;
-            configMap[configKey] = data;
-          }
+    try {
+      // 使用批量接口一次性获取所有配置
+      const res = await fetch(`${API_ENDPOINTS.STORAGE}?getConfig=ai,website,mastodon,weather,search,icon`);
+      if (!res.ok) return;
+
+      const data = await res.json();
+      const configMap: Record<string, any> = {};
+
+      for (const [key, val] of Object.entries(data)) {
+        if (val && typeof val === 'object' && Object.keys(val).length > 0) {
+          const configKey = key === 'mastodon' ? 'ticker' : key;
+          configMap[configKey] = val;
         }
-      } catch (e) {
-        console.error(`Load config ${key} failed:`, e);
       }
-    }));
 
-    // 更新 ConfigContext
-    if (Object.keys(configMap).length > 0) {
-      initConfig(configMap);
+      if (Object.keys(configMap).length > 0) {
+        initConfig(configMap);
+      }
+    } catch (e) {
+      console.error('Load configs failed:', e);
     }
   }, [initConfig]);
 
   // 初始化数据
-  const initData = useCallback(async () => {
+  const initData = useCallback(async (unlockedCats?: Set<string>) => {
     if (initialized.current) return;
     initialized.current = true;
 
@@ -102,19 +99,17 @@ export function useDataSync() {
 
     // 2. 并行从云端获取最新数据
     const [cloud] = await Promise.all([
-      loadFromCloud(),
+      loadFromCloud(unlockedCats),
       loadConfigsFromCloud(),
     ]);
 
     if (cloud) {
-      // 云端有数据，用云端数据覆盖
       let cats = cloud.categories || [];
       if (cats.length > 0 && !cats.some((c: Category) => c.id === 'common')) {
         cats = [{ id: 'common', name: '常用推荐', icon: 'Star' }, ...cats];
       }
       initLinks(cloud.links || []);
       initCategories(cats);
-      // 更新 localStorage 缓存
       localStorage.setItem(STORAGE_KEYS.LOCAL_STORAGE_KEY, JSON.stringify({
         links: cloud.links || [],
         categories: cats,
diff --git a/src/index.css b/src/index.css
index e9dedc77..eb206d91 100644
--- a/src/index.css
+++ b/src/index.css
@@ -4,6 +4,7 @@
 /* 强制设置浅色模式为默认 */
 html {
   color-scheme: light;
+  scroll-behavior: smooth;
 }
 
 html.dark {
@@ -408,4 +409,54 @@ html.dark .dark\:focus\:ring-blue-500:focus {
 section[data-category-section] {
   content-visibility: auto;
   contain-intrinsic-size: auto 320px;
-}
\ No newline at end of file
+}
+
+/* ========== 移动端优化修复 ========== */
+
+/* 防止 iOS Safari 输入框自动放大 */
+input, textarea, select {
+  font-size: 16px !important;
+}
+
+/* 移动端模态框适配 */
+@media (max-width: 640px) {
+  /* 模态框容器顶部对齐，方便滚动 */
+  .fixed.inset-0.z-\[60\] {
+    align-items: flex-start !important;
+    padding-top: 1rem;
+    padding-bottom: 1rem;
+  }
+
+  /* 模态框内容最大高度 */
+  .max-w-md.max-h-\[92vh\] {
+    max-height: 95vh !important;
+  }
+}
+
+/* 确保工具栏按钮不被压缩 */
+.flex-shrink-0 {
+  flex-shrink: 0 !important;
+}
+
+/* 小屏幕下隐藏部分非必要元素 */
+@media (max-width: 480px) {
+  /* 如果天气组件太宽，可以隐藏温度文字只显示图标 */
+  .weather-display .weather-temp {
+    display: none;
+  }
+}
+
+/* iOS Safari 长按优化 - 仅触摸设备 */
+@media (hover: none) and (pointer: coarse) {
+  .link-card {
+    -webkit-user-select: none;
+    user-select: none;
+    -webkit-touch-callout: none;
+    -webkit-tap-highlight-color: transparent;
+  }
+}
+
+/*  iOS Safari 侧边栏问题，但你的布局是内部滚动，所以需要针对 main 元素 */
+main.flex-1.overflow-y-auto {
+  scroll-behavior: smooth;
+}
diff --git a/types.ts b/types.ts
index 6d36e224..3133d0a7 100644
--- a/types.ts
+++ b/types.ts
@@ -15,6 +15,7 @@ export interface LinkItem {
   customIconUrl?: string;
   edgeoneBlobUrl?: string;
   cloudflareR2Url?: string;
+  isPrivate?: boolean; // 私人书签
 }
 
 export interface Category {
@@ -60,7 +61,7 @@ export interface AIConfig {
 }
 
 // 图标获取方式类型
-export type IconSourceType = 'faviconextractor' | 'google' | 'customapi' | 'customurl' | 'upload-edgeone' | 'upload-cloudflare';
+export type IconSourceType = 'faviconextractor' | 'google' | 'customapi' | 'customurl' | 'upload-edgeone' | 'upload-cloudflare' | 'xinac';
 
 // 图标配置
 export interface IconConfig {
@@ -99,128 +100,90 @@ export interface WebsiteConfig {
 }
 
 // 搜索模式类型
-export type SearchMode = 'internal' | 'external';
+export type SearchMode = 'internal' | 'external' | 'hybrid';
 
-// 外部搜索源配置
-export interface ExternalSearchSource {
+// 搜索来源配置
+export interface SearchSourceConfig {
   id: string;
   name: string;
   url: string;
-  icon?: string;
   enabled: boolean;
-  createdAt: number;
 }
 
 // 搜索配置
 export interface SearchConfig {
   mode: SearchMode;
-  externalSources: ExternalSearchSource[];
-  selectedSource?: ExternalSearchSource | null; // 选中的搜索源
-  defaultEngine?: string; // 默认搜索引擎 ID
-  customEngineUrl?: string; // 自定义搜索引擎 URL
-  customEngineIcon?: string; // 自定义搜索引擎 Logo (URL 或 SVG 代码)
+  externalSources: SearchSourceConfig[];
+  defaultEngine?: string;
+}
+
+// 天气配置
+export interface WeatherConfig {
+  enabled: boolean;
+  city: string;
+  apiKey?: string;
+  provider?: string;
+}
+
+// Mastodon/Ticker 配置
+export interface MastodonConfig {
+  enabled: boolean;
+  instance: string;
+  account: string;
+  maxItems: number;
 }
 
-// 滚动 Ticker 来源类型
-export type TickerSource = 'mastodon' | 'memos' | 'custom';
+export type TickerSource = 'mastodon' | 'memos' | 'custom' | 'jinrishici' | 'hitokoto';
 
-// 滚动 Ticker 配置
 export interface TickerConfig {
   enabled: boolean;
   source: TickerSource;
-  // Mastodon
   mastodonInstance?: string;
   mastodonUsername?: string;
   mastodonLimit?: number;
   mastodonExcludeReplies?: boolean;
   mastodonExcludeReblogs?: boolean;
-  // Memos
   memosHost?: string;
   memosToken?: string;
-  memosLimit?: number;
   memosCreator?: string;
+  memosLimit?: number;
   memosVisibility?: 'PUBLIC' | 'PROTECTED' | 'PRIVATE';
-  // Custom
   customItems?: string[];
+  jinrishiciUrl?: string;
+  hitokotoUrl?: string;
 }
+// AI Provider 类型
+export type AIProvider = 'gemini' | 'openai' | 'claude' | 'custom';
 
-// 天气 API 类型
-export type WeatherProvider = 'jinrishici' | 'qweather' | 'openweather' | 'visualcrossing' | 'accuweather';
-
-// 天气配置
-export interface WeatherConfig {
-  enabled: boolean;
-  provider: WeatherProvider;
-  // QWeather
-  qweatherHost?: string;
-  qweatherApiKey?: string;
-  qweatherLocation?: string;
-  // OpenWeather
-  openweatherApiKey?: string;
-  openweatherCity?: string;
-  // Visual Crossing
-  visualcrossingApiKey?: string;
-  visualcrossingLocation?: string;
-  // AccuWeather
-  accuweatherApiKey?: string;
-  accuweatherLocationKey?: string;
-  // Common
-  unit?: 'celsius' | 'fahrenheit';
-}
-
-// 完全统一的应用配置（包含所有配置）
-export interface AppConfig {
-  // AI 配置
-  ai?: AIConfig;
-
-  // 网站配置
-  website?: WebsiteConfig;
-
-  // WebDAV 配置
-  webdav?: WebDavConfig;
-
-  // 搜索配置
-  search?: SearchConfig;
-
-  // 滚动 Ticker 配置
-  ticker?: TickerConfig;
-
-  // 天气配置
-  weather?: WeatherConfig;
-
-  // 图标配置
-  icon?: IconConfig;
-
-  // 视图配置
-  view?: {
-    mode: 'compact' | 'detailed'; // 用户个人视图偏好
-    defaultMode?: 'compact' | 'detailed'; // 管理员设置的默认视图模式
-  };
-
-  // 界面配置
-  ui?: {
-    showPinnedWebsites: boolean; // 是否显示置顶网站
-    darkMode?: boolean; // 深色模式偏好（可选，主要使用系统级主题）
-  };
-
-  // 其他用户偏好设置
-  preferences?: {
-    [key: string]: any;
-  };
-}
-
+// 默认分类
 export const DEFAULT_CATEGORIES: Category[] = [
-  { id: "common", name: "常用推荐", icon: "Star" },
-  { id: "tools","name":"工具","icon":"Folder","isSubcategory":false},
-  { id: "life","name":"生活工具","icon":"Target","parentId":"tools","isSubcategory":true},
-  { id: "network","name":"网络工具","icon":"Wifi","parentId":"tools","isSubcategory":true},
+  { id: 'common', name: '常用推荐', icon: 'Star' },
 ];
 
+// 初始链接数据
 export const INITIAL_LINKS: LinkItem[] = [
-  { id: 'init1', title: '博客 Blog', url: 'https://www.eallion.com/', icon: '/favicons/eallion.png', description: '大大的小蜗牛的个人生活博客', categoryId: 'common', createdAt: Date.now(), pinned: true, pinnedOrder: 0 },
-  { id: 'init2', title: 'Mastodon e5n.cc', url: 'https://e5n.cc/@eallion', icon: '/favicons/mastodon.svg', description: 'Charles Chin\'s personal Mastodon.', categoryId: 'common', createdAt: Date.now(), pinned: true, pinnedOrder: 1 },
-  { id: 'init3', title: 'Twitter 𝕏', url: 'https://x.com/eallion', icon: '/favicons/x.svg', description: 'Blaze your glory!', categoryId: 'common', createdAt: Date.now() },
-  { id: 'init4', title: 'GitHub', url: 'https://github.com/eallion', icon: '/favicons/github.svg', description: 'Build and ship software on a single, collaborative platform', categoryId: 'common', createdAt: Date.now() },
-  { id: 'init5', title: 'Cloudflare', url: 'https://dash.cloudflare.com/', icon: '/favicons/cloudflare.svg', description: 'Connect, protect, and build everywhere', categoryId: 'common', createdAt: Date.now() },
-  { id: 'init6', title: 'Vercel', url: 'https://vercel.com', icon: '/favicons/vercel.svg', description: 'Build and deploy the best web experiences with the Frontend Cloud', categoryId: 'common', createdAt: Date.now() },
+  {
+    id: '1',
+    title: '百度',
+    url: 'https://www.baidu.com',
+    icon: 'https://www.baidu.com/favicon.ico',
+    categoryId: 'common',
+    createdAt: Date.now(),
+  },
+  {
+    id: '2',
+    title: 'GitHub',
+    url: 'https://github.com',
+    icon: 'https://github.com/favicon.ico',
+    categoryId: 'common',
+    createdAt: Date.now(),
+  },
+  {
+    id: '3',
+    title: 'Google',
+    url: 'https://www.google.com',
+    icon: 'https://www.google.com/favicon.ico',
+    categoryId: 'common',
+    createdAt: Date.now(),
+  },
 ];