function menavExtractDomain(url) {
    if (!url) return '';

    try {
        // 移除协议部分 (http://, https://, etc.)
        let domain = String(url).replace(/^[a-zA-Z]+:\/\//, '');

        // 移除路径、查询参数和锚点
        domain = domain.split('/')[0].split('?')[0].split('#')[0];

        // 移除端口号（如果有）
        domain = domain.split(':')[0];

        return domain;
    } catch (e) {
        return String(url);
    }
}

// 修复移动端 `100vh` 视口高度问题：用实际可视高度驱动布局，避免侧边栏/内容区底部被浏览器 UI 遮挡
function menavUpdateAppHeight() {
    const viewportHeight = window.visualViewport ? window.visualViewport.height : window.innerHeight;
    document.documentElement.style.setProperty('--app-height', `${Math.round(viewportHeight)}px`);
}

menavUpdateAppHeight();
window.addEventListener('resize', menavUpdateAppHeight);
if (window.visualViewport) {
    window.visualViewport.addEventListener('resize', menavUpdateAppHeight);
}

// 配置数据缓存：避免浏览器扩展/站点脚本频繁 JSON.parse
let menavConfigCacheReady = false;
let menavConfigCacheRaw = null;
let menavConfigCacheValue = null;

// 全局MeNav对象 - 用于浏览器扩展
window.MeNav = {
    version: "1.0.0",

    // 获取配置数据
    getConfig: function(options) {
        const configData = document.getElementById('menav-config-data');
        if (!configData) return null;

        const raw = configData.textContent || '';
        if (!menavConfigCacheReady || menavConfigCacheRaw !== raw) {
            menavConfigCacheValue = JSON.parse(raw);
            menavConfigCacheRaw = raw;
            menavConfigCacheReady = true;
        }

        if (options && options.clone) {
            if (typeof structuredClone === 'function') {
                return structuredClone(menavConfigCacheValue);
            }
            return JSON.parse(JSON.stringify(menavConfigCacheValue));
        }

        return menavConfigCacheValue;
    },

    // 获取元素的唯一标识符
    _getElementId: function(element) {
        const type = element.getAttribute('data-type');
        if (type === 'nav-item') {
            return element.getAttribute('data-id');
        } else if (type === 'social-link') {
            return element.getAttribute('data-url');
        } else {
            return element.getAttribute('data-name');
        }
    },

    // 根据类型和ID查找元素
    _findElement: function(type, id) {
        let selector;
        if (type === 'nav-item') {
            selector = `[data-type="${type}"][data-id="${id}"]`;
        } else if (type === 'social-link') {
            selector = `[data-type="${type}"][data-url="${id}"]`;
        } else {
            selector = `[data-type="${type}"][data-name="${id}"]`;
        }
        return document.querySelector(selector);
    },

    // 更新DOM元素
    updateElement: function(type, id, newData) {
        const element = this._findElement(type, id);
        if (!element) return false;

        if (type === 'site') {
            // 更新站点卡片
            if (newData.url) {
                element.href = newData.url;
                element.setAttribute('data-url', newData.url);
            }
            if (newData.name) {
                element.querySelector('h3').textContent = newData.name;
                element.setAttribute('data-name', newData.name);
            }
            if (newData.description) {
                element.querySelector('p').textContent = newData.description;
                element.setAttribute('data-description', newData.description);
            }
            if (newData.icon) {
                const iconElement =
                    element.querySelector('i.icon-fallback') ||
                    element.querySelector('i.site-icon') ||
                    element.querySelector('.site-card-icon i') ||
                    element.querySelector('i');

                if (iconElement) {
                    const nextIconClass = String(newData.icon || '').trim();
                    const preservedClasses = [];

                    if (iconElement.classList.contains('icon-fallback')) {
                        preservedClasses.push('icon-fallback');
                    }
                    if (iconElement.classList.contains('site-icon')) {
                        preservedClasses.push('site-icon');
                    }

                    if (nextIconClass) {
                        iconElement.className = nextIconClass;
                        preservedClasses.forEach(cls => iconElement.classList.add(cls));
                    }
                }
                element.setAttribute('data-icon', newData.icon);
            }
            if (newData.title) element.title = newData.title;

            // 触发元素更新事件
            this.events.emit('elementUpdated', {
                id: id,
                type: 'site',
                data: newData
            });

            return true;
        } else if (type === 'category') {
            // 更新分类
            if (newData.name) {
                const titleElement = element.querySelector('h2');
                if (titleElement) {
                    // 保留图标
                    const iconElement = titleElement.querySelector('i');
                    const iconClass = iconElement ? iconElement.className : '';
                    titleElement.innerHTML = `<i class="${newData.icon || iconClass}"></i> ${newData.name}`;
                }
                element.setAttribute('data-name', newData.name);
            }
            if (newData.icon) {
                element.setAttribute('data-icon', newData.icon);
            }

            // 触发元素更新事件
            this.events.emit('elementUpdated', {
                id: id,
                type: 'category',
                data: newData
            });

            return true;
        } else if (type === 'nav-item') {
            // 更新导航项
            if (newData.name) {
                const textElement = element.querySelector('.nav-text');
                if (textElement) {
                    textElement.textContent = newData.name;
                }
                element.setAttribute('data-name', newData.name);
            }
            if (newData.icon) {
                const iconElement = element.querySelector('i');
                if (iconElement) {
                    iconElement.className = newData.icon;
                }
                element.setAttribute('data-icon', newData.icon);
            }

            // 触发元素更新事件
            this.events.emit('elementUpdated', {
                id: id,
                type: 'nav-item',
                data: newData
            });

            return true;
        } else if (type === 'social-link') {
            // 更新社交链接
            if (newData.url) {
                element.href = newData.url;
                element.setAttribute('data-url', newData.url);
            }
            if (newData.name) {
                const textElement = element.querySelector('.nav-text');
                if (textElement) {
                    textElement.textContent = newData.name;
                }
                element.setAttribute('data-name', newData.name);
            }
            if (newData.icon) {
                const iconElement = element.querySelector('i');
                if (iconElement) {
                    iconElement.className = newData.icon;
                }
                element.setAttribute('data-icon', newData.icon);
            }

            // 触发元素更新事件
            this.events.emit('elementUpdated', {
                id: id,
                type: 'social-link',
                data: newData
            });

            return true;
        }

        return false;
    },

    // 添加新元素
    addElement: function(type, parentId, data) {
        let parent;
        
        if (type === 'site') {
            // 查找父级分类
            parent = document.querySelector(`[data-type="category"][data-name="${parentId}"]`);
            if (!parent) return null;

            // 添加站点卡片到分类
            const sitesGrid = parent.querySelector('[data-container="sites"]');
            if (!sitesGrid) return null;

            // 站点卡片样式：根据“页面模板”决定（friends/articles/projects 等）
            let siteCardStyle = '';
            try {
                const pageEl = parent.closest('.page');
                const pageId = pageEl && pageEl.id ? String(pageEl.id) : '';
                let templateName = pageId;

                const cfg =
                    window.MeNav && typeof window.MeNav.getConfig === 'function'
                        ? window.MeNav.getConfig()
                        : null;
                const pageConfig = cfg && cfg.data && pageId ? cfg.data[pageId] : null;
                if (pageConfig && pageConfig.template) {
                    templateName = String(pageConfig.template);
                }

                // projects 模板使用代码仓库风格卡片（与生成端 templates/components/site-card.hbs 保持一致）
                if (templateName === 'projects') siteCardStyle = 'repo';
            } catch (e) {
                siteCardStyle = '';
            }

            // 创建新的站点卡片
            const newSite = document.createElement('a');
            newSite.className = siteCardStyle ? `site-card site-card-${siteCardStyle}` : 'site-card';

	            const siteName = data.name || '未命名站点';
	            const siteUrl = data.url || '#';
	            const siteIcon = data.icon || 'fas fa-link';
	            const siteDescription = data.description || (data.url ? menavExtractDomain(data.url) : '');
	            const siteFaviconUrl = data && data.faviconUrl ? String(data.faviconUrl).trim() : '';
	            const siteForceIconModeRaw = data && data.forceIconMode ? String(data.forceIconMode).trim() : '';
	            const siteForceIconMode =
	                siteForceIconModeRaw === 'manual' || siteForceIconModeRaw === 'favicon'
	                    ? siteForceIconModeRaw
	                    : '';

            newSite.href = siteUrl;
            newSite.title = siteName + (siteDescription ? ' - ' + siteDescription : '');
            if (/^https?:\/\//i.test(siteUrl)) {
                newSite.target = '_blank';
                newSite.rel = 'noopener';
            }
            
            // 设置数据属性
            newSite.setAttribute('data-type', 'site');
            newSite.setAttribute('data-name', siteName);
	            newSite.setAttribute('data-url', data.url || '');
	            newSite.setAttribute('data-icon', siteIcon);
	            if (siteFaviconUrl) newSite.setAttribute('data-favicon-url', siteFaviconUrl);
	            if (siteForceIconMode) newSite.setAttribute('data-force-icon-mode', siteForceIconMode);
	            newSite.setAttribute('data-description', siteDescription);

            // projects repo 风格：与模板中的 repo 结构保持一致（不走 favicon 逻辑）
            if (siteCardStyle === 'repo') {
                const repoHeader = document.createElement('div');
                repoHeader.className = 'repo-header';

                const repoIcon = document.createElement('i');
                repoIcon.className = `${siteIcon || 'fas fa-code'} repo-icon`;
                repoIcon.setAttribute('aria-hidden', 'true');

                const repoTitle = document.createElement('div');
                repoTitle.className = 'repo-title';
                repoTitle.textContent = siteName;

                repoHeader.appendChild(repoIcon);
                repoHeader.appendChild(repoTitle);

                const repoDesc = document.createElement('div');
                repoDesc.className = 'repo-desc';
                repoDesc.textContent = siteDescription;

                newSite.appendChild(repoHeader);
                newSite.appendChild(repoDesc);

                const hasStats =
                    data &&
                    (data.language ||
                        data.stars ||
                        data.forks ||
                        data.issues);

                if (hasStats) {
                    const repoStats = document.createElement('div');
                    repoStats.className = 'repo-stats';

                    if (data.language) {
                        const languageItem = document.createElement('div');
                        languageItem.className = 'stat-item';

                        const langDot = document.createElement('span');
                        langDot.className = 'lang-dot';
                        langDot.style.backgroundColor = data.languageColor || '#909296';

                        languageItem.appendChild(langDot);
                        languageItem.appendChild(document.createTextNode(String(data.language)));
                        repoStats.appendChild(languageItem);
                    }

                    if (data.stars) {
                        const starsItem = document.createElement('div');
                        starsItem.className = 'stat-item';

                        const starIcon = document.createElement('i');
                        starIcon.className = 'far fa-star';
                        starIcon.setAttribute('aria-hidden', 'true');
                        starsItem.appendChild(starIcon);
                        starsItem.appendChild(document.createTextNode(` ${data.stars}`));
                        repoStats.appendChild(starsItem);
                    }

                    if (data.forks) {
                        const forksItem = document.createElement('div');
                        forksItem.className = 'stat-item';

                        const forkIcon = document.createElement('i');
                        forkIcon.className = 'fas fa-code-branch';
                        forkIcon.setAttribute('aria-hidden', 'true');
                        forksItem.appendChild(forkIcon);
                        forksItem.appendChild(document.createTextNode(` ${data.forks}`));
                        repoStats.appendChild(forksItem);
                    }

                    if (data.issues) {
                        const issuesItem = document.createElement('div');
                        issuesItem.className = 'stat-item';

                        const issueIcon = document.createElement('i');
                        issueIcon.className = 'fas fa-exclamation-circle';
                        issueIcon.setAttribute('aria-hidden', 'true');
                        issuesItem.appendChild(issueIcon);
                        issuesItem.appendChild(document.createTextNode(` ${data.issues}`));
                        repoStats.appendChild(issuesItem);
                    }

                    newSite.appendChild(repoStats);
                }
            } else {
                // 添加内容（根据图标模式渲染，避免 innerHTML 注入）
                const iconWrapper = document.createElement('div');
                iconWrapper.className = 'site-card-icon';
                iconWrapper.setAttribute('aria-hidden', 'true');

                const contentWrapper = document.createElement('div');
                contentWrapper.className = 'site-card-content';

                const titleEl = document.createElement('h3');
                titleEl.textContent = siteName;

                const descEl = document.createElement('p');
                descEl.textContent = siteDescription;

                contentWrapper.appendChild(titleEl);
                contentWrapper.appendChild(descEl);

                let iconsMode = 'favicon';
                try {
                    const cfg =
                        window.MeNav && typeof window.MeNav.getConfig === 'function'
                            ? window.MeNav.getConfig()
                            : null;
                    iconsMode = (cfg && (cfg.data?.icons?.mode || cfg.icons?.mode)) || 'favicon';
                } catch (e) {
                    iconsMode = 'favicon';
                }

	                const shouldUseCustomFavicon = Boolean(siteFaviconUrl);
	                const effectiveIconsMode = siteForceIconMode || iconsMode;

	                if (shouldUseCustomFavicon) {
	                    const iconContainer = document.createElement('div');
	                    iconContainer.className = 'icon-container';

	                    const placeholder = document.createElement('i');
	                    placeholder.className = 'fas fa-circle-notch fa-spin icon-placeholder';
	                    placeholder.setAttribute('aria-hidden', 'true');

	                    const fallback = document.createElement('i');
	                    fallback.className = `${siteIcon} icon-fallback`;
	                    fallback.setAttribute('aria-hidden', 'true');

	                    const favicon = document.createElement('img');
	                    favicon.className = 'favicon-icon';
	                    favicon.src = siteFaviconUrl;
	                    favicon.alt = `${siteName} favicon`;
	                    favicon.loading = 'lazy';
	                    favicon.addEventListener('load', () => {
	                        favicon.classList.add('loaded');
	                        placeholder.classList.add('hidden');
	                    });
	                    favicon.addEventListener('error', () => {
	                        favicon.classList.add('error');
	                        placeholder.classList.add('hidden');
	                        fallback.classList.add('visible');
	                    });

	                    iconContainer.appendChild(placeholder);
	                    iconContainer.appendChild(favicon);
	                    iconContainer.appendChild(fallback);
	                    iconWrapper.appendChild(iconContainer);
	                } else if (effectiveIconsMode === 'favicon' && siteUrl && /^https?:\/\//i.test(siteUrl)) {
	                    const faviconUrlPrimary = `https://t3.gstatic.com/faviconV2?client=SOCIAL&type=FAVICON&fallback_opts=TYPE,SIZE,URL&url=${encodeURIComponent(siteUrl)}&size=32`;
	                    const faviconUrlFallback = `https://t3.gstatic.cn/faviconV2?client=SOCIAL&type=FAVICON&fallback_opts=TYPE,SIZE,URL&url=${encodeURIComponent(siteUrl)}&size=32`;

	                    const iconContainer = document.createElement('div');
	                    iconContainer.className = 'icon-container';

                    const placeholder = document.createElement('i');
                    placeholder.className = 'fas fa-circle-notch fa-spin icon-placeholder';
                    placeholder.setAttribute('aria-hidden', 'true');

                    const fallback = document.createElement('i');
                    fallback.className = `${siteIcon} icon-fallback`;
                    fallback.setAttribute('aria-hidden', 'true');

                    const favicon = document.createElement('img');
                    favicon.className = 'favicon-icon';
                    favicon.src = faviconUrlPrimary;
                    favicon.alt = `${siteName} favicon`;
	                    favicon.loading = 'lazy';
	                    let faviconFallbackTried = false;
                    favicon.addEventListener('load', () => {
                        favicon.classList.add('loaded');
                        placeholder.classList.add('hidden');
                    });
                    favicon.addEventListener('error', () => {
                        if (!faviconFallbackTried) {
                            faviconFallbackTried = true;
                            favicon.src = faviconUrlFallback;
                            return;
                        }

                        favicon.classList.add('error');
                        placeholder.classList.add('hidden');
                        fallback.classList.add('visible');
                    });

                    iconContainer.appendChild(placeholder);
                    iconContainer.appendChild(favicon);
	                    iconContainer.appendChild(fallback);
	                    iconWrapper.appendChild(iconContainer);
	                } else {
	                    const iconEl = document.createElement('i');
	                    iconEl.className = `${siteIcon} site-icon`;
	                    iconEl.setAttribute('aria-hidden', 'true');
	                    iconWrapper.appendChild(iconEl);
	                }

                newSite.appendChild(iconWrapper);
                newSite.appendChild(contentWrapper);
            }

            // 添加到DOM
            sitesGrid.appendChild(newSite);

            

            // 移除"暂无网站"提示（如果存在）
            const emptyMessage = sitesGrid.querySelector('.empty-sites');
            if (emptyMessage) {
                emptyMessage.remove();
            }

            // 触发元素添加事件
            this.events.emit('elementAdded', {
                id: siteName,
                type: 'site',
                parentId: parentId,
                data: data
            });

            return siteName;
        } else if (type === 'category') {
            // 查找父级页面容器
            parent = document.querySelector(`[data-container="categories"]`);
            if (!parent) return null;

            // 创建新的分类
            const newCategory = document.createElement('section');
            newCategory.className = 'category';
            
            // 设置数据属性
            newCategory.setAttribute('data-type', 'category');
            newCategory.setAttribute('data-name', data.name || '未命名分类');
            newCategory.setAttribute('data-icon', data.icon || 'fas fa-folder');
            newCategory.setAttribute('data-container', 'categories');

            // 添加内容
            newCategory.innerHTML = `
                <h2 data-editable="category-name"><i class="${data.icon || 'fas fa-folder'}"></i> ${data.name || '未命名分类'}</h2>
                <div class="sites-grid" data-container="sites">
                    <p class="empty-sites">暂无网站</p>
                </div>
            `;

            // 添加到DOM
            parent.appendChild(newCategory);

            // 触发元素添加事件
            this.events.emit('elementAdded', {
                id: data.name,
                type: 'category',
                data: data
            });

            return data.name;
        }

        return null;
    },

    // 删除元素
    removeElement: function(type, id) {
        const element = this._findElement(type, id);
        if (!element) return false;

        // 获取父级容器（如果是站点卡片）
        let parentId = null;
        if (type === 'site') {
            const categoryElement = element.closest('[data-type="category"]');
            if (categoryElement) {
                parentId = categoryElement.getAttribute('data-name');
            }
        }

        // 删除元素
        element.remove();

        // 触发元素删除事件
        this.events.emit('elementRemoved', {
            id: id,
            type: type,
            parentId: parentId
        });

        return true;
    },

    // 获取所有元素
    getAllElements: function(type) {
        return Array.from(document.querySelectorAll(`[data-type="${type}"]`)).map(el => {
            const id = this._getElementId(el);
            return {
                id: id,
                type: type,
                element: el
            };
        });
    },

    // 事件系统
    events: {
        listeners: {},

        // 添加事件监听器
        on: function(event, callback) {
            if (!this.listeners[event]) {
                this.listeners[event] = [];
            }
            this.listeners[event].push(callback);
            return this;
        },

        // 触发事件
        emit: function(event, data) {
            if (this.listeners[event]) {
                this.listeners[event].forEach(callback => callback(data));
            }
            return this;
        },

        // 移除事件监听器
        off: function(event, callback) {
            if (this.listeners[event]) {
                if (callback) {
                    this.listeners[event] = this.listeners[event].filter(cb => cb !== callback);
                } else {
                    delete this.listeners[event];
                }
            }
            return this;
        }
    }
};

// 多层级嵌套书签功能
function getCollapsibleNestedContainers(root) {
    if (!root) return [];
    const headers = root.querySelectorAll(
        '.category > .category-header[data-toggle="category"], .group > .group-header[data-toggle="group"]'
    );
    return Array.from(headers).map(header => header.parentElement).filter(Boolean);
}

function isNestedContainerCollapsible(container) {
    if (!container) return false;

    if (container.classList.contains('category')) {
        return Boolean(container.querySelector(':scope > .category-header[data-toggle="category"]'));
    }

    if (container.classList.contains('group')) {
        return Boolean(container.querySelector(':scope > .group-header[data-toggle="group"]'));
    }

    return false;
}

window.MeNav.expandAll = function() {
    const activePage = document.querySelector('.page.active');
    if (activePage) {
        getCollapsibleNestedContainers(activePage).forEach(element => {
            element.classList.remove('collapsed');
            saveToggleState(element, 'expanded');
        });
    }
};

window.MeNav.collapseAll = function() {
    const activePage = document.querySelector('.page.active');
    if (activePage) {
        getCollapsibleNestedContainers(activePage).forEach(element => {
            element.classList.add('collapsed');
            saveToggleState(element, 'collapsed');
        });
    }
};

// 智能切换分类展开/收起状态
window.MeNav.toggleCategories = function() {
    const activePage = document.querySelector('.page.active');
    if (!activePage) return;
    
    const allElements = getCollapsibleNestedContainers(activePage);
    const collapsedElements = allElements.filter(element => element.classList.contains('collapsed'));
    if (allElements.length === 0) return;
    
    // 如果收起的数量 >= 总数的一半，执行展开；否则执行收起
    if (collapsedElements.length >= allElements.length / 2) {
        window.MeNav.expandAll();
        updateCategoryToggleIcon('up');
    } else {
        window.MeNav.collapseAll();
        updateCategoryToggleIcon('down');
    }
};

// 更新分类切换按钮图标
function updateCategoryToggleIcon(state) {
    const toggleBtn = document.getElementById('category-toggle');
    if (!toggleBtn) return;
    
    const icon = toggleBtn.querySelector('i');
    if (!icon) return;
    
    if (state === 'up') {
        icon.className = 'fas fa-angle-double-up';
        toggleBtn.setAttribute('aria-label', '收起分类');
    } else {
        icon.className = 'fas fa-angle-double-down';
        toggleBtn.setAttribute('aria-label', '展开分类');
    }
}

window.MeNav.toggleCategory = function(categoryName, subcategoryName = null, groupName = null, subgroupName = null) {
    let selector = `[data-name="${categoryName}"]`;

    if (subcategoryName) selector += ` [data-name="${subcategoryName}"]`;
    if (groupName) selector += ` [data-name="${groupName}"]`;
    if (subgroupName) selector += ` [data-name="${subgroupName}"]`;

    const element = document.querySelector(selector);
    if (element) {
        toggleNestedElement(element);
    }
};

window.MeNav.getNestedStructure = function() {
    // 返回完整的嵌套结构数据
    const categories = [];
    document.querySelectorAll('.category-level-1').forEach(cat => {
        categories.push(extractNestedData(cat));
    });
    return categories;
};

// 切换嵌套元素
function toggleNestedElement(container) {
    if (!isNestedContainerCollapsible(container)) return;
    const isCollapsed = container.classList.contains('collapsed');
    
    if (isCollapsed) {
        container.classList.remove('collapsed');
        saveToggleState(container, 'expanded');
    } else {
        container.classList.add('collapsed');
        saveToggleState(container, 'collapsed');
    }
    
    // 触发自定义事件
    const event = new CustomEvent('nestedToggle', {
        detail: {
            element: container,
            type: container.dataset.type,
            name: container.dataset.name,
            isCollapsed: !isCollapsed
        }
    });
    document.dispatchEvent(event);
}

// 保存切换状态
function saveToggleState(element, state) {
    const type = element.dataset.type;
    const name = element.dataset.name;
    const level = element.dataset.level || '1';
    const key = `menav-toggle-${type}-${level}-${name}`;
    localStorage.setItem(key, state);
}

// 恢复切换状态
function restoreToggleState(element) {
    const type = element.dataset.type;
    const name = element.dataset.name;
    const level = element.dataset.level || '1';
    const key = `menav-toggle-${type}-${level}-${name}`;
    const savedState = localStorage.getItem(key);
    
    if (savedState === 'collapsed') {
        element.classList.add('collapsed');
    }
}

// 初始化嵌套分类
function initializeNestedCategories() {
    // 为所有可折叠元素添加切换功能
    document.querySelectorAll('[data-toggle="category"], [data-toggle="group"]').forEach(header => {
        header.addEventListener('click', function(e) {
            e.stopPropagation();
            const container = this.parentElement;
            toggleNestedElement(container);
        });
        
        // 恢复保存的状态
        restoreToggleState(header.parentElement);
    });
}

// 提取嵌套数据
function extractNestedData(element) {
    const data = {
        name: element.dataset.name,
        type: element.dataset.type,
        level: element.dataset.level,
        isCollapsed: element.classList.contains('collapsed')
    };
    
    // 提取子元素数据
    const subcategories = element.querySelectorAll(':scope > .category-content > .subcategories-container > .category');
    if (subcategories.length > 0) {
        data.subcategories = Array.from(subcategories).map(sub => extractNestedData(sub));
    }
    
    const groups = element.querySelectorAll(':scope > .category-content > .groups-container > .group');
    if (groups.length > 0) {
        data.groups = Array.from(groups).map(group => extractNestedData(group));
    }

    const subgroups = element.querySelectorAll(':scope > .group-content > .subgroups-container > .group');
    if (subgroups.length > 0) {
        data.subgroups = Array.from(subgroups).map(subgroup => extractNestedData(subgroup));
    }
    
    const sites = element.querySelectorAll(':scope > .category-content > .sites-grid > .site-card, :scope > .group-content > .sites-grid > .site-card');
    if (sites.length > 0) {
        data.sites = Array.from(sites).map(site => ({
            name: site.dataset.name,
            url: site.dataset.url,
            icon: site.dataset.icon,
            description: site.dataset.description
        }));
    }
    
    return data;
}

document.addEventListener('DOMContentLoaded', () => {
    // 先声明所有状态变量
    let isSearchActive = false;
    // 首页不再固定为 "home"：以导航顺序第一项为准
    const homePageId = (() => {
        // 1) 优先从生成端注入的配置数据读取（保持与实际导航顺序一致）
        try {
            const config = window.MeNav && typeof window.MeNav.getConfig === 'function'
                ? window.MeNav.getConfig()
                : null;
            const injectedHomePageId = config && config.data && config.data.homePageId
                ? String(config.data.homePageId).trim()
                : '';
            if (injectedHomePageId) return injectedHomePageId;
            const nav = config && config.data && Array.isArray(config.data.navigation)
                ? config.data.navigation
                : null;
            const firstId = nav && nav[0] && nav[0].id ? String(nav[0].id).trim() : '';
            if (firstId) return firstId;
        } catch (error) {
            // 忽略解析错误，继续使用 DOM 推断
        }

        // 2) 回退到 DOM：取首个导航项的 data-page
        const firstNavItem = document.querySelector('.nav-item[data-page]');
        if (firstNavItem) {
            const id = String(firstNavItem.getAttribute('data-page') || '').trim();
            if (id) return id;
        }

        // 3) 最后兜底：取首个页面容器 id
        const firstPage = document.querySelector('.page[id]');
        if (firstPage && firstPage.id) return firstPage.id;

        return 'home';
    })();

    let currentPageId = homePageId;
    let isInitialLoad = true;
    let isSidebarOpen = false;
    let isSearchOpen = false;
    let isLightTheme = false; // 主题状态
    let isSidebarCollapsed = false; // 侧边栏折叠状态
    let pages; // 页面元素的全局引用
	    let currentSearchEngine = 'local'; // 当前选择的搜索引擎

    // 搜索索引，用于提高搜索效率
    let searchIndex = {
        initialized: false,
        items: []
    };

		    // 搜索引擎配置
		    const searchEngines = {
	        local: {
	            name: '本地搜索',
	            iconSvg: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 48 48" focusable="false"><path fill="#616161" d="M29.171,32.001L32,29.172l12.001,12l-2.828,2.828L29.171,32.001z"></path><path fill="#616161" d="M36,20c0,8.837-7.163,16-16,16S4,28.837,4,20S11.163,4,20,4S36,11.163,36,20"></path><path fill="#37474f" d="M32.476,35.307l2.828-2.828l8.693,8.693L41.17,44L32.476,35.307z"></path><path fill="#64b5f6" d="M7,20c0-7.18,5.82-13,13-13s13,5.82,13,13s-5.82,13-13,13S7,27.18,7,20"></path></svg>`,
	            url: null // 本地搜索不需要URL
	        },
	        google: {
	            name: 'Google搜索',
	            iconSvg: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 48 48" focusable="false"><path fill="#FFC107" d="M43.611,20.083H42V20H24v8h11.303c-1.649,4.657-6.08,8-11.303,8c-6.627,0-12-5.373-12-12c0-6.627,5.373-12,12-12c3.059,0,5.842,1.154,7.961,3.039l5.657-5.657C34.046,6.053,29.268,4,24,4C12.955,4,4,12.955,4,24c0,11.045,8.955,20,20,20c11.045,0,20-8.955,20-20C44,22.659,43.862,21.35,43.611,20.083z"></path><path fill="#FF3D00" d="M6.306,14.691l6.571,4.819C14.655,15.108,18.961,12,24,12c3.059,0,5.842,1.154,7.961,3.039l5.657-5.657C34.046,6.053,29.268,4,24,4C16.318,4,9.656,8.337,6.306,14.691z"></path><path fill="#4CAF50" d="M24,44c5.166,0,9.86-1.977,13.409-5.192l-6.19-5.238C29.211,35.091,26.715,36,24,36c-5.202,0-9.619-3.317-11.283-7.946l-6.522,5.025C9.505,39.556,16.227,44,24,44z"></path><path fill="#1976D2" d="M43.611,20.083H42V20H24v8h11.303c-0.792,2.237-2.231,4.166-4.087,5.571c0.001-0.001,0.002-0.001,0.003-0.002l6.19,5.238C36.971,39.205,44,34,44,24C44,22.659,43.862,21.35,43.611,20.083z"></path></svg>`,
	            url: 'https://www.google.com/search?q='
	        },
	        bing: {
	            name: 'Bing搜索',
	            iconSvg: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" focusable="false"><g fill="#2877fb" fill-rule="nonzero" stroke="none" stroke-width="1" stroke-linecap="butt" stroke-linejoin="miter" stroke-miterlimit="10" stroke-dasharray="" stroke-dashoffset="0" font-family="none" font-weight="none" font-size="none" text-anchor="none" style="mix-blend-mode: normal"><g transform="scale(5.12,5.12)"><path d="M45,26.10156v-5.10156c0,-0.89844 -0.60156,-1.69922 -1.39844,-1.89844l-4.60156,-1.40234c-5.30078,-1.59766 -10.30078,-3 -15.60156,-4.69922h-0.09766c-0.80078,-0.19922 -1.60156,0.69922 -1.19922,1.5c1.89844,3.89844 3.89844,9.5 3.89844,9.5l6.69922,2.60156c-0.30078,0 -21.69922,11.39844 -21.69922,11.39844l9,-8v-23c0,-0.89844 -0.60156,-1.80078 -1.39844,-2c0,0 -4.90234,-1.89844 -8,-2.89844c-0.20312,-0.10156 -0.40234,-0.10156 -0.60156,-0.10156c-0.39844,0 -0.80078,0.10156 -1.19922,0.39844c-0.5,0.40234 -0.80078,1 -0.80078,1.60156v34.69922c0,0.69922 0.30078,1.30078 0.89844,1.60156c2.10156,1.5 4.30078,3 6.40234,4.5l3,2.09766c0.30078,0.20313 0.69922,0.40234 1.09766,0.40234c0.40234,0 0.70313,-0.10156 1,-0.30078c4.30078,-2.60156 8.70313,-5.19922 13,-7.80078l10.60156,-6.30078c0.60156,-0.39844 1,-1 1,-1.69922z"></path></g></g></svg>`,
	            url: 'https://www.bing.com/search?q='
	        },
	        duckduckgo: {
	            name: 'DuckDuckGo搜索',
	            shortName: 'duckgo',
	            // DuckDuckGo 使用内联 SVG，避免依赖不存在的 Font Awesome 品牌图标
	            iconSvg: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="4 4 40 40" focusable="false"><path fill="#ff3d00" d="M44,24c0,11-9,20-20,20S4,35,4,24S13,4,24,4S44,13,44,24z"></path><path fill="#fff" d="M26,16.2c-0.6-0.6-1.5-0.9-2.5-1.1c-0.4-0.5-1-1-1.9-1.5c-1.6-0.8-3.5-1.2-5.3-0.9h-0.4 c-0.1,0-0.2,0.1-0.4,0.1c0.2,0,1,0.4,1.6,0.6c-0.3,0.2-0.8,0.2-1.1,0.4c0,0,0,0-0.1,0L15.7,14c-0.1,0.2-0.2,0.4-0.2,0.5 c1.3-0.1,3.2,0,4.6,0.4C19,15,18,15.3,17.3,15.7c-0.5,0.3-1,0.6-1.3,1.1c-1.2,1.3-1.7,3.5-1.3,5.9c0.5,2.7,2.4,11.4,3.4,16.3 l0.3,1.6c0,0,3.5,0.4,5.6,0.4c1.2,0,3.2,0.3,3.7-0.2c-0.1,0-0.6-0.6-0.8-1.1c-0.5-1-1-1.9-1.4-2.6c-1.2-2.5-2.5-5.9-1.9-8.1 c0.1-0.4,0.1-2.1,0.4-2.3c2.6-1.7,2.4-0.1,3.5-0.8c0.5-0.4,1-0.9,1.2-1.5C29.4,22.1,27.8,18,26,16.2z"></path><path fill="#fff" d="M24,42c-9.9,0-18-8.1-18-18c0-9.9,8.1-18,18-18c9.9,0,18,8.1,18,18C42,33.9,33.9,42,24,42z M24,8 C15.2,8,8,15.2,8,24s7.2,16,16,16s16-7.2,16-16S32.8,8,24,8z"></path><path fill="#0277bd" d="M19,21.1c-0.6,0-1.2,0.5-1.2,1.2c0,0.6,0.5,1.2,1.2,1.2c0.6,0,1.2-0.5,1.2-1.2 C20.1,21.7,19.6,21.1,19,21.1z M19.5,22.2c-0.2,0-0.3-0.1-0.3-0.3c0-0.2,0.1-0.3,0.3-0.3s0.3,0.1,0.3,0.3 C19.8,22.1,19.6,22.2,19.5,22.2z M26.8,20.6c-0.6,0-1,0.5-1,1c0,0.6,0.5,1,1,1c0.6,0,1-0.5,1-1S27.3,20.6,26.8,20.6z M27.2,21.5 c-0.1,0-0.3-0.1-0.3-0.3c0-0.1,0.1-0.3,0.3-0.3c0.1,0,0.3,0.1,0.3,0.3S27.4,21.5,27.2,21.5z M19.3,18.9c0,0-0.9-0.4-1.7,0.1 c-0.9,0.5-0.8,1.1-0.8,1.1s-0.5-1,0.8-1.5C18.7,18.1,19.3,18.9,19.3,18.9 M27.4,18.8c0,0-0.6-0.4-1.1-0.4c-1,0-1.3,0.5-1.3,0.5 s0.2-1.1,1.5-0.9C27.1,18.2,27.4,18.8,27.4,18.8"></path><path fill="#8bc34a" d="M23.3,35.7c0,0-4.3-2.3-4.4-1.4c-0.1,0.9,0,4.7,0.5,5s4.1-1.9,4.1-1.9L23.3,35.7z M25,35.6 c0,0,2.9-2.2,3.6-2.1c0.6,0.1,0.8,4.7,0.2,4.9c-0.6,0.2-3.9-1.2-3.9-1.2L25,35.6z"></path><path fill="#689f38" d="M22.5,35.7c0,1.5-0.2,2.1,0.4,2.3c0.6,0.1,1.9,0,2.3-0.3c0.4-0.3,0.1-2.2-0.1-2.6 C25,34.8,22.5,35.1,22.5,35.7"></path><path fill="#ffca28" d="M22.3,26.8c0.1-0.7,2-2.1,3.3-2.2c1.3-0.1,1.7-0.1,2.8-0.3c1.1-0.3,3.9-1,4.7-1.3 c0.8-0.4,4.1,0.2,1.8,1.5c-1,0.6-3.7,1.6-5.7,2.2c-1.9,0.6-3.1-0.6-3.8,0.4c-0.5,0.8-0.1,1.8,2.2,2c3.1,0.3,6.2-1.4,6.5-0.5 c0.3,0.9-2.7,2-4.6,2.1c-1.8,0-5.6-1.2-6.1-1.6C22.9,28.7,22.2,27.8,22.3,26.8"></path></svg>`,
	            url: 'https://duckduckgo.com/?q='
	        }
	    };

    // 获取DOM元素 - 基本元素
    const searchInput = document.getElementById('search');
    const searchBox = document.querySelector('.search-box');
    const searchResultsPage = document.getElementById('search-results');
    const searchSections = searchResultsPage.querySelectorAll('.search-section');

    // 搜索引擎相关元素
    const searchEngineToggle = document.querySelector('.search-engine-toggle');
    const searchEngineToggleIcon = searchEngineToggle
        ? searchEngineToggle.querySelector('.search-engine-icon')
        : null;
    const searchEngineToggleLabel = searchEngineToggle
        ? searchEngineToggle.querySelector('.search-engine-label')
        : null;
    const searchEngineDropdown = document.querySelector('.search-engine-dropdown');
    const searchEngineOptions = document.querySelectorAll('.search-engine-option');

    // 移动端元素
    const menuToggle = document.querySelector('.menu-toggle');
    const searchToggle = document.querySelector('.search-toggle');
    const sidebar = document.querySelector('.sidebar');
    const searchContainer = document.querySelector('.search-container');
    const overlay = document.querySelector('.overlay');

    // 侧边栏折叠功能
    const sidebarToggle = document.querySelector('.sidebar-toggle');
    const content = document.querySelector('.content');

    // 主题切换元素
    const themeToggle = document.querySelector('.theme-toggle');
    const themeIcon = themeToggle.querySelector('i');

    // 滚动进度条元素
    const scrollProgress = document.querySelector('.scroll-progress');

    // 移除预加载类，允许CSS过渡效果
    document.documentElement.classList.remove('preload');

    // 应用从localStorage读取的主题设置
    if (document.documentElement.classList.contains('theme-preload')) {
        document.documentElement.classList.remove('theme-preload');
        document.body.classList.add('light-theme');
        isLightTheme = true;
    }

    // 应用从localStorage读取的侧边栏状态
    if (document.documentElement.classList.contains('sidebar-collapsed-preload')) {
        document.documentElement.classList.remove('sidebar-collapsed-preload');
        sidebar.classList.add('collapsed');
        content.classList.add('expanded');
        isSidebarCollapsed = true;
    }

    // 即时移除loading类，确保侧边栏可见
    document.body.classList.remove('loading');
    document.body.classList.add('loaded');

    // 侧边栏折叠功能
    function toggleSidebarCollapse() {
        // 仅在交互时启用布局相关动画，避免首屏闪烁
        document.documentElement.classList.add('with-anim');

        isSidebarCollapsed = !isSidebarCollapsed;

        // 使用 requestAnimationFrame 确保平滑过渡
        requestAnimationFrame(() => {
            sidebar.classList.toggle('collapsed', isSidebarCollapsed);
            content.classList.toggle('expanded', isSidebarCollapsed);

            // 保存折叠状态到localStorage
            localStorage.setItem('sidebarCollapsed', isSidebarCollapsed ? 'true' : 'false');
        });
    }

    // 初始化侧边栏折叠状态 - 已在页面加载前处理，此处仅完成图标状态初始化等次要任务
    function initSidebarState() {
        // 从localStorage获取侧边栏状态
        const savedState = localStorage.getItem('sidebarCollapsed');

        // 图标状态与折叠状态保持一致
        if (savedState === 'true' && !isMobile()) {
            isSidebarCollapsed = true;
        } else {
            isSidebarCollapsed = false;
        }
    }

    // 侧边栏折叠按钮点击事件
    if (sidebarToggle) {
        sidebarToggle.addEventListener('click', toggleSidebarCollapse);
    }

    // 主题切换功能
    function toggleTheme() {
        isLightTheme = !isLightTheme;
        document.body.classList.toggle('light-theme', isLightTheme);

        // 更新图标
        if (isLightTheme) {
            themeIcon.classList.remove('fa-moon');
            themeIcon.classList.add('fa-sun');
        } else {
            themeIcon.classList.remove('fa-sun');
            themeIcon.classList.add('fa-moon');
        }

        // 保存主题偏好到localStorage
        localStorage.setItem('theme', isLightTheme ? 'light' : 'dark');
    }

    // 初始化主题 - 已在页面加载前处理，此处仅完成图标状态初始化等次要任务
    function initTheme() {
        // 从localStorage获取主题偏好
        const savedTheme = localStorage.getItem('theme');

        // 更新图标状态以匹配当前主题
        if (savedTheme === 'light') {
            isLightTheme = true;
            themeIcon.classList.remove('fa-moon');
            themeIcon.classList.add('fa-sun');
        } else {
            isLightTheme = false;
            themeIcon.classList.remove('fa-sun');
            themeIcon.classList.add('fa-moon');
        }
    }

    // 主题切换按钮点击事件
    themeToggle.addEventListener('click', toggleTheme);

    // 初始化搜索索引
    function initSearchIndex() {
        if (searchIndex.initialized) return;

        searchIndex.items = [];

        try {
            // 为每个页面创建索引
            if (!pages) {
                pages = document.querySelectorAll('.page');
            }

            pages.forEach(page => {
                if (page.id === 'search-results') return;

                const pageId = page.id;

                page.querySelectorAll('.site-card').forEach(card => {
                    try {
                        // 排除“扩展写回影子结构”等不应参与搜索的卡片
                        if (card.closest('[data-search-exclude="true"]')) return;

                        // 兼容不同页面/卡片样式：优先取可见文本，其次回退到 data-*（确保 projects repo 卡片也能被搜索）
                        const dataTitle = card.dataset?.name || card.getAttribute('data-name') || '';
                        const dataDescription = card.dataset?.description || card.getAttribute('data-description') || '';

                        const titleText =
                            card.querySelector('h3')?.textContent ||
                            card.querySelector('.repo-title')?.textContent ||
                            dataTitle;
                        const descriptionText =
                            card.querySelector('p')?.textContent ||
                            card.querySelector('.repo-desc')?.textContent ||
                            dataDescription;

                        const title = String(titleText || '').toLowerCase();
                        const description = String(descriptionText || '').toLowerCase();
                        const url = card.href || card.getAttribute('href') || '#';
                        const icon = card.querySelector('i.icon-fallback')?.className || card.querySelector('i')?.className || '';

                        // 将卡片信息添加到索引中
                        searchIndex.items.push({
                            pageId,
                            title,
                            description,
                            url,
                            icon,
                            element: card,
                            // 预先计算搜索文本，提高搜索效率
                            searchText: (title + ' ' + description).toLowerCase()
                        });
                    } catch (cardError) {
                        console.error('Error processing card:', cardError);
                    }
                });
            });

            searchIndex.initialized = true;
        } catch (error) {
            console.error('Error initializing search index:', error);
            searchIndex.initialized = true; // 防止反复尝试初始化
        }
    }

    // 移动端菜单切换
    function toggleSidebar() {
        isSidebarOpen = !isSidebarOpen;
        sidebar.classList.toggle('active', isSidebarOpen);
        overlay.classList.toggle('active', isSidebarOpen);
        if (isSearchOpen) {
            toggleSearch();
        }
    }

    // 移动端搜索切换
    function toggleSearch() {
        isSearchOpen = !isSearchOpen;
        searchContainer.classList.toggle('active', isSearchOpen);
        overlay.classList.toggle('active', isSearchOpen);
        if (isSearchOpen) {
            searchInput.focus();
            if (isSidebarOpen) {
                toggleSidebar();
            }
        }
    }

    // 关闭所有移动端面板
    function closeAllPanels() {
        if (isSidebarOpen) {
            toggleSidebar();
        }
        if (isSearchOpen) {
            toggleSearch();
        }
    }

    // 移动端事件监听
    menuToggle.addEventListener('click', toggleSidebar);
    searchToggle.addEventListener('click', toggleSearch);
    overlay.addEventListener('click', closeAllPanels);

    // 全局快捷键：Ctrl/Cmd + K 聚焦搜索
    document.addEventListener('keydown', e => {
        const key = (e.key || '').toLowerCase();
        if (key !== 'k') return;
        if ((!e.ctrlKey && !e.metaKey) || e.altKey) return;

        const target = e.target;
        const isTypingTarget =
            target &&
            (target.tagName === 'INPUT' || target.tagName === 'TEXTAREA' || target.isContentEditable);

        if (isTypingTarget && target !== searchInput) return;

        e.preventDefault();

        if (isMobile() && !isSearchOpen) {
            toggleSearch();
        }

        searchInput && searchInput.focus();
    });

    // 检查是否是移动设备
    function isMobile() {
        return window.innerWidth <= 768;
    }

    // 窗口大小改变时处理
    window.addEventListener('resize', () => {
        if (!isMobile()) {
            sidebar.classList.remove('active');
            searchContainer.classList.remove('active');
            overlay.classList.remove('active');
            isSidebarOpen = false;
            isSearchOpen = false;
        } else {
            // 在移动设备下，重置侧边栏折叠状态
            sidebar.classList.remove('collapsed');
            content.classList.remove('expanded');
        }

        // 重新计算滚动进度
        updateScrollProgress();
    });

    // 更新滚动进度条
    function updateScrollProgress() {
        const scrollTop = content.scrollTop || 0;
        const scrollHeight = content.scrollHeight - content.clientHeight || 1;
        const scrollPercent = (scrollTop / scrollHeight) * 100;
        scrollProgress.style.width = scrollPercent + '%';
    }

    // 监听内容区域的滚动事件
    content.addEventListener('scroll', updateScrollProgress);

    // 初始化时更新一次滚动进度
    updateScrollProgress();

    // 页面切换功能
    function showPage(pageId, skipSearchReset = false) {
        if (currentPageId === pageId && !skipSearchReset && !isInitialLoad) return;

        currentPageId = pageId;

        // 使用 RAF 确保动画流畅
        requestAnimationFrame(() => {
            if (!pages) {
                pages = document.querySelectorAll('.page');
            }

            pages.forEach(page => {
                const shouldBeActive = page.id === pageId;
                if (shouldBeActive !== page.classList.contains('active')) {
                    page.classList.toggle('active', shouldBeActive);
                }
            });

            // 初始加载完成后设置标志
            if (isInitialLoad) {
                isInitialLoad = false;
                document.body.classList.add('loaded');
            }
        });

        // 重置滚动位置并更新进度条
        content.scrollTop = 0;
        updateScrollProgress();

        // 只有在非搜索状态下才重置搜索
        if (!skipSearchReset) {
            searchInput.value = '';
            resetSearch();
        }
    }

    // 搜索功能
    function performSearch(searchTerm) {
        // 确保搜索索引已初始化
        if (!searchIndex.initialized) {
            initSearchIndex();
        }

        searchTerm = searchTerm.toLowerCase().trim();

        // 如果搜索框为空，重置所有内容
        if (!searchTerm) {
            resetSearch();
            return;
        }

        if (!isSearchActive) {
            isSearchActive = true;
        }

        try {
            // 使用搜索索引进行搜索
            const searchResults = new Map();
            let hasResults = false;

            // 使用更高效的搜索算法
            const matchedItems = searchIndex.items.filter(item => {
                return item.searchText.includes(searchTerm) || PinyinMatch.match(item.searchText, searchTerm);;
            });

            // 按页面分组结果
            matchedItems.forEach(item => {
                if (!searchResults.has(item.pageId)) {
                    searchResults.set(item.pageId, []);
                }
                // 克隆元素以避免修改原始DOM
                searchResults.get(item.pageId).push(item.element.cloneNode(true));
                hasResults = true;
            });

            // 使用requestAnimationFrame批量更新DOM，减少重排重绘
            requestAnimationFrame(() => {
                try {
                    // 清空并隐藏所有搜索区域
                    searchSections.forEach(section => {
                        try {
                            const grid = section.querySelector('.sites-grid');
                            if (grid) {
                                grid.innerHTML = ''; // 使用innerHTML清空，比removeChild更高效
                            }
                            section.style.display = 'none';
                        } catch (sectionError) {
                            console.error('Error clearing search section');
                        }
                    });

                    // 使用DocumentFragment批量添加DOM元素，减少重排
                    searchResults.forEach((matches, pageId) => {
                        const section = searchResultsPage.querySelector(`[data-section="${pageId}"]`);
                        if (section) {
                            try {
                                const grid = section.querySelector('.sites-grid');
                                if (grid) {
                                    const fragment = document.createDocumentFragment();

                                    matches.forEach(card => {
                                        // 高亮匹配文本
                                        highlightSearchTerm(card, searchTerm);
                                        fragment.appendChild(card);
                                    });

                                    grid.appendChild(fragment);
                                    section.style.display = 'block';
                                }
                            } catch (gridError) {
                                console.error('Error updating search results grid');
                            }
                        }
                    });

                    // 更新搜索结果页面状态
                    const subtitle = searchResultsPage.querySelector('.subtitle');
                    if (subtitle) {
                        subtitle.textContent = hasResults
                            ? `在所有页面中找到 ${matchedItems.length} 个匹配项`
                            : '未找到匹配的结果';
                    }

                    // 显示搜索结果页面
                    if (currentPageId !== 'search-results') {
                        currentPageId = 'search-results';
                        pages.forEach(page => {
                            page.classList.toggle('active', page.id === 'search-results');
                        });
                    }

                    // 更新搜索状态样式
                    searchBox.classList.toggle('has-results', hasResults);
                    searchBox.classList.toggle('no-results', !hasResults);
                } catch (uiError) {
                    console.error('Error updating search UI');
                }
            });
        } catch (searchError) {
            console.error('Error performing search');
        }
    }

    // 高亮搜索匹配文本
    function highlightSearchTerm(card, searchTerm) {
        if (!card || !searchTerm) return;

        try {
            // 兼容 projects repo 卡片：title/desc 不一定是 h3/p
            const titleElement = card.querySelector('h3') || card.querySelector('.repo-title');
            const descriptionElement = card.querySelector('p') || card.querySelector('.repo-desc');

            const hasPinyinMatch = typeof PinyinMatch !== 'undefined' && PinyinMatch && typeof PinyinMatch.match === 'function';

            const applyRangeHighlight = (element, start, end) => {
                const text = element.textContent || '';
                const safeStart = Math.max(0, Math.min(text.length, start));
                const safeEnd = Math.max(safeStart, Math.min(text.length - 1, end));

                const fragment = document.createDocumentFragment();
                fragment.appendChild(document.createTextNode(text.slice(0, safeStart)));

                const span = document.createElement('span');
                span.className = 'highlight';
                span.textContent = text.slice(safeStart, safeEnd + 1);
                fragment.appendChild(span);

                fragment.appendChild(document.createTextNode(text.slice(safeEnd + 1)));

                while (element.firstChild) {
                    element.removeChild(element.firstChild);
                }
                element.appendChild(fragment);
            };

            const highlightInElement = element => {
                if (!element) return;

                const rawText = element.textContent || '';
                const lowerText = rawText.toLowerCase();
                if (!rawText) return;

                if (lowerText.includes(searchTerm)) {
                    const regex = new RegExp(`(${escapeRegExp(searchTerm)})`, 'gi');
                    const fragment = document.createDocumentFragment();
                    let lastIndex = 0;
                    let match;

                    while ((match = regex.exec(rawText)) !== null) {
                        if (match.index > lastIndex) {
                            fragment.appendChild(document.createTextNode(rawText.substring(lastIndex, match.index)));
                        }

                        const span = document.createElement('span');
                        span.className = 'highlight';
                        span.textContent = match[0];
                        fragment.appendChild(span);

                        lastIndex = match.index + match[0].length;

                        // 防止无限循环
                        if (regex.lastIndex === 0) break;
                    }

                    if (lastIndex < rawText.length) {
                        fragment.appendChild(document.createTextNode(rawText.substring(lastIndex)));
                    }

                    while (element.firstChild) {
                        element.removeChild(element.firstChild);
                    }
                    element.appendChild(fragment);
                    return;
                }

                if (hasPinyinMatch) {
                    const arr = PinyinMatch.match(rawText, searchTerm);
                    if (Array.isArray(arr) && arr.length >= 2) {
                        const [start, end] = arr;
                        applyRangeHighlight(element, start, end);
                    }
                }
            };

            highlightInElement(titleElement);
            highlightInElement(descriptionElement);
        } catch (error) {
            console.error('Error highlighting search term');
        }
    }

    // 转义正则表达式特殊字符
    function escapeRegExp(string) {
        return string.replace(/[.*+?^${}()|[\]\\]/g, '\\$&');
    }

    // 重置搜索状态
    function resetSearch() {
        if (!isSearchActive) return;

        isSearchActive = false;

        try {
            requestAnimationFrame(() => {
                try {
                    // 清空搜索结果
                    searchSections.forEach(section => {
                        try {
                            const grid = section.querySelector('.sites-grid');
                            if (grid) {
                                while (grid.firstChild) {
                                    grid.removeChild(grid.firstChild);
                                }
                            }
                            section.style.display = 'none';
                        } catch (sectionError) {
                            console.error('Error clearing search section');
                        }
                    });

                    // 移除搜索状态样式
                    searchBox.classList.remove('has-results', 'no-results');

                    // 恢复到当前激活的页面
                    const currentActiveNav = document.querySelector('.nav-item.active');
                    if (currentActiveNav) {
                        const targetPageId = currentActiveNav.getAttribute('data-page');

                        if (targetPageId && currentPageId !== targetPageId) {
                            currentPageId = targetPageId;
                            pages.forEach(page => {
                                page.classList.toggle('active', page.id === targetPageId);
                            });
                        }
                    } else {
                        // 如果没有激活的导航项，默认显示首页
                        currentPageId = homePageId;
                        pages.forEach(page => {
                            page.classList.toggle('active', page.id === homePageId);
                        });
                    }
                } catch (resetError) {
                    console.error('Error resetting search UI');
                }
            });
        } catch (error) {
            console.error('Error in resetSearch');
        }
    }

    // 搜索输入事件（使用防抖）
    const debounce = (fn, delay) => {
        let timer = null;
        return (...args) => {
            if (timer) clearTimeout(timer);
            timer = setTimeout(() => {
                fn.apply(this, args);
                timer = null;
            }, delay);
        };
    };

    const debouncedSearch = debounce(performSearch, 300);

    searchInput.addEventListener('input', (e) => {
        // 只有在选择了本地搜索时，才在输入时实时显示本地搜索结果
        if (currentSearchEngine === 'local') {
            debouncedSearch(e.target.value);
        } else {
            // 对于非本地搜索，重置之前的本地搜索结果（如果有）
            if (isSearchActive) {
                resetSearch();
            }
        }
    });

    // 初始化搜索引擎设置
    function initSearchEngine() {
        // 从本地存储获取上次选择的搜索引擎
        const savedEngine = localStorage.getItem('searchEngine');
        if (savedEngine && searchEngines[savedEngine]) {
            currentSearchEngine = savedEngine;
        }

        // 设置当前搜索引擎的激活状态及图标
        updateSearchEngineUI();

        // 初始化搜索引擎下拉菜单事件
        const toggleEngineDropdown = () => {
            if (!searchEngineDropdown) return;
            const next = !searchEngineDropdown.classList.contains('active');
            searchEngineDropdown.classList.toggle('active', next);
            if (searchBox) {
                searchBox.classList.toggle('dropdown-open', next);
            }
            if (searchEngineToggle) {
                searchEngineToggle.setAttribute('aria-expanded', String(next));
            }
        };

        if (searchEngineToggle) {
            searchEngineToggle.addEventListener('click', (e) => {
                e.stopPropagation();
                toggleEngineDropdown();
            });

            // 键盘可访问性：Enter/Space 触发
            searchEngineToggle.addEventListener('keydown', (e) => {
                if (e.key === 'Enter' || e.key === ' ') {
                    e.preventDefault();
                    e.stopPropagation();
                    toggleEngineDropdown();
                }
            });
        }

        // 点击搜索引擎选项
        searchEngineOptions.forEach(option => {
            // 初始化激活状态
            if (option.getAttribute('data-engine') === currentSearchEngine) {
                option.classList.add('active');
            }

            option.addEventListener('click', (e) => {
                e.stopPropagation();

                // 获取选中的搜索引擎
                const engine = option.getAttribute('data-engine');

                // 更新当前搜索引擎
                if (engine && searchEngines[engine]) {
                    // 如果搜索引擎变更，且之前有活跃的本地搜索结果，重置搜索状态
                    if (currentSearchEngine !== engine && isSearchActive) {
                        resetSearch();
                    }

                    currentSearchEngine = engine;
                    localStorage.setItem('searchEngine', engine);

                    // 更新UI显示
                    updateSearchEngineUI();

                    // 关闭下拉菜单
                    if (searchEngineDropdown) {
                        searchEngineDropdown.classList.remove('active');
                    }
                    if (searchBox) {
                        searchBox.classList.remove('dropdown-open');
                    }
                }
            });
        });

        // 点击页面其他位置关闭下拉菜单
        document.addEventListener('click', () => {
            if (!searchEngineDropdown) return;
            searchEngineDropdown.classList.remove('active');
            if (searchBox) {
                searchBox.classList.remove('dropdown-open');
            }
        });
    }

    // 更新搜索引擎UI显示
    function updateSearchEngineUI() {
        // 移除所有选项的激活状态
        searchEngineOptions.forEach(option => {
            option.classList.remove('active');

            // 如果是当前选中的搜索引擎，添加激活状态
            if (option.getAttribute('data-engine') === currentSearchEngine) {
                option.classList.add('active');
            }
        });

        // 更新搜索引擎按钮（方案B：前缀按钮显示当前引擎）
        const engine = searchEngines[currentSearchEngine];
        if (!engine) return;
        const displayName = engine.shortName || engine.name.replace(/搜索$/, '');

        if (searchEngineToggleIcon) {
            if (engine.iconSvg) {
                searchEngineToggleIcon.className = 'search-engine-icon search-engine-icon-svg';
                searchEngineToggleIcon.innerHTML = engine.iconSvg;
            } else {
                searchEngineToggleIcon.innerHTML = '';
                searchEngineToggleIcon.className = `search-engine-icon ${engine.icon}`;
            }
        }
        if (searchEngineToggleLabel) {
            searchEngineToggleLabel.textContent = displayName;
        }
        if (searchEngineToggle) {
            searchEngineToggle.setAttribute('aria-label', `当前搜索引擎：${engine.name}，点击切换`);
        }
    }

    // 执行搜索（根据选择的搜索引擎）
    function executeSearch(searchTerm) {
        if (!searchTerm.trim()) return;

        // 根据当前搜索引擎执行搜索
        if (currentSearchEngine === 'local') {
            // 执行本地搜索
            performSearch(searchTerm);
        } else {
            // 使用外部搜索引擎
            const engine = searchEngines[currentSearchEngine];
            if (engine && engine.url) {
                // 打开新窗口进行搜索
                window.open(engine.url + encodeURIComponent(searchTerm), '_blank');
            }
        }
    }

    // 搜索框事件处理
    searchInput.addEventListener('keyup', (e) => {
        if (e.key === 'Escape') {
            searchInput.value = '';
            resetSearch();
        } else if (e.key === 'Enter') {
            executeSearch(searchInput.value);
            // 在移动设备上，执行搜索后自动关闭搜索面板
            if (isMobile() && isSearchOpen) {
                closeAllPanels();
            }
        }
    });

    // 阻止搜索框的回车默认行为
    searchInput.addEventListener('keydown', (e) => {
        if (e.key === 'Enter') {
            e.preventDefault();
        }
    });

    // 初始化
    window.addEventListener('load', () => {
        // 获取可能在HTML生成后才存在的DOM元素
        const siteCards = document.querySelectorAll('.site-card');
        const categories = document.querySelectorAll('.category');
        const navItems = document.querySelectorAll('.nav-item');
        const navItemWrappers = document.querySelectorAll('.nav-item-wrapper');
        const submenuItems = document.querySelectorAll('.submenu-item');
        pages = document.querySelectorAll('.page');

        // 初始化主题
        initTheme();

        // 初始化侧边栏状态
        initSidebarState();

        // 初始化搜索引擎选择
        initSearchEngine();

        // 初始化MeNav对象版本信息
        try {
            const config = window.MeNav.getConfig();
            if (config && config.version) {
                window.MeNav.version = config.version;
                console.log('MeNav API initialized with version:', config.version);
            }
        } catch (error) {
            console.error('Error initializing MeNav API:', error);
        }

        // 立即执行初始化，不再使用requestAnimationFrame延迟
        // 显示首页
        showPage(homePageId);

        // 添加载入动画
        categories.forEach((category, index) => {
            setTimeout(() => {
                category.style.opacity = '1';
            }, index * 100);
        });

        // 初始展开当前页面的子菜单：高亮项如果有子菜单，需要同步展开
        document.querySelectorAll('.nav-item.active').forEach(activeItem => {
            const activeWrapper = activeItem.closest('.nav-item-wrapper');
            if (!activeWrapper) return;

            const hasSubmenu = activeWrapper.querySelector('.submenu');
            if (hasSubmenu) {
                activeWrapper.classList.add('expanded');
            }
        });

        // 导航项点击效果
        navItems.forEach(item => {
            item.addEventListener('click', (e) => {
                if (item.getAttribute('target') === '_blank') return;

                e.preventDefault();

                // 获取当前项的父级wrapper
                const wrapper = item.closest('.nav-item-wrapper');
                const hasSubmenu = wrapper && wrapper.querySelector('.submenu');

                // 处理子菜单展开/折叠
                if (hasSubmenu) {
                    // 如果点击的导航项已经激活且有子菜单，则切换子菜单展开状态
                    if (item.classList.contains('active')) {
                        wrapper.classList.toggle('expanded');
                    } else {
                        // 关闭所有已展开的子菜单
                        navItemWrappers.forEach(navWrapper => {
                            if (navWrapper !== wrapper) {
                                navWrapper.classList.remove('expanded');
                            }
                        });

                        // 展开当前子菜单
                        wrapper.classList.add('expanded');
                    }
                }

                // 激活导航项
                navItems.forEach(nav => {
                    nav.classList.toggle('active', nav === item);
                });

                const pageId = item.getAttribute('data-page');
                if (pageId) {
                    showPage(pageId);

                    // 在移动端视图下点击导航项后自动收起侧边栏
                    if (isMobile() && isSidebarOpen && !hasSubmenu) {
                        closeAllPanels();
                    }
                }
            });
        });

        // 子菜单项点击效果
        submenuItems.forEach(item => {
            item.addEventListener('click', (e) => {
                e.preventDefault();

                // 获取页面ID和分类名称
                const pageId = item.getAttribute('data-page');
                const categoryName = item.getAttribute('data-category');

                if (pageId) {
                    // 清除所有子菜单项的激活状态
                    submenuItems.forEach(subItem => {
                        subItem.classList.remove('active');
                    });

                    // 激活当前子菜单项
                    item.classList.add('active');

                    // 激活相应的导航项
                    navItems.forEach(nav => {
                        nav.classList.toggle('active', nav.getAttribute('data-page') === pageId);
                    });

                    // 显示对应页面
                    showPage(pageId);

                    // 等待页面切换完成后滚动到对应分类
                    setTimeout(() => {
                        // 查找目标分类元素
                        const targetPage = document.getElementById(pageId);
                        if (targetPage) {
                            const targetCategory = Array.from(targetPage.querySelectorAll('.category h2')).find(
                                heading => heading.textContent.trim().includes(categoryName)
                            );

                            if (targetCategory) {
                                // 优化的滚动实现：滚动到使目标分类位于视口1/4处（更靠近顶部位置）
                                try {
                                    // 直接获取所需元素和属性，减少重复查询
                                    const contentElement = document.querySelector('.content');

                                    if (contentElement && contentElement.scrollHeight > contentElement.clientHeight) {
                                        // 获取目标元素相对于内容区域的位置
                                        const rect = targetCategory.getBoundingClientRect();
                                        const containerRect = contentElement.getBoundingClientRect();

                                        // 计算目标应该在视口中的位置（视口高度的1/4处）
                                        const desiredPosition = containerRect.height / 4;

                                        // 计算需要滚动的位置
                                        const scrollPosition = contentElement.scrollTop + rect.top - containerRect.top - desiredPosition;

                                        // 执行滚动
                                        contentElement.scrollTo({
                                            top: scrollPosition,
                                            behavior: 'smooth'
                                        });
                                    } else {
                                        // 回退到基本滚动方式
                                        targetCategory.scrollIntoView({ behavior: 'smooth', block: 'center' });
                                    }
                                } catch (error) {
                                    console.error('Error during scroll:', error);
                                    // 回退到基本滚动方式
                                    targetCategory.scrollIntoView({ behavior: 'smooth', block: 'center' });
                                }
                            }
                        }
                    }, 25); // 延迟时间

                    // 在移动端视图下点击子菜单项后自动收起侧边栏
                    if (isMobile() && isSidebarOpen) {
                        closeAllPanels();
                    }
                }
            });
        });

	        // 初始化嵌套分类功能
	        initializeNestedCategories();
	        
	        // 初始化分类切换按钮
	        const categoryToggleBtn = document.getElementById('category-toggle');
        if (categoryToggleBtn) {
            categoryToggleBtn.addEventListener('click', function() {
                window.MeNav.toggleCategories();
            });
        } else {
            console.error('Category toggle button not found');
        }
        
        // 初始化搜索索引（使用requestIdleCallback或setTimeout延迟初始化，避免影响页面加载）
        if ('requestIdleCallback' in window) {
            requestIdleCallback(() => initSearchIndex());
        } else {
            setTimeout(initSearchIndex, 1000);
        }
    });
});