/* ============================================================
   WorkSpace · 设计系统（暗色 + 毛玻璃）
   三条规则：玻璃必须压在光斑上 / 最多叠三层 / 文字对比优先
   ============================================================ */

* { box-sizing: border-box; margin: 0; padding: 0; }
html, body { height: 100%; overflow: hidden; }
body {
  font-family: system-ui, -apple-system, "PingFang SC", "Microsoft YaHei", sans-serif;
  background: #070b11; color: #e6edf3; font-size: 13px;
  -webkit-font-smoothing: antialiased;
}
#app {
  position: relative; height: 100vh; overflow: hidden;
  background-color: #070b11;
  background-image:
    radial-gradient(1100px 620px at 4% -14%, rgba(58,120,200,.30), transparent 62%),
    radial-gradient(900px 520px at 96% 0%, rgba(0,160,150,.20), transparent 58%),
    radial-gradient(760px 520px at 48% 114%, rgba(126,86,210,.16), transparent 60%);
  background-attachment: fixed;
}
[v-cloak] { display: none; }

.dot { width: 5px; height: 5px; border-radius: 50%; flex: 0 0 5px; }
.fico { width: 12px; height: 14px; border-radius: 2px; flex: 0 0 12px; }
.grow { flex: 1; }

/* ---------- 登录 ---------- */
.loginWrap { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; }
.loginCard {
  width: 348px; padding: 30px 28px 26px;
  background: rgba(15,21,30,.66);
  backdrop-filter: blur(26px) saturate(170%); -webkit-backdrop-filter: blur(26px) saturate(170%);
  border: 0.5px solid rgba(255,255,255,.10); border-radius: 16px;
  box-shadow: 0 20px 50px rgba(0,0,0,.45);
}
.loginCard .brand { display: flex; align-items: center; gap: 9px; margin-bottom: 4px; }
.loginCard .logo { width: 26px; height: 26px; border-radius: 7px; background: #3d7eff; }
.loginCard h1 { font-size: 16px; font-weight: 500; }
.loginCard .tag { font-size: 12px; color: #6f7b8a; margin: 0 0 24px 35px; }
.field { margin-bottom: 12px; }
.field label { display: block; font-size: 11px; color: #8794a5; margin-bottom: 5px; }
.field input {
  width: 100%; padding: 9px 11px; font-size: 13px; font-family: inherit;
  background: rgba(255,255,255,.05); color: #e6edf3;
  border: 0.5px solid rgba(255,255,255,.12); border-radius: 8px; outline: none;
}
.field input:focus { border-color: rgba(61,126,255,.6); }
.loginBtn {
  width: 100%; margin-top: 8px; padding: 10px; border: none; border-radius: 8px;
  background: #3d7eff; color: #fff; font-size: 13px; font-family: inherit; cursor: pointer;
}
.loginBtn:hover { background: #4d8bff; }
.loginBtn:disabled { opacity: .6; cursor: default; }
.loginErr { margin-top: 10px; font-size: 11px; color: #F09595; text-align: center; }
.loginFoot { margin-top: 16px; font-size: 11px; color: #4a5563; text-align: center; }

/* ---------- 主壳 ---------- */
#shell { display: flex; height: 100%; }
#sidebar {
  width: 196px; flex: 0 0 auto;
  background: rgba(13,19,27,.58);
  backdrop-filter: blur(22px); -webkit-backdrop-filter: blur(22px);
  border-right: 0.5px solid rgba(255,255,255,.07);
  display: flex; flex-direction: column; padding: 14px 10px;
  transition: width .18s ease, padding .18s ease;
  overflow: hidden;
}
#sidebar.collapsed { width: 58px; padding: 14px 8px; }
#sidebar.collapsed .sideBrand { padding: 0 0 18px; justify-content: center; }
#sidebar.collapsed .sideBrand .nm { display: none; }
#sidebar.collapsed .navItem { justify-content: center; padding: 10px 0; }
#sidebar.collapsed .navItem .label { display: none; }
#sidebar.collapsed .navItem .bdg {
  position: absolute; top: 7px; right: 9px; width: 6px; height: 6px;
  min-width: 6px; padding: 0; border-radius: 50%; font-size: 0; line-height: 0;
}
#sidebar.collapsed .sideUser { justify-content: center; padding: 6px 0; }
#sidebar.collapsed .sideUser .uinfo { display: none; }

.sideBrand { display: flex; align-items: center; gap: 8px; padding: 0 8px 18px; }
.sideBrand .logo { width: 20px; height: 20px; border-radius: 6px; background: #3d7eff; flex: 0 0 20px; }
.sideBrand .nm { font-size: 12px; font-weight: 500; white-space: nowrap; }
.navItem {
  position: relative; display: flex; align-items: center; gap: 10px;
  padding: 9px 10px; border-radius: 8px; cursor: pointer;
  font-size: 13px; color: #8794a5; margin-bottom: 2px;
}
.navItem:hover { background: rgba(255,255,255,.05); color: #e6edf3; }
.navItem.active { background: rgba(61,126,255,.16); color: #e6edf3; }
.navItem .ic { width: 16px; height: 16px; flex: 0 0 16px; opacity: .85; }
.navItem .label { white-space: nowrap; }
.navItem .bdg {
  margin-left: auto; font-size: 10px; color: #fff; background: #3d7eff;
  border-radius: 9px; padding: 0 5px; line-height: 15px;
}
.sideFoot { margin-top: auto; border-top: 0.5px solid rgba(255,255,255,.06); padding-top: 12px; }
.sideUser { display: flex; align-items: center; gap: 8px; padding: 6px 8px; }
.sideUser .av {
  width: 24px; height: 24px; flex: 0 0 24px; border-radius: 50%;
  background: rgba(61,126,255,.25); color: #b9d0ff; font-size: 10px;
  display: flex; align-items: center; justify-content: center;
}
.sideUser .nm { font-size: 12px; color: #c9d4e0; white-space: nowrap; }
.sideUser .role { font-size: 10px; color: #5f6b7a; }
.sideUser .uinfo { overflow: hidden; }

#main { flex: 1; min-width: 0; display: flex; flex-direction: column; }
#topbar {
  height: 50px; flex: 0 0 50px; display: flex; align-items: center; gap: 10px;
  padding: 0 18px; border-bottom: 0.5px solid rgba(255,255,255,.06);
}
#pageTitle { font-size: 15px; font-weight: 500; }
#topbar .sub { font-size: 11px; color: #6f7b8a; }
.iconBtn {
  width: 30px; height: 30px; flex: 0 0 30px; border-radius: 7px; cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  border: 0.5px solid rgba(255,255,255,.10); background: rgba(255,255,255,.04);
}
.iconBtn:hover { border-color: rgba(255,255,255,.22); background: rgba(255,255,255,.07); }
.tbBtn {
  font-size: 11px; color: #8794a5; cursor: pointer; padding: 6px 11px;
  border: 0.5px solid rgba(255,255,255,.10); border-radius: 7px;
  background: rgba(255,255,255,.04); white-space: nowrap;
}
.tbBtn:hover { color: #e6edf3; border-color: rgba(255,255,255,.2); }
.tbBtn.primary { background: #3d7eff; color: #fff; border-color: #3d7eff; }
.tbBtn.primary:hover { background: #4d8bff; }
.tbBtn:disabled { opacity: .4; cursor: not-allowed; }

#pages { flex: 1; min-height: 0; position: relative; }
.page { position: absolute; inset: 0; display: none; overflow: hidden; }
.page.on { display: flex; }

/* ---------- Dashboard ---------- */
#pgDash { display: flex; width: 100%; padding: 20px 22px; gap: 18px; overflow-y: auto; }
#dashMain { flex: 1; min-width: 0; }
#dashSide { width: 296px; flex: 0 0 296px; }
.hello { font-size: 18px; font-weight: 500; margin-bottom: 3px; }
.helloSub { font-size: 12px; color: #6f7b8a; margin-bottom: 18px; }
.stats { display: flex; gap: 10px; margin-bottom: 22px; }
.stat {
  flex: 1; min-width: 0; padding: 12px 14px; border-radius: 10px;
  background: rgba(15,21,30,.62);
  backdrop-filter: blur(22px) saturate(170%); -webkit-backdrop-filter: blur(22px) saturate(170%);
  border: 0.5px solid rgba(255,255,255,.08);
}
.stat .n { font-size: 20px; font-weight: 500; line-height: 1.25; }
.stat .l { font-size: 11px; color: #6f7b8a; }
.stat.a .n { color: #EF9F27; } .stat.b .n { color: #7fb0ff; }
.stat.c .n { color: #5DCAA5; } .stat.d .n { color: #c9d4e0; }

.secHead { display: flex; align-items: center; gap: 8px; margin-bottom: 11px; }
.secHead h3 { font-size: 13px; font-weight: 500; }
.secHead .hint { font-size: 10px; color: #5f6b7a; }
.secHead .more { margin-left: auto; font-size: 11px; color: #6f7b8a; cursor: pointer; }
.secHead .more:hover { color: #c9d4e0; }

.wsGrid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 12px; margin-bottom: 22px; }
.wsCard {
  padding: 13px; border-radius: 11px; cursor: pointer;
  background: rgba(15,21,30,.62);
  backdrop-filter: blur(22px) saturate(170%); -webkit-backdrop-filter: blur(22px) saturate(170%);
  border: 0.5px solid rgba(255,255,255,.08); transition: border-color .15s;
}
.wsCard:hover { border-color: rgba(255,255,255,.22); }
.wsCard .top { display: flex; align-items: center; gap: 7px; margin-bottom: 9px; }
.wsCard .nm { font-size: 13px; font-weight: 500; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.wsCard .st { margin-left: auto; font-size: 10px; white-space: nowrap; }
.wsCard .bar { height: 3px; border-radius: 2px; background: rgba(255,255,255,.08); margin-bottom: 9px; }
.wsCard .bar i { display: block; height: 3px; border-radius: 2px; }
.wsCard .meta { font-size: 11px; color: #6f7b8a; display: flex; align-items: center; }

.panel {
  padding: 13px 14px; border-radius: 11px;
  background: rgba(15,21,30,.62);
  backdrop-filter: blur(22px) saturate(170%); -webkit-backdrop-filter: blur(22px) saturate(170%);
  border: 0.5px solid rgba(255,255,255,.08);
}
.trow { display: flex; align-items: center; gap: 9px; padding: 8px 0; border-top: 0.5px solid rgba(255,255,255,.06); }
.trow:first-of-type { border-top: none; padding-top: 2px; }
.trow .b2 { width: 3px; height: 26px; border-radius: 2px; flex: 0 0 3px; }
.trow .t1 { font-size: 12px; color: #e6edf3; }
.trow .t2 { font-size: 11px; color: #6f7b8a; }
.trow .st { margin-left: auto; font-size: 10px; white-space: nowrap; }

/* ---------- Work Space ---------- */
#pgWs.on { display: flex; }
.wsSide {
  width: 236px; flex: 0 0 236px; padding: 12px 10px; overflow-y: auto;
  border-right: 0.5px solid rgba(255,255,255,.06);
}
.treeSec {
  font-size: 10px; color: #5f6b7a; padding: 10px 8px 5px;
  display: flex; align-items: center; gap: 5px;
}
.treeItem {
  display: flex; align-items: center; gap: 7px; padding: 6px 8px;
  border-radius: 6px; font-size: 11px; color: #8794a5; cursor: pointer;
  user-select: none;
}
.treeItem:hover { background: rgba(255,255,255,.05); color: #e6edf3; }
.treeItem.dir { color: #c9d4e0; font-weight: 500; }
.treeItem .caret { width: 8px; font-size: 8px; opacity: .6; flex: 0 0 8px; }
.treeChild { padding-left: 18px; }
.treeFile {
  display: flex; align-items: center; gap: 7px; padding: 5px 8px;
  border-radius: 6px; font-size: 11px; color: #8794a5; cursor: grab;
}
.treeFile:hover { background: rgba(255,255,255,.05); color: #e6edf3; }
.treeFile.dragging { opacity: .45; }

.wsMain { flex: 1; min-width: 0; min-height: 0; display: flex; flex-direction: column; padding: 14px 16px; gap: 12px; overflow-y: auto; }
.wsRow { display: flex; gap: 14px; min-height: 0; }
.wsPanel {
  background: rgba(15,21,30,.55); border: 0.5px solid rgba(255,255,255,.08);
  border-radius: 11px; padding: 12px 13px;
}
#poolPanel { width: 290px; flex: 0 0 290px; display: flex; flex-direction: column; overflow: hidden; }
#poolPanel > div:last-child { flex: 1; min-height: 0; overflow-y: auto; }
.wsRow { min-height: 0; }
#memPanel { flex: 1; min-width: 0; }

.taskItem {
  display: flex; align-items: flex-start; gap: 8px; padding: 9px 10px; margin-bottom: 7px;
  border-radius: 8px; cursor: grab; font-size: 12px; color: #c9d4e0;
  background: rgba(20,27,38,.9); border: 0.5px solid rgba(255,255,255,.09);
}
.taskItem .taskBody { min-width: 0; flex: 1; }
.taskItem:hover { border-color: rgba(255,255,255,.22); }
.taskItem.dragging { opacity: .4; }
.taskItem .tag2 { margin-left: auto; font-size: 9px; color: #6f7b8a; }

.members { display: flex; flex-wrap: wrap; gap: 10px; }
.memTile {
  width: 106px; padding: 11px 8px; border-radius: 10px; text-align: center;
  background: rgba(20,27,38,.75); border: 0.5px solid rgba(255,255,255,.09);
  transition: border-color .12s, background .12s;
}
.memTile.over { border-color: rgba(61,126,255,.8); background: rgba(61,126,255,.12); }
.memTile .av {
  width: 32px; height: 32px; border-radius: 50%; margin: 0 auto 7px;
  background: rgba(61,126,255,.22); color: #b9d0ff; font-size: 11px;
  display: flex; align-items: center; justify-content: center;
}
.memTile .nm { font-size: 11px; color: #c9d4e0; }
.memTile .cnt { font-size: 10px; color: #6f7b8a; margin-top: 2px; }
.memTile .cnt.has { color: #EF9F27; }

.pendRow {
  display: flex; align-items: center; gap: 9px; padding: 8px 10px; border-radius: 8px;
  background: rgba(239,159,39,.10); border: 0.5px solid rgba(239,159,39,.28);
  margin-bottom: 7px; font-size: 12px;
}
.pendRow .arrow { color: #6f7b8a; font-size: 11px; }
.pendRow .who { color: #FAC775; }
.pendRow .x { margin-left: auto; color: #6f7b8a; cursor: pointer; font-size: 13px; padding: 0 3px; }
.pendRow .x:hover { color: #F09595; }
.emptyHint { font-size: 11px; color: #4a5563; padding: 8px 2px; }
.assignFoot { display: flex; align-items: center; gap: 10px; margin-top: 10px; }
.assignFoot .info { font-size: 11px; color: #6f7b8a; }
#assignedList { overflow-y: auto; flex: 1; min-height: 0; }
.asgRow {
  display: flex; align-items: center; gap: 9px; padding: 9px 11px; margin-bottom: 7px;
  border-radius: 8px; background: rgba(20,27,38,.7); border: 0.5px solid rgba(255,255,255,.07);
}
.asgRow .nm { font-size: 12px; color: #c9d4e0; }
.asgRow .meta { font-size: 10px; color: #6f7b8a; }
.asgRow .st { margin-left: auto; font-size: 10px; }
.notifyBadge {
  font-size: 9px; color: #9FE1CB; border: 0.5px solid rgba(93,202,165,.35);
  border-radius: 4px; padding: 1px 5px;
}

/* ---------- 任务：新建按钮 / 说明 / 附件 / 编辑 ---------- */
.taskNewBtn {
  width: 100%; margin-bottom: 10px; padding: 7px 10px; border-radius: 8px; cursor: pointer;
  font-size: 11.5px; color: #b9d0ff; background: rgba(61,126,255,.10);
  border: 0.5px dashed rgba(61,126,255,.45); text-align: center;
}
.taskNewBtn:hover { background: rgba(61,126,255,.18); border-color: rgba(61,126,255,.7); }
.taskDesc {
  font-size: 10.5px; color: #8794a5; margin-top: 3px; line-height: 1.55;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.taskAtts { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 6px; }
.attChip {
  display: inline-flex; align-items: center; gap: 5px; max-width: 100%;
  padding: 2px 7px; border-radius: 5px; cursor: pointer;
  font-size: 10px; color: #a9b8c9;
  background: rgba(255,255,255,.05); border: 0.5px solid rgba(255,255,255,.10);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.attChip:hover { color: #dbe6f2; border-color: rgba(61,126,255,.55); }
.taskEdit {
  margin-left: auto; flex: 0 0 auto; font-size: 12px; color: #5f6b7a; cursor: pointer;
  padding: 0 3px; opacity: 0; transition: opacity .12s, color .12s;
}
.taskItem:hover .taskEdit, .asgRow:hover .taskEdit { opacity: 1; }
.taskEdit:hover { color: #b9d0ff; }
.asgMain { min-width: 0; flex: 1; }
.asgDesc {
  font-size: 10px; color: #6f7b8a; margin-top: 2px; line-height: 1.5;
  display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; overflow: hidden;
}
.asgRow .st { display: flex; align-items: center; gap: 8px; }
.pendRow .pendTask {
  min-width: 0; flex: 0 1 auto; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.attList { margin-top: 6px; }
.attRow {
  display: flex; align-items: center; gap: 8px; padding: 6px 9px; border-radius: 7px;
  background: rgba(255,255,255,.04); border: 0.5px solid rgba(255,255,255,.07);
  margin-bottom: 5px; font-size: 11.5px; color: #c9d4e0;
}
.attRow .fname { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.attRow .x { margin-left: auto; color: #6f7b8a; cursor: pointer; font-size: 13px; }
.attRow .x:hover { color: #F09595; }
.twoCol { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.confirmRow {
  padding: 9px 11px; border-radius: 8px; margin-bottom: 7px;
  background: rgba(61,126,255,.07); border: 0.5px solid rgba(61,126,255,.22);
}
.confirmRow .crTitle { font-size: 12px; color: #dbe6f2; }
.confirmRow .crWho { font-size: 10.5px; color: #FAC775; margin-top: 3px; }
.idleBig {
  font-size: 34px; font-weight: 500; color: #FAC775; line-height: 1.2; margin: 10px 0 4px;
  font-variant-numeric: tabular-nums;
}


/* ---------- Email ---------- */
#pgMail { display: flex; width: 100%; padding: 0; overflow: hidden; }
.mailSetup { padding: 26px 28px; max-width: 620px; }
.mailSetup h3 { font-size: 15px; font-weight: 500; margin-bottom: 6px; }
.mailSetup .hint { font-size: 12px; color: #6f7b8a; line-height: 1.8; margin-bottom: 18px; }
.formGrid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-bottom: 14px; }
.formGrid label { display: block; font-size: 11px; color: #8794a5; }
.formGrid label input:not([type=checkbox]) {
  width: 100%; margin-top: 5px; padding: 8px 10px; font-size: 12px; font-family: inherit;
  background: rgba(255,255,255,.05); color: #e6edf3;
  border: 0.5px solid rgba(255,255,255,.12); border-radius: 7px; outline: none;
}
.formGrid label input:focus { border-color: rgba(61,126,255,.55); }
.formGrid .chk { display: flex; align-items: center; gap: 7px; align-self: end; padding-bottom: 8px; color: #c9d4e0; font-size: 12px; }
.row { display: flex; gap: 10px; align-items: center; }
.mailMsg { margin-top: 14px; font-size: 12px; color: #9FE1CB; line-height: 1.7; }

.mailWrap { display: flex; width: 100%; min-width: 0; }
.mailFolders {
  width: 172px; flex: 0 0 172px; padding: 12px 8px; overflow-y: auto;
  border-right: 0.5px solid rgba(255,255,255,.06);
}
.mf { display: flex; align-items: center; gap: 8px; padding: 7px 9px; border-radius: 7px; font-size: 12px; color: #8794a5; cursor: pointer; }
.mf:hover { background: rgba(255,255,255,.05); color: #e6edf3; }
.mf.active { background: rgba(61,126,255,.16); color: #e6edf3; }
.mfAdd { margin-top: 12px; padding: 7px 9px; font-size: 11px; color: #6f7b8a; cursor: pointer; border-radius: 7px; }
.mfAdd:hover { color: #3d7eff; background: rgba(61,126,255,.08); }
.mfList { margin-top: 10px; border-top: 0.5px solid rgba(255,255,255,.06); padding-top: 8px; }
.mfAcc { padding: 7px 9px; font-size: 11px; color: #c9d4e0; cursor: pointer; border-radius: 7px; }
.mfAcc:hover { background: rgba(255,255,255,.05); }
.mfAcc span { display: block; font-size: 10px; color: #5f6b7a; margin-top: 2px; }

.mailList { width: 312px; flex: 0 0 312px; overflow-y: auto; border-right: 0.5px solid rgba(255,255,255,.06); }
.mailListHead {
  display: flex; align-items: center; padding: 10px 13px;
  font-size: 11px; color: #6f7b8a; border-bottom: 0.5px solid rgba(255,255,255,.06);
  position: sticky; top: 0; background: rgba(10,15,22,.92); backdrop-filter: blur(10px);
}
.mailListHead .more { margin-left: auto; cursor: pointer; }
.mailListHead .more:hover { color: #c9d4e0; }
.mrow { padding: 11px 13px; border-bottom: 0.5px solid rgba(255,255,255,.05); cursor: pointer; }
.mrow:hover { background: rgba(255,255,255,.04); }
.mrow.active { background: rgba(61,126,255,.10); border-left: 2px solid #3d7eff; padding-left: 11px; }
.mrow.unread .subj { color: #e6edf3; font-weight: 500; }
.mrow .l1 { display: flex; align-items: center; gap: 6px; margin-bottom: 3px; }
.mrow .from { font-size: 12px; color: #c9d4e0; }
.mrow .time { margin-left: auto; font-size: 10px; color: #5f6b7a; }
.mrow .subj { font-size: 12px; color: #8794a5; margin-bottom: 3px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mrow .prev { font-size: 11px; color: #5f6b7a; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mailRead { flex: 1; min-width: 0; overflow-y: auto; padding: 20px 24px; }
.mailRead h2 { font-size: 16px; font-weight: 500; margin-bottom: 10px; }
.mailMeta { font-size: 11px; color: #6f7b8a; margin-bottom: 16px; padding-bottom: 14px; border-bottom: 0.5px solid rgba(255,255,255,.07); line-height: 1.7; }
.mailBody { font-size: 12.5px; color: #c9d4e0; line-height: 2; white-space: pre-wrap; word-break: break-word; }
.mailAtt { display: inline-flex; align-items: center; gap: 7px; padding: 8px 10px; margin-top: 14px; margin-right: 8px; border-radius: 8px; background: rgba(255,255,255,.04); border: 0.5px solid rgba(255,255,255,.09); }

/* ---------- Meeting ---------- */
#pgMeet { padding: 20px 22px; overflow-y: auto; flex: 1; min-width: 0; }
.meetLobby { max-width: 520px; }
.meetLobby h3 { font-size: 15px; font-weight: 500; margin-bottom: 6px; }
.meetLobby .hint { font-size: 12px; color: #6f7b8a; line-height: 1.8; margin-bottom: 16px; }
.meetLobby .row input {
  flex: 1; padding: 9px 11px; font-size: 13px; font-family: inherit;
  background: rgba(255,255,255,.05); color: #e6edf3;
  border: 0.5px solid rgba(255,255,255,.12); border-radius: 8px; outline: none;
}
.meetLobby .row input:focus { border-color: rgba(61,126,255,.55); }
.meetLive { display: flex; flex-direction: column; height: 100%; width: 100%; min-width: 0; }
.lkBar {
  display: flex; align-items: center; gap: 10px; padding-bottom: 12px;
  font-size: 12px; color: #c9d4e0;
}
.lkStage {
  flex: 1; min-height: 0; display: grid; gap: 10px;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  align-content: start;
}

/* ---------- 会议白板 ---------- */
.tbBtn.onTab { border-color: rgba(61,126,255,.7); color: #b9d0ff; background: rgba(61,126,255,.14); }
.wbWrap { flex: 1; min-height: 0; display: flex; flex-direction: column; }
.wbBar {
  display: flex; align-items: center; gap: 8px; padding: 0 0 10px;
  font-size: 11px; color: #6f7b8a; flex-wrap: wrap;
}
.wbLab { color: #5f6b7a; margin-left: 4px; }
.wbSw {
  width: 16px; height: 16px; border-radius: 50%; cursor: pointer;
  border: 1.5px solid transparent;
}
.wbSw.on { border-color: #ffffff; box-shadow: 0 0 0 2px rgba(255,255,255,.18); }
.wbSw2 {
  width: 22px; height: 22px; border-radius: 50%; cursor: pointer;
  display: inline-flex; align-items: center; justify-content: center;
  background: rgba(255,255,255,.05); border: 0.5px solid rgba(255,255,255,.12);
}
.wbSw2 i { display: block; border-radius: 50%; background: #c9d4e0; }
.wbSw2.on { border-color: rgba(61,126,255,.75); background: rgba(61,126,255,.16); }
.wbCanvasBox {
  position: relative; flex: 1; min-height: 0; border-radius: 12px; overflow: hidden;
  background: rgba(10,14,20,.9); border: 0.5px solid rgba(255,255,255,.1);
}
.wbCanvasBox.over { border-color: rgba(61,126,255,.85); box-shadow: inset 0 0 0 1px rgba(61,126,255,.4); }
.wbBg { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; }
.wbBg img { max-width: 100%; max-height: 100%; object-fit: contain; }
.wbBg iframe { width: 100%; height: 100%; border: 0; background: #fff; }
.wbBgTag {
  position: absolute; left: 10px; top: 10px; z-index: 3;
  font-size: 10px; color: #c9d4e0; padding: 3px 8px; border-radius: 5px;
  background: rgba(11,16,23,.82); border: 0.5px solid rgba(255,255,255,.14);
}
.wbBgTag b { margin-left: 7px; cursor: pointer; color: #6f7b8a; font-weight: 400; }
.wbBgTag b:hover { color: #F09595; }
.wbCanvas {
  position: absolute; inset: 0; z-index: 2; touch-action: none; cursor: crosshair;
}
.wbHint {
  position: absolute; inset: 0; z-index: 1; display: flex; align-items: center; justify-content: center;
  font-size: 12px; color: #3f4a58; pointer-events: none; text-align: center; padding: 0 30px;
}
.lkTile {
  position: relative; border-radius: 12px; overflow: hidden;
  background: rgba(20,27,38,.9); border: 0.5px solid rgba(255,255,255,.09);
  aspect-ratio: 16 / 10;
}
.lkAvatar {
  position: absolute; inset: 0; display: flex; align-items: center; justify-content: center;
  font-size: 26px; color: #b9d0ff; background: rgba(61,126,255,.10);
}
.lkName {
  position: absolute; left: 8px; bottom: 8px;
  font-size: 10px; color: #c9d4e0; background: rgba(0,0,0,.45);
  padding: 2px 7px; border-radius: 5px;
}

/* ---------- 语言切换 ---------- */
.langSwitch {
  display: inline-flex; align-items: center; gap: 2px;
  padding: 2px; border-radius: 7px;
  border: 0.5px solid rgba(255,255,255,.10); background: rgba(255,255,255,.04);
}
.langSwitch span {
  font-size: 10px; color: #6f7b8a; padding: 3px 7px; border-radius: 5px; cursor: pointer;
}
.langSwitch span:hover { color: #c9d4e0; }
.langSwitch span.on { color: #fff; background: rgba(61,126,255,.35); }
.loginLang { margin: 14px auto 0; justify-content: center; width: fit-content; }

/* ---------- 管理界面 ---------- */
#pgAdmin { display: flex; flex-direction: column; width: 100%; padding: 0; overflow: hidden; }
.adminTabs {
  display: flex; gap: 4px; padding: 12px 20px 0;
  border-bottom: 0.5px solid rgba(255,255,255,.06);
}
.atab {
  font-size: 12px; color: #6f7b8a; padding: 8px 12px; cursor: pointer;
  border-bottom: 2px solid transparent; margin-bottom: -1px;
}
.atab:hover { color: #c9d4e0; }
.atab.active { color: #e6edf3; border-bottom-color: #3d7eff; }
.adminBody { flex: 1; min-height: 0; overflow-y: auto; padding: 18px 20px 28px; }
.adminBody .panel { padding: 16px 18px; }
.adminBody .formGrid { grid-template-columns: repeat(2, minmax(0,1fr)); gap: 12px; margin-bottom: 14px; }
.adminBody .formGrid label { font-size: 11px; color: #8794a5; }
.adminBody select {
  width: 100%; margin-top: 5px; padding: 8px 10px; font-size: 12px; font-family: inherit;
  background: rgba(255,255,255,.05); color: #e6edf3;
  border: 0.5px solid rgba(255,255,255,.12); border-radius: 7px; outline: none;
}
.adminBody .hint { font-size: 12px; color: #6f7b8a; line-height: 1.8; }
.adminBody .hint.warn { color: #FAC775; margin-top: 6px; }
.radioRow { display: flex; gap: 20px; margin: 6px 0 10px; font-size: 12px; color: #c9d4e0; }
.radioRow label { display: flex; align-items: center; gap: 7px; cursor: pointer; }
.adminFoot { display: flex; align-items: center; gap: 12px; margin-top: 18px; }
.testTo {
  flex: 1; max-width: 260px; padding: 8px 10px; font-size: 12px; font-family: inherit;
  background: rgba(255,255,255,.05); color: #e6edf3;
  border: 0.5px solid rgba(255,255,255,.12); border-radius: 7px; outline: none;
}

.admTable { width: 100%; border-collapse: collapse; font-size: 12px; }
.admTable th {
  text-align: left; font-size: 10px; font-weight: 500; color: #5f6b7a;
  padding: 6px 10px; border-bottom: 0.5px solid rgba(255,255,255,.08);
}
.admTable td { padding: 9px 10px; border-bottom: 0.5px solid rgba(255,255,255,.05); color: #c9d4e0; }
.admTable tr:last-child td { border-bottom: none; }
.admTable td.right { text-align: right; white-space: nowrap; }
.youTag {
  font-size: 9px; color: #7fb0ff; border: 0.5px solid rgba(61,126,255,.35);
  border-radius: 4px; padding: 0 4px; margin-left: 6px;
}
.stateDot { display: inline-block; width: 6px; height: 6px; border-radius: 50%; background: #1D9E75; margin-right: 5px; }
.stateDot.off { background: #6f7b8a; }
.stateTxt { font-size: 11px; color: #8794a5; margin-right: 10px; }
.okTxt { font-size: 11px; color: #9FE1CB; }
.noTxt { font-size: 11px; color: #F09595; }
.mailListHead .selAll { display: inline-flex; align-items: center; margin-right: 2px; }
.mailListHead .selCountTxt { font-size: 11px; color: #FAC775; margin-right: 6px; }
.mrow .rowSel { display: inline-flex; align-items: center; margin-right: 6px; flex: 0 0 auto; }
.mrow .l1 { display: flex; align-items: center; gap: 4px; }
.chainList { margin-top: 4px; }
.chainRow {
  display: flex; align-items: center; gap: 8px; padding: 6px 9px; margin-bottom: 5px;
  border-radius: 7px; background: rgba(61,126,255,.07);
  border: 0.5px solid rgba(61,126,255,.22); font-size: 11.5px; color: #dbe6f2;
}
.chainN {
  width: 18px; height: 18px; border-radius: 50%; flex: 0 0 18px;
  display: inline-flex; align-items: center; justify-content: center;
  background: rgba(61,126,255,.28); color: #b9d0ff; font-size: 10px;
}
.chainName { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.chainRow .x { color: #6f7b8a; cursor: pointer; font-size: 13px; }
.chainRow .x:hover { color: #F09595; }
.gpBtn {
  width: 100%; display: flex; align-items: center; gap: 8px; margin-top: 5px; padding: 7px 10px;
  border-radius: 8px; background: rgba(255,255,255,.05); border: 0.5px solid rgba(255,255,255,.12);
  color: #c9d4e0; font-size: 11.5px; cursor: pointer; text-align: left; font-family: inherit;
}
.gpBtn:hover { border-color: rgba(61,126,255,.55); }
.gpVal { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.gpArrow { color: #6f7b8a; font-size: 10px; }
.gpPanel {
  position: absolute; z-index: 60; left: 0; right: 0; top: 100%; margin-top: 4px;
  max-height: 180px; overflow-y: auto; padding: 6px 10px; border-radius: 8px;
  background: #121821; border: 0.5px solid rgba(255,255,255,.16);
  box-shadow: 0 12px 30px rgba(0,0,0,.55);
}
.gpPanel .fpRow { padding: 5px 0; }
.gpDone { position: sticky; bottom: -6px; background: #121821; padding: 6px 0 2px; text-align: right; }
.groupPick {
  max-height: 148px; overflow-y: auto; margin-top: 5px; padding: 6px 8px;
  border-radius: 8px; background: rgba(255,255,255,.03);
  border: 0.5px solid rgba(255,255,255,.1);
}
.groupPick .fpRow { padding: 4px 0; }
.fedInput {
  width: 100%; min-width: 110px; padding: 4px 7px; border-radius: 6px;
  background: rgba(255,255,255,.05); border: 0.5px solid rgba(255,255,255,.12);
  color: #c9d4e0; font-size: 11px; font-family: var(--mono, ui-monospace, monospace);
}
.fedInput:focus { outline: none; border-color: rgba(61,126,255,.6); }
.miniBtn {
  font-size: 10px; color: #8794a5; cursor: pointer; padding: 3px 8px;
  border: 0.5px solid rgba(255,255,255,.12); border-radius: 5px;
  background: rgba(255,255,255,.04); font-family: inherit;
}
.miniBtn:hover { color: #e6edf3; border-color: rgba(255,255,255,.25); }

/* ---------- 聊天：联系人 ---------- */
.cpBack {
  font-size: 16px; color: #8794a5; cursor: pointer; padding: 0 4px 0 0; line-height: 1;
}
.cpBack:hover { color: #e6edf3; }
.cpBody { flex: 1; min-height: 0; display: flex; flex-direction: column; }
.cpSearch {
  margin: 9px 10px 4px; padding: 7px 9px; font-size: 12px; font-family: inherit;
  background: rgba(255,255,255,.05); color: #e6edf3;
  border: 0.5px solid rgba(255,255,255,.10); border-radius: 7px; outline: none;
}
.cpSearch:focus { border-color: rgba(61,126,255,.5); }
.contactList { flex: 1; overflow-y: auto; padding: 6px 6px 10px; }
.contact {
  display: flex; align-items: center; gap: 9px; padding: 8px 8px;
  border-radius: 8px; cursor: pointer;
}
.contact:hover { background: rgba(255,255,255,.06); }
.cav {
  width: 28px; height: 28px; flex: 0 0 28px; border-radius: 50%;
  background: rgba(61,126,255,.22); color: #b9d0ff;
  display: flex; align-items: center; justify-content: center; font-size: 10px;
}
.cmeta { min-width: 0; }
.cnm { font-size: 12px; color: #e6edf3; }
.csub { font-size: 10px; color: #6f7b8a; }
.cgo { margin-left: auto; color: #4a5563; font-size: 14px; }

/* ---------- 浮动聊天 ---------- */
#fab {
  position: absolute; right: 20px; bottom: 20px; width: 50px; height: 50px;
  border-radius: 50%; z-index: 60; cursor: pointer;
  background: rgba(15,21,30,.82);
  backdrop-filter: blur(22px) saturate(170%); -webkit-backdrop-filter: blur(22px) saturate(170%);
  border: 0.5px solid rgba(255,255,255,.14); box-shadow: 0 10px 28px rgba(0,0,0,.45);
  display: flex; align-items: center; justify-content: center;
}
#fab:hover { border-color: rgba(61,126,255,.5); }
#fab.over { border-color: rgba(61,126,255,.9); box-shadow: 0 0 0 3px rgba(61,126,255,.3), 0 10px 28px rgba(0,0,0,.45); }
#fab .bdg {
  position: absolute; top: -2px; right: -2px; background: #3d7eff; color: #fff;
  font-size: 9px; border-radius: 9px; padding: 1px 5px; border: 1px solid #0b1017;
}
#chatPanel {
  position: absolute; right: 20px; bottom: 82px; width: 306px; height: 404px;
  border-radius: 12px; z-index: 60; display: none; flex-direction: column;
  background: rgba(15,21,30,.80);
  backdrop-filter: blur(26px) saturate(170%); -webkit-backdrop-filter: blur(26px) saturate(170%);
  border: 0.5px solid rgba(255,255,255,.12); box-shadow: 0 16px 40px rgba(0,0,0,.5);
}
#chatPanel.on { display: flex; }
#chatPanel.over { border-color: rgba(61,126,255,.65); box-shadow: 0 0 0 2px rgba(61,126,255,.3), 0 16px 40px rgba(0,0,0,.5); }
.cpHead { display: flex; align-items: center; gap: 7px; padding: 9px 11px; border-bottom: 0.5px solid rgba(255,255,255,.08); }
.cpHead .t { font-size: 12px; color: #e6edf3; }
.cpHead .x { margin-left: auto; font-size: 13px; color: #5f6b7a; cursor: pointer; padding: 0 4px; }
.cpHead .cpMem { margin-left: auto; display: inline-flex; align-items: center; cursor: pointer; padding: 0 5px; }
.cpHead .cpMem:hover svg { stroke: #c9d4e0; }
.fpRow .x.strike { color: #F09595; }
.cpHead .x:hover { color: #e6edf3; }
.cpTabs { display: flex; gap: 4px; padding: 7px 10px 0; }
.cpTab { font-size: 11px; color: #6f7b8a; padding: 4px 8px; border-radius: 5px; cursor: pointer; }
.cpTab.active { color: #e6edf3; background: rgba(255,255,255,.08); }
#msgs { flex: 1; overflow-y: auto; padding: 10px 11px; }
.msg { margin-bottom: 10px; }
.msg .who { font-size: 10px; color: #7f9ec9; margin-bottom: 2px; }
.msg .who.me { color: #9FE1CB; }
.msg .txt { font-size: 12px; color: #c9d4e0; line-height: 1.6; word-break: break-word; }
.msg .txt.me { color: #e6edf3; }
.att {
  display: flex; align-items: center; gap: 6px; padding: 6px 8px; border-radius: 6px;
  margin-top: 4px; background: rgba(255,255,255,.05); border: 0.5px solid rgba(255,255,255,.10);
}
.att .nm { font-size: 10px; color: #b9d0ff; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.att .sz { font-size: 9px; color: #5f6b7a; margin-left: auto; flex: 0 0 auto; }
.cpInput { border-top: 0.5px solid rgba(255,255,255,.08); padding: 8px 10px; display: flex; gap: 6px; align-items: center; }
.cpInput .clip {
  width: 30px; height: 30px; border-radius: 7px; flex: 0 0 30px; cursor: pointer;
  border: 0.5px solid rgba(255,255,255,.10); background: rgba(255,255,255,.04);
  display: flex; align-items: center; justify-content: center;
}
.cpInput .clip:hover { border-color: rgba(61,126,255,.5); }
.cpInput input[type=text] {
  flex: 1; min-width: 0; background: rgba(255,255,255,.05);
  border: 0.5px solid rgba(255,255,255,.10); border-radius: 7px;
  padding: 7px 9px; color: #e6edf3; font-size: 12px; font-family: inherit; outline: none;
}
.cpInput input[type=text]:focus { border-color: rgba(61,126,255,.5); }
.cpInput input[type=text]::placeholder { color: #4a5563; }
.cpInput button {
  padding: 7px 10px; border-radius: 7px; background: #3d7eff; color: #fff;
  font-size: 11px; border: none; cursor: pointer; flex: 0 0 auto;
}

#toast {
  position: absolute; left: 50%; top: 62px; transform: translateX(-50%);
  background: rgba(8,80,65,.92); border: 0.5px solid rgba(93,202,165,.4);
  color: #9FE1CB; font-size: 11px; padding: 8px 16px; border-radius: 7px;
  opacity: 0; transition: opacity .2s; pointer-events: none; z-index: 90;
}
#toast.show { opacity: 1; }

::-webkit-scrollbar { width: 6px; height: 6px; }
::-webkit-scrollbar-thumb { background: rgba(255,255,255,.12); border-radius: 3px; }
::-webkit-scrollbar-track { background: transparent; }

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

/* ---------- Email: compose / reply ---------- */
.composeBtn {
  margin-left: 10px; font-size: 11px; color: #fff; background: #3d7eff;
  padding: 4px 9px; border-radius: 6px; cursor: pointer; white-space: nowrap;
}
.composeBtn:hover { background: #4d8bff; }
.mailActs { display: flex; gap: 8px; margin-top: 20px; flex-wrap: wrap; }

/* ---------- Work Space: new task ---------- */
.taskNew { display: flex; gap: 6px; margin-bottom: 10px; }
.taskNew input[type=text], .taskNew input:not([type]) {
  flex: 1; min-width: 0; padding: 7px 9px; font-size: 12px; font-family: inherit;
  background: rgba(255,255,255,.05); color: #e6edf3;
  border: 0.5px solid rgba(255,255,255,.12); border-radius: 7px; outline: none;
}
.taskNew input:focus { border-color: rgba(61,126,255,.55); }
.taskNew .taskDue {
  width: 118px; flex: 0 0 118px; padding: 6px 6px; font-size: 11px; font-family: inherit;
  background: rgba(255,255,255,.05); color: #c9d4e0;
  border: 0.5px solid rgba(255,255,255,.12); border-radius: 7px; outline: none;
}
.taskNew .miniBtn { flex: 0 0 auto; padding: 4px 10px; font-size: 13px; }

/* ---------- Meeting: schedule + upcoming ---------- */
.meetSched { margin-top: 22px; max-width: 720px; }
.meetSched .formGrid { grid-template-columns: repeat(2, minmax(0,1fr)); }
.meetUp { max-width: 720px; }

/* ---------- Calendar ---------- */
#pgCal { display: flex; flex-direction: column; width: 100%; padding: 14px 18px 18px; overflow: hidden; }
.calHead { display: flex; align-items: center; gap: 8px; margin-bottom: 10px; }
.calMonth { font-size: 14px; font-weight: 500; min-width: 120px; }
.legend { display: inline-flex; align-items: center; gap: 5px; font-size: 10px; color: #6f7b8a; margin-left: 12px; }
.legend i { width: 8px; height: 8px; border-radius: 2px; display: inline-block; }
.lgMeet { background: #3d7eff; }
.lgTask { background: #EF9F27; }
.calDow {
  display: grid; grid-template-columns: repeat(7, minmax(0,1fr));
  gap: 6px; margin-bottom: 6px;
}
.calDow div { font-size: 10px; color: #5f6b7a; text-align: center; }
.calGrid {
  flex: 1; min-height: 0; display: grid;
  grid-template-columns: repeat(7, minmax(0,1fr));
  grid-auto-rows: minmax(64px, 1fr);
  gap: 6px; overflow-y: auto;
}
.calCell {
  background: rgba(15,21,30,.5); border: 0.5px solid rgba(255,255,255,.07);
  border-radius: 8px; padding: 5px 6px; overflow: hidden;
}
.calCell.empty { background: transparent; border-color: transparent; }
.calCell.today { border-color: rgba(61,126,255,.55); background: rgba(61,126,255,.08); }
.calDay { font-size: 10px; color: #8794a5; margin-bottom: 3px; }
.calCell.today .calDay { color: #7fb0ff; font-weight: 500; }
.calEv {
  font-size: 9px; color: #c9d4e0; padding: 2px 4px; border-radius: 4px;
  margin-bottom: 2px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.calEv.meeting { background: rgba(61,126,255,.20); color: #b9d0ff; }
.calEv.task { background: rgba(239,159,39,.18); color: #FAC775; }

/* ---------- Modal ---------- */
.modalWrap {
  position: absolute; inset: 0; z-index: 200;
  display: flex; align-items: center; justify-content: center;
  background: rgba(3,6,10,.55); backdrop-filter: blur(3px);
}
.modalCard {
  width: 620px; max-width: calc(100vw - 40px); max-height: calc(100vh - 80px);
  display: flex; flex-direction: column;
  background: rgba(15,21,30,.92);
  backdrop-filter: blur(26px) saturate(170%); -webkit-backdrop-filter: blur(26px) saturate(170%);
  border: 0.5px solid rgba(255,255,255,.14); border-radius: 14px;
  box-shadow: 0 24px 60px rgba(0,0,0,.55);
}
.modalCard.narrow { width: 440px; }
.modalHead {
  display: flex; align-items: center; padding: 12px 16px;
  border-bottom: 0.5px solid rgba(255,255,255,.08); font-size: 13px; font-weight: 500;
}
.modalHead .x { margin-left: auto; font-size: 15px; color: #6f7b8a; cursor: pointer; padding: 0 4px; }
.modalHead .x:hover { color: #e6edf3; }
.modalBody { flex: 1; min-height: 0; overflow-y: auto; padding: 14px 16px; }
.modalBody .fld { display: block; font-size: 11px; color: #8794a5; margin-bottom: 10px; }
.modalBody .fld input {
  width: 100%; margin-top: 5px; padding: 8px 10px; font-size: 12px; font-family: inherit;
  background: rgba(255,255,255,.05); color: #e6edf3;
  border: 0.5px solid rgba(255,255,255,.12); border-radius: 7px; outline: none;
}
.modalBody textarea {
  width: 100%; padding: 9px 11px; font-size: 12px; font-family: inherit; line-height: 1.8;
  background: rgba(255,255,255,.05); color: #e6edf3;
  border: 0.5px solid rgba(255,255,255,.12); border-radius: 7px; outline: none; resize: vertical;
}
.modalBody input:focus, .modalBody textarea:focus { border-color: rgba(61,126,255,.55); }
.modalFoot {
  display: flex; justify-content: flex-end; gap: 8px; padding: 12px 16px;
  border-top: 0.5px solid rgba(255,255,255,.08);
}
.pickTabs { display: flex; gap: 4px; padding: 10px 16px 0; }
.pickTabs span {
  font-size: 11px; color: #6f7b8a; padding: 4px 9px; border-radius: 6px; cursor: pointer;
}
.pickTabs span.on { color: #e6edf3; background: rgba(255,255,255,.08); }
.pickList { max-height: 320px; }
.pickRow {
  display: flex; align-items: center; gap: 8px; padding: 8px 10px;
  border-radius: 7px; cursor: pointer;
}
.pickRow:hover { background: rgba(255,255,255,.06); }
.pickRow .pnm { font-size: 12px; color: #c9d4e0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pickRow .psz { margin-left: auto; font-size: 10px; color: #5f6b7a; }

/* ---------- Work Space: upload ---------- */
.upRow { display: flex; gap: 6px; margin-bottom: 4px; }
.upRow select {
  flex: 1; min-width: 0; padding: 6px 8px; font-size: 11px; font-family: inherit;
  background: rgba(255,255,255,.05); color: #c9d4e0;
  border: 0.5px solid rgba(255,255,255,.12); border-radius: 7px; outline: none;
}
.upRow .miniBtn { flex: 0 0 auto; padding: 5px 9px; font-size: 11px; white-space: nowrap; }

/* ---------- Approvals ---------- */
.treeFile .fname { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.treeFile .apprBtn {
  margin-left: auto; flex: 0 0 auto; font-size: 11px; color: #6f7b8a;
  padding: 0 4px; border-radius: 4px; opacity: 0; transition: opacity .12s;
}
.treeFile:hover .apprBtn { opacity: 1; }
.treeFile .apprBtn:hover { color: #3d7eff; background: rgba(61,126,255,.15); }
.apvRow {
  display: flex; align-items: center; gap: 9px; padding: 8px 10px; margin-bottom: 7px;
  border-radius: 8px; background: rgba(239,159,39,.08);
  border: 0.5px solid rgba(239,159,39,.25);
}
.apvMain { min-width: 0; flex: 1; }
.apvTitle { font-size: 12px; color: #e6edf3; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.apvSub { font-size: 10px; color: #6f7b8a; }
.miniBtn.ok { border-color: rgba(93,202,165,.45); color: #5DCAA5; }
.miniBtn.ok:hover { background: rgba(29,158,117,.15); }
.miniBtn.no { border-color: rgba(240,149,149,.4); color: #F09595; margin-left: 5px; }
.miniBtn.no:hover { background: rgba(226,75,74,.15); }

/* ---------- Work Space: new folder ---------- */
.newFolderRow { display: flex; gap: 6px; margin: 6px 0 2px; }
.newFolderRow input {
  flex: 1; min-width: 0; padding: 6px 8px; font-size: 11px; font-family: inherit;
  background: rgba(255,255,255,.05); color: #e6edf3;
  border: 0.5px solid rgba(255,255,255,.12); border-radius: 7px; outline: none;
}

/* ---------- Mail full-page reader ---------- */
.readerWrap {
  position: absolute; inset: 0; z-index: 70; display: flex; flex-direction: column;
  background: rgba(9,13,19,.97);
  backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px);
}
.readerBar {
  display: flex; align-items: center; gap: 8px; padding: 12px 20px;
  border-bottom: 0.5px solid rgba(255,255,255,.08);
}
.readerBar .tbBtn.danger { border-color: rgba(240,149,149,.4); color: #F09595; }
.readerBar .tbBtn.danger:hover { background: rgba(226,75,74,.15); }
.readerBody { flex: 1; min-height: 0; overflow-y: auto; padding: 24px 28px 60px; max-width: 900px; }
.readerBody h2 { font-size: 19px; font-weight: 500; margin-bottom: 14px; line-height: 1.5; }
.readerBody .mailMeta { font-size: 12px; line-height: 1.9; }
.readerBody .mailBody { margin-top: 22px; font-size: 13px; line-height: 2; }

/* ---------- Chat: department groups ---------- */
.deptHead {
  font-size: 10px; color: #5f6b7a; padding: 10px 8px 4px;
  display: flex; align-items: center; gap: 5px; letter-spacing: .3px;
}
.deptHead.clickable { cursor: pointer; }
.deptHead.clickable:hover { color: #c9d4e0; }
.deptHead .caret { font-size: 8px; width: 8px; }
.deptHead .dcount { margin-left: auto; color: #4a5563; }

/* ---------- Admin: chat logs ---------- */
.chatLog { max-height: 320px; overflow-y: auto; }
.logRow {
  display: flex; gap: 10px; padding: 6px 0; font-size: 12px;
  border-bottom: 0.5px solid rgba(255,255,255,.05);
}
.logRow .logTime { flex: 0 0 62px; color: #5f6b7a; font-size: 10px; }
.logRow .logWho { flex: 0 0 90px; color: #7fb0ff; overflow: hidden; text-overflow: ellipsis; }
.logRow .logBody { color: #c9d4e0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* ---------- Task dates & urgency ---------- */
.taskDates { display: flex; gap: 6px; margin-bottom: 10px; }
.taskDates label {
  flex: 1; min-width: 0; font-size: 10px; color: #6f7b8a;
  display: flex; flex-direction: column; gap: 3px;
}
.taskDates input {
  width: 100%; padding: 5px 6px; font-size: 11px; font-family: inherit;
  background: rgba(255,255,255,.05); color: #c9d4e0;
  border: 0.5px solid rgba(255,255,255,.12); border-radius: 6px; outline: none;
}
.taskBody { min-width: 0; flex: 1; }
.taskTitle { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.taskMeta { font-size: 10px; color: #6f7b8a; margin-top: 3px; display: flex; gap: 5px; align-items: center; }
.taskMeta .red { color: #F09595; }
.leftTag { color: #F09595; font-size: 10px; }

.taskItem.urgent {
  border-color: rgba(226,75,74,.55) !important;
  background: rgba(226,75,74,.10) !important;
}
.taskItem.urgent .taskTitle { color: #F7C1C1; }
.asgRow.urgent {
  border-color: rgba(226,75,74,.45);
  background: rgba(226,75,74,.08);
}
.asgRow.urgent .nm { color: #F7C1C1; }

/* ---------- Mail: right reading pane ---------- */
.mailRead { padding: 16px 22px; }
.paneBar {
  display: flex; align-items: center; gap: 6px; margin-bottom: 16px;
  padding-bottom: 12px; border-bottom: 0.5px solid rgba(255,255,255,.07);
  flex-wrap: wrap;
}
.paneBar .tbBtn { padding: 5px 10px; }
.paneBar .tbBtn.danger { border-color: rgba(240,149,149,.4); color: #F09595; }
.paneBar .tbBtn.danger:hover { background: rgba(226,75,74,.15); }
.mailRead h2 { font-size: 15px; margin-bottom: 10px; }
.mailRead .mailBody { font-size: 12.5px; line-height: 1.9; }

/* ---------- Approval attachment chip ---------- */
.apvFile {
  display: inline-flex; align-items: center; gap: 6px; margin-top: 5px;
  padding: 3px 9px 3px 7px; border-radius: 6px; cursor: pointer;
  background: rgba(61,126,255,.12); border: 0.5px solid rgba(61,126,255,.35);
  font-size: 11px; color: #b9d0ff; max-width: 100%;
}
.apvFile:hover { background: rgba(61,126,255,.22); }
.apvFile .fico { width: 10px; height: 12px; flex: 0 0 10px; }

/* ---------- File preview ---------- */
.modalCard.wide { width: 860px; }
.previewBody { display: flex; align-items: center; justify-content: center; min-height: 200px; padding: 0; }
.pvImg { max-width: 100%; max-height: 70vh; display: block; }
.pvFrame { width: 100%; height: 70vh; border: none; background: #fff; }
.pvText {
  width: 100%; max-height: 70vh; overflow: auto; margin: 0; padding: 16px 18px;
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 12px;
  line-height: 1.7; color: #c9d4e0; white-space: pre-wrap; word-break: break-word;
}
.pvFallback { padding: 40px 24px; text-align: center; color: #8794a5; }
.pvFallback p { font-size: 12px; line-height: 1.8; margin-top: 14px; }

/* ---------- Spreadsheet preview ---------- */
.pvSheetWrap { width: 100%; display: flex; flex-direction: column; max-height: 70vh; }
.pvSheetBar { padding: 8px 14px; font-size: 11px; color: #8794a5; border-bottom: 0.5px solid rgba(255,255,255,.08); }
.pvSheet { overflow: auto; padding: 10px 14px 18px; }
.pvSheet table { border-collapse: collapse; font-size: 12px; background: #fff; }
.pvSheet td, .pvSheet th {
  border: 1px solid #d0d5dd; padding: 5px 9px; color: #101828; white-space: nowrap;
  font-family: -apple-system, "Segoe UI", Roboto, sans-serif;
}
.pvSheet tr:first-child td { background: #f2f4f7; font-weight: 600; }

/* ---------- Approval stamp & watermark ---------- */
.pvStampBar {
  display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
  padding: 9px 16px; font-size: 11.5px;
  border-bottom: 0.5px solid rgba(255,255,255,.08);
}
.pvStampBar.approved { background: rgba(29,158,117,.16); color: #9FE1CB; }
.pvStampBar.rejected { background: rgba(226,75,74,.14); color: #F7C1C1; }
.pvStampBar .pvHash { margin-left: auto; font-size: 10px; opacity: .6; font-family: ui-monospace, monospace; }
.pvTamper {
  padding: 9px 16px; font-size: 11.5px;
  background: rgba(226,75,74,.16); color: #F7C1C1;
  border-bottom: 0.5px solid rgba(226,75,74,.35);
}
.previewBody { position: relative; }
.pvWatermark {
  position: absolute; top: 50%; left: 50%;
  transform: translate(-50%, -50%) rotate(-24deg);
  font-size: 54px; font-weight: 700; letter-spacing: 6px;
  pointer-events: none; user-select: none; z-index: 5; white-space: nowrap;
}
.pvWatermark.approved { color: rgba(29,158,117,.18); border: 6px solid rgba(29,158,117,.18);
  padding: 10px 26px; border-radius: 10px; }
.pvWatermark.rejected { color: rgba(226,75,74,.18); border: 6px solid rgba(226,75,74,.18);
  padding: 10px 26px; border-radius: 10px; }

/* ---------- My requests ---------- */
.apvRow.approved { background: rgba(29,158,117,.08); border-color: rgba(93,202,165,.28); }
.apvRow.rejected { background: rgba(226,75,74,.08); border-color: rgba(240,149,149,.28); }
.apvState { font-size: 10px; white-space: nowrap; margin-left: auto; }
.apvState.approved { color: #5DCAA5; }
.apvState.rejected { color: #F09595; }
.apvState.pending { color: #FAC775; }

/* ---------- Submit for approval ---------- */
.apvSubmitBtn {
  width: 100%; margin: 8px 0 2px; padding: 7px 10px;
  border-radius: 8px; cursor: pointer; font-family: inherit; font-size: 11.5px;
  background: rgba(239,159,39,.14); border: 0.5px solid rgba(239,159,39,.4);
  color: #FAC775; text-align: center;
}
.apvSubmitBtn:hover { background: rgba(239,159,39,.24); }
.apvPickList { max-height: 220px; border: 0.5px solid rgba(255,255,255,.08); border-radius: 8px; padding: 4px; margin-bottom: 12px; }
.pickRow.sel { background: rgba(61,126,255,.18); border: 0.5px solid rgba(61,126,255,.5); }
.apvTo { font-size: 11.5px; color: #8794a5; margin-top: 4px; }
.apvTo.warn { color: #FAC775; }
.apvTo b { color: #c9d4e0; }
.treeFile .apprBtn { opacity: .45; }

/* ---------- Admin: password / created box ---------- */
.pwRow { display: flex; gap: 6px; margin-top: 5px; }
.pwRow input {
  flex: 1; min-width: 0; padding: 8px 10px; font-size: 12px; font-family: inherit;
  background: rgba(255,255,255,.05); color: #e6edf3;
  border: 0.5px solid rgba(255,255,255,.12); border-radius: 7px; outline: none;
}
.pwRow .miniBtn { flex: 0 0 auto; padding: 6px 10px; }
.createdBox {
  margin-top: 14px; padding: 12px 14px; border-radius: 9px;
  background: rgba(29,158,117,.10); border: 0.5px solid rgba(93,202,165,.35);
}
.cbTitle { font-size: 12px; color: #5DCAA5; margin-bottom: 2px; }
.cbHint { font-size: 10px; color: #6f7b8a; margin-bottom: 8px; }
.cbRow { display: flex; gap: 10px; font-size: 12px; padding: 2px 0; }
.cbRow span { color: #8794a5; min-width: 96px; }
.cbRow b { color: #e6edf3; font-family: ui-monospace, monospace; user-select: all; }

/* ---------- Mail folders ---------- */
.mfHead {
  display: flex; align-items: center; font-size: 10px; color: #5f6b7a;
  padding: 4px 9px 8px; letter-spacing: .3px;
}
.mfHead .gear { margin-left: auto; cursor: pointer; font-size: 12px; color: #6f7b8a; }
.mfHead .gear:hover { color: #e6edf3; }
.folderPick { max-height: 320px; overflow-y: auto; }
.fpRow {
  display: flex; align-items: center; gap: 9px; padding: 7px 9px;
  border-radius: 7px; font-size: 12px; color: #c9d4e0; cursor: pointer;
}
.fpRow:hover { background: rgba(255,255,255,.05); }
.fpRow .fpPath { margin-left: auto; font-size: 10px; color: #4a5563; }

/* ---------- Chat: new group ---------- */
.pickBar {
  display: flex; align-items: center; font-size: 11px; color: #8794a5;
  margin: 4px 0 8px;
}
.pickBar .selCount {
  margin-left: 8px; background: rgba(61,126,255,.25); color: #b9d0ff;
  border-radius: 9px; padding: 0 7px; font-size: 10px;
}

/* ---------- Dashboard widgets ---------- */
.wgrid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 14px; align-items: start; }
.wcard {
  background: rgba(15,21,30,.62);
  backdrop-filter: blur(22px) saturate(170%); -webkit-backdrop-filter: blur(22px) saturate(170%);
  border: 0.5px solid rgba(255,255,255,.08); border-radius: 11px; padding: 14px 16px;
}
.wcard.admin { border-color: rgba(61,126,255,.24); }
.whead { display: flex; align-items: center; margin-bottom: 10px; }
.whead h3 { font-size: 12.5px; font-weight: 500; }
.wmore { margin-left: auto; font-size: 10px; color: #6f7b8a; cursor: pointer; }
.wmore:hover { color: #c9d4e0; }
.wtaskRow { display: flex; gap: 10px; }
.wtaskNum { flex: 1; min-width: 0; }
.wtaskNum b { display: block; font-size: 20px; font-weight: 500; line-height: 1.2; }
.wtaskNum span { font-size: 10px; color: #6f7b8a; }
.wtaskNum b.amber { color: #EF9F27; } .wtaskNum b.red { color: #E24B4A; } .wtaskNum b.teal { color: #1D9E75; }
.wbar { height: 4px; border-radius: 2px; background: rgba(255,255,255,.08); margin: 12px 0 6px; }
.wbar i { display: block; height: 4px; border-radius: 2px; background: #1D9E75; }
.wfoot { font-size: 10px; color: #6f7b8a; }
.wbig { font-size: 30px; font-weight: 500; line-height: 1.2; }
.wtl { max-height: 210px; overflow-y: auto; }
.wtlRow { display: flex; gap: 9px; padding: 6px 0; border-bottom: 0.5px solid rgba(255,255,255,.05); }
.wtlRow:last-child { border-bottom: none; }
.wtlDot { width: 6px; height: 6px; border-radius: 50%; margin-top: 6px; flex: 0 0 6px; background: #3d7eff; }
.wtlDot.approval { background: #EF9F27; }
.wtlTitle { font-size: 12px; color: #c9d4e0; }
.wtlMeta { font-size: 10px; color: #5f6b7a; }
.wmeet { padding: 6px 0; border-bottom: 0.5px solid rgba(255,255,255,.05); }
.wmeet:last-of-type { border-bottom: none; }
.wmTitle { font-size: 12px; color: #c9d4e0; }
.wmMeta { font-size: 10px; color: #5f6b7a; }
.wfile { font-size: 10px; color: #6f7b8a; margin-top: 3px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.wsys { margin-bottom: 10px; }
.wsysRow { display: flex; align-items: center; gap: 8px; font-size: 11px; color: #8794a5; margin-bottom: 7px; }
.wsysRow span { width: 38px; flex: 0 0 38px; }
.wsysBar { flex: 1; height: 6px; border-radius: 3px; background: rgba(255,255,255,.08); overflow: hidden; }
.wsysBar i { display: block; height: 6px; background: #3d7eff; }
.wsysRow b { width: 40px; text-align: right; color: #c9d4e0; font-weight: 400; flex: 0 0 40px; }
.wsysTable { width: 100%; border-collapse: collapse; font-size: 10.5px; }
.wsysTable th, .wsysTable td { border-bottom: 0.5px solid rgba(255,255,255,.06); padding: 5px 6px; text-align: left; color: #8794a5; }
.wsysTable th { color: #5f6b7a; font-weight: 500; }
.wgear {
  font-size: 10px; color: #6f7b8a; cursor: pointer; margin-left: 10px;
  padding: 2px 7px; border: 0.5px solid rgba(255,255,255,.12); border-radius: 5px;
}
.wgear:hover { color: #e6edf3; border-color: rgba(255,255,255,.25); }

/* ---------- Work Space: collapsible sections ---------- */
.treeSec.clickable { cursor: pointer; user-select: none; }
.treeSec.clickable:hover { color: #c9d4e0; }
.treeSec .fcount { margin-left: auto; font-size: 9px; color: #4a5563; }

/* ---------- 部署版本提示 ---------- */
.buildBar {
  position: fixed; left: 50%; top: 12px; transform: translateX(-50%); z-index: 9000;
  padding: 8px 16px; border-radius: 999px; cursor: pointer;
  background: rgba(61,126,255,.18); border: 0.5px solid rgba(61,126,255,.5);
  color: #cfe0ff; font-size: 12px; backdrop-filter: blur(10px);
}
.buildBar b { color: #fff; text-decoration: underline; margin-left: 6px; }

/* ---------- Dashboard：可拖拉排序 ---------- */
.wcard[draggable="true"] { cursor: grab; }
.wcard[draggable="true"]:active { cursor: grabbing; }
.wcard.wdrag { opacity: .45; border-color: rgba(61,126,255,.55); }
.wcard[draggable="true"]::after {
  content: '⠿'; position: absolute; right: 10px; top: 8px;
  font-size: 11px; color: rgba(255,255,255,.18); pointer-events: none;
}
.wcard { position: relative; }

/* ---------- 会议设备 ---------- */
.devPanel {
  margin-top: 16px; padding: 12px 14px; border-radius: 10px;
  background: rgba(255,255,255,.03); border: 0.5px solid rgba(255,255,255,.1);
}
.devHead { display: flex; align-items: center; justify-content: space-between;
  font-size: 11.5px; color: #c9d4e0; margin-bottom: 8px; }
.devGrid { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 10px; }
.devGrid label, .devPop label { display: block; font-size: 10.5px; color: #8794a5; }
.devGrid select, .devPop select {
  width: 100%; margin-top: 5px; padding: 7px 9px; font-size: 11.5px; font-family: inherit;
  background: rgba(255,255,255,.05); color: #e6edf3;
  border: 0.5px solid rgba(255,255,255,.12); border-radius: 7px; outline: none;
}
.devFoot { display: flex; align-items: center; gap: 10px; margin-top: 10px; }
.devHint { font-size: 10.5px; color: #6f7b8a; line-height: 1.6; margin: 0; }
.devPop {
  display: flex; gap: 10px; align-items: flex-end; flex-wrap: wrap;
  padding: 10px 14px; background: rgba(255,255,255,.04);
  border-bottom: 0.5px solid rgba(255,255,255,.08);
}
.devPop label { flex: 1; min-width: 150px; }
.testVideo {
  width: 100%; max-height: 240px; border-radius: 10px; background: #0b1017;
  object-fit: cover; border: 0.5px solid rgba(255,255,255,.1);
}
.lvl { height: 6px; border-radius: 999px; background: rgba(255,255,255,.08); margin-top: 10px; overflow: hidden; }
.lvl i { display: block; height: 100%; border-radius: 999px;
  background: linear-gradient(90deg,#1D9E75,#5DCAA5); transition: width .08s linear; }
.formGrid .wide { grid-column: 1 / -1; }
.chainN.cc { background: rgba(93,202,165,.22); color: #9FE1CB; font-size: 8.5px; letter-spacing: .3px; }
.meetCard .act { display: flex; gap: 6px; align-items: center; }

/* 拖拉手柄占位：卡片标题行右边留一点空间，别压住 Open / Refresh */
.wcard[draggable="true"] .whead { padding-right: 14px; }

/* ---------- 数字签名 ---------- */
.pvSig {
  margin-left: auto; font-size: 10.5px; padding: 2px 8px; border-radius: 999px;
  background: rgba(93,202,165,.16); color: #9FE1CB; border: 0.5px solid rgba(93,202,165,.4);
}
.pvSig.bad { background: rgba(226,75,74,.18); color: #F09595; border-color: rgba(226,75,74,.45); }
.pvStampBar .miniBtn { margin-left: 8px; }
.pvSigDetail {
  padding: 10px 16px; background: rgba(93,202,165,.06);
  border-bottom: 0.5px solid rgba(255,255,255,.08); font-size: 11px;
}
.pvSigDetail .sigRow { display: flex; gap: 12px; padding: 3px 0; }
.pvSigDetail .sigRow > span { width: 150px; flex: 0 0 150px; color: #8794a5; }
.pvSigDetail .sigRow > b { color: #c9d4e0; font-weight: 500; }
.pvSigDetail .mono { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 10.5px; letter-spacing: .3px; }