/* ==========================================
           🎨 极简顶部导航栏
           ========================================== */
        body, html { margin: 0; padding: 0; width: 100%; height: 100%; overflow: hidden; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif; }
        
        .custom-navbar {
            height: 50px; background-color: #ffffff; border-bottom: 1px solid #e5e7eb;
            display: flex; align-items: center; padding: 0 16px; box-sizing: border-box;
            user-select: none; position: relative; z-index: 2000; gap: 16px;
        }

        .btn-menu { font-size: 20px; cursor: pointer; padding: 4px 10px; border-radius: 6px; transition: background 0.2s; color: #374151; }
        .btn-menu:hover { background-color: #f3f4f6; }

        .btn-save { font-size: 18px; cursor: pointer; padding: 6px 10px; border-radius: 6px; transition: background 0.2s; color: #374151; }
        .btn-save:hover { background-color: #f3f4f6; }

        /* ✨ 修改：将 file 渲染成可点击的强引导按钮 */
        .btn-file-center { 
            font-size: 14px; color: #111; font-weight: 600; cursor: pointer; 
            padding: 6px 12px; border-radius: 6px; background-color: #f3f4f6; transition: background 0.2s;
            display: flex; align-items: center; gap: 6px; border: 1px solid #e5e7eb;
        }
        .btn-file-center:hover { background-color: #e5e7eb; }

        .doc-title-input { 
            font-size: 16px; font-weight: 600; color: #111; border: 1px solid transparent; 
            padding: 4px 8px; border-radius: 4px; outline: none; transition: border 0.2s, background 0.2s; width: 200px;
        }
        .doc-title-input:hover { background-color: #f3f4f6; }
        .doc-title-input:focus { border: 1px solid #3b82f6; background-color: #fff; }

        .status-text { font-size: 12px; color: #059669; font-weight: 500; margin-left: auto; }

        /* ==========================================
           🗂️ 巨型下拉菜单 (保持不变)
           ========================================== */
        .mega-menu {
            position: absolute; top: 50px; left: 0; background: #ffffff; border-bottom: 1px solid #e5e7eb;
            border-right: 1px solid #e5e7eb; box-shadow: 4px 10px 15px -3px rgba(0, 0, 0, 0.1);
            display: none; z-index: 1999; height: 450px; width: 500px;
        }
        .mega-menu.active { display: flex; }
        .menu-left { width: 200px; background-color: #f9fafb; border-right: 1px solid #e5e7eb; display: flex; flex-direction: column; padding: 10px 0; }
        .menu-item { padding: 10px 20px; font-size: 14px; color: #374151; cursor: pointer; transition: background 0.2s; display: flex; align-items: center; gap: 8px; }
        .menu-item:hover { background-color: #e5e7eb; color: #111; font-weight: 500; }
        .menu-divider { height: 1px; background-color: #d1d5db; margin: 8px 16px; }
        .menu-bottom-dock { margin-top: auto; }
        .menu-right { flex-grow: 1; padding: 20px; background-color: #ffffff; overflow-y: auto; }
        .recent-title { font-size: 12px; color: #6b7280; font-weight: bold; margin-bottom: 12px; }
        .recent-list { list-style: none; padding: 0; margin: 0; }
        .recent-item { display: flex; justify-content: space-between; align-items: center; padding: 8px 12px; border-radius: 6px; cursor: pointer; transition: background 0.2s; }
        .recent-item:hover { background-color: #f3f4f6; }
        .filename { font-size: 14px; color: #111; display: flex; align-items: center; gap: 6px; }
        .filedate { font-size: 12px; color: #9ca3af; }

        /* ==========================================
           📂 80% 居中覆盖：文件大厅弹窗 (核心新增)
           ========================================== */
        .modal-overlay {
            position: fixed; top: 0; left: 0; width: 100vw; height: 100vh;
            background: rgba(0, 0, 0, 0.4); /* 半透明黑底遮罩 */
            backdrop-filter: blur(2px); /* 极其克制的毛玻璃效果 */
            z-index: 3000; /* 必须是全场最高，盖住所有东西 */
            display: none; /* 默认隐藏 */
            justify-content: center; align-items: center;
            opacity: 0; transition: opacity 0.2s; /* 增加呼吸感动画 */
        }
        .modal-overlay.active {
            display: flex; opacity: 1;
        }
        .modal-content {
            width: 80%; height: 80%; background: #ffffff; border-radius: 12px;
            box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25);
            display: flex; flex-direction: column; overflow: hidden;
            transform: scale(0.95); transition: transform 0.2s;
        }
        .modal-overlay.active .modal-content { transform: scale(1); }

        /* 弹窗顶部栏 */
        .modal-header {
            height: 50px; border-bottom: 1px solid #e5e7eb; display: flex;
            justify-content: space-between; align-items: center; padding: 0 20px;
        }
        .modal-title { font-size: 16px; font-weight: bold; color: #111; }
        .btn-close { font-size: 24px; color: #6b7280; cursor: pointer; transition: color 0.2s; }
        .btn-close:hover { color: #ef4444; }

        /* 弹窗主体 25/75 左右分栏 */
        .modal-body {
            display: flex; flex: 1; height: calc(100% - 50px);
        }
        
        /* 左侧标签列表 (25%) */
        .modal-sidebar {
            width: 25%; background: #f9fafb; border-right: 1px solid #e5e7eb;
            padding: 16px; overflow-y: auto;
        }
        .tag-item {
            padding: 10px 12px; margin-bottom: 4px; border-radius: 6px; cursor: pointer;
            font-size: 14px; color: #374151; display: flex; align-items: center; gap: 8px;
        }
        .tag-item:hover { background-color: #e5e7eb; }
        .tag-item.active { background-color: #e0f2fe; color: #0369a1; font-weight: bold; } /* 选中的蓝色风格 */

        /* 右侧文件列表 (75%) */
        .modal-main {
            width: 75%; background: #ffffff; padding: 24px; overflow-y: auto;
        }
        /* 卡片式文件列表 */
        .file-grid {
            display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 16px;
        }
        .file-card {
            border: 1px solid #e5e7eb; border-radius: 8px; padding: 16px; cursor: pointer;
            transition: transform 0.2s, box-shadow 0.2s;
        }
        .file-card:hover { transform: translateY(-2px); box-shadow: 0 10px 15px -3px rgba(0,0,0,0.05); border-color: #d1d5db; }
        .file-card-icon { font-size: 32px; margin-bottom: 8px; }
        .file-card-name { font-size: 14px; font-weight: 600; color: #111; margin-bottom: 4px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
        .file-card-time { font-size: 12px; color: #9ca3af; }


        /* ==========================================
           📊 Luckysheet 容器
           ========================================== */
        #luckysheet-workspace {
            position: absolute; top: 50px; left: 0; width: 100%; height: calc(100% - 50px);
        }