/* ============================================================
   设计令牌 · Design Tokens
   视觉主题：高级磨砂玻璃（Frosted Glass）+ 商务专业感
   规则：导航/工具/浮层 = 玻璃；正文内容区 = 实底（保证 WCAG AA 对比度）
   ============================================================ */
:root{
  /* — 表面 Surface — */
  --bg:#eaeef6; --bg2:#fff;
  --sidebar:#fff; --card:#fff; --card2:#f2f4f9;
  --bd:#e3e7ef; --bd2:#eef0f6;

  /* — 文字 Text（均满足 4.5:1 以上对比度） — */
  --txt:#1a1f2b; --mut:#5b6371; --light:#858d9c;

  /* — 品牌 Brand — */
  --pri:#3370ff; --pri2:#5b8cff; --pri-weak:#e8f0ff;
  --accent:#8a5bff;

  /* — 语义 Semantic — */
  --ok:#0ea472; --warn:#d97706; --err:#e5484d;
  --ok-weak:rgba(14,164,114,.12); --err-weak:rgba(229,72,77,.12); --warn-weak:rgba(217,119,6,.12);

  /* — 形状与阴影 Shape & Elevation — */
  --radius:8px; --radius-md:12px; --radius-lg:16px; --radius-xl:22px;
  --shadow:0 4px 20px rgba(17,24,39,.08);

  /* — 磨砂玻璃 Glass — */
  --glass:rgba(255,255,255,.72);        /* 主玻璃面：侧栏、顶栏、浮层 */
  --glass-soft:rgba(255,255,255,.55);   /* 次级玻璃：工具条、分组容器 */
  --glass-thin:rgba(255,255,255,.38);   /* 轻玻璃：行悬停、标签底 */
  --glass-bd:rgba(255,255,255,.72);     /* 玻璃亮描边（模拟折射边缘） */
  --glass-line:rgba(15,23,42,.07);      /* 玻璃分隔线 */
  --glass-hl:rgba(255,255,255,.9);      /* 顶部高光 */
  --blur:18px; --blur-sm:10px; --blur-lg:30px;
  --shadow-glass:0 8px 32px rgba(15,23,42,.10),0 1px 2px rgba(15,23,42,.05);
  --shadow-lift:0 12px 28px -8px rgba(15,23,42,.18);
  --shadow-float:0 24px 56px -14px rgba(15,23,42,.30);

  /* — 环境光斑（玻璃需要有可模糊的底层才成立） — */
  --amb1:rgba(51,112,255,.16); --amb2:rgba(138,91,255,.13); --amb3:rgba(14,164,114,.10);

  /* — 动效 Motion — */
  --ease:cubic-bezier(.16,1,.3,1);
  --t-fast:.15s; --t:.25s;
}
.dark{
  --bg:#0a0e1a; --bg2:#141a2c;
  --sidebar:#111628; --card:#18203a; --card2:#1e2740;
  --bd:#2b3454; --bd2:#232b47;
  --txt:#e9ecf5; --mut:#a6aec4; --light:#767f97;
  --pri:#5b8cff; --pri2:#7aa2ff; --pri-weak:rgba(91,140,255,.18);
  --accent:#a17cff;
  --ok:#2dd4a0; --warn:#fbbf24; --err:#ff6b70;
  --ok-weak:rgba(45,212,160,.16); --err-weak:rgba(255,107,112,.16); --warn-weak:rgba(251,191,36,.16);
  --shadow:0 8px 30px rgba(0,0,0,.4);

  --glass:rgba(23,30,54,.68);
  --glass-soft:rgba(23,30,54,.5);
  --glass-thin:rgba(23,30,54,.34);
  --glass-bd:rgba(255,255,255,.1);
  --glass-line:rgba(255,255,255,.07);
  --glass-hl:rgba(255,255,255,.14);
  --shadow-glass:0 8px 32px rgba(0,0,0,.42),0 1px 2px rgba(0,0,0,.3);
  --shadow-lift:0 12px 28px -8px rgba(0,0,0,.45);
  --shadow-float:0 24px 56px -14px rgba(0,0,0,.6);

  --amb1:rgba(51,112,255,.24); --amb2:rgba(138,91,255,.2); --amb3:rgba(14,164,114,.12);
}
/* 不支持 backdrop-filter 的浏览器：自动降级为近实色，避免文字糊在背景上 */
@supports not ((backdrop-filter:blur(2px)) or (-webkit-backdrop-filter:blur(2px))){
  :root{--glass:rgba(255,255,255,.95);--glass-soft:rgba(255,255,255,.92);--glass-thin:rgba(255,255,255,.88)}
  .dark{--glass:rgba(23,30,54,.96);--glass-soft:rgba(23,30,54,.94);--glass-thin:rgba(23,30,54,.9)}
}
*{box-sizing:border-box}
html,body{margin:0;height:100%}
body{
  font:14px/1.6 system-ui,'Segoe UI',Roboto,'PingFang SC','Microsoft Yahei',sans-serif;
  background:var(--bg); color:var(--txt); min-height:100vh; -webkit-font-smoothing:antialiased;
}
/* 环境光层：玻璃质感的底子。fixed + z-index:-1，不参与布局也不拦截点击 */
body::before{
  content:'';position:fixed;inset:0;z-index:-1;pointer-events:none;
  background:
    radial-gradient(900px 620px at 10% -10%,var(--amb1),transparent 62%),
    radial-gradient(760px 560px at 94% 4%,var(--amb2),transparent 60%),
    radial-gradient(840px 640px at 66% 110%,var(--amb3),transparent 62%);
}
/* 玻璃工具类：任何需要磨砂面的组件直接复用，保证质感一致 */
.glass{
  background:var(--glass);
  backdrop-filter:blur(var(--blur)) saturate(180%);
  -webkit-backdrop-filter:blur(var(--blur)) saturate(180%);
  border:1px solid var(--glass-bd);
  box-shadow:var(--shadow-glass);
}
.ic{width:18px;height:18px;vertical-align:middle;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;flex:none}
button{font-family:inherit;cursor:pointer}
.hidden{display:none!important}

/* ===== 统一占位符：全站输入框灰色提示文字 ===== */
input::placeholder,textarea::placeholder{color:var(--light);opacity:1;font-weight:400}
input::-webkit-input-placeholder,textarea::-webkit-input-placeholder{color:var(--light);opacity:1}
input::-moz-placeholder,textarea::-moz-placeholder{color:var(--light);opacity:1}
input:-ms-input-placeholder,textarea:-ms-input-placeholder{color:var(--light);opacity:1}
input:disabled::placeholder,textarea:disabled::placeholder{color:var(--light);opacity:.6}
/* contenteditable 的占位符（富文本 / Tab 面板） */
[contenteditable][data-ph]:empty:before{content:attr(data-ph);color:var(--light);pointer-events:none}
/* 输入框获得焦点时提示文字进一步减淡，减少视觉干扰 */
input:focus::placeholder,textarea:focus::placeholder{opacity:.65;transition:opacity var(--t-fast)}

/* 布局 */
/* 登录页样式已全部迁移到 assets/login.css（右侧卡片 + 壁纸 + 多登录方式），此处不再定义，避免相互覆盖 */
.err{color:var(--err);font-size:13px;margin-top:10px;min-height:18px}

#appView{height:100vh;overflow:hidden;background:transparent}
#homeView{display:flex;height:100vh}
#editorView{display:flex;height:100vh;overflow:hidden}

