:root {
  --bg: #eef0f5; --surface: #fff;
  --primary: #2563eb; --primary-dark: #1d4ed8; --primary-light: #eef2ff;
  --danger: #dc2626; --danger-light: #fef2f2;
  --success: #16a34a; --success-light: #f0fdf4;
  --warning: #d97706; --warning-light: #fffbeb;
  --text: #0f172a; --text-secondary: #475569; --text-muted: #94a3b8;
  --border: #e2e8f0;
  --radius: 12px; --radius-sm: 8px;
  --shadow: 0 1px 3px rgba(0,0,0,.06);
  --shadow-md: 0 4px 16px rgba(0,0,0,.08);
}

/* ===== 2026 智慧门户视觉体系 ===== */
.topnav { height: 68px; padding: 0 24px; gap: 24px; background: rgba(7,19,41,.98); border-bottom: 1px solid rgba(75,153,255,.22); box-shadow: 0 10px 32px rgba(2,8,23,.22); }
.topnav .brand { min-width: 330px; gap: 12px; color: #fff; }
.brand-mark { width: 38px; height: 38px; display: grid; place-items: center; border-radius: 12px; font-size: 20px; font-weight: 900; background: linear-gradient(145deg,#2f8cff,#6be4ff); box-shadow: 0 0 24px rgba(59,160,255,.38); }
.brand-copy { display: flex; flex-direction: column; line-height: 1.1; }
.brand-copy strong { font-size: 16px; letter-spacing: .6px; }
.brand-copy small { margin-top: 5px; color: #7ea5d7; font-size: 8px; letter-spacing: 1.35px; }
.topnav .nav-group { height: 100%; gap: 2px; }
.nav-home,.nav-trigger { height: 100%; display: flex; align-items: center; padding: 0 11px; border: 0; color: #b9cae3; background: none; font: inherit; font-size: 13px; cursor: pointer; white-space: nowrap; border-bottom: 2px solid transparent; }
.nav-home:hover,.nav-trigger:hover,.nav-home.active,.nav-trigger.active { color: #fff; background: rgba(57,139,255,.09); border-bottom-color: #45c9ff; }
.nav-trigger span { margin-left: 5px; opacity: .65; }
.nav-menu { height: 100%; position: relative; }
.nav-dropdown { display: none; position: absolute; left: 0; top: 58px; min-width: 220px; padding: 8px; background: rgba(9,24,49,.98); border: 1px solid rgba(92,154,235,.25); border-radius: 12px; box-shadow: 0 18px 45px rgba(2,8,23,.36); }
.nav-menu:hover .nav-dropdown,.nav-menu:focus-within .nav-dropdown { display: block; }
.drop-link { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 11px 12px; border-radius: 8px; color: #d7e6fb; font-size: 13px; }
.drop-link:hover { color: #fff; background: rgba(50,143,255,.16); }
.drop-link b { color: #56d6ff; }.drop-link em { color: #728aa9; font-size: 10px; font-style: normal; }
.drop-link.planned { cursor: default; color: #7890ae; }
.user-avatar { width: 28px; height: 28px; display: grid; place-items: center; border-radius: 50%; color: #dff5ff; background: rgba(67,158,255,.22); border: 1px solid rgba(92,194,255,.35); font-size: 12px; font-weight: 800; }
.portal-home { padding: 26px 30px 38px; background: radial-gradient(circle at 88% 8%,rgba(54,132,255,.12),transparent 28%),linear-gradient(180deg,#f4f8fd,#edf2f8); }
.hero-panel { min-height: 215px; position: relative; overflow: hidden; display: flex; align-items: center; justify-content: space-between; padding: 34px 48px; color: #fff; border-radius: 20px; background: linear-gradient(125deg,#071a3d 0%,#0c3766 55%,#0b6595 100%); box-shadow: 0 22px 45px rgba(10,42,85,.2); }
.hero-panel:before { content:""; position:absolute; inset:0; background-image:linear-gradient(rgba(87,182,255,.055) 1px,transparent 1px),linear-gradient(90deg,rgba(87,182,255,.055) 1px,transparent 1px); background-size:28px 28px; mask-image:linear-gradient(90deg,#000,transparent); }
.hero-copy { position: relative; z-index: 2; max-width: 760px; }.eyebrow { color:#79d9ff; font-size:10px; letter-spacing:2px; font-weight:700; }.eyebrow span { display:inline-block;width:20px;height:2px;margin:0 8px 3px 0;background:#50d7ff; }
.hero-copy h1 { margin-top: 13px; font-size: 34px; letter-spacing: 3px; }.hero-copy p { margin-top: 12px; max-width: 680px; color:#b8cee9; font-size:14px; line-height:1.8; }.hero-meta { display:flex; gap:25px; margin-top:23px; color:#7fa4cc; font-size:11px; }.hero-meta span:first-child { color:#64dfb1; }
.hero-orbit { width: 170px; height: 170px; position:relative; display:grid; place-items:center; margin-right:45px; }.orbit-ring { position:absolute; inset:12px; border:1px solid rgba(92,212,255,.32); border-radius:50%; box-shadow:0 0 45px rgba(28,162,255,.18),inset 0 0 28px rgba(48,176,255,.12); }.orbit-ring:after { content:"";position:absolute;inset:18px;border:1px dashed rgba(104,206,255,.22);border-radius:50%; }.orbit-core { width:72px;height:72px;display:grid;place-items:center;border-radius:22px;background:linear-gradient(145deg,#178eff,#50d5ff);font-size:24px;font-weight:900;box-shadow:0 0 38px rgba(46,189,255,.45); }
.workspace-head { display:flex;align-items:end;justify-content:space-between;margin:28px 2px 16px; }.section-kicker { color:#2f7edb;font-size:9px;font-weight:800;letter-spacing:1.8px; }.workspace-head h2 { margin-top:4px;font-size:21px; }.workspace-tip { color:#8291a5;font-size:12px; }
.capability-grid { display:grid;grid-template-columns:repeat(3,minmax(260px,1fr));gap:16px; }.cap-domain { --tone:#3489ff; position:relative;min-height:235px;padding:20px;border:1px solid #dce5f0;border-radius:16px;background:rgba(255,255,255,.92);box-shadow:0 8px 28px rgba(25,55,92,.06);transition:.2s; }.cap-domain:hover { transform:translateY(-2px);box-shadow:0 14px 32px rgba(25,55,92,.1);border-color:color-mix(in srgb,var(--tone) 28%,#dce5f0); }.cap-domain header { display:flex;align-items:center;gap:12px; }.domain-icon { width:42px;height:42px;display:grid;place-items:center;border-radius:12px;color:var(--tone);background:color-mix(in srgb,var(--tone) 10%,white);font-size:21px;font-weight:800; }.domain-code { color:var(--tone);font-size:8px;font-weight:900;letter-spacing:1.5px; }.cap-domain h3 { margin-top:2px;font-size:17px; }.domain-desc { margin:12px 0 14px;color:#718096;font-size:12px; }.cap-apps { display:flex;flex-direction:column;gap:8px; }.cap-app { display:flex;align-items:center;justify-content:space-between;gap:12px;padding:11px 12px;border:1px solid #e9eef5;border-radius:10px;background:#f9fbfd;cursor:pointer;transition:.15s; }.cap-app:hover { border-color:color-mix(in srgb,var(--tone) 30%,#e9eef5);background:color-mix(in srgb,var(--tone) 4%,white); }.cap-app-title { font-size:13px;font-weight:700; }.cap-app-desc { margin-top:3px;color:#8795a8;font-size:10px; }.cap-app-action { flex:none;color:var(--tone);font-size:10px;font-weight:700; }.cap-app.is-planned { cursor:default;opacity:.68; }.cap-app.is-planned .cap-app-action { color:#8b99aa; }.tone-cyan{--tone:#089fc4}.tone-violet{--tone:#7257d8}.tone-blue{--tone:#287cea}.tone-indigo{--tone:#4d58d5}.tone-slate{--tone:#49647d}.tone-emerald{--tone:#11966e}
@media(max-width:1180px){.topnav .brand{min-width:260px}.brand-copy small{display:none}.nav-home,.nav-trigger{padding:0 7px;font-size:12px}.capability-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:760px){.topnav{height:auto;min-height:64px;flex-wrap:wrap;padding:10px 14px}.topnav .brand{min-width:0}.topnav .nav-group{order:3;width:100%;height:40px;overflow-x:auto}.topnav .username{display:none}.portal-home{padding:14px}.hero-panel{padding:26px 22px}.hero-copy h1{font-size:26px}.hero-orbit{display:none}.hero-meta{gap:10px;flex-wrap:wrap}.capability-grid{grid-template-columns:1fr}}

/* 能力区强化与常驻消息入口 */
.message-hub { position:relative;display:flex;align-items:center;gap:7px;padding:7px 10px;border:1px solid rgba(94,194,255,.28);border-radius:10px;background:rgba(34,126,220,.13);color:#d9ecff;font-size:12px;cursor:pointer;white-space:nowrap; }
.message-hub:hover { background:rgba(42,145,245,.22);border-color:rgba(94,194,255,.48); }.message-icon { font-size:16px;color:#6bdcff; }.message-hub em { padding:2px 5px;border-radius:5px;background:rgba(255,184,77,.15);color:#ffc66d;font-size:8px;font-style:normal; }
.message-hub.has-unread:after { content:attr(data-unread);position:absolute;right:-7px;top:-7px;min-width:18px;height:18px;padding:0 4px;display:grid;place-items:center;border:2px solid #071329;border-radius:10px;background:#ff405b;color:#fff;font-size:9px;font-weight:800; }
.cap-domain { overflow:hidden;min-height:255px;padding:23px;border-color:#cfdbea;background:linear-gradient(155deg,#fff 55%,color-mix(in srgb,var(--tone) 5%,white));box-shadow:0 10px 28px rgba(22,52,88,.09); }
.cap-domain:before { content:"";position:absolute;left:0;right:0;top:0;height:4px;background:linear-gradient(90deg,var(--tone),color-mix(in srgb,var(--tone) 35%,white)); }
.cap-domain.is-featured { border-color:color-mix(in srgb,var(--tone) 45%,#cfdbea);box-shadow:0 12px 34px color-mix(in srgb,var(--tone) 14%,transparent); }
.cap-domain h3 { font-size:19px; }.domain-desc { margin:14px 0 17px;font-size:13px;color:#64758b; }.domain-icon { width:48px;height:48px;font-size:23px;box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--tone) 12%,transparent); }
.cap-app { min-height:57px;padding:13px 14px;border-color:#dbe5f0;background:rgba(255,255,255,.85); }.cap-app-title { font-size:14px; }.cap-app-desc { margin-top:5px;font-size:11px; }.cap-app-action { padding:5px 8px;border-radius:7px;background:color-mix(in srgb,var(--tone) 9%,white);font-size:10px; }
.cap-app:not(.is-planned):hover { transform:translateX(3px);box-shadow:0 5px 14px rgba(24,65,108,.08); }.cap-app.is-planned { opacity:1;border-style:dashed;background:rgba(247,249,252,.9); }.cap-app.is-planned .cap-app-action { background:#eef1f5;color:#738197; }
@media(max-width:1180px){.message-hub span:not(.message-icon),.message-hub em{display:none}}

/* ===== 即时通讯 ===== */
.collab-shell{display:grid;grid-template-columns:310px minmax(420px,1fr) 240px;flex:1;min-height:0;background:#edf3f9}.chat-sidebar,.chat-main,.chat-info{min-height:0}.chat-sidebar{display:flex;flex-direction:column;background:#fff;border-right:1px solid #dce5ef}.chat-sidebar>header{height:82px;display:flex;align-items:center;justify-content:space-between;padding:17px 20px;border-bottom:1px solid #e7edf4}.chat-sidebar h2{margin-top:3px;font-size:20px}.icon-btn{width:34px;height:34px;border:0;border-radius:10px;background:#eaf4ff;color:#1477df;font-size:23px;cursor:pointer}.chat-search{padding:12px 15px}.chat-search input{width:100%;padding:10px 13px;border:1px solid #dbe5ef;border-radius:10px;background:#f7f9fc;outline:none}.conversation-list{flex:1;overflow:auto;padding:0 9px 12px}.conversation-item{width:100%;display:flex;align-items:center;gap:10px;padding:11px;border:0;border-radius:11px;background:transparent;text-align:left;cursor:pointer}.conversation-item:hover,.conversation-item.active{background:#edf6ff}.conversation-avatar{width:40px;height:40px;display:grid;place-items:center;flex:none;border-radius:13px;background:linear-gradient(145deg,#2189ed,#55d3ef);color:#fff;font-weight:800}.conversation-copy{min-width:0;flex:1}.conversation-copy b,.conversation-copy small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.conversation-copy b{font-size:13px}.conversation-copy small{margin-top:4px;color:#8a98aa;font-size:10px}.conversation-item em{min-width:19px;height:19px;padding:0 5px;display:grid;place-items:center;border-radius:10px;background:#ff405b;color:#fff;font-size:9px;font-style:normal}.list-empty{padding:35px 10px;text-align:center;color:#9aa7b7}.chat-main{position:relative;background:linear-gradient(180deg,#f9fbfd,#f1f5f9)}.chat-empty{height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;color:#7f90a5}.chat-empty .empty-icon{width:72px;height:72px;display:grid;place-items:center;margin-bottom:15px;border-radius:24px;background:#e4f2ff;color:#1688e9;font-size:30px}.chat-empty h2{color:#29425f}.chat-empty p{margin-top:8px}.chat-panel{height:100%;display:flex;flex-direction:column}.chat-head{height:72px;padding:14px 22px;background:rgba(255,255,255,.92);border-bottom:1px solid #dce5ef}.chat-head h2{font-size:17px}.chat-head p{margin-top:5px;color:#8997a8;font-size:10px}.message-list{flex:1;overflow:auto;padding:18px 24px}.load-more{display:block;margin:0 auto 15px;padding:5px 12px;border:0;border-radius:8px;background:#e7edf4;color:#708096;font-size:10px;cursor:pointer}.message-row{display:flex;margin:10px 0}.message-row.own{justify-content:flex-end}.message-bubble{max-width:70%;padding:9px 12px;border:1px solid #dce6f0;border-radius:4px 13px 13px 13px;background:#fff;box-shadow:0 3px 10px rgba(29,58,91,.06)}.message-row.own .message-bubble{border-color:#2788e6;border-radius:13px 4px 13px 13px;background:#2788e6;color:#fff}.message-sender{margin-bottom:4px;color:#2281d7;font-size:9px;font-weight:700}.message-row.own .message-sender{color:#cce9ff}.message-text{line-height:1.6;word-break:break-word}.message-bubble time{display:block;margin-top:4px;text-align:right;color:#9aa7b6;font-size:8px}.message-row.own time{color:#bfe1ff}.message-file{display:flex;align-items:center;gap:8px;margin-top:5px;padding:9px;border-radius:8px;background:rgba(232,242,251,.8);color:#245f93}.message-row.own .message-file{background:rgba(255,255,255,.16);color:#fff}.message-file small{margin-left:auto}.chat-compose{padding:10px 18px 16px;background:#fff;border-top:1px solid #dce5ef}.compose-row{display:flex;align-items:end;gap:9px}.compose-row textarea{flex:1;max-height:120px;resize:none;padding:10px 12px;border:1px solid #d6e0eb;border-radius:11px;font:inherit;outline:none}.compose-row textarea:focus{border-color:#298be8;box-shadow:0 0 0 3px #e8f4ff}.attach-btn{width:38px;height:38px;border:1px solid #d5e1ed;border-radius:10px;background:#f4f8fc;color:#377aa8;font-size:21px;cursor:pointer}.send-btn{height:38px;padding:0 19px;border:0;border-radius:10px;background:#2185e4;color:#fff;font-weight:700;cursor:pointer}.pending-file{margin-bottom:8px;padding:7px 10px;border-radius:8px;background:#eef7ff;color:#276796;font-size:11px}.pending-file button{float:right;border:0;background:none;cursor:pointer}.chat-info{padding:16px;background:#f6f9fc;border-left:1px solid #dce5ef}.info-card{margin-bottom:12px;padding:16px;border:1px solid #dbe5ef;border-radius:13px;background:#fff}.info-card h3{font-size:13px}.info-card p{margin-top:9px;color:#8492a3;font-size:10px;line-height:1.65}.status-row{display:flex;align-items:center;gap:7px;margin-top:11px;font-size:11px}.live-dot{width:7px;height:7px;border-radius:50%;background:#19bc84;box-shadow:0 0 8px #19bc84}.modal-mask{position:fixed;inset:0;z-index:1000;display:grid;place-items:center;background:rgba(2,12,29,.55)}.modal-mask[hidden]{display:none}.dialog{width:390px;padding:20px;border-radius:16px;background:#fff;box-shadow:0 20px 60px rgba(2,12,29,.3)}.dialog header{display:flex;justify-content:space-between;align-items:center;margin-bottom:17px}.dialog header button{border:0;background:none;font-size:21px;cursor:pointer}.dialog label{display:block;margin:12px 0 6px;color:#63748a;font-size:11px}.dialog-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:18px}

/* ===== 文件中心 ===== */
.files-page{flex:1;overflow:auto;padding:24px 28px;background:radial-gradient(circle at 90% 0,rgba(67,142,245,.1),transparent 30%),#eef3f9}.files-hero{display:flex;align-items:center;justify-content:space-between;padding:26px 30px;border-radius:17px;background:linear-gradient(120deg,#09254b,#0f6090);color:#fff;box-shadow:0 14px 32px rgba(13,51,93,.18)}.files-hero h1{margin-top:5px;font-size:25px}.files-hero p{margin-top:9px;color:#b9d0e8;font-size:12px}.upload-primary{padding:11px 17px;border-radius:10px;background:#fff;color:#126bb1;font-weight:700;cursor:pointer;box-shadow:0 6px 18px rgba(2,20,47,.18)}.files-workspace{display:grid;grid-template-columns:230px 1fr;min-height:520px;margin-top:18px;border:1px solid #d7e1ec;border-radius:16px;background:#fff;overflow:hidden;box-shadow:0 10px 28px rgba(20,52,88,.07)}.file-nav{padding:18px 12px;background:#f7f9fc;border-right:1px solid #e0e8f1}.file-space{width:100%;display:flex;gap:11px;align-items:center;padding:12px;border:0;border-radius:10px;background:transparent;text-align:left;cursor:pointer}.file-space:hover,.file-space.active{background:#e7f2ff;color:#156fc2}.file-space>span{font-size:20px}.file-space b,.file-space small{display:block}.file-space b{font-size:12px}.file-space small{margin-top:4px;color:#8998aa;font-size:9px}.storage-note{margin-top:22px;padding:12px;border-radius:10px;background:#eef3f8;color:#708197}.storage-note b{font-size:11px}.storage-note p{margin-top:5px;font-size:9px;line-height:1.6}.file-content{padding:20px 22px}.file-content>header{display:flex;align-items:center;justify-content:space-between;margin-bottom:18px}.file-content h2{font-size:19px}.file-content header p{margin-top:5px;color:#8493a5;font-size:10px}.file-tools{display:flex;gap:8px}.file-tools .input{width:220px}.upload-progress{margin-bottom:12px;padding:9px 12px;border-radius:9px;background:#e8f6ff;color:#176fae;font-size:11px}.file-table-wrap{overflow:auto}.file-table{width:100%;border-collapse:collapse}.file-table th,.file-table td{padding:12px 10px;border-bottom:1px solid #e8edf3;text-align:left;font-size:11px}.file-table th{color:#7b899b;background:#f7f9fb;font-weight:600}.file-name{display:flex;align-items:center;gap:9px;min-width:220px}.file-name>span{font-size:20px;color:#3288db}.file-name b,.file-name small{display:block}.file-name small{margin-top:4px;color:#9aa6b5;font-size:8px}.space-badge{padding:3px 8px;border-radius:7px;font-size:9px}.space-badge.public{background:#e3f4ee;color:#168363}.space-badge.personal{background:#e8f1ff;color:#296fcb}.file-empty{padding:60px;text-align:center;color:#97a4b4}
@media(max-width:1100px){.collab-shell{grid-template-columns:270px 1fr}.chat-info{display:none}.files-workspace{grid-template-columns:190px 1fr}}@media(max-width:760px){.collab-shell{grid-template-columns:1fr}.chat-sidebar{display:none}.files-page{padding:12px}.files-hero{padding:20px}.files-workspace{grid-template-columns:1fr}.file-nav{display:flex;gap:6px}.storage-note{display:none}.file-content>header{align-items:flex-start;gap:10px;flex-direction:column}.file-tools{width:100%}.file-tools .input{flex:1}}
.message-toast{position:fixed;right:22px;top:82px;z-index:1200;width:330px;display:flex;align-items:flex-start;gap:11px;padding:14px;border:1px solid #bcdcff;border-radius:13px;background:#fff;color:#17324f;text-align:left;box-shadow:0 16px 45px rgba(8,38,73,.24);cursor:pointer;animation:toast-in .24s ease}.message-toast>span{width:34px;height:34px;display:grid;place-items:center;border-radius:10px;background:#e6f4ff;color:#1688e7;font-size:17px}.message-toast div{min-width:0;flex:1}.message-toast b{font-size:12px}.message-toast p{margin-top:5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#6e7f92;font-size:11px}@keyframes toast-in{from{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:none}}
* { box-sizing: border-box; margin: 0; padding: 0; }
[hidden] { display: none !important; }
html, body { height: 100%; }
body {
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Microsoft YaHei", sans-serif;
  background: var(--bg); color: var(--text); font-size: 14px;
}
a { color: var(--primary); text-decoration: none; }

/* ===== 顶栏 ===== */
.topnav {
  background: linear-gradient(135deg, #0f172a 0%, #1e3a5f 50%, #2563eb 100%);
  color: #fff; height: 56px; display: flex; align-items: center; padding: 0 20px;
  gap: 18px; box-shadow: 0 2px 12px rgba(0,0,0,.18); position: relative; z-index: 100;
  flex-shrink: 0;
}
.topnav .brand { display: flex; align-items: center; gap: 10px; font-weight: 700; font-size: 16px; letter-spacing: 1px; white-space: nowrap; }
.topnav .brand .logo { font-size: 20px; }
.topnav .nav-group { display: flex; align-items: center; gap: 4px; }
.topnav .nav-group .sep { color: rgba(255,255,255,.35); margin: 0 6px; }
.topnav .nav-link {
  color: rgba(255,255,255,.82); padding: 7px 12px; border-radius: 8px; font-size: 14px;
  transition: all .15s; white-space: nowrap;
}
.topnav .nav-link:hover { background: rgba(255,255,255,.14); color: #fff; }
.topnav .nav-link.active { background: rgba(255,255,255,.2); color: #fff; font-weight: 600; }
.topnav .spacer { flex: 1; }
.topnav .user-box { display: flex; align-items: center; gap: 12px; }
.topnav .username { font-size: 13px; color: rgba(255,255,255,.9); }
.topnav .btn-logout {
  background: rgba(255,255,255,.14); color: #fff; border: none; padding: 6px 12px;
  border-radius: 8px; cursor: pointer; font-size: 13px;
}
.topnav .btn-logout:hover { background: rgba(255,255,255,.26); }

/* ===== 布局 ===== */
.page { display: flex; flex-direction: column; height: 100vh; }
.page-body { flex: 1; overflow: auto; padding: 24px; }

/* ===== 卡片 ===== */
.card { background: var(--surface); border-radius: var(--radius); box-shadow: var(--shadow); padding: 20px; border: 1px solid var(--border); }
.card + .card { margin-top: 16px; }
.card h2 { font-size: 16px; margin-bottom: 14px; display: flex; align-items: center; gap: 8px; }
.card h2 .ico { font-size: 18px; }

/* ===== 按钮 ===== */
.btn {
  border: none; border-radius: 8px; padding: 8px 16px; cursor: pointer; font-size: 14px;
  transition: all .15s; display: inline-flex; align-items: center; gap: 6px;
}
.btn-primary { background: var(--primary); color: #fff; }
.btn-primary:hover { background: var(--primary-dark); }
.btn-ghost { background: #f1f5f9; color: var(--text); border: 1px solid var(--border); }
.btn-ghost:hover { background: #e2e8f0; }
.btn-danger { background: var(--danger-light); color: var(--danger); border: 1px solid #fecaca; }
.btn-danger:hover { background: #fee2e2; }
.btn-sm { padding: 5px 10px; font-size: 12px; }
.btn:disabled { opacity: .55; cursor: not-allowed; }

/* ===== 表单 ===== */
.form-row { margin-bottom: 14px; }
.form-row label { display: block; font-size: 13px; color: var(--text-secondary); margin-bottom: 6px; font-weight: 500; }
.input {
  width: 100%; border: 1px solid var(--border); border-radius: 8px; padding: 9px 12px;
  font-size: 14px; outline: none; transition: border-color .15s, box-shadow .15s; background: #fff;
}
.input:focus { border-color: var(--primary); box-shadow: 0 0 0 3px var(--primary-light); }
.form-inline { display: flex; gap: 10px; align-items: flex-end; flex-wrap: wrap; }
.form-inline .form-row { margin-bottom: 0; flex: 1; min-width: 140px; }

/* 工具权限勾选 */
.chk-group { display: flex; flex-wrap: wrap; gap: 14px; padding-top: 8px; }
.chk { display: inline-flex; align-items: center; gap: 5px; font-size: 13px; color: var(--text-secondary); cursor: pointer; white-space: nowrap; }
.chk input { cursor: pointer; }
.chk-sm { font-size: 12px; margin-right: 10px; }

/* ===== 提示 ===== */
.msg { padding: 10px 14px; border-radius: 8px; font-size: 13px; margin-top: 12px; display: none; }
.msg.error { display: block; background: var(--danger-light); color: var(--danger); }
.msg.success { display: block; background: var(--success-light); color: var(--success); }
.msg.info { display: block; background: var(--warning-light); color: var(--warning); }

/* ===== 表格 ===== */
table.tbl { width: 100%; border-collapse: collapse; }
table.tbl th, table.tbl td { text-align: left; padding: 10px 12px; border-bottom: 1px solid var(--border); font-size: 13px; }
table.tbl th { color: var(--text-secondary); font-weight: 600; background: #f8fafc; white-space: nowrap; }
table.tbl tr:hover td { background: #f8fafc; }
.badge { display: inline-block; padding: 2px 10px; border-radius: 12px; font-size: 12px; }
.badge.admin { background: var(--primary-light); color: var(--primary); }
.badge.user { background: #f1f5f9; color: var(--text-secondary); }
.badge.on { background: var(--success-light); color: var(--success); }
.badge.off { background: var(--danger-light); color: var(--danger); }
.row-actions { display: flex; gap: 6px; flex-wrap: wrap; }

/* ===== 登录页 ===== */
.login-wrap { min-height: 100vh; display: flex; align-items: center; justify-content: center;
  background: linear-gradient(135deg, #0f172a 0%, #1e3a5f 60%, #2563eb 100%); }
.login-card { background: #fff; border-radius: 16px; box-shadow: 0 20px 60px rgba(0,0,0,.3); padding: 36px 40px; width: 360px; }
.login-card .brand { text-align: center; margin-bottom: 24px; }
.login-card .brand .logo { font-size: 40px; }
.login-card .brand h1 { font-size: 20px; margin-top: 8px; letter-spacing: 2px; }
.login-card .brand p { color: var(--text-muted); font-size: 13px; margin-top: 4px; }
.login-card .btn { width: 100%; justify-content: center; padding: 10px; margin-top: 6px; }
.login-wrap { position:relative; overflow:hidden; background:radial-gradient(circle at 75% 20%,rgba(28,143,255,.28),transparent 30%),linear-gradient(135deg,#06142d,#0b315d 60%,#087498); }
.login-wrap:before { content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(94,191,255,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(94,191,255,.05) 1px,transparent 1px);background-size:32px 32px; }
.login-card { position:relative;width:420px;padding:40px 44px;border:1px solid rgba(255,255,255,.72);box-shadow:0 28px 80px rgba(1,10,29,.4); }
.login-card .brand h1 { margin-top:14px;font-size:20px;letter-spacing:.5px; }.login-card .brand p { margin-top:7px;font-size:9px;letter-spacing:1.4px;color:#7890ad; }

/* ===== 首页 ===== */
.home-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 18px; }
.home-tile {
  background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius);
  padding: 22px; cursor: pointer; transition: all .18s; box-shadow: var(--shadow); display: flex;
  flex-direction: column; gap: 10px;
}
.home-tile:hover { transform: translateY(-3px); box-shadow: var(--shadow-md); border-color: var(--primary-light); }
.home-tile .t-ico { font-size: 30px; }
.home-tile .t-title { font-size: 17px; font-weight: 700; }
.home-tile .t-desc { color: var(--text-secondary); font-size: 13px; line-height: 1.6; }
.home-tile .t-go { color: var(--primary); font-size: 13px; font-weight: 600; }
.home-tile.admin-tile { border-left: 4px solid var(--primary); }

/* ===== 工具内嵌页 ===== */
.tool-frame-wrap { flex: 1; background: #fff; overflow: hidden; }
.tool-frame-wrap iframe { width: 100%; height: 100%; border: none; display: block; }

/* ===== 设置页 ===== */
.key-input-wrap { display: flex; gap: 8px; }
.key-input-wrap .input { flex: 1; font-family: Consolas, monospace; }

/* ===== 文件中心：目录与新建文档 ===== */
.file-create-actions { display: flex; align-items: center; gap: 9px; }
.hero-action { padding: 10px 15px; border: 1px solid rgba(255,255,255,.38); border-radius: 10px; background: rgba(255,255,255,.1); color: #fff; font-weight: 650; cursor: pointer; backdrop-filter: blur(8px); }
.hero-action:hover { background: rgba(255,255,255,.2); }
.file-breadcrumbs { display: flex; align-items: center; gap: 6px; min-height: 38px; margin: -5px 0 12px; padding: 7px 10px; border: 1px solid #e2eaf3; border-radius: 9px; background: #f8fafc; }
.file-breadcrumbs button { border: 0; background: transparent; color: #176eb7; font-size: 11px; cursor: pointer; }
.file-breadcrumbs button:hover { text-decoration: underline; }
.file-breadcrumbs span { color: #9aa8b7; }
.folder-row { cursor: pointer; }
.folder-row:hover td { background: #f2f8ff; }
.folder-icon { color: #e7a91c !important; }
.file-modal-backdrop { position: fixed; inset: 0; z-index: 1600; display: grid; place-items: center; padding: 20px; background: rgba(4,18,39,.5); backdrop-filter: blur(3px); }
.file-modal { width: min(440px,100%); padding: 22px; border: 1px solid #d8e5f2; border-radius: 16px; background: #fff; box-shadow: 0 28px 80px rgba(4,24,51,.3); }
.file-modal-wide { width: min(700px,100%); }
.file-modal>header { display: flex; align-items: flex-start; justify-content: space-between; margin-bottom: 20px; }
.file-modal h2 { margin-top: 4px; font-size: 20px; }
.modal-close { width: 32px; height: 32px; border: 0; border-radius: 8px; background: #eef3f8; color: #50657c; font-size: 21px; cursor: pointer; }
.modal-field { display: block; margin-bottom: 15px; }
.modal-field>span { display: block; margin-bottom: 7px; color: #334b65; font-size: 12px; font-weight: 650; }
.modal-field small { display: block; margin-top: 6px; color: #8797a9; font-size: 10px; }
.document-editor { min-height: 230px; resize: vertical; line-height: 1.7; font-family: Consolas,"Microsoft YaHei",sans-serif; }
.modal-path { padding: 10px; border-radius: 8px; background: #f2f7fc; color: #6b7f94; font-size: 11px; }
.modal-path b { color: #1e67a7; }
.file-modal-error { margin-top: 10px; padding: 9px 11px; border: 1px solid #fecaca; border-radius: 8px; background: #fff1f2; color: #b42338; font-size: 11px; }
.modal-actions { display: flex; justify-content: flex-end; gap: 9px; margin-top: 18px; }
.upload-intent-files { margin: -8px 0 14px; padding: 9px 11px; border-radius: 9px; background: #f2f7fc; color: #60768d; font-size: 11px; line-height: 1.6; }
.upload-intent-option { position: relative; display: grid; grid-template-columns: 24px 32px 1fr; gap: 9px; align-items: start; margin: 10px 0; padding: 14px; border: 1.5px solid #dce6f0; border-radius: 12px; cursor: pointer; transition: .18s ease; }
.upload-intent-option:hover,.upload-intent-option.active { border-color: #2788e6; background: #f0f7ff; box-shadow: 0 0 0 3px rgba(39,136,230,.08); }
.upload-intent-option>span { display: grid; place-items: center; width: 30px; height: 30px; border-radius: 9px; background: #e5f1fd; color: #1477cf; font-size: 16px; }
.upload-intent-option b { display: block; color: #253e58; font-size: 13px; }.upload-intent-option p { margin-top: 5px; color: #728398; font-size: 10px; line-height: 1.55; }.upload-intent-option small { display: block; margin-top: 6px; color: #9a6a18; font-size: 9px; }
.upload-review-notice { margin-top: 12px; padding: 9px 11px; border-radius: 8px; background: #fff8e6; color: #916315; font-size: 10px; }
.knowledge-file-status { display: inline-block; padding: 4px 8px; border-radius: 10px; font-size: 9px; white-space: nowrap; }.knowledge-file-status.none { background: #eef2f6; color: #7a8999; }.knowledge-file-status.pending { background: #fff3d8; color: #a66912; }.knowledge-file-status.indexing { background: #e8f2ff; color: #246fc0; }.knowledge-file-status.published { background: #dff6ec; color: #15795a; }.knowledge-file-status.rejected,.knowledge-file-status.failed { background: #fee8e8; color: #b33b3b; }

@media(max-width:760px) {
  .files-hero { align-items: flex-start; gap: 18px; flex-direction: column; }
  .file-create-actions { width: 100%; flex-wrap: wrap; }
  .file-create-actions>* { flex: 1; justify-content: center; text-align: center; white-space: nowrap; }
  .file-breadcrumbs { overflow: auto; }
  .file-modal-backdrop { align-items: end; padding: 0; }
  .file-modal { width: 100%; border-radius: 18px 18px 0 0; }
}

/* ===== 即时通讯：截图与多格式预览 ===== */
.compose-hint { margin: 0 0 7px 48px; color: #8090a3; font-size: 9px; }
.capture-btn { height: 38px; padding: 0 11px; border: 1px solid #cfe0f0; border-radius: 10px; background: #edf7ff; color: #176fae; font-size: 11px; font-weight: 650; cursor: pointer; }
.capture-btn:hover { border-color: #8fc6f3; background: #e1f2ff; }
.pending-file { position: relative; min-height: 42px; padding: 8px 42px 8px 10px; }
.pending-file.error { border: 1px solid #fecaca; background: #fff1f2; color: #b42338; }
.pending-file>button { position: absolute; top: 8px; right: 10px; float: none; width: 25px; height: 25px; border-radius: 7px; color: #49647d; font-size: 18px; }
.pending-file-content { display: flex; align-items: center; gap: 10px; }
.pending-file-content img { width: 54px; height: 42px; border-radius: 7px; object-fit: cover; border: 1px solid #cbddeb; }
.pending-file-content b,.pending-file-content small { display: block; }
.pending-file-content b { color: #245f93; font-size: 11px; }
.pending-file-content small { margin-top: 4px; color: #8293a4; font-size: 9px; }
.attachment-uploading { display: flex; align-items: center; gap: 9px; }
.attachment-uploading span { width: 16px; height: 16px; border: 2px solid #abd6f6; border-top-color: #167bd0; border-radius: 50%; animation: attachment-spin .7s linear infinite; }
@keyframes attachment-spin { to { transform: rotate(360deg); } }
.message-image-card { width: min(390px,56vw); margin-top: 6px; overflow: hidden; border-radius: 10px; background: rgba(236,245,252,.9); }
.message-image { display: block; width: 100%; max-height: 300px; border: 0; background: #dfeaf4; cursor: zoom-in; overflow: hidden; }
.message-image img { display: block; width: 100%; max-height: 300px; object-fit: contain; background: #fff; }
.message-image-card>div { display: flex; align-items: center; gap: 8px; min-width: 0; padding: 7px 9px; color: #375f80; font-size: 9px; }
.message-image-card>div span { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.message-image-card>div small { color: #8094a7; }
.message-image-card>div a { font-weight: 700; }
.message-row.own .message-image-card { background: rgba(255,255,255,.15); }
.message-row.own .message-image-card>div,.message-row.own .message-image-card>div small,.message-row.own .message-image-card>div a { color: #fff; }
.message-file-card { display: flex; align-items: center; width: min(360px,54vw); margin-top: 6px; border-radius: 10px; background: rgba(232,242,251,.9); overflow: hidden; }
.message-file-main { display: flex; align-items: center; gap: 10px; min-width: 0; flex: 1; padding: 9px; border: 0; background: transparent; color: #245f93; text-align: left; cursor: pointer; }
.message-file-main:disabled { cursor: default; }
.file-type-icon { width: 36px; height: 36px; display: grid; place-items: center; flex: none; border-radius: 9px; background: #d9eafa; color: #2475bd; font-size: 10px; font-weight: 800; }
.file-type-icon.document { background: #e5efff; color: #2764bf; font-size: 16px; }
.file-type-icon.spreadsheet { background: #dff5ea; color: #16835a; font-size: 16px; }
.file-type-icon.pdf { background: #fee9e8; color: #c83a37; }
.message-file-copy { min-width: 0; flex: 1; }
.message-file-copy b,.message-file-copy small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.message-file-copy b { font-size: 10px; }
.message-file-copy small { margin-top: 5px; color: #7a91a6; font-size: 8px; }
.message-file-download { width: 42px; align-self: stretch; display: grid; place-items: center; border-left: 1px solid rgba(105,145,180,.2); color: #2671ad; font-size: 17px; }
.message-row.own .message-file-card { background: rgba(255,255,255,.16); }
.message-row.own .message-file-main,.message-row.own .message-file-copy small,.message-row.own .message-file-download { color: #fff; }
.message-row.own .file-type-icon { background: rgba(255,255,255,.2); color: #fff; }
.message-row.own .message-file-download { border-left-color: rgba(255,255,255,.2); }
.attachment-preview-mask { position: fixed; inset: 0; z-index: 1700; display: grid; place-items: center; padding: 24px; background: rgba(2,13,31,.7); backdrop-filter: blur(5px); }
.attachment-preview-shell { width: min(1180px,94vw); height: min(820px,90vh); display: flex; flex-direction: column; overflow: hidden; border: 1px solid rgba(255,255,255,.45); border-radius: 17px; background: #f1f5f9; box-shadow: 0 30px 100px rgba(0,0,0,.42); }
.attachment-preview-shell>header { height: 70px; display: flex; align-items: center; justify-content: space-between; flex: none; padding: 13px 18px; border-bottom: 1px solid #d8e2ec; background: #fff; }
.attachment-preview-shell h2 { max-width: 720px; margin-top: 3px; overflow: hidden; color: #1b3652; text-overflow: ellipsis; white-space: nowrap; font-size: 16px; }
.preview-actions { display: flex; align-items: center; gap: 9px; }
.preview-close { width: 34px; height: 34px; border: 0; border-radius: 9px; background: #eaf0f6; color: #4e6175; font-size: 22px; cursor: pointer; }
.preview-loading,.preview-empty { margin: auto; color: #78899d; font-size: 12px; }
.attachment-preview-content { flex: 1; min-height: 0; overflow: auto; }
.image-preview { width: 100%; height: 100%; min-height: 0; display: flex; flex-direction: column; background: #172232; }
.image-preview-toolbar { min-height: 46px; display: flex; align-items: center; justify-content: space-between; gap: 16px; flex: none; padding: 7px 14px; border-bottom: 1px solid rgba(255,255,255,.12); background: #111c2b; color: #dbe7f4; }
.image-preview-toolbar a { color: #b9d8ff; font-size: 11px; font-weight: 700; }
.image-zoom-tools { display: flex; align-items: center; gap: 7px; }
.image-zoom-tools button { min-width: 32px; height: 30px; padding: 0 10px; border: 1px solid rgba(255,255,255,.18); border-radius: 7px; background: #223247; color: #f8fbff; cursor: pointer; font: inherit; }
.image-zoom-tools button:hover { border-color: #6eb4ff; background: #294361; }
.image-zoom-tools span { min-width: 130px; color: #c6d5e5; text-align: center; font-size: 10px; }
.image-preview-stage { flex: 1; min-width: 0; min-height: 0; overflow: auto; display: flex; align-items: flex-start; justify-content: center; padding: 24px; background-color: #253244; background-image: linear-gradient(45deg,#2b394c 25%,transparent 25%),linear-gradient(-45deg,#2b394c 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#2b394c 75%),linear-gradient(-45deg,transparent 75%,#2b394c 75%); background-size: 24px 24px; background-position: 0 0,0 12px,12px -12px,-12px 0; }
.image-preview-stage.is-zoomed { justify-content: flex-start; cursor: grab; }
.image-preview-stage.is-dragging { cursor: grabbing; user-select: none; }
.image-preview-stage img { display: block; flex: none; max-width: 100%; max-height: calc(90vh - 165px); object-fit: contain; background: #fff; box-shadow: 0 12px 40px rgba(0,0,0,.32); image-rendering: auto; }
.image-preview > img { margin: auto; background: #fff; }
.pdf-preview-wrap { position: relative; width: 100%; height: 100%; background: #fff; }
.pdf-preview { display: block; width: 100%; height: 100%; border: 0; background: #fff; }
.pdf-load-status { position: absolute; z-index: 3; top: 12px; left: 50%; padding: 8px 14px; border: 1px solid #c5ddf0; border-radius: 18px; transform: translateX(-50%); background: rgba(237,248,255,.96); box-shadow: 0 4px 15px rgba(30,78,116,.13); color: #2b688f; font-size: 10px; white-space: nowrap; }
.pdf-load-status.loaded { border-color: #bce4d5; background: rgba(235,250,244,.96); color: #1e765c; }
.pdf-fast-preview { min-height: 100%; background: #d9e0e7; }
.pdf-fast-toolbar { position: sticky; top: 0; z-index: 6; display: flex; align-items: center; justify-content: space-between; min-height: 50px; padding: 8px 16px; border-bottom: 1px solid #b9c5d0; background: rgba(35,48,61,.96); color: #fff; box-shadow: 0 5px 15px rgba(15,28,41,.16); }
.pdf-fast-toolbar>div:first-child b,.pdf-fast-toolbar>div:first-child span { display: block; }.pdf-fast-toolbar>div:first-child b { font-size: 11px; }.pdf-fast-toolbar>div:first-child span { margin-top: 3px; color: #b9c7d4; font-size: 8px; }
.pdf-zoom-tools { display: flex; align-items: center; gap: 7px; }.pdf-zoom-tools button,.pdf-zoom-tools a { height: 28px; display: inline-grid; place-items: center; padding: 0 10px; border: 1px solid #607182; border-radius: 6px; background: #34485b; color: #fff; text-decoration: none; font-size: 10px; cursor: pointer; }.pdf-zoom-tools button { min-width: 30px; font-size: 16px; }.pdf-zoom-tools span { min-width: 42px; text-align: center; font-size: 9px; }
.pdf-rendered-pages { --pdf-page-width:100%; display: flex; flex-direction: column; align-items: center; gap: 18px; min-width: 100%; padding: 20px; overflow: visible; }
.pdf-rendered-page { position: relative; width: var(--pdf-page-width); max-width: 1400px; flex: none; margin: 0; overflow: hidden; border: 1px solid #bcc8d2; border-radius: 4px; background: #fff; box-shadow: 0 8px 28px rgba(21,35,48,.18); transition: width .18s ease; }
.pdf-rendered-page img { position: relative; z-index: 2; display: block; width: 100%; height: auto; opacity: 0; transition: opacity .2s; }.pdf-rendered-page.loaded img { opacity: 1; }
.pdf-page-placeholder { display: grid; place-items: center; gap: 10px; width: 100%; aspect-ratio: var(--pdf-aspect); background: linear-gradient(110deg,#f3f5f7 20%,#e7ecf0 38%,#f3f5f7 56%); background-size: 220% 100%; animation: pdf-shimmer 1.5s linear infinite; color: #7c8996; }.pdf-rendered-page.loaded .pdf-page-placeholder { display: none; }.pdf-page-placeholder span { width: 28px; height: 28px; border: 3px solid #b8c5d0; border-top-color: #318ddd; border-radius: 50%; animation: pdf-spin .8s linear infinite; }.pdf-page-placeholder b { font-size: 10px; font-weight: 500; }
.pdf-rendered-page figcaption { position: relative; z-index: 3; padding: 7px 10px; border-top: 1px solid #e2e7eb; background: #fff; color: #7d8b98; text-align: right; font-size: 8px; }
@keyframes pdf-spin { to { transform: rotate(360deg); } } @keyframes pdf-shimmer { to { background-position-x: -220%; } }
.text-preview { min-height: 100%; padding: 28px; overflow: auto; background: #fff; color: #263b50; white-space: pre-wrap; word-break: break-word; font: 12px/1.75 Consolas,"Microsoft YaHei",sans-serif; }
.word-preview { width: min(820px,calc(100% - 44px)); min-height: calc(100% - 44px); margin: 22px auto; padding: 58px 68px; background: #fff; color: #202b36; box-shadow: 0 4px 18px rgba(24,47,75,.12); }
.word-preview h1 { margin-bottom: 30px; padding-bottom: 14px; border-bottom: 1px solid #dfe5eb; font-size: 22px; }
.word-preview p { margin: 0 0 12px; line-height: 1.9; white-space: pre-wrap; }
.word-table { margin-top: 24px; }
.word-table h4 { margin-bottom: 8px; color: #52677d; }
.workbook-preview { padding: 20px; }
.sheet-preview { margin-bottom: 22px; border: 1px solid #d7e1eb; border-radius: 11px; background: #fff; overflow: hidden; }
.sheet-preview h3 { padding: 11px 14px; border-bottom: 1px solid #dce5ee; background: #eef6fd; color: #205e92; font-size: 12px; }
.preview-table-wrap { max-width: 100%; overflow: auto; }
.preview-table { width: max-content; min-width: 100%; border-collapse: collapse; }
.preview-table th,.preview-table td { min-width: 95px; max-width: 280px; padding: 7px 9px; border: 1px solid #e1e7ed; overflow: hidden; color: #32485d; text-overflow: ellipsis; white-space: nowrap; font-size: 10px; }
.preview-table th { position: sticky; top: 0; background: #f4f7fa; color: #536a80; font-weight: 700; }
.preview-notice { position: sticky; bottom: 0; padding: 9px 14px; background: #fff4d9; color: #866017; text-align: center; font-size: 10px; }

@media(max-width:760px) {
  .capture-btn { display: none; }
  .compose-hint { margin-left: 0; }
  .message-image-card,.message-file-card { width: 68vw; }
  .attachment-preview-mask { padding: 0; }
  .attachment-preview-shell { width: 100vw; height: 100vh; border-radius: 0; }
  .attachment-preview-shell h2 { max-width: 48vw; }
  .word-preview { width: 100%; min-height: 100%; margin: 0; padding: 30px 22px; }
  .preview-actions .btn { display: none; }
  .image-preview-toolbar { align-items: flex-start; flex-direction: column; gap: 6px; }
  .image-zoom-tools { max-width: 100%; overflow-x: auto; }
}

/* ===== 用户资料、账户名称与头像 ===== */
.topnav .user-box { gap: 9px; }
button.user-avatar { position: relative; width: 36px; height: 36px; padding: 0; overflow: visible; border: 1px solid rgba(92,194,255,.46); cursor: pointer; flex: none; }
.user-avatar>img { width: 100%; height: 100%; display: block; border-radius: 50%; object-fit: cover; }
.user-avatar>span { display: grid; place-items: center; width: 100%; height: 100%; }
.user-avatar>i { position: absolute; right: -4px; bottom: -3px; width: 15px; height: 15px; display: grid; place-items: center; border: 2px solid #0a1c3a; border-radius: 50%; background: #42c8ff; color: #06224a; font: 800 10px/1 Arial; opacity: 0; transform: scale(.75); transition: .18s; }
.user-avatar:hover>i,.user-avatar:focus-visible>i { opacity: 1; transform: scale(1); }
.user-avatar.uploading:after { content: ""; position: absolute; inset: -3px; border: 2px solid transparent; border-top-color: #65d9ff; border-radius: 50%; animation: attachment-spin .7s linear infinite; }
.user-identity { display: flex; min-width: 0; flex-direction: column; line-height: 1.1; }
.user-identity strong { max-width: 105px; overflow: hidden; color: #e7f3ff; text-overflow: ellipsis; white-space: nowrap; font-size: 11px; }
.user-identity small { max-width: 105px; margin-top: 4px; overflow: hidden; color: #7594b8; text-overflow: ellipsis; white-space: nowrap; font-size: 8px; }
.profile-notice { position: fixed; top: 82px; right: 24px; z-index: 1900; padding: 11px 15px; border: 1px solid #a8ddc9; border-radius: 10px; background: #effcf7; color: #187357; font-size: 12px; box-shadow: 0 12px 32px rgba(6,35,58,.18); animation: toast-in .22s ease; }
.profile-notice.error { border-color: #fecaca; background: #fff1f2; color: #b42338; }
.card-subtitle { margin: -5px 0 15px; color: #7a899a; font-size: 11px; }
.user-create-form .form-row { min-width: 180px; }
.user-table-wrap { overflow: auto; }
.user-table { min-width: 1180px; }
.admin-user-avatar { width: 36px; height: 36px; display: grid; place-items: center; border-radius: 11px; object-fit: cover; background: linear-gradient(145deg,#2189ed,#55d3ef); color: #fff; font-size: 13px; font-weight: 800; }
.login-account,.user-id { display: block; white-space: nowrap; }
.login-account { color: #243a51; font-size: 12px; }
.user-id { margin-top: 4px; color: #9aa6b4; font-size: 8px; }
.display-name-editor { min-width: 210px; display: flex; align-items: center; gap: 6px; }
.display-name-editor .input { min-width: 130px; padding: 7px 9px; font-size: 11px; }
.conversation-avatar { overflow: hidden; }
.conversation-avatar img { width: 100%; height: 100%; display: block; object-fit: cover; }
.message-row { align-items: flex-start; gap: 8px; }
.message-row.own { flex-direction: row-reverse; justify-content: flex-start; }
.message-avatar { width: 30px; height: 30px; display: grid; place-items: center; flex: none; overflow: hidden; border: 1px solid #c7dced; border-radius: 10px; background: linear-gradient(145deg,#e2f2ff,#b7dcf8); color: #176aa9; font-size: 10px; font-weight: 800; }
.message-avatar img { width: 100%; height: 100%; display: block; object-fit: cover; }
.message-row.own .message-avatar { border-color: #8ac8f6; }

/* ===== 即时通讯：引用历史消息 ===== */
.chat-head-copy { min-width: 0; }
.chat-title-view { display: flex; align-items: center; gap: 7px; }
.chat-title-view[hidden],.chat-title-editor[hidden] { display: none; }
.chat-title-view h2 { max-width: min(520px,55vw); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.chat-title-view button { width: 25px; height: 25px; border: 0; border-radius: 7px; background: transparent; color: #8a99a8; font-size: 13px; cursor: pointer; opacity: 0; transition: .15s; }
.chat-title-view:hover button,.chat-title-view button:focus-visible { background: #edf3f8; color: #337fbd; opacity: 1; }
.chat-title-editor { height: 30px; display: flex; align-items: center; gap: 6px; }
.chat-title-editor input { width: min(360px,45vw); height: 30px; padding: 0 9px; border: 1px solid #70aee2; border-radius: 7px; outline: none; font: 600 14px/1 "Microsoft YaHei",sans-serif; box-shadow: 0 0 0 3px rgba(44,139,218,.1); }
.chat-title-editor button { height: 28px; padding: 0 9px; border: 1px solid #d5e1eb; border-radius: 7px; background: #fff; color: #60768a; font-size: 9px; cursor: pointer; }
.chat-title-editor button:first-of-type { border-color: #2788e6; background: #2788e6; color: #fff; }
.message-bubble { position: relative; }
.message-quote-action { position: absolute; top: 2px; right: -38px; width: 30px; height: 26px; display: flex; align-items: center; justify-content: center; gap: 2px; padding: 0; border: 0; border-radius: 7px; background: transparent; cursor: pointer; opacity: 0; transform: translateX(-3px); transition: .15s; }
.message-quote-action i { width: 3px; height: 3px; border-radius: 50%; background: #8191a1; }
.message-quote-action:hover,.message-quote-action:focus-visible { background: #e1e8ef; outline: none; }
.message-row.own .message-quote-action { right: auto; left: -38px; transform: translateX(3px); }
.message-row:hover .message-quote-action,.message-quote-action:focus-visible { opacity: 1; transform: translateX(0); }
.message-action-menu { position: fixed; z-index: 1800; min-width: 92px; padding: 5px; border: 1px solid #dbe3eb; border-radius: 8px; background: rgba(255,255,255,.98); box-shadow: 0 8px 28px rgba(31,50,69,.2); animation: message-menu-in .12s ease-out; }
.message-action-menu[hidden] { display: none; }
.message-action-menu button { width: 100%; height: 34px; display: flex; align-items: center; gap: 9px; padding: 0 12px; border: 0; border-radius: 6px; background: transparent; color: #334b61; font: inherit; font-size: 11px; cursor: pointer; white-space: nowrap; }
.message-action-menu button:hover { background: #edf2f6; }
.message-action-menu button span { color: #657c91; font-size: 15px; }
@keyframes message-menu-in { from { opacity: 0; transform: translateY(-3px) scale(.97); } to { opacity: 1; transform: translateY(0) scale(1); } }
.message-quote { width: 100%; display: block; margin: 3px 0 7px; padding: 7px 9px; overflow: hidden; border: 0; border-left: 3px solid #2e8dde; border-radius: 6px; background: #eff6fc; color: #526b82; text-align: left; cursor: pointer; }
.message-quote b,.message-quote span { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.message-quote b { color: #2479bd; font-size: 9px; }
.message-quote span { margin-top: 3px; font-size: 9px; }
.message-quote.unavailable { cursor: default; opacity: .76; }
.message-row.own .message-quote { border-left-color: #d5efff; background: rgba(255,255,255,.16); color: #eef8ff; }
.message-row.own .message-quote b { color: #fff; }
.pending-quote { position: relative; margin-bottom: 8px; padding: 8px 42px 8px 12px; border-left: 3px solid #2788e6; border-radius: 7px; background: #eef6fd; color: #526b82; }
.pending-quote div { min-width: 0; }
.pending-quote b,.pending-quote span { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pending-quote b { color: #2479bd; font-size: 10px; }
.pending-quote span { margin-top: 3px; font-size: 9px; }
.pending-quote>button { position: absolute; top: 8px; right: 10px; width: 25px; height: 25px; border: 0; border-radius: 7px; background: transparent; color: #49647d; font-size: 18px; cursor: pointer; }
.quote-target-flash .message-bubble { animation: quote-target-pulse 1.8s ease; }
@keyframes quote-target-pulse { 0%,100% { box-shadow: 0 3px 10px rgba(29,58,91,.06); } 25%,65% { box-shadow: 0 0 0 4px rgba(38,139,230,.24),0 6px 18px rgba(29,58,91,.12); } }

/* ===== 即时通讯：消息区清晰度与气泡层级优化 ===== */
.chat-sidebar>header { height: 78px; }
.chat-sidebar h2 { font-size: 19px; }
.conversation-list { padding: 2px 10px 16px; }
.conversation-item { gap: 11px; padding: 12px 10px; border-radius: 12px; }
.conversation-avatar { width: 42px; height: 42px; border-radius: 12px; font-size: 13px; }
.conversation-copy b { color: #20364d; font-size: 13px; }
.conversation-copy small { margin-top: 5px; color: #7b8da0; font-size: 10px; }
.chat-head { height: 76px; padding: 15px 24px; box-shadow: 0 1px 0 rgba(34,58,82,.03); }
.chat-head h2 { color: #1e344a; font-size: 18px; }
.chat-head p { margin-top: 6px; color: #788b9e; font-size: 11px; }
.message-list { padding: 26px clamp(28px,4vw,72px) 38px; background: linear-gradient(180deg,#f5f8fb 0%,#f1f5f8 100%); scrollbar-color: #bdcad6 transparent; scrollbar-width: thin; }
.message-row { gap: 11px; margin: 17px 0; }
.message-avatar { width: 36px; height: 36px; border-radius: 11px; background: linear-gradient(145deg,#e6f4ff,#bcdff7); font-size: 12px; box-shadow: 0 2px 8px rgba(29,72,107,.08); }
.message-bubble { min-width: 76px; max-width: min(680px,72%); padding: 11px 14px 9px; border-color: #d7e1e9; border-radius: 5px 15px 15px 15px; background: #fff; color: #263b4d; box-shadow: 0 5px 18px rgba(34,58,82,.08); font-size: 14px; line-height: 1.65; }
.message-row.own .message-bubble { border-color: #237fda; border-radius: 15px 5px 15px 15px; background: linear-gradient(145deg,#2d91e8,#217bd2); color: #fff; box-shadow: 0 6px 18px rgba(35,126,210,.2); }
.message-sender { margin-bottom: 6px; color: #287ebf; font-size: 11px; font-weight: 700; line-height: 1.2; }
.message-row.own .message-sender { color: #d9efff; }
.message-text { color: #24394c; font-size: 14px; line-height: 1.7; }
.message-row.own .message-text { color: #fff; }
.message-bubble time { margin-top: 7px; color: #8999a8; font-size: 9px; line-height: 1; }
.message-row.own .message-bubble time { color: #d4ecff; }
.message-quote-action { top: 7px; }
.message-quote { margin: 2px 0 9px; padding: 8px 10px; border-left-width: 3px; background: #eef5fb; }
.message-quote b { font-size: 10px; }
.message-quote span { margin-top: 4px; color: #566f84; font-size: 11px; line-height: 1.45; }
.message-row.own .message-quote { background: rgba(255,255,255,.16); }
.message-row.own .message-quote span { color: #edf7ff; }
.message-file-card { width: min(400px,58vw); margin-top: 9px; border: 1px solid rgba(105,145,180,.18); border-radius: 11px; background: #edf5fb; }
.message-file-main { gap: 11px; padding: 11px; }
.file-type-icon { width: 42px; height: 42px; border-radius: 10px; font-size: 11px; }
.message-file-copy b { color: #244662; font-size: 12px; }
.message-file-copy small { margin-top: 6px; color: #6f879c; font-size: 10px; }
.message-file-download { width: 48px; font-size: 19px; }
.message-row.own .message-file-card { border-color: rgba(255,255,255,.18); background: rgba(255,255,255,.15); }
.message-row.own .message-file-copy b { color: #fff; }
.message-image-card { width: min(440px,60vw); margin-top: 9px; border: 1px solid rgba(105,145,180,.18); border-radius: 12px; box-shadow: 0 3px 12px rgba(30,60,88,.08); }
.message-image-card>div { padding: 9px 11px; font-size: 10px; }
.message-image-card>div small { font-size: 9px; }
.chat-compose { padding: 12px clamp(20px,3vw,48px) 17px; box-shadow: 0 -5px 20px rgba(34,58,82,.04); }
.compose-hint { margin: 0 0 8px 51px; font-size: 10px; }
.compose-row { gap: 10px; }
.compose-row textarea { min-height: 44px; padding: 11px 14px; border-radius: 12px; background: #fbfcfe; color: #24394d; font-size: 14px; line-height: 1.5; }
.attach-btn,.capture-btn,.send-btn { height: 44px; }
.attach-btn { width: 44px; font-size: 22px; }
.capture-btn { padding: 0 14px; font-size: 12px; }
.send-btn { padding: 0 23px; font-size: 13px; }
.pending-file,.pending-quote { margin-bottom: 9px; font-size: 12px; }

@media(max-width:760px) {
  .user-identity { display: none; }
  button.user-avatar { width: 32px; height: 32px; }
  .profile-notice { top: 72px; right: 12px; }
  .chat-title-view button { opacity: 1; }
  .chat-title-editor input { width: 46vw; }
  .message-quote-action { position: static; float: right; width: 26px; height: 22px; margin: -2px -4px 2px 7px; opacity: .72; transform: none; }
  .message-row.own .message-quote-action { float: left; margin: -2px 7px 2px -4px; transform: none; }
  .message-list { padding: 18px 13px 28px; }
  .message-row { gap: 7px; margin: 14px 0; }
  .message-avatar { width: 32px; height: 32px; border-radius: 9px; }
  .message-bubble { max-width: 78%; padding: 10px 12px 8px; font-size: 13px; }
  .message-text { font-size: 13px; }
  .chat-compose { padding: 10px 12px 13px; }
}

/* ===== 文件上传速度与PPTX预览 ===== */
.upload-progress { padding: 12px 14px; border: 1px solid #cde1f4; background: #f3f9ff; }
.upload-status-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.upload-status-head b,.upload-status-head small { display: block; }
.upload-status-head b { max-width: 620px; overflow: hidden; color: #21496c; text-overflow: ellipsis; white-space: nowrap; font-size: 11px; }
.upload-status-head small { margin-top: 4px; color: #7690a8; font-size: 9px; }
.upload-cancel { padding: 5px 9px; border: 1px solid #d4e1ed; border-radius: 7px; background: #fff; color: #5d7388; font-size: 9px; cursor: pointer; }
.upload-meter { height: 7px; margin-top: 10px; overflow: hidden; border-radius: 5px; background: #dceaf5; }
.upload-meter span { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg,#1789e8,#3bd4db); transition: width .18s ease; box-shadow: 0 0 10px rgba(35,166,224,.32); }
.upload-metrics { display: grid; grid-template-columns: 60px 1fr 120px 120px; gap: 8px; margin-top: 7px; color: #71859a; font-size: 9px; }
.upload-metrics span:first-child { color: #126eb6; font-weight: 800; }
.upload-failure,.upload-success { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.upload-failure b,.upload-failure p { display: block; }
.upload-failure b { color: #b42338; }
.upload-failure p { margin-top: 4px; color: #8b4d59; font-size: 9px; }
.upload-success b { color: #16805e; }.upload-success span { color: #69859b; font-size: 9px; }
.presentation-notice { position: sticky; top: 0; z-index: 4; padding: 10px 16px; border-bottom: 1px solid #efd999; background: #fff8dd; color: #80601d; text-align: center; font-size: 10px; }
.presentation-preview { display: grid; grid-template-columns: repeat(auto-fit,minmax(420px,1fr)); gap: 22px; padding: 24px; counter-reset: slides; }
.slide-preview { position: relative; min-height: 270px; overflow: auto; padding: 36px 42px; border: 1px solid #d6e1ec; border-radius: 8px; background: #fff; color: #25394c; aspect-ratio: 16/9; box-shadow: 0 8px 24px rgba(22,49,79,.12); }
.slide-preview .slide-number { position: absolute; right: 13px; bottom: 10px; color: #9aabbc; font-size: 9px; }
.slide-preview h2 { margin-bottom: 20px; padding-bottom: 10px; border-bottom: 2px solid #2383d8; color: #123e69; font-size: 19px; }
.slide-preview p { margin: 8px 0; line-height: 1.65; white-space: pre-wrap; }
.slide-preview .preview-table-wrap { margin-top: 15px; }
.presentation-rendered-notice { position: sticky; top: 0; z-index: 4; padding: 10px 16px; border-bottom: 1px solid #b9d9ed; background: #eaf7ff; color: #276282; text-align: center; font-size: 10px; }
.rendered-presentation-preview { display: grid; gap: 24px; width: min(1080px,calc(100% - 40px)); margin: 0 auto; padding: 24px 0 40px; }
.rendered-slide { margin: 0; overflow: hidden; border: 1px solid #cad8e5; border-radius: 9px; background: #fff; box-shadow: 0 10px 30px rgba(20,44,70,.14); }
.rendered-slide img { display: block; width: 100%; height: auto; background: #fff; }
.rendered-slide figcaption { padding: 8px 13px; border-top: 1px solid #e3e9ef; color: #6c7f92; text-align: right; font-size: 10px; }

/* ===== 文件资产台账 ===== */
.ledger-page { flex: 1; overflow: auto; padding: 24px 28px 40px; background: radial-gradient(circle at 92% 0,rgba(28,139,228,.1),transparent 28%),#eef3f9; }
.ledger-hero { display: flex; align-items: center; justify-content: space-between; padding: 25px 30px; border-radius: 17px; background: linear-gradient(120deg,#082650,#106c96); color: #fff; box-shadow: 0 14px 32px rgba(13,51,93,.16); }
.ledger-hero h1 { margin-top: 5px; font-size: 25px; }.ledger-hero p { margin-top: 8px; color: #c1d8ea; font-size: 11px; }
.ledger-metrics { display: grid; grid-template-columns: repeat(5,1fr); gap: 12px; margin: 16px 0; }
.ledger-metrics article { padding: 15px 17px; border: 1px solid #dce5ee; border-radius: 12px; background: #fff; box-shadow: 0 7px 20px rgba(25,55,86,.05); }
.ledger-metrics span { display: block; color: #7d8da0; font-size: 10px; }.ledger-metrics strong { display: block; margin-top: 6px; color: #163b60; font-size: 22px; }
.ledger-metrics .active strong { color: #14805f; }.ledger-metrics .deleted strong { color: #bd7621; }.ledger-metrics .missing strong { color: #c74444; }
.ledger-card { padding: 0; overflow: hidden; }.ledger-toolbar { display: flex; align-items: end; justify-content: space-between; gap: 20px; padding: 19px 20px; border-bottom: 1px solid #e2e9f0; }
.ledger-toolbar h2 { font-size: 18px; }.ledger-toolbar p { margin-top: 5px; color: #8291a2; font-size: 10px; }.ledger-filters { display: flex; gap: 8px; }.ledger-filters .input { width: 160px; }.ledger-filters .input:first-child { width: 230px; }
.ledger-table-wrap { overflow: auto; }.ledger-table { min-width: 1380px; }.ledger-table th,.ledger-table td { vertical-align: top; font-size: 11px!important; }.ledger-table td { padding-top: 13px!important; padding-bottom: 13px!important; }
.ledger-original { width: 220px; }.ledger-original b { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }.ledger-original small,.ledger-account { display: block; margin-top: 5px; color: #8a99aa; font-size: 9px; }
.storage-mapping { width: 275px; }.storage-mapping code { display: block; color: #245986; font-size: 10px; word-break: break-all; }.storage-mapping small { display: block; margin-top: 5px; color: #8b9aaa; font-size: 8px; word-break: break-all; }.storage-mapping button { margin-top: 5px; padding: 0; border: 0; background: transparent; color: #1977c7; font-size: 9px; cursor: pointer; }
.ledger-status { display: inline-block; padding: 4px 9px; border-radius: 12px; font-size: 9px; }.ledger-status.active { background: #e2f5ee; color: #18795d; }.ledger-status.deleted { background: #fff0d8; color: #a76a19; }.ledger-status.missing { background: #fee8e8; color: #b63e3e; }
.audit-modal { width: min(650px,92vw); max-height: 80vh; }.audit-modal>header { display: flex; align-items: center; justify-content: space-between; padding: 18px 20px; border-bottom: 1px solid #e1e7ee; }.audit-list { max-height: 60vh; overflow: auto; padding: 18px 24px 24px; }
.audit-list article { position: relative; display: grid; grid-template-columns: 13px 1fr; gap: 12px; padding-bottom: 18px; }.audit-list article>span { z-index: 1; width: 10px; height: 10px; margin-top: 4px; border: 2px solid #fff; border-radius: 50%; background: #2889d8; box-shadow: 0 0 0 2px #bddcf4; }.audit-list article:not(:last-child):before { content:""; position: absolute; top: 13px; bottom: 0; left: 5px; width: 1px; background: #cdddea; }
.audit-list b { color: #24455f; font-size: 12px; }.audit-list p { margin-top: 4px; color: #65788b; font-size: 10px; }.audit-list time { display: block; margin-top: 5px; color: #9aa7b4; font-size: 9px; }
.knowledge-review-hero { background: linear-gradient(120deg,#102b52,#176d82); }.knowledge-review-table { min-width: 1180px; }.knowledge-review-table td { vertical-align: top; }.knowledge-review-dialog { width: min(520px,92vw); }.review-file-name { padding: 10px 12px; border-radius: 9px; background: #f0f6fb; color: #294a67; font-weight: 700; word-break: break-all; }.knowledge-review-dialog textarea { width: 100%; resize: vertical; }.knowledge-error { display: block; max-width: 220px; margin-top: 6px; color: #b33b3b; font-size: 9px; line-height: 1.45; }

@media(max-width:760px) {
  .upload-metrics { grid-template-columns: 50px 1fr; }
  .presentation-preview { grid-template-columns: 1fr; padding: 12px; }
  .slide-preview { min-height: 220px; padding: 25px 20px; aspect-ratio: auto; }
  .rendered-presentation-preview { width: calc(100% - 16px); gap: 12px; padding: 12px 0 24px; }
  .pdf-fast-toolbar { align-items: flex-start; gap: 6px; flex-direction: column; }.pdf-rendered-pages { padding: 8px; gap: 9px; }.pdf-zoom-tools a { display: none; }
  .ledger-page { padding: 12px; }.ledger-hero { padding: 20px; }.ledger-metrics { grid-template-columns: repeat(2,1fr); }.ledger-toolbar { align-items: stretch; flex-direction: column; }.ledger-filters { flex-wrap: wrap; }.ledger-filters .input,.ledger-filters .input:first-child { width: 100%; }
}

/* ===== 即时通讯：微信式桌面布局 ===== */
.collab-shell { grid-template-columns: 280px minmax(540px,1fr); background: #f5f5f5; }
.chat-info { display: none; }
.chat-sidebar { border-right: 1px solid #d7d7d7; background: #e9eaec; }
.chat-sidebar>header { height: 72px; padding: 14px 16px; border-bottom: 0; background: #e9eaec; }
.chat-sidebar h2 { color: #252525; font-size: 18px; font-weight: 600; }
.chat-sidebar .section-kicker { color: #84888d; font-size: 8px; letter-spacing: .14em; }
.chat-sidebar .icon-btn { width: 31px; height: 31px; border-radius: 5px; background: #f5f5f5; color: #50555a; font-size: 20px; }
.chat-search { padding: 8px 12px 10px; }
.chat-search input { height: 34px; padding: 0 12px 0 32px; border: 0; border-radius: 5px; background-color: #f5f5f5; background-image: linear-gradient(45deg,transparent 46%,#92979c 48%,#92979c 55%,transparent 57%); background-repeat: no-repeat; background-position: 17px 20px; background-size: 7px 7px; color: #333; font-size: 12px; box-shadow: inset 0 0 0 1px rgba(0,0,0,.03); }
.conversation-list { padding: 0; }
.conversation-item { min-height: 64px; gap: 11px; padding: 9px 13px; border-radius: 0; }
.conversation-item:hover { background: #dcdddf; }
.conversation-item.active { background: #18b36b; }
.conversation-avatar { width: 42px; height: 42px; border-radius: 5px; background: linear-gradient(145deg,#3aa8e5,#28c2c7); box-shadow: none; }
.conversation-copy b { color: #262626; font-size: 13px; font-weight: 500; }
.conversation-copy small { color: #8a8d91; font-size: 10px; }
.conversation-item.active .conversation-copy b,.conversation-item.active .conversation-copy small { color: #fff; }
.conversation-item em { background: #fa5151; }
.chat-main { background: #f5f5f5; }
.chat-head { height: 72px; padding: 13px 26px; border-bottom: 1px solid #e2e2e2; background: #f5f5f5; box-shadow: none; }
.chat-head h2 { color: #222; font-size: 17px; font-weight: 500; }
.chat-head p { margin-top: 5px; color: #999; font-size: 10px; }
.chat-title-view button { border-radius: 5px; color: #777; }
.chat-title-view:hover button,.chat-title-view button:focus-visible { background: #e6e6e6; color: #333; }
.chat-title-editor input { border-color: #b8b8b8; border-radius: 4px; background: #fff; box-shadow: none; font-size: 14px; }
.chat-title-editor button { border-color: #d5d5d5; border-radius: 4px; }
.chat-title-editor button:first-of-type { border-color: #07c160; background: #07c160; }
.message-list { padding: 26px clamp(30px,5vw,82px) 42px; background: #f5f5f5; }
.load-more { background: #dedede; color: #777; }
.message-row { gap: 11px; margin: 19px 0; }
.message-avatar { width: 40px; height: 40px; border: 0; border-radius: 5px; background: #d7ebf8; box-shadow: none; font-size: 12px; }
.message-bubble { min-width: 0; max-width: min(620px,68%); padding: 9px 12px 8px; border: 0; border-radius: 5px; background: #fff; color: #222; box-shadow: 0 1px 1px rgba(0,0,0,.08); font-size: 14px; line-height: 1.55; }
.message-bubble:before { content: ""; position: absolute; top: 13px; left: -7px; width: 0; height: 0; border-top: 6px solid transparent; border-bottom: 6px solid transparent; border-right: 8px solid #fff; }
.message-row.own .message-bubble { border: 0; border-radius: 5px; background: #95ec69; color: #1f2326; box-shadow: 0 1px 1px rgba(0,0,0,.08); }
.message-row.own .message-bubble:before { right: -7px; left: auto; border-right: 0; border-left: 8px solid #95ec69; }
.message-sender { margin-bottom: 5px; color: #8a8a8a; font-size: 11px; font-weight: 400; }
.message-row.own .message-sender { display: none; }
.message-text,.message-row.own .message-text { color: #1f2326; font-size: 14px; line-height: 1.65; }
.message-bubble time,.message-row.own .message-bubble time { margin-top: 6px; color: #8c8c8c; font-size: 8px; opacity: .72; }
.message-row.own .message-bubble time { color: #46663a; }
.message-quote-action { top: 7px; right: -38px; }
.message-row.own .message-quote-action { right: auto; left: -38px; }
.message-quote-action i { background: #888; }
.message-quote-action:hover,.message-quote-action:focus-visible { background: #e3e3e3; }
.message-quote { margin: 1px 0 8px; padding: 7px 9px; border-left: 3px solid #9ca4aa; border-radius: 3px; background: #f0f0f0; color: #666; }
.message-quote b { color: #6d747a; }
.message-quote span { color: #6b6b6b; }
.message-row.own .message-quote { border-left-color: #70bd50; background: rgba(255,255,255,.35); color: #3d5733; }
.message-row.own .message-quote b,.message-row.own .message-quote span { color: #3d5733; }
.message-file-card { width: min(390px,57vw); border-color: #ddd; border-radius: 4px; background: #fff; }
.message-file-copy b { color: #333; }
.message-row.own .message-file-card { border-color: rgba(0,0,0,.09); background: rgba(255,255,255,.72); }
.message-row.own .message-file-main,.message-row.own .message-file-copy b,.message-row.own .message-file-copy small,.message-row.own .message-file-download { color: #3b4a37; }
.message-row.own .file-type-icon { background: rgba(255,255,255,.72); color: #2777bd; }
.message-image-card { border-radius: 5px; box-shadow: none; }
.message-row.own .message-image-card { background: rgba(255,255,255,.3); }
.chat-compose { min-height: 168px; padding: 10px 22px 14px; border-top: 1px solid #e0e0e0; background: #fff; box-shadow: none; }
.compose-toolbar { height: 34px; display: flex; align-items: center; gap: 7px; }
.compose-toolbar .attach-btn,.compose-toolbar .capture-btn { width: 32px; height: 30px; display: grid; place-items: center; padding: 0; border: 0; border-radius: 4px; background: transparent; color: #4f5458; }
.compose-toolbar .attach-btn:hover,.compose-toolbar .capture-btn:hover { background: #efefef; color: #111; }
.compose-toolbar svg { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.compose-tip { margin-left: auto; color: #aaa; font-size: 9px; }
.compose-row { min-height: 105px; display: flex; align-items: flex-end; gap: 14px; }
.compose-row textarea { height: 100px; min-height: 100px; max-height: 120px; padding: 7px 4px; border: 0; border-radius: 0; background: transparent; color: #222; font-size: 14px; line-height: 1.65; box-shadow: none; }
.compose-row textarea:focus { border: 0; box-shadow: none; }
.send-btn { height: 34px; padding: 0 24px; border-radius: 4px; background: #07c160; color: #fff; font-size: 12px; font-weight: 500; }
.send-btn:hover { background: #06ad56; }
.send-btn:disabled { background: #e9e9e9; color: #b5b5b5; }
.pending-file,.pending-quote { border-radius: 4px; background: #f1f1f1; color: #555; }
.pending-quote { border-left-color: #07c160; }
.message-action-menu { border-color: #ddd; border-radius: 5px; box-shadow: 0 7px 24px rgba(0,0,0,.16); }

@media(max-width:1000px) {
  .collab-shell { grid-template-columns: 230px minmax(430px,1fr); }
  .message-list { padding-right: 28px; padding-left: 28px; }
}

@media(max-width:760px) {
  .collab-shell { display: block; }
  .chat-sidebar { display: none; }
  .chat-main { height: calc(100vh - 104px); }
  .chat-head { height: 64px; padding: 11px 15px; }
  .message-list { padding: 15px 12px 24px; }
  .message-row { margin: 14px 0; }
  .message-avatar { width: 34px; height: 34px; }
  .message-bubble { max-width: 76%; padding: 8px 10px 7px; }
  .chat-compose { min-height: 138px; padding: 8px 12px 10px; }
  .compose-tip { display: none; }
  .compose-row { min-height: 82px; }
  .compose-row textarea { height: 78px; min-height: 78px; }
  .send-btn { padding: 0 17px; }
}

/* ===== 即时通讯：柔和配色、轻量引用、撤回与联系人选择器 ===== */
.conversation-item.active { background: #d9e5ef; box-shadow: inset 3px 0 #4d7fa7; }
.conversation-item.active .conversation-copy b { color: #20394f; }
.conversation-item.active .conversation-copy small { color: #688095; }
.chat-title-editor button:first-of-type { border-color: #4d82ad; background: #4d82ad; }
.message-stack { max-width: min(620px,68%); display: flex; min-width: 0; flex-direction: column; align-items: flex-start; }
.message-row.own .message-stack { align-items: flex-end; }
.message-stack .message-bubble { max-width: 100%; }
.message-row.own .message-bubble { background: #d8e9f6; color: #20303c; }
.message-row.own .message-bubble:before { border-left-color: #d8e9f6; }
.message-row.own .message-bubble time { color: #647c8e; }
.message-quote { width: auto; max-width: 100%; display: flex; align-items: center; gap: 4px; margin: 6px 4px 0; padding: 0; border: 0; border-radius: 0; background: transparent; color: #94999e; box-shadow: none; font-size: 11px; line-height: 1.45; cursor: pointer; }
.message-quote span { display: block; min-width: 0; overflow: hidden; color: #94999e; font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
.message-quote b { display: inline; color: #858b90; font-size: inherit; font-weight: 400; }
.message-quote i { color: #b0b4b7; font-style: normal; }
.message-quote:hover span { color: #657787; }
.message-row.own .message-quote,.message-row.own .message-quote span,.message-row.own .message-quote b { border: 0; background: transparent; color: #8b9297; }
.message-quote.unavailable { display: flex; background: transparent; opacity: .82; }
.pending-quote { min-height: 26px; display: flex; align-items: center; justify-content: flex-end; margin: 0 0 3px; padding: 2px 34px 2px 4px; border: 0; border-radius: 0; background: transparent; color: #91979c; }
.pending-quote[hidden] { display: none; }
.pending-quote>div { max-width: 72%; display: flex; align-items: center; gap: 0; overflow: hidden; font-size: 11px; }
.pending-quote b,.pending-quote span { display: inline; margin: 0; color: #91979c; font-size: 11px; font-weight: 400; line-height: 1.4; }
.pending-quote span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pending-quote i { margin-left: 5px; color: #b0b4b7; font-style: normal; }
.pending-quote>button { top: 1px; right: 4px; color: #979da2; }
.send-btn { background: #4d82ad; }
.send-btn:hover { background: #3f739e; }
.message-action-menu button[hidden] { display: none; }
.message-recalled { margin: 14px auto; color: #a0a4a8; text-align: center; font-size: 11px; }
.message-recalled span { padding: 4px 10px; border-radius: 10px; background: rgba(0,0,0,.025); }
.chat-notice { position: fixed; top: 92px; left: 50%; z-index: 2100; padding: 9px 15px; border: 1px solid #bfd3e3; border-radius: 7px; transform: translateX(-50%); background: rgba(255,255,255,.97); color: #3e627e; box-shadow: 0 8px 26px rgba(35,55,72,.16); font-size: 12px; }
.chat-notice.error { border-color: #efc1c1; color: #a33b3b; }

.modal-mask:has(.chat-create-dialog) { background: rgba(31,43,55,.48); backdrop-filter: blur(2px); }
.chat-create-dialog { width: min(520px,92vw); padding: 0; overflow: hidden; border: 1px solid rgba(255,255,255,.7); border-radius: 14px; box-shadow: 0 24px 70px rgba(20,32,43,.3); }
.chat-create-dialog>header { margin: 0; padding: 20px 22px 15px; border-bottom: 1px solid #edf0f3; }
.chat-create-dialog>header h3 { margin-top: 3px; color: #21384c; font-size: 18px; }
.chat-create-dialog>header .section-kicker { color: #6d8aa2; font-size: 8px; letter-spacing: .13em; }
.chat-create-dialog>header>button { width: 30px; height: 30px; border-radius: 7px; color: #7c8994; }
.chat-create-dialog>header>button:hover { background: #eef2f5; color: #344d62; }
.chat-create-intro { padding: 13px 22px 4px; color: #7b8995; font-size: 11px; line-height: 1.6; }
.contact-picker-head { display: flex; align-items: center; justify-content: space-between; padding: 10px 22px 7px; }
.contact-picker-head label { margin: 0; color: #354e63; font-size: 12px; font-weight: 700; }
.contact-picker-head span { color: #6f8aa0; font-size: 10px; }
.contact-search { padding: 0 22px 9px; }
.contact-search input { width: 100%; height: 36px; padding: 0 12px 0 35px; border: 1px solid #d9e1e8; border-radius: 8px; outline: none; background: #f7f9fb; color: #2a3d4d; font: inherit; font-size: 12px; }
.contact-search input:focus { border-color: #7ba4c5; background: #fff; box-shadow: 0 0 0 3px rgba(78,130,173,.1); }
.contact-picker { height: 220px; margin: 0 22px; overflow: auto; border: 1px solid #dfe5ea; border-radius: 9px; background: #fff; }
.chat-create-dialog .contact-option { min-height: 55px; display: grid; grid-template-columns: 36px minmax(0,1fr) 22px; align-items: center; gap: 11px; margin: 0; padding: 8px 11px; border-bottom: 1px solid #f0f2f4; cursor: pointer; transition: .12s; }
.contact-option:last-child { border-bottom: 0; }
.contact-option:hover { background: #f5f8fa; }
.contact-option:has(input:checked) { background: #edf4f9; }
.contact-option input { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; }
.contact-avatar { width: 36px; height: 36px; display: grid; place-items: center; overflow: hidden; border-radius: 8px; background: linear-gradient(145deg,#dcecf8,#bcd7e9); color: #326b96; font-size: 12px; font-weight: 700; }
.contact-avatar img { width: 100%; height: 100%; object-fit: cover; }
.contact-copy { min-width: 0; }
.contact-copy b,.contact-copy small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.contact-copy b { color: #263d50; font-size: 12px; }
.contact-copy small { margin-top: 4px; color: #8a98a4; font-size: 9px; }
.contact-option>i { width: 20px; height: 20px; display: grid; place-items: center; border: 1px solid #cbd6df; border-radius: 50%; color: transparent; font-size: 11px; font-style: normal; }
.contact-option:has(input:checked)>i { border-color: #4d82ad; background: #4d82ad; color: #fff; }
.contact-empty { padding: 70px 15px; color: #9aa5ae; text-align: center; font-size: 11px; }
.chat-create-dialog .group-title-label { display: flex; align-items: center; justify-content: space-between; margin: 15px 22px 7px; color: #354e63; font-size: 12px; font-weight: 700; }
.chat-create-dialog .group-title-label span { color: #9aa4ad; font-size: 9px; font-weight: 400; }
.chat-create-dialog .group-title-input { width: calc(100% - 44px); margin: 0 22px; border-radius: 8px; background: #fbfcfd; }
.chat-create-dialog .dialog-actions { margin: 18px 0 0; padding: 13px 22px; border-top: 1px solid #edf0f3; background: #fafbfc; }
.chat-create-dialog .dialog-actions .btn { min-width: 76px; justify-content: center; border-radius: 7px; }
.chat-create-dialog .dialog-actions .btn-primary { border-color: #4d82ad; background: #4d82ad; }

@media(max-width:760px) {
  .message-stack { max-width: 76%; }
  .message-stack .message-bubble { max-width: 100%; }
  .pending-quote>div { max-width: 88%; }
  .chat-create-dialog { width: 100%; max-height: 88vh; border-radius: 16px 16px 0 0; }
  .contact-picker { height: 190px; }
}

/* ===== 即时通讯：阅读密度与消息流最终优化 ===== */
.message-list { padding: 22px clamp(24px,4vw,64px) 30px; background: #f3f4f6; }
.message-row { width: min(1080px,100%); margin: 15px auto; }
.message-stack { max-width: min(720px,74%); }
.message-avatar { width: 42px; height: 42px; border-radius: 7px; }
.message-sender { margin: 0 4px 5px; color: #747f89; font-size: 12px; line-height: 1.2; }
.message-bubble { padding: 9px 13px; background: #fff; color: #1f2937; font-size: 15px; line-height: 1.65; }
.message-text,.message-row.own .message-text { color: #1f2937; font-size: 15px; line-height: 1.65; }
.message-row.own .message-bubble { background: #d9eaf7; }
.message-row.own .message-bubble:before { border-left-color: #d9eaf7; }
.message-quote { margin-top: 3px; color: #788692; font-size: 11.5px; }
.message-quote span,.message-quote b,.message-row.own .message-quote span,.message-row.own .message-quote b { color: #788692; font-size: 11.5px; }
.message-quote i { color: #9da7af; }
.message-time-divider { width: min(1080px,100%); margin: 17px auto 9px; color: #9aa1a8; text-align: center; font-size: 11px; line-height: 1; }
.message-time-divider span { display: inline-block; padding: 3px 8px; }
.message-recalled { width: min(1080px,100%); margin: 15px auto; }
.message-bubble:not(:has(.message-text)):has(.message-image-card) { padding: 0; background: transparent; box-shadow: none; }
.message-bubble:not(:has(.message-text)):has(.message-image-card):before { display: none; }
.message-image-card { width: min(380px,48vw); margin: 0; border-color: #dfe3e7; background: #fff; }
.message-image { max-height: 300px; background: #fff; }
.message-image img { max-height: 300px; }
.message-row.own .message-image-card { background: #fff; }
.message-row.own .message-image-card>div,.message-row.own .message-image-card>div small { color: #667786; }
.message-row.own .message-image-card>div a { color: #3979aa; }
.chat-compose { min-height: 132px; padding: 8px 22px 11px; }
.compose-toolbar { height: 29px; }
.compose-row { min-height: 78px; }
.compose-row textarea { height: 74px; min-height: 74px; max-height: 96px; padding-top: 5px; font-size: 14px; }
.pending-quote { min-height: 22px; }

@media(max-width:760px) {
  .message-list { padding: 14px 11px 22px; }
  .message-row { width: 100%; margin: 13px auto; }
  .message-stack { max-width: 78%; }
  .message-avatar { width: 36px; height: 36px; }
  .message-bubble,.message-text,.message-row.own .message-text { font-size: 14px; }
  .message-time-divider,.message-recalled { width: 100%; }
  .message-image-card { width: min(330px,67vw); }
  .chat-compose { min-height: 118px; }
  .compose-row { min-height: 66px; }
  .compose-row textarea { height: 62px; min-height: 62px; }
}

/* ===== 即时通讯：宽屏消息流间距 ===== */
.message-list { padding-right: 18px; padding-left: 18px; }
.message-row,.message-time-divider,.message-recalled { width: 100%; }

/* ===== 即时通讯：可调节输入区高度 ===== */
.chat-compose { --compose-height:132px; position: relative; height: var(--compose-height); min-height: 108px; max-height: 48vh; display: flex; flex: none; flex-direction: column; box-sizing: border-box; }
.compose-resizer { position: absolute; z-index: 5; top: -6px; right: 0; left: 0; width: 100%; height: 12px; padding: 0; border: 0; background: transparent; cursor: ns-resize; touch-action: none; }
.compose-resizer:after { content: ""; position: absolute; top: 4px; left: 50%; width: 46px; height: 3px; border-radius: 2px; transform: translateX(-50%); background: #c7cdd2; opacity: .55; transition: .15s; }
.compose-resizer:hover:after,.compose-resizer.active:after { width: 64px; background: #6f98b9; opacity: 1; }
.compose-row { flex: 1; min-height: 0; }
.compose-row textarea { height: 100%; min-height: 0; max-height: none; }
body.compose-resizing { cursor: ns-resize; user-select: none; }

@media(max-width:760px) {
  .chat-compose { min-height: 96px; }
}

/* Group mentions */
.conversation-mention-badge { flex: none; padding: 2px 6px; border-radius: 5px; background: #fff0f0; color: #d33b3b; font-size: 10px; font-weight: 700; white-space: nowrap; }
.conversation-item.active .conversation-mention-badge { background: #fff; color: #c73535; }
.message-mention { display: inline; padding: 1px 2px; border-radius: 3px; background: rgba(77,130,173,.12); color: #176da8; font-weight: 650; }
.message-row.own .message-mention { background: rgba(255,255,255,.56); color: #245f86; }
.message-row.mentioned-me .message-bubble { box-shadow: 0 0 0 2px rgba(60,126,177,.14),0 1px 1px rgba(0,0,0,.08); }
.mention-picker { position: absolute; z-index: 20; bottom: calc(100% - 4px); left: 22px; width: min(330px,calc(100% - 44px)); max-height: 310px; overflow: auto; padding: 7px; border: 1px solid #d9e1e8; border-radius: 10px; background: rgba(255,255,255,.98); box-shadow: 0 14px 38px rgba(34,52,67,.2); }
.mention-picker[hidden] { display: none; }
.mention-picker-title { display: flex; align-items: center; justify-content: space-between; padding: 6px 8px 8px; color: #7b8791; font-size: 10px; }
.mention-picker-title b { color: #38566d; font-size: 11px; }
.mention-picker button { width: 100%; display: flex; align-items: center; gap: 10px; padding: 8px; border: 0; border-radius: 7px; background: transparent; color: #263b4d; text-align: left; cursor: pointer; }
.mention-picker button:hover,.mention-picker button[aria-selected="true"] { background: #eaf2f8; }
.mention-picker button>span:last-child { min-width: 0; }
.mention-picker button b,.mention-picker button small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mention-picker button b { font-size: 12px; font-weight: 600; }
.mention-picker button small { margin-top: 2px; color: #8a969f; font-size: 9px; }
.mention-avatar { width: 30px; height: 30px; display: grid; place-items: center; flex: none; overflow: hidden; border-radius: 6px; background: #dcecf7; color: #2f6f9c; font-size: 11px; font-weight: 700; }
.mention-avatar img { width: 100%; height: 100%; object-fit: cover; }
.message-hub.has-mention:after { content: "@"; background: #e34b4b; }
.message-toast.mention { border-color: #efc8c8; }
.message-toast.mention>span { background: #fff0f0; color: #d64343; font-weight: 800; }
@media(max-width:760px) {
  .mention-picker { left: 12px; width: calc(100% - 24px); }
}