/* 耘禾工作台 —— 组件样式 */
.ic{width:17px;height:17px;stroke:currentColor;fill:none;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round;flex:none}

/* ===== 登录页 ===== */
.login-wrap{display:flex;min-height:100vh}
/* 登录页品牌区：必须用主题变量，不能写死颜色。
   原先写死 #232742（深靛蓝近黑），导致登录页永远是一副深色面孔、不跟随站点主题。
   改用 --sb / --sb-tx / --sb-mut（各主题的侧栏配色），切主题时登录页一起变。 */
.login-brand{flex:1.1;background:var(--sb);color:var(--sb-tx);display:flex;flex-direction:column;justify-content:center;padding:60px 64px;position:relative;overflow:hidden}
.login-brand .lg-logo{display:flex;align-items:center;gap:14px;margin-bottom:36px}
.login-brand .lg-logo .mk{width:52px;height:52px;border-radius:14px;background:#35d0a5;display:grid;place-items:center}
.login-brand h1{font-size:34px;margin:0 0 14px;font-weight:600;letter-spacing:1px}
.login-brand .slogan{font-size:19px;color:var(--sb-mut);margin:0 0 44px;line-height:1.8}
.login-brand .feats{display:flex;gap:26px;color:var(--sb-tx);opacity:.82;font-size:14px}
.login-brand .feats div{display:flex;align-items:center;gap:8px}
.login-form-side{flex:1;background:var(--bg);display:grid;place-items:center;padding:40px}
.login-mobile-brand{display:none}
.login-card{background:var(--card);border:1px solid var(--bd);border-radius:var(--radius-lg);box-shadow:var(--shadow);padding:42px 44px;width:380px;max-width:100%;box-sizing:border-box}
.login-card h2{margin:0 0 4px;font-size:22px}
.login-card .sub{color:var(--mut);font-size:13.5px;margin-bottom:26px}
.field{margin-bottom:16px}
.field label{display:block;font-size:13px;color:var(--mut);margin-bottom:6px}
.field input,.field select,.field textarea{width:100%;border:1.5px solid var(--bd);border-radius:var(--radius-sm);padding:10px 14px;font:14px var(--font);background:var(--card);color:var(--tx);outline:none;transition:border-color .15s, box-shadow .15s;box-sizing:border-box}
.pwd-wrap{position:relative;display:flex;align-items:center}
.pwd-wrap input{padding-right:40px!important}
.pwd-toggle{position:absolute;right:8px;background:none;border:none;padding:4px;color:var(--mut);cursor:pointer;display:grid;place-items:center}
.pwd-toggle:hover{color:var(--pri)}
.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--pri);box-shadow:0 0 0 3px var(--pri-soft)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:none;border-radius:var(--radius-sm);padding:10px 22px;font-size:14px;cursor:pointer;transition:transform .12s, opacity .15s;background:var(--pri);color:#fff}
.btn:active{transform:scale(.97)}
.btn:disabled{opacity:.5;cursor:not-allowed}
.btn.ghost{background:transparent;border:1.5px solid var(--bd);color:var(--tx)}
.btn.ghost:hover{border-color:var(--pri);color:var(--pri)}
.btn.danger{background:var(--danger)}
.btn.sm{padding:5px 13px;font-size:12.5px;border-radius:7px}
.btn.block{width:100%;padding:12px;font-size:15px}
.form-err{background:#fcebeb;color:#a32d2d;border-radius:var(--radius-sm);padding:9px 14px;font-size:13px;margin-bottom:14px}
[data-theme="obsidian"] .form-err{background:rgba(226,75,74,.15);color:#f09595}
.form-ok{background:#eaf3de;color:#3b6d11;border-radius:var(--radius-sm);padding:9px 14px;font-size:13px;margin-bottom:14px}
.hint{font-size:12.5px;color:var(--mut);margin-top:14px;text-align:center}

/* ===== 主框架 ===== */
.shell{display:flex;height:100vh;overflow:hidden}
.sb{width:224px;flex:none;background:var(--sb);color:var(--sb-tx);display:flex;flex-direction:column;padding:14px 10px;transition:width .35s cubic-bezier(.4,0,.2,1);overflow:visible}
.sb nav-area{display:block}
.sb .navscroll{flex:1;overflow-y:auto;overflow-x:hidden;min-height:0;margin-right:-4px;padding-right:4px}
.sb .navscroll::-webkit-scrollbar{width:4px}
.sb .navscroll::-webkit-scrollbar-thumb{background:rgba(128,128,128,.3);border-radius:2px}
.sb .sb-brand,.sb .sb-user{overflow:hidden}
.sb .sb-pin{flex:none;border-top:1px solid rgba(255,255,255,.08);margin-top:8px;padding-top:6px}
[data-theme="spruce"] .sb .sb-pin,[data-theme="notion"] .sb .sb-pin,[data-theme="corporate"] .sb .sb-pin{border-top-color:var(--bd)}
.shell.folded .sb{width:60px}
.sb-brand{display:flex;align-items:center;gap:10px;padding:4px 10px 16px;font-weight:600;white-space:nowrap}
.sb-brand .mk{width:32px;height:32px;flex:none;border-radius:9px;background:#35d0a5;display:grid;place-items:center}
.sb-brand .btxt{display:flex;flex-direction:column;line-height:1.22;min-width:0}
.sb-brand .btxt b{font-size:15px;font-weight:700;letter-spacing:.5px}
.sb-brand .btxt small{font-size:11px;color:var(--sb-mut);font-weight:400}
.sb-brand .lb,.sb .it .lb,.sb .grp{transition:opacity .18s}
.shell.folded .sb-brand .btxt,.shell.folded .sb .it .lb,.shell.folded .sb .grp{opacity:0;pointer-events:none}
.sb .grp{font-size:11px;color:var(--sb-mut);padding:12px 12px 4px;white-space:nowrap;letter-spacing:1px}
.sb .it{display:flex;align-items:center;gap:10px;padding:8px 12px;border-radius:9px;color:var(--sb-mut);cursor:pointer;white-space:nowrap;margin:1px 0;position:relative;transition:background .15s,color .15s;text-decoration:none}
.sb .it:hover{color:var(--sb-tx);background:rgba(255,255,255,.06)}
.sb .it.on{color:var(--sb-tx);background:rgba(255,255,255,.08);font-weight:600}
[data-theme="spruce"] .sb .it:hover{color:var(--sb-active);background:var(--pri-soft)}
[data-theme="spruce"] .sb .it.on{color:var(--sb-active);background:var(--pri-soft)}
.sb .it.on::before{content:"";position:absolute;left:-10px;top:22%;bottom:22%;width:3px;border-radius:3px;background:var(--sb-active)}
.sb-user{margin-top:auto;display:flex;align-items:center;gap:10px;padding:10px;border-top:1px solid rgba(255,255,255,.08);white-space:nowrap}
[data-theme="spruce"] .sb-user{border-top-color:var(--bd)}
.ava{width:30px;height:30px;flex:none;border-radius:50%;background:var(--acc-soft);color:var(--acc);display:grid;place-items:center;font-size:13px;font-weight:600}
.sb-user .nm{font-size:13.5px}
.sb-user .rl{font-size:11px;color:var(--sb-mut)}

.main{flex:1;display:flex;flex-direction:column;min-width:0;min-height:0}
.top{display:flex;align-items:center;gap:14px;padding:12px 22px;border-bottom:1px solid var(--bd);background:var(--card)}
.crumb{font-size:13px;color:var(--mut)}
.searchbox{flex:0 1 320px;margin:0 auto;display:flex;align-items:center;gap:8px;background:var(--bg);border:1px solid var(--bd);border-radius:999px;padding:7px 16px;color:var(--mut);font-size:12.5px;cursor:pointer;transition:border-color .15s}
.searchbox:hover{border-color:var(--pri)}
.searchbox kbd{margin-left:auto;border:1px solid var(--bd);border-radius:5px;padding:0 6px;font-size:10.5px;font-family:inherit}
.top .r{display:flex;align-items:center;gap:10px;margin-left:auto}
.aibtn{display:flex;align-items:center;gap:6px;background:var(--acc-soft);color:var(--acc);border:none;border-radius:9px;padding:7px 14px;font-size:12.5px;font-weight:600;cursor:pointer;transition:transform .12s}
.aibtn:active{transform:scale(.95)}
.bell{position:relative;color:var(--mut);cursor:pointer;background:none;border:none;padding:4px}
.bell i{position:absolute;top:2px;right:3px;width:7px;height:7px;border-radius:50%;background:var(--danger)}
/* 未读角标（数字） */
.bell .bell-dot{position:static;width:auto;height:auto;min-width:16px;padding:0 4px;border-radius:9px;
  background:var(--danger);color:#fff;font-size:10.5px;font-weight:700;line-height:16px;text-align:center;
  position:absolute;top:-2px;right:-4px;font-style:normal}

/* ===== 站内通知面板 ===== */
.npanel-mask{position:fixed;inset:0;z-index:120;background:rgba(15,18,30,.28);animation:fadeIn .16s}
.npanel{position:absolute;top:60px;right:18px;width:390px;max-width:calc(100vw - 24px);max-height:76vh;
  display:flex;flex-direction:column;background:var(--card);border:1px solid var(--bd);border-radius:var(--radius-lg);
  box-shadow:0 20px 50px rgba(15,20,40,.22);overflow:hidden;animation:pop .2s cubic-bezier(.34,1.3,.64,1)}
.nhead{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:14px 16px;border-bottom:1px solid var(--bd)}
.nhead b{font-size:14.5px}
.nhead span{display:flex;align-items:center;gap:6px}
.nclose{background:none;border:none;color:var(--mut);font-size:16px;cursor:pointer;padding:4px 8px;border-radius:8px;line-height:1}
.nclose:hover{background:var(--bg);color:var(--tx)}
.nlist{flex:1;overflow-y:auto;min-height:0;padding:6px 8px}
.nitem{padding:10px 12px;border-radius:10px;cursor:pointer;transition:background .15s}
.nitem:hover{background:var(--bg)}
.nitem .ntop{display:flex;align-items:center;gap:7px}
.nitem .ndot{width:7px;height:7px;border-radius:50%;background:transparent;flex:none}
.nitem.unread .ndot{background:var(--pri)}
.nitem b{font-size:13.5px;font-weight:600}
.nitem.imp b{color:var(--danger)}
.nitem .ntime{margin-left:auto;font-size:11px;color:var(--mut);flex:none}
.nitem .nmeta{font-size:11.5px;color:var(--mut);margin:3px 0 0 14px}
.nitem .nbody{font-size:12.5px;color:var(--mut);margin:4px 0 0 14px;white-space:pre-wrap;line-height:1.6;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.nitem.open .nbody{-webkit-line-clamp:unset;overflow:visible;color:var(--tx)}
.nfoot{border-top:1px solid var(--bd);padding:11px 16px;text-align:center;font-size:12.5px}
.nfoot a{color:var(--pri);text-decoration:none}
/* 通知页未读态 */
.panel.nunread{border-left:3px solid var(--pri)}

/* ===== AI 助手（会话列表 + 聊天区） ===== */
.aiwrap{display:grid;grid-template-columns:250px 1fr;gap:14px;align-items:start}
.aiconv{min-width:0}
.aichat{display:flex;flex-direction:column;height:60vh;min-width:0}
#chat{flex:1;overflow-y:auto;min-height:0;padding:4px 2px}
.ainput{display:flex;gap:10px;border-top:1px solid var(--bd);padding-top:12px}
.ainput input{flex:1;min-width:0;border:1.5px solid var(--bd);border-radius:9px;padding:10px 14px;font:14px var(--font);background:var(--card);color:var(--tx);outline:none}
.ainput input:focus{border-color:var(--pri);box-shadow:0 0 0 3px var(--pri-soft)}
.msgrow{border:none!important;padding:6px 2px!important;align-items:flex-end}
.bub{padding:8px 14px;max-width:82%;font-size:13.5px;line-height:1.6;white-space:pre-wrap;word-break:break-word}
.bub.me{background:var(--pri);color:#fff;border-radius:12px 12px 4px 12px}
.bub.ai{background:var(--bg);color:var(--tx);border-radius:12px 12px 12px 4px;border:1px solid var(--bd)}
.convlist{display:flex;flex-direction:column;gap:4px;max-height:48vh;overflow-y:auto;min-width:0}
.conv{position:relative;display:block;border:1px solid var(--bd);border-radius:10px;padding:9px 30px 9px 11px;cursor:pointer;background:var(--card);transition:border-color .15s,background .15s;min-width:0}
.conv:hover{border-color:var(--pri)}
.conv.on{border-color:var(--pri);background:var(--pri-soft)}
.conv .cv-t{display:block;font-size:13px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.conv .cv-m{display:block;font-size:11px;color:var(--mut);margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.conv .cv-del{position:absolute;top:6px;right:6px;width:22px;height:22px;border:none;border-radius:6px;background:none;color:var(--mut);cursor:pointer;font-size:12px;line-height:1;opacity:0;transition:opacity .15s}
.conv:hover .cv-del{opacity:1}
.conv .cv-del:hover{background:var(--danger);color:#fff}
@media (max-width:768px){
  .aiwrap{grid-template-columns:1fr}
  .aichat{height:56vh}
  .aiconv .convlist{max-height:34vh}
  .aiconv.conv-hidden .convlist{display:none}
  .conv .cv-del{opacity:1}
}

/* ===== 即时消息（老师之间私聊 + 群聊） ===== */
.sb .it .nav-badge{position:absolute;top:6px;right:8px;min-width:16px;height:16px;padding:0 4px;border-radius:9px;
  background:var(--danger);color:#fff;font-size:10px;font-weight:700;line-height:16px;text-align:center;font-style:normal;white-space:nowrap}
.shell.folded .sb .it .nav-badge{top:2px;right:2px}
.chatwrap{display:grid;grid-template-columns:292px 1fr;gap:14px;align-items:stretch;height:calc(100vh - 190px);min-height:440px}
.chatlist{min-width:0;display:flex;flex-direction:column}
.chatlist-head{display:flex;gap:8px;margin-bottom:10px}
.chatlist-head .btn{flex:1;min-width:0;white-space:nowrap}
.chatconvlist{flex:1;max-height:none;overflow-y:auto;min-height:0}
.chatconv{display:flex;align-items:center;gap:10px;padding:10px 12px 10px 11px}
.ch-ava{width:36px;height:36px;flex:none;border-radius:50%;background:var(--pri-soft);color:var(--pri);display:grid;place-items:center;font-size:14px;font-weight:600}
.ch-ava-sm{width:26px;height:26px;font-size:12px}
.ch-mid{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.ch-mid .cv-t{display:flex;align-items:center;gap:6px}
.ch-grp{font-style:normal;font-weight:400;font-size:10.5px;color:var(--mut);background:var(--bg);border-radius:6px;padding:1px 6px;flex:none}
.chat-unread{flex:none;min-width:17px;height:17px;padding:0 5px;border-radius:9px;background:var(--danger);color:#fff;font-size:10.5px;font-weight:700;line-height:17px;text-align:center;font-style:normal}
.chatwin{display:flex;flex-direction:column;min-width:0;min-height:0}
.chatwin-head{flex:none;font-size:14px;font-weight:600;padding:2px 4px 12px;border-bottom:1px solid var(--bd);margin-bottom:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.chatbox{flex:1;overflow-y:auto;min-height:0;padding:4px 2px}
.bub-other{display:flex;flex-direction:column;gap:3px;max-width:82%;align-items:flex-start;min-width:0}
.bub-name{font-size:11px;color:var(--mut);padding-left:2px}
.pick-list{max-height:44vh;overflow-y:auto;border:1px solid var(--bd);border-radius:10px;margin:2px 0 12px}
.pick-item{border:none!important;border-bottom:1px solid var(--bd)!important;border-radius:0!important;padding:9px 12px!important;cursor:pointer}
.pick-item:last-child{border-bottom:none!important}
.pick-item:hover{background:var(--bg)}
.pick-item input[type="checkbox"]{width:16px;height:16px;accent-color:var(--pri);cursor:pointer}
@media (max-width:900px){
  .chatwrap{grid-template-columns:1fr;height:auto;min-height:0}
  .chatconvlist{max-height:40vh}
  .chatwin{height:64vh;min-height:380px}
}

/* AI 模型列表行 */
#modelList .todo-row{align-items:center}
#modelList .row-off{opacity:.5}
#modelList .mdl-main{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
#modelList .mdl-main b{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#modelList .mdl-sub{font-size:11.5px;color:var(--mut);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#modelList .mdl-badges{display:flex;gap:5px;flex:none}
#modelList .mdl-acts{display:flex;gap:5px;flex:none;flex-wrap:wrap;justify-content:flex-end}
@media (max-width:768px){
  #modelList .mdl-badges,#modelList .mdl-acts{flex:1 1 100%!important;justify-content:flex-start}
  #modelList .mdl-sub{white-space:normal!important}
}
/* 侧栏收起/展开按钮：图标 + 文字，一眼看得懂 */
.foldbtn{display:inline-flex;align-items:center;gap:6px;height:32px;padding:0 11px 0 9px;border-radius:9px;
  border:1px solid var(--bd);background:var(--card);color:var(--mut);cursor:pointer;
  font:500 12.5px/1 var(--font);white-space:nowrap;flex:none;transition:background .15s,border-color .15s,color .15s}
.foldbtn:hover{color:var(--pri);border-color:var(--pri);background:var(--pri-soft)}
.foldbtn .fl{display:inline}
.foldbtn .ic{width:17px;height:17px;flex:none}

.body{flex:1;overflow-y:auto;overflow-x:hidden;min-height:0;padding:22px 22px 78px;-webkit-overflow-scrolling:touch}
.page-title{font-size:22px;margin:0 0 4px}
.page-sub{color:var(--mut);font-size:13.5px;margin-bottom:20px}

/* ===== 卡片与面板 ===== */
.cards4{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:18px}
.stat{background:var(--card);border:1px solid var(--bd);border-radius:var(--radius);padding:16px 18px;transition:transform .18s, box-shadow .18s;animation:rise .45s both}
.stat:nth-child(2){animation-delay:.06s}.stat:nth-child(3){animation-delay:.12s}.stat:nth-child(4){animation-delay:.18s}
.stat:hover{transform:translateY(-2px);box-shadow:var(--shadow)}
.stat .t{font-size:12.5px;color:var(--mut);display:flex;justify-content:space-between;align-items:center}
.stat .n{font-size:26px;font-weight:700;font-variant-numeric:tabular-nums;margin-top:4px}
.stat .n small{font-size:12.5px;font-weight:400;color:var(--mut)}
.stat .icn{width:30px;height:30px;border-radius:8px;display:grid;place-items:center;background:var(--pri-soft);color:var(--pri)}
.stat.acc .icn{background:var(--acc-soft);color:var(--acc)}
@keyframes rise{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}

.panel{background:var(--card);border:1px solid var(--bd);border-radius:var(--radius);padding:18px 20px;margin-bottom:16px}
.panel h3{margin:0 0 12px;font-size:15px;display:flex;justify-content:space-between;align-items:center}
.panel h3 small{color:var(--mut);font-weight:400;font-size:12.5px}
.grid2{display:grid;grid-template-columns:1.5fr 1fr;gap:16px}
.empty{color:var(--mut);text-align:center;padding:26px 0;font-size:13.5px}

/* ===== 待办 ===== */
.todo-row{display:flex;align-items:center;gap:10px;padding:9px 6px;border-bottom:1px solid var(--bd);font-size:13.5px}
.todo-row:last-child{border:none}
.todo-row span[style*="flex:1"]{word-break:break-word;white-space:normal;overflow-wrap:anywhere;min-width:0;line-height:1.5}
/* 方形复选框（打勾） */
.todo-ck{width:18px;height:18px;flex:none;border-radius:5px;border:1.5px solid var(--mut);cursor:pointer;transition:all .15s;display:grid;place-items:center;color:transparent;background:var(--card)}
.todo-ck:hover{border-color:var(--ok);background:var(--pri-soft)}
.todo-ck.done{background:var(--ok);border-color:var(--ok);color:#fff}
.todo-ck svg{display:block}
/* 完成后整行变灰 + 内容删除线（保留在列表里，不消失） */
.todo-row.done{opacity:.55}
.todo-row.done .ct{text-decoration:line-through;color:var(--mut)}
.todo-row.done .tm,.todo-row.done .pri{opacity:.7}
.todo-row .tm{margin-left:auto;font-size:11.5px;color:var(--mut);white-space:nowrap;flex:none}
/* 手机端列表堆叠规则见文件末尾 @media(max-width:768px) */
.pri{font-size:11px;border-radius:6px;padding:1px 8px;white-space:nowrap}
.pri.urgent{background:#fcebeb;color:#a32d2d}.pri.high{background:var(--acc-soft);color:var(--acc)}
.pri.normal{background:var(--pri-soft);color:var(--pri)}.pri.low{background:var(--bg);color:var(--mut)}
.pri.overdue{background:#fcebeb;color:#a32d2d}

.quickadd{display:flex;gap:10px;margin-bottom:14px}
.quickadd input{flex:1}
.chips{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:14px}
.chip{border:1px solid var(--bd);background:var(--card);color:var(--mut);border-radius:999px;padding:4px 14px;font-size:12.5px;cursor:pointer;transition:all .15s}
.chip.on{background:var(--pri);border-color:var(--pri);color:#fff}

/* ===== 快速开始 ===== */
.qstart{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.qitem{display:flex;align-items:center;gap:12px;background:var(--card);border:1px solid var(--bd);border-radius:var(--radius);padding:14px 16px;cursor:pointer;transition:all .18s;text-align:left}
.qitem:hover{transform:translateY(-2px);box-shadow:var(--shadow);border-color:var(--pri)}
.qitem .icn{width:34px;height:34px;border-radius:9px;background:var(--pri-soft);color:var(--pri);display:grid;place-items:center;flex:none}
.qitem b{font-size:13.5px;display:block}
.qitem span{font-size:11.5px;color:var(--mut)}

/* ===== 表格（桌面：正常表格；手机：见下方卡片式适配） ===== */
table.tbl{width:100%;border-collapse:collapse;font-size:13.5px}
.tbl th,.tbl td{padding:9px 12px;text-align:left;border-bottom:1px solid var(--bd)}
.tbl th{color:var(--mut);font-weight:500;font-size:12.5px;white-space:nowrap}
.tbl td{word-break:break-word;overflow-wrap:anywhere}
.tbl tr:hover td{background:var(--bg)}
.rolebadge{font-size:11.5px;border-radius:6px;padding:2px 9px;background:var(--pri-soft);color:var(--pri)}
.rolebadge.admin{background:var(--acc-soft);color:var(--acc)}
.statusdot{display:inline-flex;align-items:center;gap:6px;font-size:12.5px}
.statusdot::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--ok)}
.statusdot.off::before{background:var(--danger)}

/* ===== 底部抽屉（移动端） ===== */
.sheet-mask{position:fixed;inset:0;background:rgba(0,0,0,.4);z-index:100;opacity:0;transition:opacity .2s;pointer-events:none}
.sheet-mask.on{opacity:1;pointer-events:auto}
.sheet{position:fixed;bottom:0;left:0;right:0;background:var(--card);border-radius:16px 16px 0 0;padding:20px 16px calc(env(safe-area-inset-bottom) + 16px);transform:translateY(100%);transition:transform .25s ease}
.sheet-mask.on .sheet{transform:none}
.sheet-act{display:block;width:100%;padding:14px;border:none;background:transparent;text-align:center;font-size:16px;border-bottom:1px solid var(--bd)}
.sheet-act:active{background:var(--bg)}
.sheet-act.danger{color:var(--danger)}

/* ===== 弹窗（必须 position:fixed 居中，否则沉到页面下方） ===== */
.modal-mask{position:fixed;inset:0;background:rgba(20,20,40,.45);display:grid;place-items:center;z-index:50;animation:fadeIn .18s}
.modal{background:var(--card);border-radius:var(--radius-lg);padding:26px 28px;width:440px;max-width:92vw;max-height:86vh;overflow-y:auto;box-shadow:0 24px 60px rgba(0,0,0,.2);animation:pop .22s cubic-bezier(.34,1.4,.64,1)}
.modal h3{margin:0 0 16px;font-size:17px}
.modal .acts{display:flex;justify-content:flex-end;gap:10px;margin-top:20px}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}
@keyframes pop{from{opacity:0;transform:scale(.94) translateY(10px)}to{opacity:1;transform:none}}

/* ===== 通知条 ===== */
.toast{position:fixed;top:20px;left:50%;transform:translateX(-50%);background:var(--tx);color:var(--bg);border-radius:10px;padding:10px 22px;font-size:13.5px;z-index:99;animation:pop .25s;box-shadow:0 10px 30px rgba(0,0,0,.25)}

/* ===== 设置页 ===== */
.setgrid{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.theme-opts{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.theme-opt{border:2px solid var(--bd);border-radius:var(--radius);padding:12px;cursor:pointer;transition:border-color .15s;text-align:center}
.theme-opt.on{border-color:var(--pri)}
.theme-opt .pv{height:52px;border-radius:8px;margin-bottom:8px;display:flex;overflow:hidden;border:1px solid var(--bd)}
.theme-opt b{font-size:13px}
.theme-opt span{font-size:11.5px;color:var(--mut);display:block}
.badge-note{display:inline-block;background:var(--acc-soft);color:var(--acc);border-radius:6px;padding:2px 10px;font-size:12px;font-weight:600}

@media (max-width:1000px){.cards4{grid-template-columns:repeat(2,1fr)}.grid2,.setgrid{grid-template-columns:1fr}.qstart{grid-template-columns:repeat(2,1fr)}
  .login-brand{display:none}
  /* 手机端改成纵向排列：原先 .login-form-side 是 grid(place-items:center)，
     加了品牌头之后它成了第二个"格子"，两个元素被并排排放 → 卡片被顶到右侧、贴边不居中。 */
  .login-form-side{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:28px 18px}
  /* 显式给卡片定宽：flex 容器里 max-width:100% 的百分比解析不可靠（实测卡片仍是 380px、
     在 390px 屏上右侧被切 8px），所以这里直接写 width:100% + max-width 上限。 */
  .login-card{width:100%;max-width:380px;padding:32px 22px}
  /* 手机上补一个精简品牌头：原先品牌区整体隐藏后，页面只剩一张孤卡、上方大片空白 */
  .login-mobile-brand{display:flex;flex-direction:column;align-items:center;gap:10px;margin-bottom:22px}
  .login-mobile-brand .mk{width:54px;height:54px;border-radius:15px;overflow:hidden}
  .login-mobile-brand .nm{font-size:17px;font-weight:600;color:var(--tx);letter-spacing:.5px}
  .login-mobile-brand .sl{font-size:12.5px;color:var(--mut)}
}

/* ===== Notion 风交互规则：禁位移/缩放，只变色 ===== */
[data-theme="notion"] *{transition-duration:150ms!important}
[data-theme="notion"] .stat,[data-theme="notion"] .qitem,[data-theme="notion"] .panel{animation:none!important}
[data-theme="notion"] .stat:hover,[data-theme="notion"] .qitem:hover{transform:none!important;box-shadow:var(--shadow)!important}
[data-theme="notion"] .qitem:hover,[data-theme="notion"] .todo-row:hover{background:#efedea}
[data-theme="notion"] .sb{border-right:1px solid var(--bd)}
[data-theme="notion"] .sb .it:hover{background:#efedea;color:var(--tx)}
[data-theme="notion"] .sb .it.on{background:#e3e1db;color:var(--tx)}
[data-theme="notion"] .sb .it.on::before{display:none}
[data-theme="notion"] .btn:active{transform:none;filter:brightness(.95)}
[data-theme="notion"] .top{background:var(--card)}
[data-theme="notion"] .modal{box-shadow:0 4px 20px rgba(15,15,15,.12)}

/* ===== 企业简洁风交互规则：按压确认 + 焦点环 + 微浮起 ===== */
[data-theme="corporate"] *{transition-duration:200ms!important}
[data-theme="corporate"] .btn{box-shadow:0 1px 2px rgba(0,0,0,.05);font-weight:500}
[data-theme="corporate"] .btn:hover{transform:translateY(-1px);box-shadow:0 2px 4px rgba(0,0,0,.08)}
[data-theme="corporate"] .btn:active{transform:scale(.98);box-shadow:0 1px 2px rgba(0,0,0,.05)}
[data-theme="corporate"] .field input:focus,.field select:focus,.field textarea:focus{box-shadow:0 0 0 2px var(--card),0 0 0 4px var(--pri);border-color:var(--pri)}
[data-theme="corporate"] .stat:hover{transform:translateY(-2px);box-shadow:0 4px 6px rgba(0,0,0,.07)}
[data-theme="corporate"] .sb{border-right:1px solid var(--bd)}
[data-theme="corporate"] .sb .it:hover{background:var(--pri-soft);color:var(--pri)}
[data-theme="corporate"] .sb .it.on{background:var(--pri-soft);color:var(--pri)}

/* ===== 材料设计交互规则：海拔物理 + 标准缓动 + 按压涟漪 ===== */
[data-theme="material"] *{transition-timing-function:cubic-bezier(0.4,0,0.2,1)!important;transition-duration:250ms!important}
[data-theme="material"] .btn,[data-theme="material"] .stat,[data-theme="material"] .panel,[data-theme="material"] .qitem{box-shadow:0 1px 3px rgba(0,0,0,.12),0 1px 2px rgba(0,0,0,.14)}
[data-theme="material"] .btn:hover,[data-theme="material"] .stat:hover,[data-theme="material"] .qitem:hover{box-shadow:var(--shadow-hover);transform:translateY(-2px)}
[data-theme="material"] .btn:active{transform:scale(.98);box-shadow:0 1px 3px rgba(0,0,0,.12),0 1px 2px rgba(0,0,0,.14)}
[data-theme="material"] .field input:focus,[data-theme="material"] .field select:focus,[data-theme="material"] .field textarea:focus{border-color:var(--pri);box-shadow:0 0 0 1px var(--pri)}
[data-theme="material"] .sb{border-right:1px solid var(--bd)}
[data-theme="material"] .sb .it:hover{background:var(--pri-soft);color:var(--pri)}
[data-theme="material"] .sb .it.on{background:var(--pri-soft);color:var(--pri)}
[data-theme="material"] .modal{box-shadow:0 10px 20px rgba(0,0,0,.15),0 3px 6px rgba(0,0,0,.1)}

/* ===== 侧栏折叠后的文字提示（JS 生成 .nav-tip，position:fixed 不受 overflow 裁剪） ===== */
.nav-tip{position:fixed;transform:translateY(-50%);background:var(--tx);color:var(--bg);padding:5px 12px;border-radius:8px;font-size:12.5px;font-weight:500;z-index:200;pointer-events:none;box-shadow:0 8px 24px rgba(0,0,0,.25);white-space:nowrap}

/* ===== 手机端适配（≤768px）===== */
.tablewrap{overflow-x:auto;-webkit-overflow-scrolling:touch}
@media (max-width:768px){
  .shell{flex-direction:column}
  .sb{position:fixed;left:0;top:0;bottom:0;z-index:60;transform:translateX(-100%);transition:transform .25s ease;box-shadow:0 0 40px rgba(0,0,0,.25);width:240px!important}
  .shell.mopen .sb{transform:translateX(0)}
  .shell.folded .sb{width:240px!important}
  .main{width:100%;min-width:0}
  .body{padding:14px 12px calc(14px + env(safe-area-inset-bottom));overflow-x:hidden;overflow-y:auto}
  .top{padding:10px 12px;gap:8px}
  .crumb{display:none}
  .searchbox{flex:1;max-width:none;margin:0;min-width:0}
  .searchbox kbd{display:none}
  .top .r{gap:6px;flex:none}
  .top .aibtn{padding:7px 10px;font-size:12px}
  .top .aibtn{display:none}
  /* 手机顶栏窄：折叠按钮只留图标 */
  .foldbtn{padding:0;width:34px;justify-content:center}
  .foldbtn .fl{display:none}
  .cards4{grid-template-columns:repeat(2,1fr);gap:10px}
  .stat{padding:12px 14px;min-width:0}
  .stat .n{font-size:22px}
  .qstart{grid-template-columns:1fr!important;gap:8px}
  .qitem{padding:12px;min-width:0;width:100%;box-sizing:border-box}
  .qitem b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:block}
  .qitem span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:block}
  .page-title{font-size:19px}
  .modal{width:94vw;padding:20px}
  .quickadd{flex-wrap:wrap}
  .quickadd input{min-width:100%}
  .grid2{grid-template-columns:1fr}
  /* 通知面板：手机端贴顶全宽 */
  .npanel{top:52px;right:8px;left:8px;width:auto;max-width:none;max-height:72vh}
  .nitem{padding:12px 10px}

  /* ===== 表格 → 卡片式（手机端核心适配） ===== */
  .panel{overflow-x:visible}
  table.tbl.tbl-cards{min-width:0;table-layout:auto;width:100%;display:block}
  table.tbl.tbl-cards thead{display:none}
  table.tbl.tbl-cards tbody{display:block}
  table.tbl.tbl-cards tr{display:block;background:var(--card);border:1px solid var(--bd);border-radius:10px;padding:10px 12px;margin-bottom:10px}
  table.tbl.tbl-cards tr:hover td{background:transparent}
  table.tbl.tbl-cards td{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;border:none;padding:5px 0;white-space:normal;word-break:normal;overflow-wrap:anywhere;text-align:right;font-size:13.5px}
  table.tbl.tbl-cards td::before{content:attr(data-label);flex:none;color:var(--mut);font-size:12px;text-align:left;max-width:44%}
  table.tbl.tbl-cards td[data-label=""]{justify-content:flex-start;text-align:left}
  table.tbl.tbl-cards td[data-label=""]::before{display:none}
  /* 操作列（按钮）单独一行左对齐 */
  table.tbl.tbl-cards td .btn{margin:2px 0 2px 8px}
  /* 课表保持横向滚动（不转卡片） */
  #scGrid{overflow-x:auto}
  #scGrid table.tbl{min-width:640px}

  /* ===== 列表项 → 上下堆叠（解决长文本竖排） =====
     注意：HTML 里写的是内联 style="flex:1"，优先级高于外部 CSS，
     必须用 !important 才能覆盖，否则长文本会被压成一字一行的竖排。 */
  .todo-row,.qitem{flex-wrap:wrap;gap:6px 10px;align-items:center}
  .todo-row span[style*="flex:1"],.qitem span[style*="flex:1"],.todo-row .ct{
    flex:1 1 100%!important;min-width:0!important;white-space:normal!important;
    word-break:normal;overflow-wrap:anywhere;line-height:1.6;text-align:left}
  .todo-row b,.qitem b{white-space:normal;word-break:break-word;overflow-wrap:anywhere;line-height:1.4}
  .todo-row .tm{margin-left:auto;flex:none}
  /* 行内操作按钮紧凑排列，避免换行错位 */
  .todo-row .btn,.qitem .btn{flex:none}
  .todo-row .btn.sm{padding:6px 10px;font-size:12px}
  .todo-row .pri{flex:none}
  .panel h3{gap:8px;flex-wrap:wrap}
  .panel h3 span{flex:none}
  /* 触控目标加大到 40px */
  .sb .it{padding:11px 12px}
  .todo-row{padding:12px 6px}
  .btn.sm{padding:7px 14px}
  .navmask{position:fixed;inset:0;background:rgba(0,0,0,.4);z-index:55;opacity:0;pointer-events:none;transition:opacity .2s}
  .shell.mopen .navmask{opacity:1;pointer-events:auto}
}
@media (min-width:769px){.navmask{display:none}}

/* 高度用 dvh（手机地址栏自适应），不支持的回退 vh */
.shell{height:100vh;height:100dvh}
.login-wrap{min-height:100vh;min-height:100dvh}

@media (prefers-reduced-motion: reduce){*{animation:none!important;transition:none!important}}

/* ================= 马卡龙靛蓝（mist）界面细化 · 对齐原设计图 ================= */
/* Hero 横幅：主色实底圆角横条 + 白色衬线问候 + 白色小字 + 扁平插画 */
.hero{background:var(--pri);border-radius:var(--radius);padding:24px 28px;display:flex;align-items:center;
  justify-content:space-between;gap:20px;margin-bottom:16px}
.hero-greet{font-size:24px;margin:0 0 6px;color:#fff;font-weight:700;letter-spacing:.2px;line-height:1.3;
  text-wrap:balance;word-break:keep-all}
.hero-sub{margin:0;color:rgba(255,255,255,.82);font-size:13px;line-height:1.6}
.hero-art{flex:none}
.hero-svg{display:block}

/* 顶栏用户信息：圆形头像 + 橙色姓名（原图特征） */
.top-user{display:flex;align-items:center;gap:7px;white-space:nowrap}
.top-user .ava-sm{width:26px;height:26px;border-radius:50%;background:#fff;color:var(--pri);
  display:grid;place-items:center;font-size:12px;font-weight:700;flex:none;border:1px solid var(--bd)}
.top-user .nm{font-size:12.5px;font-weight:600;color:var(--acc)}

/* 悬浮新建按钮（原图右下角主色方钮 + 白色加号） */
.fab{position:fixed;right:22px;bottom:22px;width:46px;height:46px;border-radius:12px;border:none;
  background:var(--pri);color:#fff;display:grid;place-items:center;cursor:pointer;z-index:40;
  transition:filter .15s,box-shadow .15s,transform .12s}
.fab:hover{filter:brightness(.9);box-shadow:0 6px 18px rgba(35,35,58,.2)}
.fab:active{transform:scale(.96)}
.fab .ic{width:20px;height:20px}

/* 粉彩统计卡：三颗粉彩轮换，文字深灰蓝（原图事件卡/会议卡做法） */
[data-theme="mist"] .cards4 .stat{border-color:transparent;background:#c6eadc}
[data-theme="mist"] .cards4 .stat:nth-child(2){background:#d8d8f0}
[data-theme="mist"] .cards4 .stat:nth-child(3){background:#fed8c5}
[data-theme="mist"] .cards4 .stat:nth-child(4){background:#d8d8f0}
[data-theme="mist"] .cards4 .stat .t,
[data-theme="mist"] .cards4 .stat .n,
[data-theme="mist"] .cards4 .stat .n small{color:#55586b}
[data-theme="mist"] .cards4 .stat .icn{background:rgba(255,255,255,.66);color:#4948c7}
[data-theme="mist"] .cards4 .stat.acc .icn{background:rgba(255,255,255,.66);color:#e4874a}
/* 粉彩块 hover = 同族加深一档（不做位移/投影，保持扁平） */
[data-theme="mist"] .cards4 .stat:hover{transform:none;box-shadow:none;background:#b4e2d0}
[data-theme="mist"] .cards4 .stat:nth-child(2):hover,
[data-theme="mist"] .cards4 .stat:nth-child(4):hover{background:#c7c7ea}
[data-theme="mist"] .cards4 .stat:nth-child(3):hover{background:#fbcbb4}

/* 搜索框：8px 圆角细边框（原图不是药丸） */
[data-theme="mist"] .searchbox{border-radius:8px;background:#fff}
/* 侧栏用户头像：白底靛蓝字（粉彩底配橙字对比度不足） */
[data-theme="mist"] .sb-user .ava{background:#fff;color:var(--pri)}
[data-theme="mist"] .sb-user .nm{color:#fff;font-weight:600}
[data-theme="mist"] .sb-user .rl{color:rgba(255,255,255,.72)}
/* 右栏面板浅灰底（对应原图 Meetings 栏 #F8F8F8） */
[data-theme="mist"] .panel.soft{background:#f8f8f8;border-color:#ececf2}
/* 快速开始图标：粉彩轮换 */
[data-theme="mist"] .qstart .qitem .icn{background:#c6eadc;color:#4a5c57}
[data-theme="mist"] .qstart .qitem:nth-child(3n+2) .icn{background:#d8d8f0;color:#4b4d6b}
[data-theme="mist"] .qstart .qitem:nth-child(3n) .icn{background:#fed8c5;color:#7a5240}
[data-theme="mist"] .qitem:hover{border-color:var(--pri)}
[data-theme="mist"] .panel.soft .todo-row{border-bottom-color:#ececf2}

@media (max-width:768px){
  .hero{padding:16px;gap:10px}
  .hero-greet{font-size:19px}
  .hero-sub{font-size:12px}
  /* 手机端保留横幅插画：按视口宽度自适应缩放，最小 76px，最大 96px */
  .hero-art{display:block;flex:none}
  .hero-svg{width:clamp(76px,24vw,96px);height:auto}
  .hero-txt{min-width:0;flex:1}
  .top-user{display:none}
  .fab{right:14px;bottom:calc(14px + env(safe-area-inset-bottom));width:44px;height:44px}
  .body{padding-bottom:calc(76px + env(safe-area-inset-bottom))}
}

/* ================= 黑曜荧光（obsidian）界面细化 =================
   规则：深空灰黑底 + 单颗荧光黄 #FBFD5E + 冷调灰的亮度分层；零投影、零渐变、hover 只提亮不位移
   2026-10-04 优化：纯黑底在普通笔记本屏上整片糊成死黑（用户反馈），故整体抬高底色与卡片亮度、
   拉开亮度台阶、给中性色加轻微冷调、描边提亮，并在组件层加 4% 白顶部内高光帮助低质量屏辨识边界。 */

/* Hero 横幅：深底白字 + 荧光黄点缀条 */
/* 横幅：不再是灰底，改用「深靛蓝渐变 + 左上角荧光黄光晕」——冷暖对比拉开整页层次 */
[data-theme="obsidian"] .hero{
  position:relative;overflow:hidden;
  border:1px solid rgba(255,255,255,.14);
  /* 背景 = AI 生成的「流动光带」横幅（三选一，见 /design 里的对比图）。
     四层，顺序即叠放顺序：① 左侧压暗保白字 ② 上下 scrim 与页面嵌合
     ③ 荧光黄柔光接上主色 ④ 底图 */
  background-color:#0a0d1c;
  background-image:
    linear-gradient(92deg, rgba(8,10,22,.56) 0%, rgba(8,10,22,.30) 22%, rgba(8,10,22,.07) 52%, rgba(8,10,22,0) 76%),
    linear-gradient(180deg, rgba(8,10,22,.24) 0%, rgba(8,10,22,.02) 22%, rgba(8,10,22,.02) 64%, rgba(8,10,22,.30) 100%),
    radial-gradient(560px 260px at 84% 54%, rgba(251,253,94,.14), rgba(251,253,94,.04) 48%, rgba(251,253,94,0) 78%),
    url('../img/hero-bg.jpg');
  background-size:cover, cover, cover, cover;
  background-position:center, center, center, center;
  background-repeat:no-repeat, no-repeat, no-repeat, no-repeat;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.10), 0 2px 4px rgba(0,0,0,.5), 0 14px 34px rgba(0,0,0,.36);
}
[data-theme="obsidian"] .hero-txt::before{content:"";display:block;width:64px;height:3px;border-radius:999px;background:linear-gradient(90deg,#fbfd5e 0%,rgba(251,253,94,.45) 55%,rgba(251,253,94,0) 100%);margin-bottom:14px}
[data-theme="obsidian"] .hero-sub{color:#e9eff8;font-weight:450;text-shadow:0 1px 3px rgba(10,14,20,.68)}
[data-theme="obsidian"] .hero-txt{position:relative;z-index:1}
/* 横幅右侧的扁平插画已移除（HTML 结构保留，随时可恢复）。
   原因：毛玻璃要读作玻璃，前提是"背后有可辨识的结构"；这张壁纸是纯光效、背后无结构，
   玻璃壳只会变成一块"彩色牛奶板"。而且它正压在壁纸最亮的区域，等于两个主角抢戏。
   插画本身不丢——它适合待在纯色底上（空状态、登录页、侧栏），在那里立刻就好看了。 */
[data-theme="obsidian"] .hero-art{display:none}
/* 标题字重从 700 降到 500：粗体显得"喊"，细一档更冷、更高级（不降字号，保证清晰度） */
[data-theme="obsidian"] .hero-greet{font-weight:400;text-shadow:0 2px 10px rgba(10,14,20,.6)}
[data-theme="obsidian"] .hero-sub{line-height:1.7}

/* 统计卡：两级亮度分层（普通卡 #20252E / 最高优先卡 #2B313C），各带 4% 白顶部内高光 */
[data-theme="obsidian"] .cards4 .stat{background:#39434f;border-color:#4a5464;box-shadow:inset 0 1px 0 rgba(255,255,255,.12)}
[data-theme="obsidian"] .cards4 .stat .icn{background:rgba(255,255,255,.08);color:var(--pri)}
/* 最高优先卡 = 最亮一档 + 荧光黄实心图标（不用白卡：深色页里孤零零一张白卡像没改干净） */
[data-theme="obsidian"] .cards4 .stat:first-child{background:#485466;border-color:#566176}
[data-theme="obsidian"] .cards4 .stat:first-child .icn{background:var(--pri);color:#1a1f27}
[data-theme="obsidian"] .cards4 .stat:hover{transform:none;background:#3d4756;box-shadow:inset 0 1px 0 rgba(255,255,255,.12)}
[data-theme="obsidian"] .cards4 .stat:first-child:hover{background:#535f72}

/* 侧栏：选中项荧光黄文字 + 黄衬底（左侧黄竖条由基础 ::before 提供） */
[data-theme="obsidian"] .sb{border-right:1px solid #4a5464}
/* 侧栏菜单项：全圆角扁平胶囊（参考图的胶囊语言） */
[data-theme="obsidian"] .sb .it{border-radius:999px;padding:9px 14px;margin:2px 0;border:1px solid transparent;transition:background .16s,border-color .16s,color .16s}
[data-theme="obsidian"] .sb .it:hover{background:linear-gradient(100deg,rgba(255,255,255,.04),rgba(255,255,255,.09));border-color:rgba(255,255,255,.10)}
/* 选中项：荧光黄实底 + 深色字 + 顶部高光/外发光，做成一颗"立体药丸"。
   注意不要用「荧光黄的低透明度」铺底——那会算成浑浊的橄榄绿；要用就是实底。 */
[data-theme="obsidian"] .sb .it.on{
  color:#161b23;font-weight:700;
  /* 光从右来：左深黄 → 右亮黄，扁平胶囊（对齐参考图的扁平按钮） */
  background:linear-gradient(100deg,#c9d227 0%,#e6ee4c 48%,#fdff9e 100%);
  border-color:rgba(255,255,255,.46);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.62);
}
[data-theme="obsidian"] .sb .it.on::before{display:none}
[data-theme="obsidian"] .sb .it.on svg{color:#161b23}
[data-theme="obsidian"] .sb-brand .mk{background:var(--pri)}
[data-theme="obsidian"] .sb-pin{border-top-color:#4a5464}
[data-theme="obsidian"] .sb-user{border-top-color:#4a5464}
[data-theme="obsidian"] .sb-user .ava{background:var(--pri);color:#1a1f27;font-weight:700}

/* 顶栏：AI 按钮 = 荧光黄底黑字（对应参考图选中药丸），搜索框细描边药丸 */
[data-theme="obsidian"] .top{background:#242b36;border-bottom-color:#4a5464}
[data-theme="obsidian"] .aibtn{background:rgba(251,253,94,.14);color:var(--pri);border:1px solid rgba(251,253,94,.35);border-radius:999px}
[data-theme="obsidian"] .aibtn:active{transform:scale(.96)}
[data-theme="obsidian"] .searchbox{background:#2a313d;border-color:#4a5464;border-radius:999px}
[data-theme="obsidian"] .searchbox:hover{border-color:var(--pri)}
[data-theme="obsidian"] .top-user .nm{color:var(--pri)}
[data-theme="obsidian"] .top-user .ava-sm{background:#3e4756;color:var(--pri);border-color:#566176}
[data-theme="obsidian"] .bell i{background:var(--pri)}
[data-theme="obsidian"] .bell-dot{background:var(--pri);color:#1a1f27;font-weight:700}

/* 状态标签：深色底上把浅粉底深红字换成低饱和红字（保证可读） */
[data-theme="obsidian"] .pri.urgent,[data-theme="obsidian"] .pri.overdue{background:rgba(255,107,107,.16);color:#ff8a8a}
[data-theme="obsidian"] .pri.low{background:rgba(255,255,255,.06);color:var(--mut)}

/* 按钮：主按钮荧光黄底黑字 + 全圆药丸；次按钮细描边 */
[data-theme="obsidian"] .btn{color:#12161d;border-radius:999px}
[data-theme="obsidian"] .btn.sm{border-radius:10px}
[data-theme="obsidian"] .btn:hover{filter:brightness(1.07)}
[data-theme="obsidian"] .btn.ghost{color:var(--tx);background:transparent}
[data-theme="obsidian"] .btn.ghost:hover{border-color:var(--pri);color:var(--pri);filter:none}
[data-theme="obsidian"] .btn.danger{color:#12161d}
[data-theme="obsidian"] .chip.on{color:#12161d;border-color:var(--pri)}
[data-theme="obsidian"] .bub.me{color:#12161d}
[data-theme="obsidian"] .foldbtn{border-radius:999px}
[data-theme="obsidian"] .foldbtn:hover{background:rgba(251,253,94,.12)}

/* 表格：表头更深一档，行 hover 提亮（不压暗） */
[data-theme="obsidian"] .tbl th{background:#3a4452;color:#d2d9e3}
[data-theme="obsidian"] .tbl th,[data-theme="obsidian"] .tbl td{border-bottom-color:#4a5464}
[data-theme="obsidian"] .tbl tr:hover td{background:#3d4756}

/* 表单：更深底 + 暗描边，focus 荧光黄描边与光晕 */
[data-theme="obsidian"] .field input,[data-theme="obsidian"] .field select,[data-theme="obsidian"] .field textarea{background:var(--input-bg);border-color:#373e4a;border-radius:10px;color:var(--tx)}
[data-theme="obsidian"] .field input::placeholder,[data-theme="obsidian"] .field textarea::placeholder{color:#989fa9}
[data-theme="obsidian"] .field input:focus,[data-theme="obsidian"] .field select:focus,[data-theme="obsidian"] .field textarea:focus{border-color:var(--pri);box-shadow:0 0 0 3px rgba(251,253,94,.18)}

/* 面板 / 浮层：亮度台阶 + 顶部内高光（低质量屏上也能看清卡片边界），弹窗是唯一允许重投影的地方 */
/* ===== 质感升级（2026-10-04 用户要求"跳出全扁平"）=====
   卡片：外圈用「上亮下暗」的金属渐变描边（伪元素做边框，不影响背景与交互态）+ 立体投影 */
[data-theme="obsidian"] .panel,
[data-theme="obsidian"] .cards4 .stat{
  position:relative;
  box-shadow:0 1px 2px rgba(0,0,0,.45), 0 10px 26px rgba(0,0,0,.28);
}
[data-theme="obsidian"] .panel::after,
[data-theme="obsidian"] .cards4 .stat::after{
  content:"";position:absolute;inset:0;border-radius:inherit;padding:1px;
  background:linear-gradient(158deg, rgba(255,255,255,.42) 0%, rgba(255,255,255,.10) 32%, rgba(255,255,255,.02) 62%, rgba(0,0,0,.34) 100%);
  -webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite:xor;
          mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
          mask-composite:exclude;
  pointer-events:none;z-index:1;
}
/* 卡片内浮出的圆形展开按钮要压在金属描边之上 */
[data-theme="obsidian"] .up-more{z-index:3}
/* 卡内块：卡片里再叠一层浅色块，形成「页面底 < 框架 < 卡片 < 卡内块」四级台阶 */
[data-theme="obsidian"] .qitem{background:rgba(255,255,255,.045);border-color:transparent}
[data-theme="obsidian"] .qitem:hover{background:rgba(255,255,255,.075);border-color:var(--pri)}
[data-theme="obsidian"] .conv{background:rgba(255,255,255,.04)}
[data-theme="obsidian"] .todo-row:hover,[data-theme="obsidian"] .upday:hover{background:rgba(255,255,255,.03)}
[data-theme="obsidian"] .modal{background:#3e4756;border:1px solid #566176;box-shadow:0 24px 64px rgba(0,0,0,.7)}
[data-theme="obsidian"] .modal-mask{background:rgba(0,0,0,.72)}
[data-theme="obsidian"] .sheet{background:#3e4756}
[data-theme="obsidian"] .sheet-mask{background:rgba(0,0,0,.72)}
[data-theme="obsidian"] .sheet-act:active{background:#414b58}

/* 悬浮新建钮：荧光黄底 + 黑加号（对应参考图那颗黄色圆钮） */
[data-theme="obsidian"] .fab{background:var(--pri);color:#12161d;border-radius:14px}
[data-theme="obsidian"] .fab:hover{filter:brightness(1.08);box-shadow:none}

/* 顶部提示条：深底浅字，避免黑页面里跳出一块白 */
[data-theme="obsidian"] .toast{background:#3e4756;color:var(--tx);border:1px solid #566176;box-shadow:0 16px 48px rgba(0,0,0,.6)}

/* 滚动条 */
/* 内容区顶光：大屏上卡片之间缝隙面积大，加一层极淡的光晕让"黑"不那么死 */
[data-theme="obsidian"] .body{
  background-image:radial-gradient(1100px 520px at 50% -8%, rgba(255,255,255,.045), rgba(255,255,255,0) 68%);
}

[data-theme="obsidian"] .body::-webkit-scrollbar{width:10px}
[data-theme="obsidian"] .body::-webkit-scrollbar-thumb{background:#566176;border-radius:5px}
[data-theme="obsidian"] .body::-webkit-scrollbar-track{background:transparent}

/* 手机端：保持黑色基调与圆角，不因窄屏退化 */
@media (max-width:768px){
  /* 手机端专用底图 hero-bg-mobile.jpg —— 关键：手机横幅比例约 3:1，与底图原图一致，
     所以用【整张图】，能完整保留「左侧深色 → 右侧炫彩」的横向过渡。
     电脑端是 7.5:1 的扁条、必须竖裁，余下的窄条只剩炫彩、没有过渡 —— 两边不能共用一张图。
     这也取代了此前"底图放大 170% 取右侧局部"的做法（那会把左侧深色裁掉）。 */
  [data-theme="obsidian"] .hero{background-size:cover, cover, cover, cover;background-position:center, center, 82% 50%, 12% center;background-image:linear-gradient(92deg, rgba(8,10,22,.46) 0%, rgba(8,10,22,.22) 26%, rgba(8,10,22,.05) 56%, rgba(8,10,22,0) 82%), linear-gradient(180deg, rgba(8,10,22,.20) 0%, rgba(8,10,22,.02) 22%, rgba(8,10,22,.02) 62%, rgba(8,10,22,.26) 100%), radial-gradient(320px 180px at 80% 50%, rgba(251,253,94,.13), rgba(251,253,94,0) 76%), url('../img/hero-bg-mobile.jpg')}
  [data-theme="obsidian"] .hero{border-radius:var(--radius)}
  [data-theme="obsidian"] .cards4 .stat{border-radius:14px}
}

/* ================= 首页「未来七天」：逐日列出 课表/作业截止/待办截止 ================= */
/* 两栏面板按内容高度对齐（不被 grid 拉伸），便于「未来七天」精确对齐待办栏 */
.grid2 > div{min-width:0}
.grid2 > div > .panel{align-self:start;width:100%}
/* 首页两栏：默认按内容高（方便精确对齐）；展开「未来七天」时由脚本把左栏也拉伸填满，
   避免右栏变高后左栏下方露出一大块空背景。 */
.grid2-dash > div{display:flex;min-width:0}
.grid2-dash > div > .panel{width:100%;min-width:0;align-self:start}
.panel.soft{display:flex;flex-direction:column}
.uplist{display:flex;flex-direction:column;gap:9px;min-height:0}
/* 收起态：高度锁定为左侧待办面板高度，超出部分渐隐裁掉，底部浮出圆形展开按钮 */
.panel.soft.compact{position:relative;overflow:hidden}
.panel.soft.compact .uplist{flex:1;overflow:hidden;
  -webkit-mask-image:linear-gradient(#000 calc(100% - 42px),transparent);
  mask-image:linear-gradient(#000 calc(100% - 30px),transparent)}
.panel.soft .up-more{display:none}
.panel.soft.compact .up-more,
.panel.soft.open .up-more{display:grid}
.up-more{position:absolute;left:50%;bottom:12px;transform:translateX(-50%);
  width:34px;height:34px;padding:0;border-radius:50%;border:1px solid var(--bd);
  background:var(--card);color:var(--mut);place-items:center;cursor:pointer;z-index:2;
  box-shadow:0 2px 10px rgba(0,0,0,.14);transition:color .15s,border-color .15s,background .15s}
.up-more:hover{color:var(--pri);border-color:var(--pri);background:var(--pri-soft)}
.up-more svg{width:16px;height:16px;transition:transform .22s}
.panel.soft.open .up-more{position:static;transform:none;margin:12px auto 0}
.panel.soft.open .up-more svg{transform:rotate(180deg)}
.upday{padding-bottom:8px;border-bottom:1px solid var(--bd)}
.upday:last-child{padding-bottom:0;border-bottom:none}
.upd-hd{display:flex;align-items:center;gap:6px;font-size:12.5px;color:var(--mut);margin-bottom:2px}
.upd-hd b{font-size:13px;color:var(--tx);font-variant-numeric:tabular-nums;letter-spacing:.2px}
.upday.today .upd-hd b{color:var(--pri)}
.upd-hd i{font-style:normal;font-size:11px;font-weight:600;border-radius:999px;padding:0 7px;background:var(--pri-soft);color:var(--pri)}
.upd-hd em{margin-left:auto;font-style:normal;font-size:11px;color:var(--mut)}
.upit{display:flex;align-items:center;gap:8px;padding:3px 0;font-size:12.5px;min-width:0}
.upit .tm{flex:none;min-width:40px;font-size:11.5px;color:var(--mut);font-variant-numeric:tabular-nums}
.upit .tx{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;word-break:break-all}
.upit .tx.urgent{color:var(--danger);font-weight:600}
.upit .tag{flex:none;font-size:10.5px;font-weight:600;border-radius:4px;padding:1px 6px}
.upit .tag.schedule{background:var(--pri-soft);color:var(--pri)}
.upit .tag.assignment{background:var(--acc-soft);color:var(--acc)}
.upit .tag.todo{background:rgba(128,128,128,.16);color:var(--mut)}
.upit.none{color:var(--mut);opacity:.65;font-size:12px;padding-left:48px}
@media (max-width:768px){
  .upit .tx{white-space:normal}
  .upit .tm{min-width:34px}
}
/* 极窄屏：再收一档字号，避免问候语被断成「老」/「师！」 */
@media (max-width:360px){
  .hero{padding:14px;gap:9px}
  .hero-greet{font-size:17px}
  .hero-sub{font-size:11.5px}
}

/* ===== 推送弹窗 + 附件 + 存储空间 ===== */
.pushfab{position:fixed;right:22px;bottom:80px;width:46px;height:46px;border-radius:12px;border:1px solid var(--bd);
  background:var(--card);color:var(--mut);display:grid;place-items:center;cursor:pointer;z-index:40;
  box-shadow:var(--shadow);transition:color .15s,border-color .15s}
.pushfab:hover{color:var(--pri);border-color:var(--pri)}
.push-fab-dot{position:absolute;top:-4px;right:-4px;min-width:17px;height:17px;padding:0 4px;border-radius:9px;
  background:var(--danger);color:#fff;font-size:10px;font-weight:700;line-height:17px;text-align:center;font-style:normal}
.push-toast{position:fixed;right:20px;bottom:140px;width:320px;max-width:calc(100vw - 32px);display:flex;gap:10px;
  background:var(--card);border:1px solid var(--bd);border-radius:14px;box-shadow:0 16px 40px rgba(15,20,40,.22);
  padding:12px 14px;z-index:130;cursor:pointer;animation:pop .22s cubic-bezier(.34,1.3,.64,1)}
.push-toast .pt-ico{flex:none;width:32px;height:32px;border-radius:9px;background:var(--pri-soft);color:var(--pri);display:grid;place-items:center}
.push-toast .pt-mid{flex:1;min-width:0}
.push-toast .pt-title{font-size:13.5px;font-weight:600;line-height:1.4}
.push-toast .pt-body{font-size:12px;color:var(--mut);margin-top:2px;line-height:1.5;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.push-toast .pt-close{flex:none;background:none;border:none;color:var(--mut);cursor:pointer;font-size:14px;padding:0 2px;height:20px}
.push-toast .pt-close:hover{color:var(--tx)}
.pushpanel-mask{position:fixed;inset:0;z-index:120;background:rgba(15,18,30,.28);animation:fadeIn .16s}
.pushpanel{position:absolute;right:20px;bottom:90px;width:380px;max-width:calc(100vw - 24px);max-height:70vh;
  display:flex;flex-direction:column;background:var(--card);border:1px solid var(--bd);border-radius:var(--radius-lg);
  box-shadow:0 20px 50px rgba(15,20,40,.22);overflow:hidden;animation:pop .2s cubic-bezier(.34,1.3,.64,1)}
@media (max-width:768px){
  .pushfab{right:14px;bottom:70px;width:44px;height:44px}
  .push-toast{bottom:126px;right:12px}
  .pushpanel{right:8px;bottom:74px}
}
.chatinput{flex-wrap:wrap}
.chatinput .chat-tool{flex:none;padding:8px 11px;font-weight:700}
.chat-pending{padding:0 2px 8px}
.chat-pending-in{display:flex;flex-wrap:wrap;gap:6px}
.chip{display:inline-flex;align-items:center;gap:6px;background:var(--pri-soft);color:var(--pri);border-radius:8px;padding:4px 8px;font-size:12px;max-width:220px}
.chip b{display:inline-block;max-width:150px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:500}
.chip .chip-x{cursor:pointer;font-weight:700;opacity:.7}
.chip .chip-x:hover{opacity:1}
.chat-msgwrap{display:flex;flex-direction:column;gap:4px;max-width:82%;min-width:0}
.chat-msgwrap.mine{align-items:flex-end}
.chat-msgwrap.other{align-items:flex-start}
.chat-atts{display:flex;flex-direction:column;gap:6px;width:100%;min-width:0}
.chat-img img{max-width:220px;max-height:180px;border-radius:10px;display:block;border:1px solid var(--bd)}
.chat-file{display:flex;align-items:center;gap:10px;background:var(--card);border:1px solid var(--bd);border-radius:10px;padding:8px 12px;text-decoration:none;color:var(--tx);max-width:260px}
.chat-file:hover{border-color:var(--pri)}
.chat-file .cf-ico{flex:none;width:30px;height:30px;border-radius:8px;background:var(--pri-soft);color:var(--pri);display:grid;place-items:center}
.chat-file .cf-mid{flex:1;min-width:0;display:flex;flex-direction:column;gap:1px}
.chat-file .cf-n{font-size:12.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.chat-file .cf-s{font-size:11px;color:var(--mut)}
.storage-bar{height:10px;border-radius:6px;background:var(--bg);border:1px solid var(--bd);overflow:hidden}
.storage-bar i{display:block;height:100%;background:var(--pri);border-radius:6px;transition:width .3s}
.st-row{flex-wrap:wrap}
.st-mid{flex:1;min-width:0;display:flex;flex-direction:column;gap:1px}
.st-mid b{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.st-sub{font-size:11px;color:var(--mut)}
@media (max-width:768px){
  .st-row .st-usage{flex:1 1 100%;order:5}
}

/* ===== 即时沟通优化：气泡对齐 / 输入框 / 表情 / 面板拖拽 ===== */
.msgrow.mine{justify-content:flex-end}
.msgrow.other{justify-content:flex-start}
.chatinput{position:relative;display:flex;flex-direction:column;gap:8px}
.chatinput-row{display:flex;align-items:flex-end;gap:8px}
.chatinput-row .chat-tool{flex:none;padding:9px 11px;font-weight:700}
.chatinput-row textarea{flex:1;min-width:0;border:1.5px solid var(--bd);border-radius:9px;padding:10px 14px;font:14px var(--font);background:var(--card);color:var(--tx);outline:none;resize:vertical;min-height:42px;max-height:160px;line-height:1.5;box-sizing:border-box}
.chatinput-row textarea:focus{border-color:var(--pri);box-shadow:0 0 0 3px var(--pri-soft)}
/* 发送按钮状态色（全局，桌面+手机统一）：默认灰=没内容可发；.ready=有内容，用主题色点亮。
   图标/文字颜色：没内容时用次要色（灰底上看得清），有内容时跟 .btn 的主题配色走。 */
.chatinput-row #ch_send{background:var(--ghost)}
.chatinput-row #ch_send:disabled{opacity:1}
.chatinput-row #ch_send:not(.ready){color:var(--mut)}
.chatinput-row #ch_send.ready{background:var(--pri)}
.chat-emoji-pop{display:none;position:absolute;bottom:54px;left:0;width:300px;max-width:100%;max-height:210px;overflow-y:auto;background:var(--card);border:1px solid var(--bd);border-radius:12px;box-shadow:var(--shadow);padding:10px;z-index:50;flex-wrap:wrap;gap:2px}
.chat-emoji-pop.on{display:flex}
.emoji-item{border:none;background:none;font-size:22px;cursor:pointer;padding:5px;border-radius:8px;line-height:1}
.emoji-item:hover{background:var(--bg)}
/* 表情面板右上角关闭按钮 */
.emoji-close{position:absolute;top:5px;right:5px;width:26px;height:26px;border:none;background:transparent;color:var(--mut);font-size:14px;cursor:pointer;border-radius:6px;display:grid;place-items:center;line-height:1}
.emoji-close:hover{background:var(--bg);color:var(--tx)}
.phead{cursor:move;user-select:none}
.p-resize{position:absolute;right:0;bottom:0;width:16px;height:16px;cursor:nwse-resize;background:linear-gradient(135deg,transparent 50%,var(--bd) 50%)}
@media (max-width:768px){
  .chatinput-row{flex-wrap:wrap}
  .chatinput-row .chat-tool{order:1}
  .chatinput-row textarea{order:2;flex:1 1 100%;min-height:44px}
  .chatinput-row #ch_send{order:3;margin-left:auto}
  .chat-emoji-pop{left:0;right:0;width:auto}
  .chat-img img{max-width:60vw}
  .chat-file{max-width:72vw}
  .push-toast{width:calc(100vw - 24px)}
}

/* 修复：聊天气泡文字竖排——.bub 的 max-width:82% 原本是给 AI 助手（气泡直接在行内）用的，
   聊天里气泡被 .chat-msgwrap 包裹，82% 变成相对内层容器、再叠一层压缩，导致短消息也竖排。
   聊天内让气泡宽度跟随 .chat-msgwrap（其自身已限 82%）。 */
.chat-msgwrap .bub{max-width:100%}

/* 输入框默认更高（参考微信，明显高于单行） */
.chatinput-row textarea{min-height:56px;padding:14px 16px}
/* 未读红点闪烁（有新消息时像微信一样闪） */
.push-fab-dot{animation:pushblink 1.2s ease-in-out infinite}
@keyframes pushblink{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.35;transform:scale(1.18)}}

/* 电脑端输入框明显更高 */
.chatinput-row textarea{min-height:64px;padding:14px 16px}
/* 手机端输入框 + 发送按钮：模仿手机微信（圆角浅灰输入框 + 绿色发送） */
@media (max-width:768px){
  .chatinput-row textarea{min-height:46px;border:none;background:var(--bg);border-radius:10px;padding:12px 14px}
  .chatinput-row #ch_send{border-radius:10px;min-height:44px;padding:0 20px;font-size:15px}
  .chatinput-row .chat-tool{background:transparent;border:none;font-size:16px}
}

/* 手机端输入框：图标 + 输入框 + 发送 同一行（模仿微信，发送不换行） */
@media (max-width:768px){
  .chatinput-row{flex-wrap:nowrap;align-items:flex-end;gap:6px}
  .chatinput-row .chat-tool{flex:none;padding:10px 7px;background:transparent;border:none;font-size:16px;min-width:0}
  .chatinput-row textarea{flex:1 1 auto;min-width:0;min-height:46px;border:none;background:var(--bg);border-radius:10px;padding:12px 12px;line-height:1.4}
  .chatinput-row #ch_send{flex:none;border-radius:10px;min-height:44px;padding:0 16px;font-size:15px;white-space:nowrap}
}

/* 消息/会话删除按钮（hover 显示，手机端常显） */
.msg-del{opacity:0;background:none;border:none;color:var(--mut);cursor:pointer;font-size:13px;padding:2px 5px;border-radius:6px;transition:opacity .15s;flex:none;align-self:center;line-height:1}
.msgrow:hover .msg-del{opacity:1}
.msg-del:hover{color:var(--danger);background:var(--bg)}
.chatconv .conv-del2{flex:none;background:none;border:none;color:var(--mut);cursor:pointer;font-size:13px;padding:4px 6px;border-radius:6px;opacity:0;transition:opacity .15s;line-height:1}
.chatconv:hover .conv-del2{opacity:1}
.chatconv .conv-del2:hover{color:var(--danger);background:var(--bg)}
@media (max-width:768px){
  .msg-del,.chatconv .conv-del2{opacity:.65}
}

/* ===== 手机端体验优化（对照微信） ===== */
@media (max-width:768px){
  /* 消息删除：手机端不常显 ✕，改为长按弹出操作菜单 */
  .msg-del{display:none!important}
  /* 会话删除按钮：手机端也收起，长按会话项操作 */
  .chatconv .conv-del2{display:none!important}
  /* 输入框排布对齐微信：附件 | 输入框 | 表情 | @ | 发送 */
  .chatinput-row #ch_attach{order:1}
  .chatinput-row textarea{order:2}
  .chatinput-row #ch_emoji{order:3}
  .chatinput-row #ch_at{order:4}
  .chatinput-row #ch_send{order:5}
  /* 输入框：浅灰底、无边框、更圆的角（微信观感） */
  .chatinput-row textarea{border:none!important;background:rgba(120,125,150,.13);border-radius:8px;padding:12px 14px;box-shadow:none}
  .chatinput-row textarea:focus{box-shadow:none}
  .chatinput-row .chat-tool{color:var(--mut)}
  .chatinput-row #ch_send{box-shadow:none}
}

/* ===== 手机端聊天页布局（去掉遮挡、聊天区占满） ===== */
@media (max-width:768px){
  /* 聊天页隐藏右下角悬浮按钮（快速新建/推送铃铛），否则压在输入框上 */
  body.chat-page .fab, body.chat-page .pushfab{display:none!important}
  /* 页面高度收进一屏：会话列表限高，聊天窗占满剩余 */
  .chatwrap{display:flex;flex-direction:column;gap:10px;height:calc(100dvh - 168px);min-height:400px}
  .chatlist{flex:none}
  .chatconvlist{max-height:22vh;min-height:0}
  .chatwin{flex:1 1 auto;min-height:0;height:auto}
  .chatbox{min-height:0}
  .chat-pending{flex:none}
}

/* 手机端聊天页：精简标题区，让聊天区更大；气泡宽度贴近微信 */
@media (max-width:768px){
  body.chat-page .page-sub{display:none}
  body.chat-page .page-title{font-size:17px;margin:0 0 8px}
  body.chat-page .chatwrap{height:calc(100dvh - 152px)}
  .chat-msgwrap{max-width:76%}
  .chat-atts{max-width:100%}
}

/* ===== 手机端聊天页：会话列表 ↔ 聊天窗 两视图切换（微信式） ===== */
.chat-back{display:none}
@media (max-width:768px){
  body.chat-page .chatwrap{display:flex;flex-direction:column;height:calc(100dvh - 152px);min-height:400px}
  /* 默认显示会话列表 */
  body.chat-page .chatlist{display:flex;flex-direction:column;flex:1;min-height:0;background:var(--card)}
  body.chat-page .chatconvlist{flex:1;max-height:none;overflow-y:auto;min-height:0}
  body.chat-page .chatwin{display:none}
  /* 进入聊天：列表隐藏，聊天窗占满 */
  body.chat-page.chat-open .chatlist{display:none}
  body.chat-page.chat-open .chatwin{display:flex;flex:1;min-height:0;background:var(--bg);padding:0;border:none;box-shadow:none}
  body.chat-page.chat-open .chatwin-head{display:flex;align-items:center;gap:4px;padding:8px 10px;background:var(--card);border-bottom:1px solid var(--bd)}
  body.chat-page.chat-open .chatwin-title{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:16px;font-weight:600;text-align:center}
  body.chat-page.chat-open .chatbox{background:var(--bg);padding:12px 10px}
  body.chat-page.chat-open .chatinput{background:var(--card);padding:8px 10px}
  body.chat-page.chat-open .chat-pending{padding:4px 10px;background:var(--card)}
  .chat-back{display:grid;place-items:center;width:34px;height:34px;border:none;background:transparent;color:var(--mut);font-size:30px;cursor:pointer;flex:none;line-height:1;padding:0 4px 4px}
  .chat-back:active{color:var(--pri)}
  /* 会话列表项更像微信列表行 */
  body.chat-page .chatlist-head{padding:8px 10px}
  body.chat-page .chatconv{background:transparent;border:none;border-bottom:1px solid var(--bd);border-radius:0;padding:11px 12px}
  body.chat-page .chatconv:hover{border-color:transparent}
  body.chat-page .chatconv.on{background:var(--pri-soft)}
}

/* ===== 手机端输入框对照微信：外围浅灰 + 白输入框 + 发送按钮稍小 ===== */
@media (max-width:768px){
  body.chat-page.chat-open .chatinput{background:var(--bd);padding:9px 10px}/* 灰底用主题边框色，六套主题自动适配 */
  body.chat-page.chat-open .chatinput-row{gap:6px;align-items:center}
  /* 图标更小，让输入框更长 */
  body.chat-page .chatinput-row .chat-tool{width:auto;min-width:0;padding:8px 4px;font-size:16px;background:transparent;border:none;color:var(--mut);flex:none}
  /* 输入框：白底圆角，正常表单高度 */
  body.chat-page .chatinput-row textarea{background:var(--card);border:none;border-radius:8px;min-height:42px;height:42px;max-height:120px;padding:11px 14px;font-size:15px;line-height:1.4;box-shadow:0 1px 2px rgba(20,25,50,.05);resize:none}
  /* 发送按钮：比输入框略矮 */
  body.chat-page .chatinput-row #ch_send{color:#fff;border-radius:8px;height:38px;min-height:38px;padding:0 16px;font-size:15px;box-shadow:none;flex:none}
  body.chat-page .chatinput-row #ch_send:not(.ready){color:var(--mut)}
  /* 气泡精致化：统一 10px 圆角，自己气泡更柔和 */
  body.chat-page .chatbox .bub{border-radius:10px;line-height:1.5}
  body.chat-page .msgrow.mine .bub.me{background:linear-gradient(180deg,#5b5ce0,#4948c7)}
  body.chat-page .msgrow.other .bub.ai{background:#fff;border:none;box-shadow:0 1px 2px rgba(20,25,50,.05)}
  body.chat-page .chatbox .msgrow{padding:5px 2px!important}
}
@media (max-width:768px){
  body.chat-page .chatinput-row textarea{height:auto}/* 默认 42px，多行自动长高（不改 min-height） */
}

/* ===== 手机端输入条通栏 + 发送按钮纯图标（对照图2） =====
   问题：.body 左右 12px 内边距把输入条往里推，灰底两头露白、发送按钮带文字太宽顶出右边缘。
   改法：①聊天打开时 .body 去掉左右内边距，输入条通栏到屏幕边；
        ②发送按钮手机端只留图标（隐藏"发送"二字），宽度从 87px 降到约 40px；
        ③空输入=灰色禁用，有内容=主题色点亮（用 var(--pri)，自动跟随六套主题）。 */
@media (max-width:768px){
  /* 通栏：只把聊天窗（标题栏+消息区+输入条）撑到屏幕两侧，
     用负外边距抵消 .body 的 12px 左右内边距；页面标题「即时沟通」保持原边距不受影响 */
  body.chat-page.chat-open .chatwin{margin-left:-12px;margin-right:-12px;border-radius:0}/* 通栏：负边距抵消 .body 内边距，去圆角避免屏幕两侧露缺口 */
  body.chat-page.chat-open .chatinput{padding:8px 8px calc(8px + env(safe-area-inset-bottom))}
  /* 发送按钮：纯图标圆形，空输入灰色、有内容主题色 */
  body.chat-page .chatinput-row #ch_send{width:40px;height:40px;min-height:40px;padding:0;border-radius:50%;display:grid;place-items:center}
  body.chat-page .chatinput-row #ch_send .send-label{display:none}
  body.chat-page .chatinput-row #ch_send .ic{width:18px;height:18px;margin:0}
  body.chat-page .chatinput-row #ch_send:disabled{background:var(--ghost);opacity:1}
  body.chat-page .chatinput-row #ch_send.ready{background:var(--pri)}
  /* obsidian 主题主色是荧光黄，图标要用深色才看得清（与 .btn 在该主题下的处理一致） */
  [data-theme="obsidian"] body.chat-page .chatinput-row #ch_send.ready{color:#12161d}
  /* 输入条背景：浅色主题保持微信灰；深色主题下沉一档，避免和消息区糊成一片 */
  [data-theme="obsidian"] body.chat-page.chat-open .chatinput{background:var(--input-bg)}
}

/* ===== 手机端聊天页：输入条钉在屏幕最底端，中间消息区自适应 =====
   问题：.chatwrap 高度原先靠手写 calc(100dvh - 152px) 估算，与顶栏+标题的实际高度
   对不上（顶栏高度会随内容/安全区变化），底部留一条白缝、输入条悬在半空不贴底。
   改法：聊天页把 .body 改成不滚动的弹性容器，chatwrap 用 flex:1 吃满剩余高度；
   消息区 .chatbox 自身 flex:1 自适应伸缩，输入条作为弹性列的最后一项自然贴到屏幕底。
   不再依赖任何手写高度估算，屏幕多高都自适应。 */
@media (max-width:768px){
  body.chat-page .body{display:flex;flex-direction:column;overflow:hidden;padding-bottom:0}
  body.chat-page .page-title{flex:none}
  body.chat-page .chatwrap{flex:1;min-height:0;height:auto}
  /* .panel 自带 margin-bottom:16px，会把聊天窗/会话列表从屏幕底顶起 16px（实测白缝来源），去掉 */
  body.chat-page .chatwin, body.chat-page .chatlist{margin-bottom:0}
  body.chat-page .chatlist{min-height:0}
  body.chat-page.chat-open .chatwin{min-height:0}
}

/* ===== 自定义头像 ===== */
.ava-sm{width:26px;height:26px;flex:none;border-radius:50%;background:var(--acc-soft);color:var(--acc);display:grid;place-items:center;font-size:12px;font-weight:600}
.ava-lg{width:64px;height:64px;flex:none;border-radius:50%;background:var(--acc-soft);color:var(--acc);display:grid;place-items:center;font-size:26px;font-weight:600;border:2px solid var(--bd)}
/* 顶栏小头像在有自定义图时也要圆 */
.top-user .ava-sm[style*="background-image"]{background-color:transparent}

/* ===== 消息中心按钮（i-push 线性图标）+ 提示音开关 ===== */
.pushfab .ic{width:21px;height:21px}
/* 提示音关：图标降饱和 + 虚线边，一眼看出"声音关了但消息还在" */
.pushfab.muted{color:var(--ghost);border-style:dashed}
.pushfab.muted:hover{color:var(--mut);border-color:var(--mut)}
/* 面板内「提示音开/提示音关」按钮：图标 + 文字同排 */
.pp-sound{display:inline-flex;align-items:center;gap:5px}
.pp-sound .ic{width:15px;height:15px}
.pp-sound span{font-size:12.5px}
.pp-sound.off{color:var(--ghost)}
.pp-sound.off:hover{color:var(--mut)}