/* 侧边栏：磨砂玻璃 + 右侧折射亮边 */
.sidebar{
  width:280px;flex:none;display:flex;flex-direction:column;position:relative;
  background:var(--glass);
  backdrop-filter:blur(var(--blur)) saturate(180%);
  -webkit-backdrop-filter:blur(var(--blur)) saturate(180%);
  border-right:1px solid var(--glass-line);
}
.sidebar::after{content:'';position:absolute;top:0;right:0;bottom:0;width:1px;background:linear-gradient(180deg,var(--glass-hl),transparent 55%);pointer-events:none}
.sidebar header{padding:14px 16px;border-bottom:1px solid var(--glass-line);display:flex;align-items:center;gap:10px}
.logo{width:32px;height:32px;border-radius:10px;background:linear-gradient(135deg,var(--pri),var(--accent));display:grid;place-items:center;color:#fff;box-shadow:0 4px 12px -2px rgba(51,112,255,.45)}
.logo .ic{width:18px;height:18px;stroke:#fff}
.site-name{font-weight:600;font-size:15px;letter-spacing:.2px}
.sidebar .tools{padding:10px 12px;display:flex;flex-direction:column;gap:8px;border-bottom:1px solid var(--glass-line)}
.sidebar .tools-search{position:relative;display:flex;align-items:center}
.sidebar .tools-search .ic{position:absolute;left:9px;width:15px;height:15px;color:var(--light);pointer-events:none}
.sidebar .tools-search input{width:100%;background:var(--glass-thin);border:1px solid var(--glass-line);color:var(--txt);border-radius:9px;padding:7px 10px 7px 30px;font-size:13px;transition:all var(--t-fast)}
.sidebar .tools-search input:focus{outline:none;border-color:var(--pri);background:var(--bg2);box-shadow:0 0 0 3px var(--pri-weak)}
.sidebar .tool-actions{display:flex;gap:8px}
.sidebar .tool-actions .btn-icon{flex:1;display:inline-flex;align-items:center;justify-content:center;gap:6px;height:32px;border-radius:9px;background:var(--glass-thin);border:1px solid var(--glass-line);color:var(--mut);font-size:12px}
.sidebar .tool-actions .btn-icon:hover{background:var(--glass-soft);color:var(--txt);border-color:var(--glass-bd)}
.sidebar .tool-actions .btn-icon .ic{width:15px;height:15px}

/* 按钮体系 */
.btn{
  border:1px solid var(--glass-line);background:var(--glass-soft);color:var(--txt);
  border-radius:9px;padding:7px 11px;display:inline-flex;align-items:center;gap:6px;font-size:13px;
  backdrop-filter:blur(var(--blur-sm));-webkit-backdrop-filter:blur(var(--blur-sm));
  transition:all var(--t-fast);
}
.btn:hover{border-color:var(--pri);color:var(--pri);background:var(--pri-weak);transform:translateY(-1px)}
.btn:active{transform:translateY(0)}
.btn:focus-visible{outline:2px solid var(--pri);outline-offset:2px}
.btn.pri{background:linear-gradient(135deg,var(--pri),var(--pri2));border-color:transparent;color:#fff;box-shadow:0 4px 14px -4px rgba(51,112,255,.55)}
.btn.pri:hover{background:linear-gradient(135deg,var(--pri2),var(--pri));color:#fff;box-shadow:0 8px 20px -6px rgba(51,112,255,.6)}
.btn.ghost{background:transparent;backdrop-filter:none;-webkit-backdrop-filter:none}
.btn-icon{border:none;background:transparent;color:var(--mut);padding:5px;border-radius:9px;display:inline-grid;place-items:center;transition:all var(--t-fast)}
.btn-icon:hover{background:var(--glass-thin);color:var(--txt)}
.btn-icon:focus-visible{outline:2px solid var(--pri);outline-offset:1px}
.btn.danger:hover{border-color:var(--err);color:var(--err);background:var(--err-weak)}

.tree{flex:1;overflow:auto;padding:8px}
.node{user-select:none}
.node-row{display:flex;align-items:center;gap:6px;padding:6px 8px;border-radius:7px;cursor:pointer;margin:1px 0;position:relative;transition:background .15s}
.node-row:hover{background:var(--card2)}
.node-row.active{background:var(--pri-weak);color:var(--pri)}
.node-row.active::before{content:'';position:absolute;left:0;top:4px;bottom:4px;width:3px;background:var(--pri);border-radius:0 3px 3px 0}
.node-row .tw{width:18px;flex:none;color:var(--light);transition:transform .15s;display:inline-grid;place-items:center;position:relative;z-index:2}
.node-row.open .tw{transform:rotate(90deg)}
.node-row .nm{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:13px;position:relative;z-index:1}
.inline-rename{width:100%;box-sizing:border-box;font:inherit;padding:3px 6px;border:1.5px solid var(--pri);border-radius:6px;background:var(--card);color:var(--txt);outline:none}
.node-row .inline-rename{flex:1;min-width:0;font-size:13px;position:relative;z-index:3}
.node-row .acts{display:none;gap:1px;position:relative;z-index:2}
.node-row:hover .acts{display:inline-flex}
.children{margin-left:12px;border-left:1px solid var(--bd2);padding-left:6px}
.drop-before,.drop-after,.drop-inside{border-radius:7px}
.drop-before{box-shadow:inset 0 2px 0 var(--pri)}
.drop-after{box-shadow:inset 0 -2px 0 var(--pri)}
.drop-inside{background:var(--pri-weak)}

/* 主区：内容底板保持实色，保证正文可读性（玻璃只用在外壳） */
.main{flex:1;display:flex;flex-direction:column;min-width:0;background:var(--bg2)}

/* 文档标题头：把标题/路径从顶栏下沉，形成清晰的内容区头部 */
.doc-header{
  padding:20px 32px 12px;background:var(--bg2);border-bottom:1px solid var(--glass-line);
}
.doc-header-inner{max-width:900px;margin:0 auto}
.doc-breadcrumb{font-size:12px;color:var(--mut);margin-bottom:6px;display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.doc-breadcrumb span{opacity:.6}
.doc-title{font-size:26px;font-weight:700;color:var(--txt);margin:0;line-height:1.3}

.topbar{
  display:flex;align-items:center;gap:12px;padding:10px 16px;position:relative;z-index:5;
  background:var(--glass);
  backdrop-filter:blur(var(--blur)) saturate(180%);
  -webkit-backdrop-filter:blur(var(--blur)) saturate(180%);
  border-bottom:1px solid var(--glass-line);
  box-shadow:0 1px 0 var(--glass-hl) inset;
}
.breadcrumb{font-size:13px;color:var(--mut);flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:flex;align-items:center;gap:6px}
.breadcrumb span{max-width:140px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.topbar .status{font-size:12px;color:var(--light)}
.seg{display:flex;background:var(--glass-thin);border:1px solid var(--glass-line);border-radius:10px;overflow:hidden;padding:2px;gap:2px}
.seg button{background:transparent;border:none;color:var(--mut);padding:5px 12px;font-size:13px;border-radius:8px;transition:all var(--t-fast)}
.seg button:hover{color:var(--txt);background:var(--glass-thin)}
.seg button.on{background:var(--pri);color:#fff;box-shadow:0 2px 8px -2px rgba(51,112,255,.5)}

.editor-wrap{flex:1;display:flex;min-height:0}
#editorBody{flex:1;display:flex;min-height:0;overflow:hidden}
.editor-pane{flex:1;display:flex;flex-direction:column;min-width:0;min-height:0}
.editor-pane+.editor-pane{border-left:1px solid var(--bd)}

/* 工具栏：轻玻璃，避免与顶栏抢层级 */
.toolbar{
  display:flex;flex-wrap:wrap;gap:4px;align-items:center;padding:8px 12px;
  background:var(--glass-soft);
  backdrop-filter:blur(var(--blur-sm)) saturate(160%);
  -webkit-backdrop-filter:blur(var(--blur-sm)) saturate(160%);
  border-bottom:1px solid var(--glass-line);
}
.toolbar .btn-icon{width:30px;height:30px}
.toolbar .btn-icon.on{background:var(--pri-weak);color:var(--pri)}
.tb-sep{width:1px;height:20px;background:var(--glass-line);margin:0 3px;flex:none}
.tb-select{background:var(--glass-thin);border:1px solid var(--glass-line);color:var(--txt);border-radius:8px;padding:5px 8px;font-size:12px;max-width:110px;transition:all var(--t-fast)}
.tb-select:focus{outline:none;border-color:var(--pri);box-shadow:0 0 0 3px var(--pri-weak)}
.tb-color{position:relative;width:26px;height:26px;border-radius:7px;overflow:hidden;border:1px solid var(--bd);display:inline-grid;place-items:center;cursor:pointer;flex:none}
.tb-color span{position:absolute;inset:0;opacity:.85}
.tb-color input{position:absolute;inset:0;opacity:0;cursor:pointer;border:none;padding:0}
.tb-group{display:inline-flex;gap:4px;align-items:center;flex:none}
.btn-sm{border:1px solid var(--bd);background:var(--bg2);color:var(--txt);border-radius:7px;padding:4px 9px;font-size:12px;cursor:pointer;transition:all .15s;white-space:nowrap}
.btn-sm:hover{border-color:var(--pri);color:var(--pri)}
.btn-sm.term-pc.on,.term-block[data-term="pc"]{border-left-color:var(--pri)}
.btn-sm.term-mobile.on,.term-block[data-term="mobile"]{border-left-color:#1fae6b}
.btn-sm.term-pad.on,.term-block[data-term="pad"]{border-left-color:#e08a00}

/* 终端内容标记块（编辑器内 + 分享页） */
.term-block{border-left:3px solid var(--pri);padding:8px 12px;margin:10px 0;background:rgba(127,127,127,.06);border-radius:0 8px 8px 0}
.term-block p:first-child{margin-top:0}
.term-block p:last-child{margin-bottom:0}
/* 文档终端切换栏（主应用预览 + 分享页共用视觉） */
.cat-bar{display:flex;gap:8px;overflow-x:auto;padding:12px 0 10px;margin-bottom:8px;-webkit-overflow-scrolling:touch;scrollbar-width:none}
.cat-bar::-webkit-scrollbar{display:none}
.cat-btn{flex:none;padding:7px 14px;border-radius:18px;border:0.5px solid var(--bd);background:var(--card);color:var(--mut);font-size:13px;font-weight:500;cursor:pointer;transition:all .15s;white-space:nowrap}
.cat-btn.on{background:var(--pri-weak);color:var(--pri);border-color:var(--pri)}
/* 阅读/预览区的全局终端栏：吸顶，切换文档/滚动时始终可见，且可横向滑动 */
.term-bar{position:sticky;top:0;z-index:6;background:var(--bg2);padding:10px 2px;margin:-2px -2px 10px;backdrop-filter:blur(6px)}
@media(prefers-color-scheme:dark){.term-bar{background:var(--bg2)}}
.term-bar .cat-btn{user-select:none}

/* 终端 Tab 组件：电脑端 / 手机端 多面板，点击标签切换显隐（编辑/阅读一致） */
/* Tab 组件：玻璃质感标签页；内容区保持实底确保可读性 */
.tab-widget{position:relative;border:1px solid var(--glass-bd);border-radius:var(--radius-lg);overflow:hidden;margin:16px 0;background:var(--card);box-shadow:var(--shadow-glass);transition:border-color var(--t),box-shadow var(--t)}
.tab-widget:hover{border-color:rgba(51,112,255,.28);box-shadow:var(--shadow-lift)}
.tab-head{display:flex;align-items:center;gap:3px;overflow-x:auto;padding:6px 6px 0;-webkit-overflow-scrolling:touch;scrollbar-width:none;border-bottom:1px solid var(--glass-line);background:var(--glass-soft);backdrop-filter:blur(var(--blur-sm)) saturate(160%);-webkit-backdrop-filter:blur(var(--blur-sm)) saturate(160%);position:relative}
.tab-head::before{content:'';position:absolute;top:0;left:14px;right:14px;height:1px;background:linear-gradient(90deg,transparent,var(--glass-hl),transparent);pointer-events:none}
.tab-head::-webkit-scrollbar{display:none}
.tab-close{flex:none;width:26px;height:26px;border-radius:7px;margin-left:auto;margin-right:2px;margin-bottom:6px;background:transparent;color:var(--mut);font-size:18px;line-height:26px;text-align:center;cursor:pointer;transition:all var(--t-fast);flex-shrink:0}
.tab-close:hover{background:var(--err-weak);color:var(--err)}
.tab-tab{flex:none;display:inline-flex;align-items:center;gap:6px;padding:8px 16px;border:0;border-bottom:2px solid transparent;background:transparent;color:var(--mut);font-size:13px;font-weight:500;cursor:pointer;white-space:nowrap;transition:color var(--t-fast),border-color var(--t-fast),background var(--t-fast),box-shadow var(--t-fast);border-radius:8px 8px 0 0;margin-bottom:-1px;position:relative;z-index:1}
.tab-tab:hover{color:var(--txt);background:var(--glass-thin)}
.tab-tab.on{color:var(--pri);border-bottom-color:var(--pri);background:var(--glass);font-weight:600;box-shadow:0 -2px 10px rgba(15,23,42,.05)}
.tab-add{flex:none;width:28px;height:28px;border-radius:7px;border:1px dashed var(--glass-line);background:transparent;color:var(--mut);font-size:18px;line-height:1;cursor:pointer;display:inline-grid;place-items:center;transition:all var(--t-fast);flex-shrink:0}
.tab-add:hover{border-color:var(--pri);color:var(--pri);background:var(--pri-weak)}
.tab-del{display:none;width:16px;height:16px;border-radius:50%;background:var(--glass-thin);color:var(--mut);font-size:12px;line-height:16px;text-align:center;cursor:pointer;transition:all var(--t-fast);flex-shrink:0}
.tab-tab:hover .tab-del{display:inline-block}
.tab-del:hover{background:var(--err);color:#fff}
.tab-body{position:relative;padding:16px;background:var(--card);min-height:80px}
.tab-body::before{content:'';position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,var(--glass-line),transparent);pointer-events:none}
.tab-panel{display:none;outline:none}
.tab-panel.on{display:block;animation:tabIn .18s ease}
.tab-panel:empty:before{content:"在此输入内容…";color:var(--light);opacity:.7}
@keyframes tabIn{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}
/* Tab 组件：移动端阅读适配（增大点击区域、优化间距与字号） */
@media(max-width:820px){
  .tab-widget{margin:14px 0;border-radius:var(--radius-md)}
  .tab-head{padding:4px 4px 0}
  .tab-tab{padding:10px 14px;font-size:14px;min-height:44px}
  .tab-tab .tab-del{width:18px;height:18px;line-height:18px}
  .tab-add{width:32px;height:32px}
  .tab-close{width:30px;height:30px;line-height:30px;margin-bottom:8px}
  .tab-body{padding:14px}
}
@media(max-width:680px){
  .tab-widget{margin:12px 0;border-radius:var(--radius);box-shadow:none}
  .tab-head{padding:2px 2px 0}
  .tab-tab{padding:10px 12px;font-size:14px}
  .tab-body{padding:12px}
  .tab-panel{font-size:15px;line-height:1.75}
  .tab-panel p{margin:0 0 .75em}
  .tab-panel h1,.tab-panel h2,.tab-panel h3,.tab-panel h4{margin:1.2em 0 .5em}
  .tab-panel img{max-width:100%;height:auto;border-radius:8px}
  .tab-panel blockquote{padding:10px 14px;margin:12px 0}
  .tab-panel pre{padding:12px;font-size:13px}
}

/* 文本编辑器 */
#editor{flex:1;background:var(--bg2);border:none;color:var(--txt);padding:24px 32px;font:14px/1.8 ui-monospace,SFMono-Regular,Menlo,monospace;resize:none;outline:none;min-width:360px}
#preview{flex:1;overflow-x:hidden;overflow-y:auto;padding:24px 32px;background:var(--bg2);min-width:360px}
#preview > *{max-width:900px;margin-left:auto;margin-right:auto}
#preview > .term-bar{max-width:none;margin-left:0;margin-right:0}
.wysiwyg{flex:1;overflow:auto;padding:24px 32px;outline:none;background:var(--bg2);min-width:360px}

/* 分屏拖拽分割线（飞书风格） */
.pane-split{flex:0 0 9px;position:relative;cursor:col-resize;background:var(--bg2);user-select:none;touch-action:none}
.pane-split>i{position:absolute;top:0;bottom:0;left:4px;width:1px;background:var(--bd);transition:background .15s,width .15s,left .15s}
.pane-split:hover>i,.pane-split.dragging>i{left:3px;width:3px;background:var(--pri);border-radius:2px}
.pane-split::after{content:'';position:absolute;top:50%;left:1px;width:7px;height:34px;margin-top:-17px;border-radius:4px;background:var(--bd);opacity:0;transition:opacity .15s}
.pane-split:hover::after{opacity:.55}
body.pane-resizing{cursor:col-resize;user-select:none}
body.pane-resizing #preview,body.pane-resizing .wysiwyg,body.pane-resizing #editor{pointer-events:none}
/* 分屏时两侧留出呼吸感 */
.editor-pane-body.is-split #preview{background:var(--card2)}
#preview h1,#preview h2,#preview h3{margin:.8em 0 .4em}
#preview pre{background:var(--card2);padding:12px;border-radius:10px;overflow:auto}
#preview code{background:var(--bd2);padding:1px 5px;border-radius:5px}
#preview blockquote{border-left:3px solid var(--pri);margin:0;padding:4px 14px;color:var(--mut)}
#preview table{border-collapse:collapse}#preview th,#preview td{border:1px solid var(--bd);padding:6px 10px}
#preview img{max-width:100%;height:auto;display:block;margin:10px 0;border-radius:8px}
#wysiwyg img{max-width:100%;height:auto;display:block;margin:10px 0;border-radius:8px;cursor:nwse-resize;position:relative}
#wysiwyg img:hover{outline:2px dashed var(--pri);outline-offset:2px}
/* 移动端：内容图片强制按比例缩放，杜绝大图溢出 / 横向滚动（覆盖编辑器写入的内联固定宽高） */
@media (max-width:680px){
  #preview,#wysiwyg,#editor{min-width:0}
  #preview img,#wysiwyg img,.share-main img,.dir-content img,.tab-panel img{max-width:100%!important;height:auto!important}
}
/* 图片点击放大（lightbox） */
.img-lightbox{position:fixed;inset:0;z-index:9999;display:none;align-items:center;justify-content:center;background:rgba(8,12,22,.94);padding:24px;touch-action:none}
.img-lightbox .lb-img{max-width:100%;max-height:100%;object-fit:contain;border-radius:10px;box-shadow:0 20px 60px rgba(0,0,0,.5);background:#fff;touch-action:none;will-change:transform}
.img-lightbox .lb-close{position:absolute;top:16px;right:16px;width:42px;height:42px;border:none;border-radius:50%;background:rgba(255,255,255,.16);color:#fff;font-size:24px;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center}
.img-lightbox .lb-close:hover{background:rgba(255,255,255,.28)}
.wysiwyg:empty:before{content:attr(data-ph);color:var(--light)}

/* 文件夹/分类阅读页：自身正文 + 完整子层级目录 */
#preview .dir-head{padding:8px 0 18px}
#preview .dir-head h1{margin:0 0 6px;font-size:26px}
#preview .dir-meta{color:var(--mut);font-size:13px;margin:0}
#preview .dir-content{line-height:1.8;color:var(--txt);padding:8px 0 24px}
#preview .dir-content img{max-width:100%;border-radius:8px}
#preview .dir-content p{margin:12px 0}
#preview .dir-content h1,#preview .dir-content h2,#preview .dir-content h3{margin:22px 0 12px}
#preview .dir-tree{list-style:none;margin:0;padding:0}
#preview .dir-tree .dir-tree{padding-left:18px;border-left:1px solid var(--bd2);margin-left:9px}
#preview .dir-item{margin:3px 0}
#preview .dir-line{display:flex;align-items:center;gap:8px;padding:9px 10px;border-radius:8px;cursor:pointer;transition:background .15s;color:var(--txt)}
#preview .dir-line:hover{background:var(--card2)}
#preview .dir-line .ic{flex:none;width:18px;height:18px;color:var(--pri)}
#preview .dir-folder > .dir-line{font-weight:500}
#preview .dir-doc > .dir-line{color:var(--mut)}
#preview .dir-line .nm{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.empty{flex:1;display:grid;place-items:center;color:var(--mut);text-align:center;background:var(--bg2)}
.empty .ic{width:46px;height:46px;stroke-width:1.5;opacity:.5}

/* 表格编辑器 */
.sheet-wrap{flex:1;overflow:auto;padding:16px;background:var(--bg2)}
.sheet-table{border-collapse:collapse;background:var(--card);border:1px solid var(--bd)}
.sheet-table th,.sheet-table td{border:1px solid var(--bd);min-width:90px;height:32px;padding:4px 6px;position:relative}
.sheet-table th{background:var(--card2);color:var(--mut);font-weight:500;text-align:center;font-size:12px}
.sheet-table td input{width:100%;height:100%;border:none;background:transparent;color:var(--txt);outline:none;font-size:13px}
.sheet-table td.selected{outline:2px solid var(--pri);outline-offset:-2px;z-index:1}

/* 幻灯片编辑器 */
.slide-wrap{flex:1;display:flex;flex-direction:column;overflow:hidden;background:var(--bg2)}
.slide-list{width:200px;border-right:1px solid var(--bd);overflow:auto;padding:10px;background:var(--card)}
.slide-thumb{padding:10px;border:1px solid var(--bd);border-radius:8px;margin-bottom:8px;cursor:pointer;background:var(--bg2);position:relative;height:90px;overflow:hidden}
.slide-thumb.active{border-color:var(--pri);background:var(--pri-weak)}
.slide-thumb .idx{font-size:11px;color:var(--light);position:absolute;top:4px;left:6px}
.slide-stage{flex:1;display:grid;place-items:center;padding:20px;overflow:auto}
.slide-canvas{width:800px;height:450px;background:var(--card);border:1px solid var(--bd);border-radius:8px;position:relative;box-shadow:var(--shadow)}
.slide-block{position:absolute;border:1px dashed transparent;padding:6px;cursor:text}
.slide-block:hover{border-color:var(--pri)}
.slide-block[contenteditable]{outline:none}

/* 大纲面板 */
.outline-panel{width:220px;border-left:1px solid var(--glass-line);background:var(--glass);backdrop-filter:blur(var(--blur)) saturate(180%);-webkit-backdrop-filter:blur(var(--blur)) saturate(180%);overflow:auto;padding:12px;transition:transform .25s cubic-bezier(.16,1,.3,1)}
.outline-panel h3{font-size:13px;color:var(--mut);margin:0 0 10px;padding:0 4px}
.outline-item{padding:5px 6px;border-radius:6px;cursor:pointer;font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--txt)}
.outline-item:hover{background:var(--glass-thin)}
.outline-item.l2{padding-left:18px}
.outline-item.l3{padding-left:32px}
#outlineBackdrop{display:none;pointer-events:none}

/* 顶部右侧 */
.top-right{display:flex;align-items:center;gap:8px}
.avatar{width:30px;height:30px;border-radius:50%;background:linear-gradient(135deg,#8a5bff,var(--pri));display:grid;place-items:center;color:#fff;font-size:13px;font-weight:600}
.dot{width:8px;height:8px;border-radius:50%;background:var(--light)}
.dot.on{background:var(--ok);box-shadow:0 0 8px var(--ok)}
.dot.bad{background:var(--err)}

/* 模态：景深遮罩 + 悬浮玻璃卡片 */
.modal-bg{
  position:fixed;inset:0;background:rgba(10,14,26,.42);
  backdrop-filter:blur(8px) saturate(120%);-webkit-backdrop-filter:blur(8px) saturate(120%);
  display:grid;place-items:center;z-index:50;padding:20px;
  animation:mbIn .22s var(--ease);
}
@keyframes mbIn{from{opacity:0}to{opacity:1}}
.modal{
  position:relative;
  background:var(--glass);
  backdrop-filter:blur(var(--blur-lg)) saturate(200%);
  -webkit-backdrop-filter:blur(var(--blur-lg)) saturate(200%);
  border:1px solid var(--glass-bd);
  border-radius:var(--radius-lg);
  width:min(560px,94vw);max-height:88vh;overflow:auto;padding:24px;
  box-shadow:var(--shadow-float);
  animation:mIn .28s var(--ease);
}
/* 顶部高光：模拟玻璃边缘对光的折射，是"高级感"的关键细节 */
.modal::before{content:'';position:absolute;top:0;left:16px;right:16px;height:1px;background:linear-gradient(90deg,transparent,var(--glass-hl),transparent);pointer-events:none}
@keyframes mIn{from{opacity:0;transform:translateY(12px) scale(.98)}to{opacity:1;transform:none}}
.modal h3{margin:0 0 16px;font-size:17px;font-weight:600;display:flex;align-items:center;gap:8px;letter-spacing:.2px}
.modal .field{margin:14px 0}
.modal label{display:block;font-size:12px;color:var(--mut);margin-bottom:6px;font-weight:500}
.modal input,.modal textarea,.modal select{
  width:100%;background:var(--bg2);border:1px solid var(--bd);color:var(--txt);
  border-radius:10px;padding:10px 12px;font-size:14px;font-family:inherit;transition:all var(--t-fast);
}
.modal input:focus,.modal textarea:focus,.modal select:focus{outline:none;border-color:var(--pri);box-shadow:0 0 0 3px var(--pri-weak)}
.modal input:disabled{background:var(--glass-thin);color:var(--mut);cursor:not-allowed}
.modal input::placeholder{color:var(--mut);opacity:.85}
.modal .row{display:flex;gap:10px}
.modal .row>*{flex:1}
.modal .foot{display:flex;justify-content:flex-end;gap:10px;margin-top:20px;padding-top:16px;border-top:1px solid var(--glass-line)}
.modal .hint{font-size:12px;color:var(--mut);line-height:1.6;margin:6px 0 0}
.kv{display:flex;justify-content:space-between;padding:9px 0;border-bottom:1px solid var(--glass-line);font-size:13px}
.kv:hover{background:var(--glass-thin)}

/* ---------- 分享面板（飞书风格） ---------- */
.share-panel{font-size:13px}
.sp-doc{display:flex;align-items:center;gap:8px;padding:10px 12px;background:var(--glass-soft);backdrop-filter:blur(var(--blur-sm)) saturate(160%);-webkit-backdrop-filter:blur(var(--blur-sm)) saturate(160%);border-radius:12px;margin-bottom:14px}
.sp-doc .ic{width:17px;height:17px;color:var(--pri);flex:none}
.sp-title{font-size:14px;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

.sp-row{display:flex;align-items:center;gap:14px;padding:12px 2px}
.sp-row-main{flex:1;min-width:0}
.sp-row-t{font-size:14px;font-weight:500;margin-bottom:3px}
.sp-row-s{font-size:12px;color:var(--mut);line-height:1.5}

/* 开关 */
.sw{position:relative;display:inline-block;width:42px;height:24px;flex:none;cursor:pointer}
.sw input{position:absolute;opacity:0;width:0;height:0;padding:0;border:none}
.sw i{position:absolute;inset:0;background:var(--bd);border-radius:999px;transition:background .2s}
.sw i::after{content:'';position:absolute;top:3px;left:3px;width:18px;height:18px;border-radius:50%;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.25);transition:transform .2s}
.sw input:checked+i{background:var(--pri)}
.sw input:checked+i::after{transform:translateX(18px)}

.sp-body{border-top:1px solid var(--bd2);padding-top:14px;margin-top:4px}
.sp-perm{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px}
.sp-perm-lb{font-size:13px;color:var(--mut);flex:none}
.modal .sp-select{width:auto;min-width:118px;padding:7px 10px;font-size:13px}

.sp-link{display:flex;gap:8px;align-items:center}
.modal .sp-link input{flex:1;background:var(--glass-thin);font-size:12px;color:var(--mut);padding:9px 11px}
.sp-link .btn{flex:none;white-space:nowrap}

.sp-more{display:flex;align-items:center;gap:5px;margin-top:14px;background:transparent;border:none;color:var(--mut);font-size:12.5px;padding:4px 0;cursor:pointer}
.sp-more:hover{color:var(--pri)}
.sp-more .ic{width:15px;height:15px;transition:transform .2s}
.sp-more.open .ic{transform:rotate(180deg)}
.sp-more-body{border-top:1px dashed var(--bd2);margin-top:8px;padding-top:6px}
.sp-more-act{display:flex;align-items:center;gap:10px;margin-top:12px}
.sp-hint{font-size:11.5px;color:var(--mut);font-weight:400;margin-left:4px}
.tag{font-size:11px;padding:2px 8px;border-radius:20px;background:var(--pri-weak);color:var(--pri)}

/* 新建文档类型选择 */
.type-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:10px}
.type-card{position:relative;border:1px solid var(--glass-bd);border-radius:var(--radius-md);padding:18px;text-align:center;cursor:pointer;transition:all .15s;background:var(--glass-soft);backdrop-filter:blur(var(--blur-sm)) saturate(160%);-webkit-backdrop-filter:blur(var(--blur-sm)) saturate(160%);box-shadow:var(--shadow-glass)}
.type-card:hover{border-color:var(--pri);background:var(--pri-weak);box-shadow:var(--shadow-lift)}
.type-card .ic{width:36px;height:36px;margin-bottom:8px;color:var(--pri)}
.type-card h4{margin:0;font-size:14px}
.type-card p{margin:4px 0 0;font-size:12px;color:var(--mut)}

/* AI 悬浮 */
#fab{position:fixed;right:22px;bottom:22px;width:54px;height:54px;border-radius:50%;background:linear-gradient(135deg,var(--pri),var(--accent));border:none;color:#fff;display:grid;place-items:center;box-shadow:0 10px 30px rgba(91,140,255,.45),0 0 0 1px rgba(255,255,255,.14) inset;z-index:40;transition:transform var(--t) var(--ease),box-shadow var(--t)}
#fab:hover{transform:translateY(-3px) scale(1.04);box-shadow:0 16px 38px rgba(91,140,255,.55),0 0 0 1px rgba(255,255,255,.2) inset}
#fab .ic{width:24px;height:24px;stroke:#fff}
#aiPanel{
  position:fixed;right:22px;bottom:88px;width:420px;height:580px;max-height:82vh;
  background:var(--glass);
  backdrop-filter:blur(var(--blur-lg)) saturate(200%);
  -webkit-backdrop-filter:blur(var(--blur-lg)) saturate(200%);
  border:1px solid var(--glass-bd);border-radius:var(--radius-lg);
  display:flex;flex-direction:column;overflow:hidden;
  box-shadow:var(--shadow-float);z-index:41;
  animation:mIn .28s var(--ease);
}
#aiPanel header{display:flex;align-items:center;gap:8px;padding:12px 14px;border-bottom:1px solid var(--glass-line)}
#aiTabs{display:flex;gap:4px;padding:8px 12px;border-bottom:1px solid var(--glass-line)}
#aiTabs button{flex:1;background:var(--glass-thin);border:1px solid var(--glass-line);color:var(--mut);border-radius:9px;padding:6px;font-size:12px;transition:all var(--t-fast)}
#aiTabs button.on{background:var(--pri);color:#fff;border-color:transparent;box-shadow:0 2px 8px -2px rgba(51,112,255,.5)}
#aiMode{display:flex;gap:4px;padding:8px 12px;background:var(--glass-thin);border-bottom:1px solid var(--glass-line)}
#aiMode button{flex:1;background:transparent;border:1px solid var(--glass-line);color:var(--mut);border-radius:8px;padding:5px;font-size:12px;transition:all var(--t-fast)}
#aiMode button.on{background:var(--pri-weak);color:var(--pri);border-color:var(--pri)}
#aiMessages{flex:1;overflow:auto;padding:14px;display:flex;flex-direction:column;gap:10px}
.msg{padding:10px 12px;border-radius:14px;font-size:13px;max-width:90%;white-space:pre-wrap;word-break:break-word;line-height:1.6}
.msg.me{align-self:flex-end;background:linear-gradient(135deg,var(--pri),var(--pri2));color:#fff;border-bottom-right-radius:5px;box-shadow:0 3px 10px -3px rgba(51,112,255,.5)}
.msg.ai{align-self:flex-start;background:var(--bg2);border:1px solid var(--glass-line);border-bottom-left-radius:5px}
.msg .src{font-size:11px;color:var(--pri);margin-top:6px;display:block}
#aiInputBar{display:flex;gap:8px;padding:10px 12px;border-top:1px solid var(--glass-line)}
#aiInputBar textarea{flex:1;background:var(--bg2);border:1px solid var(--bd);color:var(--txt);border-radius:11px;padding:8px 10px;resize:none;height:44px;font:13px/1.4 inherit;transition:all var(--t-fast)}
#aiInputBar textarea:focus{outline:none;border-color:var(--pri);box-shadow:0 0 0 3px var(--pri-weak)}
.kbd-hint{font-size:11px;color:var(--light);text-align:center;padding:4px}

/* 版本对比 */
.diff{font:12px/1.5 ui-monospace,monospace;white-space:pre-wrap}
.d-same{color:var(--mut)}
.d-del{background:rgba(255,107,107,.12);color:var(--err)}
.d-add{background:rgba(70,211,154,.12);color:#2aae74}

/* 移动端 */
#sidebarToggle{display:none}
#sbBackdrop{display:none}
@media(max-width:900px){
  .outline-panel{position:fixed;right:0;top:0;bottom:0;width:min(320px,82vw);z-index:35;display:block !important;transform:translateX(100%);border-left:none;box-shadow:var(--shadow)}
  body.outline-open .outline-panel{transform:none}
  #outlineBackdrop{display:block;position:fixed;inset:0;background:rgba(0,0,0,.4);z-index:34;opacity:0;pointer-events:none;transition:opacity .25s}
  body.outline-open #outlineBackdrop{opacity:1;pointer-events:auto}
  .slide-canvas{width:100%;height:auto;aspect-ratio:16/9}
}
@media(max-width:820px){
  .sidebar{position:fixed;left:0;top:0;bottom:0;z-index:30;transform:translateX(-100%);transition:transform .25s;box-shadow:var(--shadow)}
  body.sb-open .sidebar{transform:none}
  #sidebarToggle{display:inline-grid}
  #sbBackdrop{display:block;position:fixed;inset:0;background:rgba(0,0,0,.4);z-index:25;opacity:0;pointer-events:none;transition:opacity .25s}
  body.sb-open #sbBackdrop{opacity:1;pointer-events:auto}
  .breadcrumb{display:none}
  .topbar{flex-wrap:wrap;gap:6px;padding:10px 12px}
  .seg button{padding:6px 9px;font-size:12px}
  #editor,#preview,.wysiwyg{padding:16px}
  .doc-header{padding:14px 16px 10px}
  .doc-title{font-size:20px}
  #preview > *{max-width:none}
  #aiPanel{width:auto;left:12px;right:12px;bottom:80px;height:70vh}
  #fab{bottom:18px;right:18px;width:50px;height:50px}
  .type-grid{grid-template-columns:1fr}
}

/* ============ 首页 ============ */
.home-nav{
  width:220px;flex:none;display:flex;flex-direction:column;user-select:none;position:relative;
  background:var(--glass);
  backdrop-filter:blur(var(--blur)) saturate(180%);
  -webkit-backdrop-filter:blur(var(--blur)) saturate(180%);
  border-right:1px solid var(--glass-line);
}
.home-nav::after{content:'';position:absolute;top:0;right:0;bottom:0;width:1px;background:linear-gradient(180deg,var(--glass-hl),transparent 55%);pointer-events:none}
.home-nav header{padding:16px;display:flex;align-items:center;gap:10px;border-bottom:1px solid var(--glass-line)}
.home-nav header .logo{width:34px;height:34px}
.home-nav nav{flex:1;padding:10px 12px;overflow:auto}
.nav-item{display:flex;align-items:center;gap:10px;padding:9px 10px;border-radius:10px;color:var(--txt);text-decoration:none;font-size:14px;cursor:pointer;margin:2px 0;position:relative;transition:all var(--t-fast)}
.nav-item .ic{color:var(--mut);transition:color var(--t-fast)}
.nav-item:hover{background:var(--glass-thin)}
.nav-item:hover .ic{color:var(--txt)}
.nav-item.on{background:var(--pri-weak);color:var(--pri);font-weight:500}
.nav-item.on .ic{color:var(--pri)}
/* 选中态左侧指示条，强化层级 */
.nav-item.on::before{content:'';position:absolute;left:-12px;top:50%;transform:translateY(-50%);width:3px;height:18px;background:var(--pri);border-radius:0 3px 3px 0}
.nav-bottom{padding:12px 14px;border-top:1px solid var(--glass-line);display:flex;align-items:center;gap:10px}
.nav-bottom .user-meta{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.nav-bottom .user-name{font-size:13px;color:var(--txt);font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.nav-bottom .user-sub{font-size:11px;color:var(--light)}
.nav-bottom .btn-icon{width:30px;height:30px;border-radius:8px;color:var(--mut)}
.nav-bottom .btn-icon:hover{background:var(--glass-thin);color:var(--txt)}

/* 编辑器左侧边栏底部用户区 */
.sidebar-footer{padding:12px 14px;border-top:1px solid var(--glass-line);display:flex;align-items:center;gap:10px;background:var(--glass-soft)}
.sidebar-footer .user-meta{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.sidebar-footer .user-name{font-size:13px;color:var(--txt);font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sidebar-footer .user-sub{font-size:11px;color:var(--light)}
.sidebar-footer .btn-icon{width:30px;height:30px;border-radius:8px;color:var(--mut)}
.sidebar-footer .btn-icon:hover{background:var(--glass-thin);color:var(--txt)}

.home-main{flex:1;display:flex;flex-direction:column;min-width:0;background:transparent;overflow:hidden}
.home-top{
  display:flex;align-items:center;gap:16px;padding:16px 24px;position:relative;z-index:4;
  background:var(--glass);
  backdrop-filter:blur(var(--blur)) saturate(180%);
  -webkit-backdrop-filter:blur(var(--blur)) saturate(180%);
  border-bottom:1px solid var(--glass-line);
  box-shadow:0 1px 0 var(--glass-hl) inset;
}
.home-actions{display:flex;gap:10px}
.home-actions .btn{display:inline-flex;align-items:center;gap:6px;padding:8px 14px;font-size:14px}
.home-actions .btn .ic{width:16px;height:16px}
.dropdown{position:relative}
.dropdown-menu{
  position:absolute;top:calc(100% + 8px);left:0;
  background:var(--glass);
  backdrop-filter:blur(var(--blur-lg)) saturate(200%);
  -webkit-backdrop-filter:blur(var(--blur-lg)) saturate(200%);
  border:1px solid var(--glass-bd);border-radius:var(--radius-md);
  box-shadow:var(--shadow-float);padding:6px;min-width:210px;z-index:30;
  animation:mIn .2s var(--ease);
}
.dm-item{display:flex;align-items:center;gap:10px;padding:10px;border-radius:9px;cursor:pointer;font-size:13px;transition:all var(--t-fast)}
.dm-item:hover{background:var(--pri-weak)}
.dm-item:hover .ic{transform:scale(1.08)}
.dm-item .ic{width:20px;height:20px;color:var(--pri);flex:none;transition:transform var(--t-fast)}
.dm-item b{display:block;font-weight:500;color:var(--txt)}
.dm-item span{display:block;font-size:12px;color:var(--mut)}
.dm-divider{height:1px;background:var(--glass-line);margin:6px 0}
.home-search{flex:1;display:flex;align-items:center;gap:8px;max-width:360px;margin-left:auto;position:relative}
.home-search .ic{color:var(--light);position:absolute;left:12px;pointer-events:none;z-index:1}
.home-search input{
  flex:1;background:var(--glass-thin);border:1px solid var(--glass-line);border-radius:10px;
  padding:9px 12px 9px 36px;font-size:14px;color:var(--txt);transition:all var(--t-fast);
}
.home-search input:focus{outline:none;border-color:var(--pri);background:var(--bg2);box-shadow:0 0 0 3px var(--pri-weak)}

.home-tabs{
  display:flex;gap:22px;padding:12px 24px 0;position:relative;z-index:3;
  background:var(--glass-soft);
  backdrop-filter:blur(var(--blur-sm)) saturate(160%);
  -webkit-backdrop-filter:blur(var(--blur-sm)) saturate(160%);
  border-bottom:1px solid var(--glass-line);
}
.home-tabs button{padding:8px 4px 12px;background:transparent;border:none;color:var(--mut);font-size:14px;cursor:pointer;position:relative;transition:color var(--t-fast)}
.home-tabs button:hover{color:var(--txt)}
.home-tabs button.on{color:var(--pri);font-weight:600}
.home-tabs button.on::after{content:'';position:absolute;left:0;right:0;bottom:0;height:2px;background:linear-gradient(90deg,var(--pri),var(--pri2));border-radius:2px 2px 0 0}

.home-list-wrap{flex:1;overflow:auto;padding:0 24px 24px}
.home-list-head{
  position:sticky;top:0;display:grid;grid-template-columns:2fr 1.2fr 120px 160px 44px;gap:12px;
  padding:12px 16px;font-size:12px;color:var(--mut);font-weight:600;letter-spacing:.3px;z-index:2;
  background:var(--glass-soft);
  backdrop-filter:blur(var(--blur)) saturate(160%);
  -webkit-backdrop-filter:blur(var(--blur)) saturate(160%);
  border-bottom:1px solid var(--glass-line);
}
.home-list-head .col-action{text-align:right}
.home-list{padding:8px 0}
.home-row{
  display:grid;grid-template-columns:2fr 1.2fr 120px 160px 44px;gap:12px;align-items:center;
  padding:11px 16px;border-radius:11px;cursor:pointer;font-size:14px;
  border:1px solid transparent;
  transition:background var(--t-fast),border-color var(--t-fast),transform var(--t-fast),box-shadow var(--t-fast);
}
.home-row:hover{background:var(--glass);border-color:var(--glass-bd);box-shadow:var(--shadow-glass);transform:translateX(2px)}
.home-row .col-title{display:flex;align-items:center;gap:10px;overflow:hidden}
.home-row .col-title .ic{color:var(--pri);flex:none;width:20px;height:20px}
.home-row .col-title b{font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.home-row .col-location,.home-row .col-owner,.home-row .col-time{color:var(--mut);font-size:13px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.home-row .col-action{display:flex;justify-content:flex-end}
.home-row .col-action .btn-icon{width:28px;height:28px}
.home-row-menu,.ctx-menu{
  background:var(--glass);
  backdrop-filter:blur(var(--blur-lg)) saturate(200%);
  -webkit-backdrop-filter:blur(var(--blur-lg)) saturate(200%);
  border:1px solid var(--glass-bd);border-radius:var(--radius-md);
  box-shadow:var(--shadow-float);padding:6px;display:flex;flex-direction:column;gap:2px;
  animation:mIn .18s var(--ease);
}
.home-row-menu{position:absolute;right:10px;top:30px;min-width:148px;z-index:20}
.ctx-menu{position:fixed;min-width:158px;z-index:60}
.home-row-menu button,.ctx-menu button{display:flex;align-items:center;gap:8px;padding:8px 10px;border:none;background:transparent;border-radius:8px;color:var(--txt);font-size:13px;cursor:pointer;text-align:left;transition:all var(--t-fast)}
.home-row-menu button:hover,.ctx-menu button:hover{background:var(--pri-weak);color:var(--pri)}
.home-row-menu button.danger:hover,.ctx-menu button.danger:hover{background:var(--err-weak);color:var(--err)}
.home-row-wrap{position:relative}

/* ===== 插画式空状态 ===== */
.home-empty{text-align:center;padding:56px 20px 64px;color:var(--mut)}
.home-empty .ic{width:56px;height:56px;opacity:.4;margin-bottom:14px}
.es{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:8px 20px;animation:esIn .4s var(--ease)}
@keyframes esIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.es-art{width:180px;height:140px;margin-bottom:20px;flex:none}
.es-art svg{width:100%;height:100%;display:block;overflow:visible}
.es h4{margin:0 0 8px;font-size:16px;font-weight:600;color:var(--txt);letter-spacing:.2px}
.es p{margin:0;font-size:13px;color:var(--mut);line-height:1.7;max-width:320px}
.es .es-act{margin-top:20px;display:flex;gap:10px;flex-wrap:wrap;justify-content:center}
/* 插画配色跟随主题令牌，暗色模式自动适配 */
.es-art .a-fill{fill:var(--pri);opacity:.1}
.es-art .a-fill2{fill:var(--accent);opacity:.09}
.es-art .a-paper{fill:var(--bg2);stroke:var(--bd);stroke-width:2}
.es-art .a-ring{fill:none;stroke:var(--bd);stroke-width:5}
.es-art .a-line{stroke:var(--bd);stroke-width:2.5;stroke-linecap:round;fill:none}
.es-art .a-pri{stroke:var(--pri);stroke-width:2.5;stroke-linecap:round;stroke-linejoin:round;fill:none}
.es-art .a-dot{fill:var(--pri);opacity:.55}
.es-art .a-dot2{fill:var(--accent);opacity:.4}
.es-art .a-shadow{fill:var(--txt);opacity:.05}
/* 漂浮动效：让插画有呼吸感，但尊重「减弱动态效果」偏好 */
.es-art .a-float{animation:esFloat 4s ease-in-out infinite}
.es-art .a-float2{animation:esFloat 4s ease-in-out infinite .7s}
.es-art .a-float3{animation:esFloat 4s ease-in-out infinite 1.4s}
@keyframes esFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-5px)}}
@media(prefers-reduced-motion:reduce){
  .es-art .a-float,.es-art .a-float2,.es-art .a-float3{animation:none}
  .es,.modal,.dropdown-menu,.ctx-menu,.home-row-menu,#aiPanel{animation:none}
}

/* 首页响应式 */
@media(max-width:900px){
  .home-nav{width:64px}
  .home-nav header .site-name,.nav-item span,.nav-bottom .user-name{display:none}
  .home-nav header{justify-content:center;padding:18px 10px}
  .home-nav nav{padding:10px}
  .nav-item{justify-content:center;padding:10px}
  .nav-bottom{justify-content:center}
  .home-list-head,.home-row{grid-template-columns:2fr 100px 44px}
  .home-list-head .col-location,.home-row .col-location,.home-list-head .col-owner,.home-row .col-owner{display:none}
}
@media(max-width:680px){
  .home-top{flex-wrap:wrap;padding:14px 16px}
  .home-search{width:100%;max-width:none;margin-left:0}
  .home-list-wrap{padding:0 12px 16px}
  .home-list-head,.home-row{grid-template-columns:1fr 44px}
  .home-list-head .col-time,.home-row .col-time{display:none}
}

/* ===== 首页新增组件样式（面包屑 / 回收站 / 知识库） ===== */
.home-crumb{display:flex;align-items:center;gap:6px;padding:12px 24px;flex-wrap:wrap;position:relative;z-index:3;background:var(--glass-soft);backdrop-filter:blur(var(--blur-sm)) saturate(160%);-webkit-backdrop-filter:blur(var(--blur-sm)) saturate(160%);border-bottom:1px solid var(--glass-line)}
.home-crumb .cb{color:var(--mut);font-size:13px;cursor:pointer;padding:2px 4px;border-radius:6px;transition:all .15s}
.home-crumb .cb:hover{color:var(--pri);background:var(--pri-weak)}
.home-crumb .cb.cur{color:var(--txt);font-weight:500;cursor:default}
.home-crumb .cb.cur:hover{background:transparent}
.home-crumb .cb-sep{color:var(--light);font-size:12px}
.crumb-act{margin-left:auto;display:flex;gap:8px}

.home-trashbar{display:flex;align-items:center;gap:14px;padding:12px 24px;font-size:13px;color:var(--mut);position:relative;z-index:3;background:var(--warn-weak);backdrop-filter:blur(var(--blur-sm));-webkit-backdrop-filter:blur(var(--blur-sm));border-bottom:1px solid var(--glass-line)}
.home-trashbar span{flex:1}
.home-trashbar .btn{margin-left:auto;flex:none}

.home-row.is-folder .col-title b{font-weight:600}
.fav-dot{color:var(--warn);margin-left:3px;font-size:11px;line-height:1}
.col-action2{display:flex;justify-content:flex-end;gap:8px}
.home-row.trash-row{grid-template-columns:2fr 1.3fr auto;gap:12px}
.loading-row{padding:40px;text-align:center;color:var(--mut);font-size:13px}

/* 知识库卡片网格 */
.wiki-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:16px;padding:24px;overflow:auto;align-content:start}
.wiki-card{
  position:relative;display:flex;flex-direction:column;min-height:128px;padding:18px;cursor:pointer;
  background:var(--glass);
  backdrop-filter:blur(var(--blur)) saturate(180%);
  -webkit-backdrop-filter:blur(var(--blur)) saturate(180%);
  border:1px solid var(--glass-bd);border-radius:var(--radius-lg);
  box-shadow:var(--shadow-glass);
  transition:transform var(--t) var(--ease),box-shadow var(--t),border-color var(--t);
}
.wiki-card::before{content:'';position:absolute;top:0;left:14px;right:14px;height:1px;background:linear-gradient(90deg,transparent,var(--glass-hl),transparent);pointer-events:none}
.wiki-card:hover{border-color:rgba(51,112,255,.35);box-shadow:var(--shadow-lift);transform:translateY(-3px)}
.wiki-card .wc-top{display:flex;align-items:flex-start;justify-content:space-between;margin-bottom:12px}
.wiki-card .wc-ic{width:42px;height:42px;border-radius:12px;background:linear-gradient(135deg,var(--pri),var(--accent));color:#fff;display:grid;place-items:center;flex:none;box-shadow:0 6px 16px -6px rgba(51,112,255,.6)}
.wiki-card .wc-ic .ic{width:22px;height:22px;stroke:#fff}
.wiki-card .wc-act{opacity:1;transition:opacity .15s}
.wiki-card:hover .wc-act{opacity:1}
.wiki-card h4{margin:4px 0 6px;font-size:15px;font-weight:600}
.wiki-card p{margin:0;color:var(--mut);font-size:12.5px}
.wiki-card.add{border-style:dashed;align-items:center;justify-content:center;text-align:center;color:var(--mut);gap:8px}
.wiki-card.add:hover{border-color:var(--pri);color:var(--pri)}
.wiki-card.add .ic{width:26px;height:26px}
.wiki-card.add h4{margin:0;font-size:14px;font-weight:500}
.wiki-empty{grid-column:1/-1;text-align:center;padding:60px 20px;color:var(--mut)}
.wiki-empty .ic{width:52px;height:52px;opacity:.4;margin-bottom:12px}
.wiki-empty p{margin:0 0 4px;font-size:15px;color:var(--txt)}
.wiki-empty span{font-size:13px}
.wiki-empty .btn{margin-top:16px}

/* 知识库内部：分类/分组视图 */
.wiki-inside{padding:24px;overflow:auto}
.wiki-inside-head{margin-bottom:18px}
.wih-title{display:flex;align-items:center;gap:14px}
.wih-title .ic{width:30px;height:30px;color:var(--pri);flex:none}
.wih-title h2{margin:0;font-size:19px;font-weight:600}
.wih-title p{margin:2px 0 0;color:var(--mut);font-size:12.5px}
.wiki-inside-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:16px;align-content:start}
.wiki-cat-card{
  position:relative;display:flex;flex-direction:column;min-height:128px;padding:18px;cursor:pointer;
  background:var(--glass);
  backdrop-filter:blur(var(--blur)) saturate(180%);
  -webkit-backdrop-filter:blur(var(--blur)) saturate(180%);
  border:1px solid var(--glass-bd);border-radius:var(--radius-lg);
  box-shadow:var(--shadow-glass);
  transition:transform var(--t) var(--ease),box-shadow var(--t),border-color var(--t);
}
.wiki-cat-card::before{content:'';position:absolute;top:0;left:14px;right:14px;height:1px;background:linear-gradient(90deg,transparent,var(--glass-hl),transparent);pointer-events:none}
.wiki-cat-card:hover{border-color:rgba(51,112,255,.35);box-shadow:var(--shadow-lift);transform:translateY(-3px)}
.wiki-cat-card .wc-top{display:flex;align-items:flex-start;justify-content:space-between;margin-bottom:12px}
.wiki-cat-card .wc-ic{width:42px;height:42px;border-radius:11px;background:linear-gradient(135deg,var(--pri),#8a5bff);color:#fff;display:grid;place-items:center;flex:none}
.wiki-cat-card .wc-ic .ic{width:22px;height:22px;stroke:#fff}
.wiki-cat-card .wc-act{opacity:1;transition:opacity .15s;display:flex;gap:4px}
.wiki-cat-card:hover .wc-act{opacity:1}
.wiki-cat-card h4{margin:4px 0 6px;font-size:15px;font-weight:600}
.wiki-cat-card .wc-act .btn-icon{width:30px;height:30px}
.wiki-inside-empty{grid-column:1/-1;text-align:center;padding:60px 20px;color:var(--mut)}

@media(max-width:680px){
  .home-crumb{padding:10px 16px}
  .wiki-grid{padding:14px;gap:12px;grid-template-columns:repeat(auto-fill,minmax(150px,1fr))}
  .wiki-inside{padding:14px}
  .wiki-inside-grid{grid-template-columns:repeat(auto-fill,minmax(150px,1fr))}
  .home-row.trash-row{grid-template-columns:1fr auto}
  .home-row.trash-row .col-location{display:none}
}

/* 知识库卡片内页预览 */
.wc-meta{margin:0 0 8px;color:var(--mut);font-size:12px}
.wc-pages{list-style:none;padding:0;margin:10px 0 0;flex:1;display:flex;flex-direction:column;gap:2px}
.wc-pages li{display:flex;align-items:center;gap:8px;font-size:12.5px;color:var(--mut);padding:6px 0;border-top:1px solid var(--bd2);cursor:pointer;transition:color .15s}
.wc-pages li:hover{color:var(--pri)}
.wc-pages li .dot{width:5px;height:5px;border-radius:50%;background:var(--light);flex:none}
.wc-pages li{position:relative}
.wc-pages li .wc-p-title{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1}
.wc-pages li .li-act{margin-left:auto;opacity:.5;transition:opacity .15s;display:flex;gap:2px;flex:none}
.wc-pages li:hover .li-act{opacity:1}
.wc-pages li .li-act .btn-icon{width:24px;height:24px}
.wc-pages li.wc-empty{cursor:default;color:var(--light);font-style:italic}

/* 模板库分类筛选 */
.tpl-cats{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:14px}
.tpl-cats .btn{padding:5px 12px;font-size:12.5px}
.tpl-cats .btn.on{background:var(--pri-weak);color:var(--pri);border-color:var(--pri-weak)}
.type-card{position:relative}
.tpl-cat{position:absolute;top:10px;right:10px;font-size:11px;color:var(--light);background:var(--card2);padding:2px 8px;border-radius:10px}

/* 设置面板 */
.st-tabs{display:flex;gap:8px;border-bottom:1px solid var(--glass-line);margin-bottom:16px}
.st-tabs button{background:transparent;border:none;padding:8px 14px;color:var(--mut);font-size:13px;border-radius:8px;cursor:pointer;transition:all .15s}
.st-tabs button:hover{color:var(--txt)}
.st-tabs button.on{background:var(--glass-soft);color:var(--pri);font-weight:600;box-shadow:var(--shadow-glass)}
.st-panel{min-height:260px}
.st-tip{font-size:12px;color:var(--ok);margin-top:10px;min-height:18px}
.avatar-upload{display:flex;align-items:center;gap:14px;margin-bottom:14px}
.avatar-upload .avatar{width:64px;height:64px;font-size:24px;cursor:pointer;position:relative;overflow:hidden}
.avatar-upload input{display:none}
.avatar-upload .hint{font-size:12px;color:var(--mut);margin:6px 0 0}
#homeSettingsBtn{margin-left:auto;color:var(--mut)}
#homeSettingsBtn:hover{color:var(--txt)}

/* 登录设置面板 */
.lg-sec{border:1px solid var(--glass-line);border-radius:12px;padding:12px 14px;margin-bottom:14px;background:var(--glass-soft);backdrop-filter:blur(var(--blur-sm)) saturate(160%);-webkit-backdrop-filter:blur(var(--blur-sm)) saturate(160%)}
.lg-switch{display:flex;align-items:center;gap:9px;font-size:14px;font-weight:500;color:var(--txt);cursor:pointer;user-select:none}
.lg-switch input{width:16px;height:16px;accent-color:var(--pri);cursor:pointer;margin:0}
.lg-sec .hint{font-size:12px;color:var(--mut);margin:8px 0 0;line-height:1.6}
.lg-sec .field{margin:10px 0 0}
.lg-sec code{background:var(--bg);padding:1px 6px;border-radius:4px;font-size:11px;word-break:break-all}

/* 用户管理 */
.um-wrap{min-width:min(680px,86vw)}
.um-bar{display:flex;gap:10px;align-items:center;margin-bottom:12px}
.um-bar .inp{flex:1}
.um-list{max-height:52vh;overflow:auto;border:1px solid var(--glass-line);border-radius:12px;background:var(--glass-soft);backdrop-filter:blur(var(--blur-sm)) saturate(160%);-webkit-backdrop-filter:blur(var(--blur-sm)) saturate(160%);box-shadow:var(--shadow-glass)}
.um-empty{padding:28px;text-align:center;color:var(--mut);font-size:13px;margin:0}
.um-row{display:flex;align-items:center;gap:12px;padding:11px 13px;border-bottom:1px solid var(--glass-line)}
.um-row:last-child{border-bottom:none}
.um-row:hover{background:var(--glass-thin)}
.um-row.off{opacity:.55}
.um-avatar{width:36px;height:36px;flex:0 0 36px;border-radius:50%;background:var(--pri-weak);color:var(--pri);display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:600;overflow:hidden}
.um-avatar img{width:100%;height:100%;object-fit:cover}
.um-info{flex:1;min-width:0}
.um-name{font-size:14px;color:var(--txt);display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.um-sub{font-size:12px;color:var(--mut);margin-top:2px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.um-tag{font-style:normal;font-size:10px;padding:1px 6px;border-radius:8px;background:var(--pri-weak);color:var(--pri)}
.um-tag.off{background:rgba(148,148,148,.18);color:var(--mut)}
.um-ops{display:flex;gap:6px;flex-shrink:0}
.btn.sm{padding:4px 9px;font-size:12px;border-radius:6px}
.btn.sm:disabled{opacity:.4;cursor:not-allowed}
.um-roles{display:flex;flex-wrap:wrap;gap:8px 14px;padding:8px 0}
.um-role{display:flex;align-items:center;gap:6px;font-size:13px;color:var(--txt);cursor:pointer}
.um-role input{width:15px;height:15px;accent-color:var(--pri);margin:0;cursor:pointer}
@media (max-width:640px){
  .um-wrap{min-width:auto}
  .um-row{flex-wrap:wrap}
  .um-ops{width:100%;justify-content:flex-end;flex-wrap:wrap}
}