/* 企业微信风格 UI - 响应式（电脑端 / 移动端） */
:root {
  --blue: #1485ee;          /* 企业微信主蓝 */
  --blue-dark: #0f6bbf;
  --rail-bg: #fbfbfc;       /* 左侧导航栏浅色（企业微信风格） */
  --list-bg: #f7f7f7;
  --chat-bg: #ffffff;
  --bubble-own: #cee5fd;
  --bubble-other: #f2f3f5;
  --text: #1f2329;
  --text-sub: #8a9099;
  --border: #e5e6e8;
  --green: #07c160;
  --red: #fa5151;
  --orange: #ff9d00;
}

.dr-toolbar {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  margin-bottom: 10px;
}
.dr-toolbar .tabs { margin: 0; border: 0; }
.dr-toolbar .set-input { min-width: 150px; }
.dr-list { display: grid; gap: 8px; }
.dr-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 12px;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: #fff;
}
.dr-row-main { display: flex; align-items: center; gap: 8px; min-width: 0; flex-wrap: wrap; }
.dr-meta { color: var(--text-sub); font-size: 12px; }
.dr-status { font-size: 12px; }
.dr-status.success { color: var(--green, #07c160); }
.dr-status.error, .dr-missing { color: #e5484d; }
.dr-status.muted, .dr-empty { color: var(--text-sub); }
.dr-row-actions { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; justify-content: flex-end; }
.dr-empty { padding: 18px 8px; text-align: center; font-size: 13px; }
.dr-error { color: #e5484d; }
.dr-content { white-space: pre-wrap; word-break: break-word; max-height: min(70vh, 720px); overflow: auto; padding: 14px; border: 1px solid var(--border); border-radius: 8px; line-height: 1.7; background: #fafbfc; }
.dr-source-summary { color: var(--text-sub); font-size: 13px; }

@media (max-width: 720px) {
  .dr-row { align-items: flex-start; flex-direction: column; }
  .dr-row-actions { width: 100%; justify-content: flex-start; }
  .dr-toolbar .set-input { flex: 1 1 150px; min-width: 0; }
}
* { margin: 0; padding: 0; box-sizing: border-box; }
html, body { height: 100%; }
body {
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'PingFang SC', 'Microsoft YaHei', sans-serif;
  color: var(--text); font-size: 14px; overflow: hidden;
}
#app { height: 100vh; height: 100dvh; display: flex; min-height: 0; }
/* 移动端/WebView(APK) 触摸滚动：所有内部滚动区启用惯性滚动 + 防滚动穿透；flex 滚动祖先需 min-height:0 才能滚 */
.scroll-list, .msg-list, .work-area, .settings-main, .detail-pane, .docs-list, .docs-rich-wrap, .docs-text-wrap, .docs-sheet-wrap, .article-view, .modal, .news-feed, #bug-view, .panel-list {
  -webkit-overflow-scrolling: touch; overscroll-behavior: contain;
}
button { cursor: pointer; border: none; background: none; font-family: inherit; }
input, textarea, select { font-family: inherit; font-size: 14px; outline: none; }
::-webkit-scrollbar { width: 6px; height: 6px; }
::-webkit-scrollbar-thumb { background: #c9ccd1; border-radius: 3px; }

/* ===== 登录页 ===== */
.login-page {
  flex: 1; display: flex; align-items: center; justify-content: center;
  background: linear-gradient(135deg, #1485ee 0%, #0a5cb8 100%);
}
.login-card {
  background: #fff; border-radius: 12px; padding: 40px 36px; width: 360px; max-width: 92vw;
  box-shadow: 0 12px 40px rgba(0,0,0,.18);
}
.login-card h1 { font-size: 22px; text-align: center; margin-bottom: 6px; }
.login-card .sub { text-align: center; color: var(--text-sub); margin-bottom: 26px; font-size: 13px; }
.login-card input {
  width: 100%; padding: 12px 14px; border: 1px solid var(--border); border-radius: 8px; margin-bottom: 14px;
}
.login-card input:focus { border-color: var(--blue); }
.btn-primary {
  background: var(--blue); color: #fff; border-radius: 8px; padding: 10px 18px; font-size: 14px;
}
.btn-primary:hover { background: var(--blue-dark); }
.btn-primary:disabled { opacity: .5; cursor: not-allowed; }
.btn-block { width: 100%; padding: 12px; font-size: 15px; }
.login-card .switch { text-align: center; margin-top: 14px; color: var(--blue); font-size: 13px; cursor: pointer; }
.login-tip { margin-top: 14px; font-size: 12px; color: var(--text-sub); background: #f5f8fc; padding: 10px; border-radius: 8px; line-height: 1.7; }

/* ===== 公司上下文 / 无公司状态 ===== */
.company-context-loading {
  flex: 1; display: flex; align-items: center; justify-content: center; color: var(--text-sub);
}
.company-landing {
  flex: 1; min-width: 0; min-height: 0; overflow-y: auto; display: flex; align-items: center;
  justify-content: center; background: #f7f8fa; padding: 32px;
}
.company-landing-content { width: min(100%, 560px); text-align: center; }
.company-landing-icon {
  width: 52px; height: 52px; display: inline-flex; align-items: center; justify-content: center;
  border-radius: 8px; background: #eaf3fe; color: var(--blue); font-size: 28px; margin-bottom: 18px;
}
.company-landing h1 { font-size: 22px; line-height: 1.4; margin-bottom: 8px; }
.company-landing p { color: var(--text-sub); line-height: 1.7; margin: 0 auto 22px; max-width: 480px; }
.company-identity-row {
  min-height: 52px; display: flex; align-items: center; gap: 12px; background: #fff;
  border: 1px solid var(--border); border-radius: 8px; padding: 8px 10px 8px 14px; text-align: left;
}
.company-identity-row > span { color: var(--text-sub); font-size: 12px; white-space: nowrap; }
.company-identity-row code {
  flex: 1; min-width: 0; font-size: 15px; font-weight: 700; color: var(--text); word-break: break-all;
}
.company-icon-button {
  width: 40px; height: 40px; flex: 0 0 40px; border-radius: 6px; color: var(--blue);
  background: #eef5fd; font-size: 18px;
}
.company-icon-button:hover { background: #dcecff; }
.company-icon-button:disabled { opacity: .45; cursor: not-allowed; }
.company-choice-list { display: grid; gap: 8px; margin-top: 14px; }
.company-choice {
  width: 100%; min-height: 58px; display: flex; align-items: center; gap: 12px; padding: 9px 12px;
  border: 1px solid var(--border); border-radius: 8px; background: #fff; text-align: left;
}
.company-choice:hover, .company-choice:focus-visible { border-color: var(--blue); background: #f5f9fe; }
.company-choice-mark {
  width: 36px; height: 36px; border-radius: 6px; background: #eaf3fe; color: var(--blue);
  display: inline-flex; align-items: center; justify-content: center; font-size: 20px;
}
.company-choice > span:nth-child(2) { flex: 1; min-width: 0; }
.company-choice b, .company-choice small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.company-choice small { color: var(--text-sub); margin-top: 3px; }
.company-choice-arrow { color: var(--text-sub); font-size: 22px; }
.company-landing-actions { margin-top: 18px; display: flex; justify-content: center; flex-wrap: wrap; gap: 8px; }
.company-landing-actions button { min-height: 40px; }

/* ===== 主框架 ===== */
.app-shell { flex: 1; min-width: 0; min-height: 0; display: flex; flex-direction: column; }
.view-root { flex: 1; min-width: 0; min-height: 0; display: flex; }

/* ===== 左侧导航栏 ===== */
.rail {
  width: 68px; background: var(--rail-bg); border-right: 1px solid var(--border);
  display: flex; flex-direction: column; align-items: center;
  padding: 14px 0; gap: 4px; flex-shrink: 0;
}
.rail .avatar { width: 38px; height: 38px; border-radius: 6px; margin-bottom: 14px; }
.rail-item {
  width: 56px; height: 52px; border-radius: 8px; display: flex; flex-direction: column; align-items: center;
  justify-content: center; color: #5f6671; font-size: 10px; gap: 2px; position: relative;
}
.rail-item .icon { font-size: 20px; }
.rail-item:hover { background: #f0f1f3; }
.rail-item.active { background: #eaf3fe; color: var(--blue); }
.rail-item .badge {
  position: absolute; top: 2px; right: 2px; background: var(--red); color: #fff; font-size: 10px;
  min-width: 16px; height: 16px; border-radius: 8px; display: flex; align-items: center; justify-content: center; padding: 0 4px;
}
.rail .spacer { flex: 1; }

/* 头像通用 */
.avatar { background: var(--blue); color: #fff; display: flex; align-items: center; justify-content: center; font-size: 14px; flex-shrink: 0; overflow: hidden; }
.avatar.green { background: var(--green); }
.avatar.orange { background: var(--orange); }

/* ===== 中栏列表 ===== */
.panel-list {
  width: 280px; background: var(--list-bg); border-right: 1px solid var(--border);
  display: flex; flex-direction: column; flex-shrink: 0;
}
.panel-list .head { padding: 14px 12px 8px; display: flex; gap: 8px; align-items: center; }
.search-box {
  flex: 1; background: #e8e9eb; border-radius: 6px; padding: 7px 10px; border: none; font-size: 13px;
}
.icon-btn { width: 32px; height: 32px; border-radius: 6px; background: #e8e9eb; font-size: 16px; flex-shrink: 0; }
.icon-btn:hover { background: #dcdee1; }
.scroll-list { flex: 1; overflow-y: auto; }

.conv-item {
  display: flex; padding: 11px 12px; gap: 10px; cursor: pointer; align-items: center;
}
.conv-item:hover { background: #ececee; }
.conv-item.active { background: #e3eefb; }
.conv-item .avatar { width: 42px; height: 42px; border-radius: 6px; font-size: 16px; }
.conv-item .info { flex: 1; min-width: 0; }
.conv-item .row1 { display: flex; justify-content: space-between; }
.conv-item .name { font-size: 14px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.conv-item .time { font-size: 11px; color: var(--text-sub); }
.conv-item .row2 { display: flex; justify-content: space-between; margin-top: 3px; }
.conv-item .preview { font-size: 12px; color: var(--text-sub); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; flex: 1; }
.conv-item .badge { background: var(--red); color: #fff; font-size: 10px; min-width: 17px; height: 17px; border-radius: 9px; display: flex; align-items: center; justify-content: center; padding: 0 5px; }

/* ===== 聊天主区 ===== */
.main-area { flex: 1; display: flex; flex-direction: column; background: var(--chat-bg); min-width: 0; }
.chat-header {
  background: #fff; border-bottom: 1px solid var(--border); padding: 0 18px; height: 56px;
  display: flex; align-items: center; justify-content: space-between;
}
.chat-header .title { font-size: 16px; font-weight: 600; display: flex; align-items: center; gap: 8px; }
.chat-header .back-btn { display: none; font-size: 20px; margin-right: 4px; }
.chat-header .actions { display: flex; gap: 6px; }

/* ===== 设置页 ===== */
.settings-wrap { flex: 1; display: flex; min-width: 0; background: #fff; }
.settings-nav { width: 220px; flex-shrink: 0; background: #f7f8fa; border-right: 1px solid var(--border); padding: 18px 12px; }
.settings-title { font-size: 18px; font-weight: 700; padding: 4px 10px 16px; }
.set-nav-item { padding: 11px 14px; border-radius: 8px; font-size: 14px; cursor: pointer; color: #1f2329; margin-bottom: 2px; }
.set-nav-item:hover { background: #eceef1; }
.set-nav-item.active { background: #e3e6ea; font-weight: 600; }
.settings-main { flex: 1; min-width: 0; overflow-y: auto; padding: 30px 40px; }
.set-h { font-size: 18px; font-weight: 700; margin-bottom: 18px; }
.set-card { border: 1px solid var(--border); border-radius: 12px; padding: 22px 24px; max-width: 560px; }
.set-prof { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.set-prof-name { font-size: 18px; font-weight: 700; }
.set-prof-sub { font-size: 13px; color: var(--text-sub); margin-top: 6px; }
.set-prof-av { position: relative; cursor: pointer; flex-shrink: 0; }
.set-avatar { border-radius: 10px; object-fit: cover; display: block; }
.set-avatar.txt { background: var(--blue); color: #fff; display: flex; align-items: center; justify-content: center; font-weight: 600; border-radius: 10px; }
.set-av-edit { position: absolute; right: -6px; bottom: -6px; width: 24px; height: 24px; border-radius: 50%; background: #fff; border: 1px solid var(--border); display: flex; align-items: center; justify-content: center; font-size: 13px; color: var(--blue); box-shadow: 0 1px 4px rgba(0,0,0,.12); }
.set-btn-line { width: 100%; margin-top: 20px; padding: 11px; background: #f2f3f5; border-radius: 8px; font-size: 14px; color: #1f2329; }
.set-btn-line:hover { background: #ececee; }
.set-row { display: flex; align-items: baseline; gap: 10px; margin-bottom: 10px; }
.set-l { font-size: 14px; font-weight: 600; }
.set-sub { font-size: 12px; color: var(--text-sub); }
.set-input { width: 100%; box-sizing: border-box; padding: 9px 11px; border: 1px solid var(--border); border-radius: 6px; font-size: 14px; margin-bottom: 12px; }
.set-btn { padding: 9px 16px; background: var(--blue); color: #fff; border-radius: 8px; font-size: 14px; }
.set-btn:disabled { background: #c4cad2; cursor: not-allowed; }
.set-tip { font-size: 12px; color: var(--text-sub); margin-top: 12px; line-height: 1.7; }

/* ===== 资讯详情阅读页 ===== */
.news-more { color: var(--blue); font-size: 12px; }
.article-view { max-height: 64vh; overflow-y: auto; padding: 4px 2px; }
.art-title { font-size: 22px; font-weight: 700; line-height: 1.4; margin: 6px 0 12px; }
.art-meta { font-size: 13px; color: var(--text-sub); margin-bottom: 16px; }
.art-tag { background: #eef1f5; color: #6b7178; border-radius: 4px; padding: 1px 6px; font-size: 12px; margin-right: 4px; }
.art-lead { border-left: 3px solid #1485ee; background: #f6f9fe; color: #44494f; padding: 10px 14px; border-radius: 0 6px 6px 0; font-size: 14px; line-height: 1.8; margin-bottom: 18px; }
.art-body p { font-size: 15px; line-height: 1.9; color: #1f2329; margin: 0 0 16px; word-break: break-word; }

/* ===== 视频消息内联播放 ===== */
.bubble.video-bubble { padding: 8px; background: var(--bubble-other); overflow: hidden; width: min(300px, 76vw); }
.msg-row.own .bubble.video-bubble { background: var(--bubble-own); }
.video-title { font-size: 12px; color: #33383f; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; margin: 0 28px 6px 0; }
.video-frame { position: relative; background: #000; border-radius: 6px; overflow: hidden; }
.msg-video { width: 100%; max-height: 360px; border-radius: 6px; display: block; background: #000; }
.msg-video::-webkit-media-controls-fullscreen-button { display: none !important; }
.video-zoom-btn {
  position: absolute; right: 42px; bottom: 32px; width: 42px; height: 34px; border: 0;
  border-radius: 5px; background: rgba(0,0,0,.18); color: #fff; cursor: zoom-in;
  display: inline-flex; align-items: center; justify-content: center; font-size: 18px;
}
.video-zoom-btn:hover { background: rgba(20,133,238,.82); }
.video-folder-btn { top: 6px; bottom: auto; right: 6px; }

/* ===== 转发：选择发送人面板 ===== */
.fwd-wrap { display: flex; height: 56vh; max-height: 460px; }
.fwd-left { width: 50%; border-right: 1px solid var(--border); display: flex; flex-direction: column; padding-right: 12px; }
.fwd-search { padding: 8px 10px; border: 1px solid var(--border); border-radius: 6px; margin-bottom: 8px; box-sizing: border-box; }
.fwd-list { flex: 1; overflow-y: auto; }
.fwd-item { display: flex; align-items: center; gap: 8px; padding: 7px 6px; cursor: pointer; border-radius: 6px; }
.fwd-item:hover { background: #f2f3f5; }
.fwd-item input { flex-shrink: 0; width: 16px; height: 16px; }
.fwd-item .avatar { width: 30px; height: 30px; border-radius: 6px; }
.fwd-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 14px; }
.fwd-right { width: 50%; padding-left: 16px; display: flex; flex-direction: column; }
.fwd-to-title { font-size: 13px; color: var(--text-sub); margin-bottom: 6px; }
.fwd-to { display: flex; flex-wrap: wrap; gap: 6px; min-height: 26px; margin-bottom: 10px; }
.fwd-to-empty { color: var(--text-sub); font-size: 12px; }
.fwd-chip { background: #eaf3fe; color: #1485ee; border-radius: 4px; padding: 2px 8px; font-size: 12px; }
.fwd-card { background: #f2f3f5; border-radius: 6px; padding: 10px 12px; font-size: 13px; color: #444; margin-bottom: auto; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.fwd-note { margin: 12px 0; padding: 8px 10px; border: 1px solid var(--border); border-radius: 6px; box-sizing: border-box; }
.fwd-actions { display: flex; gap: 10px; justify-content: flex-end; }
.fwd-actions button { padding: 8px 22px; border-radius: 6px; font-size: 14px; }

.msg-list { flex: 1; min-height: 0; overflow-y: auto; padding: 18px; display: flex; flex-direction: column; gap: 14px; }
.msg-row { display: flex; gap: 10px; max-width: 78%; }
.msg-row.own { align-self: flex-end; flex-direction: row-reverse; }
.msg-row .avatar { width: 36px; height: 36px; border-radius: 6px; }
.msg-body { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.msg-row.own .msg-body { align-items: flex-end; }
.plus-one { align-self: flex-start; margin-top: 2px; font-size: 11px; color: var(--blue); background: rgba(20,133,238,.08); border: 1px solid rgba(20,133,238,.3); border-radius: 10px; padding: 1px 9px; cursor: pointer; opacity: 0; transition: opacity .15s; }
.msg-row.own .plus-one { align-self: flex-end; }
.msg-row:hover .plus-one { opacity: 1; }
.plus-one:hover { background: rgba(20,133,238,.16); }
.msg-meta { font-size: 11px; color: var(--text-sub); display: flex; gap: 6px; align-items: center; }
.bubble {
  background: var(--bubble-other); border-radius: 6px; padding: 9px 12px; line-height: 1.7;
  word-break: break-word; white-space: pre-wrap; position: relative; font-size: 13.5px;
}
.msg-row.own .bubble { background: var(--bubble-own); }
.polish-tag {
  font-size: 10px; color: var(--blue); background: rgba(20,133,238,.1); padding: 1px 6px; border-radius: 4px; cursor: pointer;
}
.bubble.voice { display: flex; align-items: center; gap: 8px; cursor: pointer; min-width: 90px; }
.bubble.file-msg { display: flex; align-items: center; gap: 10px; cursor: pointer; padding-right: 42px; min-width: 220px; }
.bubble.file-msg .ficon { font-size: 26px; }
.bubble.file-msg .fname { font-size: 13px; max-width: 200px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.bubble.file-msg .fsize { font-size: 11px; color: var(--text-sub); }
.file-folder-btn {
  position: absolute; right: 7px; bottom: 6px; width: 26px; height: 24px; border: 0;
  border-radius: 6px; background: rgba(20,133,238,.1); color: var(--blue); cursor: pointer;
  display: inline-flex; align-items: center; justify-content: center; font-size: 14px; line-height: 1;
}
.file-folder-btn:hover { background: var(--blue); color: #fff; }
.expired-file { color: var(--text-sub); background: #f1f2f4; font-size: 13px; }
.bubble img.msg-img { max-width: 240px; border-radius: 6px; display: block; }
.bubble.img-bubble { display: inline-block; }
.img-cap { margin-top: 6px; font-size: 13.5px; line-height: 1.6; white-space: pre-wrap; word-break: break-word; max-width: 240px; }
.sys-msg { align-self: center; font-size: 12px; color: var(--text-sub); background: rgba(0,0,0,.04); padding: 3px 10px; border-radius: 10px; }
.typing-tip { font-size: 12px; color: var(--text-sub); padding: 0 18px 4px; height: 18px; }

/* 输入区 */
.input-area { background: #fff; border-top: 1px solid var(--border); padding: 8px 14px 12px; }
.input-toolbar { display: flex; gap: 4px; padding-bottom: 6px; align-items: center; }
.tool-btn { width: 32px; height: 32px; font-size: 17px; border-radius: 6px; display: flex; align-items: center; justify-content: center; }
.tool-btn:hover { background: #f2f3f5; }
.tool-btn.recording { background: var(--red); color: #fff; animation: pulse 1s infinite; }
@keyframes pulse { 50% { opacity: .6; } }
.polish-switch { margin-left: auto; display: flex; align-items: center; gap: 6px; font-size: 12px; color: var(--text-sub); cursor: pointer; user-select: none; }
.switch-dot { width: 34px; height: 18px; border-radius: 9px; background: #d0d3d8; position: relative; transition: .2s; }
.switch-dot::after { content: ''; position: absolute; width: 14px; height: 14px; border-radius: 50%; background: #fff; top: 2px; left: 2px; transition: .2s; }
.polish-switch.on .switch-dot { background: var(--blue); }
.polish-switch.on .switch-dot::after { left: 18px; }
.input-row { display: flex; gap: 10px; align-items: flex-end; }
.input-row textarea {
  flex: 1; border: none; resize: none; height: 116px; min-height: 48px; padding: 9px 0; font-size: 14px; line-height: 1.5; background: transparent;
}
/* 发送按钮 + 发送方式下拉 */
.send-wrap { display: flex; align-items: stretch; gap: 0; }
.send-wrap .send-btn { border-top-right-radius: 0; border-bottom-right-radius: 0; padding: 8px 18px; }
.send-caret { background: var(--blue); color: #fff; border-radius: 0 6px 6px 0; border-left: 1px solid rgba(255,255,255,.35); width: 22px; font-size: 12px; display: flex; align-items: center; justify-content: center; }
.send-caret:hover { filter: brightness(1.05); }
.send-mode-pop { position: absolute; right: 14px; bottom: 56px; background: #fff; border: 1px solid var(--border); border-radius: 8px; box-shadow: 0 6px 24px rgba(0,0,0,.16); padding: 4px; z-index: 9998; min-width: 210px; }
.smp-item { display: flex; align-items: center; gap: 6px; padding: 9px 12px; font-size: 13px; border-radius: 6px; cursor: pointer; white-space: nowrap; }
.smp-item:hover { background: #f2f3f5; }
.smp-item.on { color: var(--blue); }
.smp-check { width: 14px; display: inline-block; color: var(--blue); }
.input-resize { height: 6px; margin: -8px -14px 2px; cursor: ns-resize; border-radius: 3px; }
.input-resize:hover { background: #d8e6f5; }
.msg-img { cursor: zoom-in; }
.send-btn { background: var(--blue); color: #fff; border-radius: 6px; padding: 8px 22px; font-size: 14px; }
.send-btn:disabled { background: #c4cad2; }

.empty-state { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; color: var(--text-sub); gap: 10px; }
.empty-state .big { font-size: 52px; }

/* ===== 通讯录 ===== */
.section-title { padding: 12px 14px 6px; font-size: 12px; color: var(--text-sub); }
.contact-item { display: flex; align-items: center; gap: 10px; padding: 9px 14px; cursor: pointer; }
.contact-item:hover { background: #ececee; }
.contact-item.active { background: #d8e7f5; }
.contact-item .avatar { width: 36px; height: 36px; border-radius: 6px; }
.contact-item .meta { flex: 1; min-width: 0; }
.contact-item .nm { font-size: 14px; }
.contact-item .ttl { font-size: 11px; color: var(--text-sub); }
.dept-head { padding: 9px 14px; font-size: 13px; font-weight: 600; cursor: pointer; display: flex; align-items: center; gap: 6px; color: #444; }
.dept-head:hover { background: #ececee; }
.dept-head .dept-arrow { color: var(--text-sub); font-size: 11px; width: 12px; flex-shrink: 0; }
.dept-head .dept-name { flex: 1; }
.dept-head .dept-count { color: var(--text-sub); font-weight: 400; }

.detail-pane { flex: 1; display: flex; flex-direction: column; align-items: center; padding-top: 60px; gap: 6px; background: #fff; overflow-y: auto; }
.detail-pane .avatar { width: 72px; height: 72px; border-radius: 10px; font-size: 28px; }
.detail-pane h2 { font-size: 20px; margin-top: 10px; }
.detail-pane .sub { color: var(--text-sub); font-size: 13px; }
.detail-actions { display: flex; gap: 12px; margin-top: 24px; }
.btn-secondary { border: 1px solid var(--border); border-radius: 8px; padding: 9px 20px; font-size: 14px; background: #fff; }
.btn-secondary:hover { border-color: var(--blue); color: var(--blue); }
.btn-danger { border: 1px solid var(--red); color: var(--red); border-radius: 8px; padding: 9px 20px; background: #fff; }
.req-card { background: #fff; border-radius: 8px; margin: 6px 10px; padding: 10px 12px; display: flex; align-items: center; gap: 10px; }
.req-card .avatar { width: 34px; height: 34px; border-radius: 6px; }
.req-card .who { flex: 1; font-size: 13px; }
.btn-mini { background: var(--blue); color: #fff; border-radius: 5px; padding: 5px 12px; font-size: 12px; }

/* ===== 工作台 ===== */
.work-area { flex: 1; overflow-y: auto; background: #f2f3f7; }
.work-head { padding: 22px 26px 0; }
.work-head h1 { font-size: 20px; }
.work-head p { color: var(--text-sub); font-size: 13px; margin-top: 4px; }
.module-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 14px; padding: 20px 26px; }
.module-card {
  background: #fff; border-radius: 10px; padding: 18px; cursor: pointer; transition: .15s;
  border: 1px solid transparent;
}
.module-card:hover { transform: translateY(-2px); box-shadow: 0 6px 18px rgba(0,0,0,.07); border-color: #dbe7f5; }
.module-card .icon { font-size: 30px; }
.module-card h3 { font-size: 15px; margin: 10px 0 4px; }
.module-card p { font-size: 12px; color: var(--text-sub); line-height: 1.5; }

.module-panel { padding: 20px 26px; max-width: 980px; }
.module-panel .panel-head { display: flex; align-items: center; gap: 10px; margin-bottom: 16px; }
.module-panel .panel-head h2 { font-size: 18px; flex: 1; }
.card { background: #fff; border-radius: 10px; padding: 18px; margin-bottom: 14px; }
.card h3 { font-size: 15px; margin-bottom: 12px; }
.form-row { display: flex; gap: 10px; margin-bottom: 10px; flex-wrap: wrap; }
.form-row input, .form-row select, .form-row textarea {
  border: 1px solid var(--border); border-radius: 6px; padding: 8px 10px; font-size: 13px;
}
.form-row input:focus, .form-row textarea:focus { border-color: var(--blue); }
.form-row textarea { width: 100%; min-height: 80px; resize: vertical; }
.form-row .grow { flex: 1; }
.result-box { background: #f7f8fa; border-radius: 8px; padding: 14px; white-space: pre-wrap; font-size: 13px; line-height: 1.7; margin-top: 10px; max-height: 420px; overflow-y: auto; }
.result-box img { max-width: 100%; border-radius: 8px; }
.result-box.mono { font-family: 'SF Mono', Consolas, monospace; font-size: 12.5px; }

.table { width: 100%; border-collapse: collapse; font-size: 13px; }
.table th { text-align: left; color: var(--text-sub); font-weight: 500; padding: 8px 10px; border-bottom: 1px solid var(--border); white-space: nowrap; }
.table td { padding: 9px 10px; border-bottom: 1px solid #f0f1f3; }
.table tr:hover td { background: #fafbfc; }
.tag { display: inline-block; padding: 2px 8px; border-radius: 4px; font-size: 11px; }
.tag.bug { background: #fde9e9; color: var(--red); }
.tag.task { background: #e7f3fe; color: var(--blue); }
.tag.optimization { background: #fff4e0; color: var(--orange); }
.tag.todo { background: #f0f1f3; color: #666; }
.tag.doing { background: #e7f3fe; color: var(--blue); }
.tag.done { background: #e6f9ef; color: var(--green); }
.tag.closed { background: #f0f1f3; color: #999; }
.tag.high, .tag.urgent { background: #fde9e9; color: var(--red); }
.tag.medium { background: #fff4e0; color: var(--orange); }
.tag.low { background: #f0f1f3; color: #666; }

.tabs { display: flex; gap: 4px; margin-bottom: 14px; flex-wrap: wrap; }
.tab { padding: 7px 16px; border-radius: 6px; font-size: 13px; color: var(--text-sub); background: #fff; }
.tab.active { background: var(--blue); color: #fff; }

.kb-item { padding: 12px 0; border-bottom: 1px solid #f0f1f3; cursor: pointer; }
.kb-item:hover .kt { color: var(--blue); }
.kb-item .kt { font-size: 14px; font-weight: 500; }
.kb-item .km { font-size: 12px; color: var(--text-sub); margin-top: 4px; }

/* ===== 弹窗 / 提示 ===== */
#modal-container .mask {
  position: fixed; inset: 0; background: rgba(0,0,0,.4); display: flex; align-items: center; justify-content: center; z-index: 100;
}
.modal { background: #fff; border-radius: 12px; padding: 22px; width: 420px; max-width: 92vw; max-height: 84vh; overflow-y: auto; }
.modal h3 { font-size: 16px; margin-bottom: 16px; }
.modal .foot { display: flex; justify-content: flex-end; gap: 10px; margin-top: 18px; }
.member-pick { max-height: 260px; overflow-y: auto; border: 1px solid var(--border); border-radius: 8px; padding: 6px; }
.member-pick label { display: flex; align-items: center; gap: 8px; padding: 7px 8px; border-radius: 6px; cursor: pointer; font-size: 13px; }
.member-pick label:hover { background: #f5f6f8; }

#toast-container { position: fixed; top: 20px; left: 50%; transform: translateX(-50%); z-index: 200; display: flex; flex-direction: column; gap: 8px; }
.toast { background: rgba(0,0,0,.78); color: #fff; padding: 10px 18px; border-radius: 8px; font-size: 13px; animation: fadein .2s; max-width: 80vw; }
.toast.success { background: rgba(7,193,96,.92); }
.toast.error { background: rgba(250,81,81,.92); }
@keyframes fadein { from { opacity: 0; transform: translateY(-8px); } }

/* ===== Width-based mobile layout (shared Web/APK shell) =====
   Complex module adaptations remain in their owning stylesheets. */
@media (max-width: 768px), (pointer: coarse) and (max-height: 500px) {
  :root { --navh: calc(56px + env(safe-area-inset-bottom, 0px)); }
  #app { flex-direction: column; }
  .app-shell { width: 100%; height: 100%; padding-bottom: var(--navh); }
  .company-landing {
    align-items: flex-start; padding: calc(30px + env(safe-area-inset-top, 0px)) 18px calc(30px + env(safe-area-inset-bottom, 0px));
  }
  .company-landing-content { margin: auto 0; }
  .company-identity-row { gap: 8px; padding-left: 10px; }
  .company-identity-row > span { display: none; }
  .company-landing-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .company-landing-actions button { min-height: 44px; padding: 9px 10px; }
  .company-choice { min-height: 64px; }
  /* 底部导航固定显示，所有页面可见（层级高于全屏的聊天/详情页） */
  .rail {
    order: 2; width: 100%; height: var(--navh); flex-direction: row; justify-content: space-around;
    padding: 0 0 env(safe-area-inset-bottom, 0px) 0;
    position: fixed; left: 0; bottom: 0; z-index: 60; background: #fff; box-shadow: 0 -1px 0 var(--border);
  }
  .rail .avatar { display: none; }
  .rail .spacer { display: none; }
  .panel-list { width: 100%; flex: 1; padding-bottom: var(--navh); padding-top: env(safe-area-inset-top, 0px); }
  /* 聊天/详情全屏页底部留出导航栏空间，避免盖住底部图标；顶部留出状态栏安全区 */
  .main-area {
    position: fixed; top: 0; left: 0; right: 0; bottom: var(--navh); z-index: 50; transform: translateX(100%); transition: transform .25s;
    padding-top: env(safe-area-inset-top, 0px);
  }
  .main-area.open { transform: translateX(0); }
  .chat-header .back-btn { display: block; }
  .msg-row { max-width: 88%; }
  .detail-pane { position: fixed; top: 0; left: 0; right: 0; bottom: var(--navh); z-index: 50; display: none; padding-top: env(safe-area-inset-top, 0px); }
  .detail-pane.open { display: flex; }
  .settings-nav { width: 140px; }
  .settings-main { padding: 18px 16px calc(70px + env(safe-area-inset-bottom, 0px)); }
  .work-area { padding-bottom: var(--navh); min-height: 0; }
  .panel-list { min-height: 0; }
  .module-grid { grid-template-columns: repeat(2, 1fr); padding: 14px; }
  .module-panel { padding: 14px; }
  .table-wrap { overflow-x: auto; }
}


/* ===== 企业微信风格：聊天主体布局 ===== */
.chat-body { flex: 1; display: flex; min-height: 0; }
.chat-center { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.time-divider {
  align-self: center; font-size: 11px; color: #b2b6bd; padding: 2px 0; user-select: none;
}

/* 右侧群信息边栏 */
.member-sidebar {
  width: 220px; flex-shrink: 0; background: #fbfbfc; border-left: 1px solid var(--border);
  overflow-y: auto; padding: 14px 12px; display: flex; flex-direction: column; gap: 10px;
}
.member-sidebar.hidden { display: none; }
.ms-board {
  background: #fff; border: 1px solid var(--border); border-radius: 8px; padding: 10px 12px;
  font-size: 13px; font-weight: 600; cursor: default;
}
.ms-board span { font-weight: 400; font-size: 11px; color: var(--text-sub); }
.ms-head { font-size: 12px; color: var(--text-sub); padding: 2px 2px 0; }
.ms-list { display: flex; flex-direction: column; gap: 2px; }
.ms-item { display: flex; align-items: center; gap: 8px; padding: 5px 4px; border-radius: 6px; font-size: 13px; }
.ms-item:hover { background: #f0f1f3; }
.ms-item .avatar { width: 26px; height: 26px; border-radius: 5px; font-size: 12px; }
.ms-name { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.owner-tag {
  font-size: 10px; color: var(--orange); border: 1px solid var(--orange); border-radius: 3px; padding: 0 4px;
}
.ms-add {
  border: 1px dashed var(--border); border-radius: 6px; padding: 7px; font-size: 13px; color: var(--text-sub);
}
.ms-add:hover { color: var(--blue); border-color: var(--blue); }

/* 表情面板 */
.emoji-pop { display: flex; flex-wrap: wrap; gap: 4px; padding: 8px 4px; font-size: 21px; }
.emoji-pop span { cursor: pointer; padding: 2px 4px; border-radius: 5px; }
.emoji-pop span:hover { background: #f0f1f3; }

@media (max-width: 768px), (pointer: coarse) and (max-height: 500px) {
  .rail { border-right: none; border-top: 1px solid var(--border); }
  .member-sidebar { display: none; }
}


/* ===== 资讯信息流（企业微信"行业资讯"风格） ===== */
.news-feed { max-width: 720px; }
.news-source-link { display: inline-flex; align-items: center; min-height: 32px; margin-left: 8px; color: var(--blue); font-size: 12px; font-weight: 600; text-decoration: none; }
.news-source-link:hover { text-decoration: underline; }
.news-date { font-size: 22px; font-weight: 800; margin-bottom: 14px; font-family: Georgia, 'Times New Roman', serif; }
.news-date span { font-size: 12px; font-weight: 600; color: var(--text); margin-left: 4px; }
.news-hero {
  height: 200px; border-radius: 10px; position: relative; color: #fff; padding: 18px;
  display: flex; flex-direction: column; justify-content: space-between; overflow: hidden;
}
.nh-title { font-size: 20px; font-weight: 700; line-height: 1.5; max-width: 80%; text-shadow: 0 1px 4px rgba(0,0,0,.3); }
.nh-src { font-size: 12px; opacity: .85; }
.news-sum { font-size: 13px; color: var(--text-sub); line-height: 1.7; padding: 12px 2px; border-bottom: 1px solid #f0f1f3; }
.news-item { display: flex; gap: 16px; padding: 16px 2px; border-bottom: 1px solid #f0f1f3; align-items: flex-start; }
.ni-main { flex: 1; min-width: 0; }
.ni-title { font-size: 15.5px; font-weight: 600; line-height: 1.5; }
.ni-sum { font-size: 12.5px; color: var(--text-sub); line-height: 1.6; margin-top: 5px; }
.ni-src { font-size: 12px; color: #b2b6bd; margin-top: 8px; }
.ni-thumb {
  width: 110px; height: 76px; border-radius: 6px; flex-shrink: 0;
  display: flex; align-items: center; justify-content: center; font-size: 30px;
}
.news-box { border: 1px solid var(--border); border-radius: 10px; padding: 14px 16px; margin-top: 16px; background: #fafbfc; }
.nb-tag { font-size: 12px; color: var(--blue); margin-bottom: 8px; }
.nb-tag + .ni-title { font-size: 15.5px; }
.news-box .ni-sum { margin-top: 6px; }
.news-box .ni-src { margin-top: 8px; }
.news-note { text-align: center; font-size: 11px; color: #c2c6cd; padding: 14px 0 4px; }


/* ===== 语音通话悬浮窗 ===== */
.call-widget {
  position: fixed; top: 70px; right: 24px; z-index: 300;
  background: #fff; border: 1px solid var(--border); border-radius: 12px;
  box-shadow: 0 8px 30px rgba(0,0,0,.15); padding: 12px 16px;
  display: flex; align-items: center; gap: 10px; font-size: 14px;
  animation: fadein .2s;
}
.cw-icon { font-size: 20px; }
.cw-copy { display: flex; flex-direction: column; min-width: 130px; max-width: 320px; }
.cw-text { min-width: 130px; }
.cw-sub { margin-top: 2px; color: var(--text-sub); font-size: 12px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cw-btns { display: flex; gap: 8px; }
.cw-btn { border-radius: 6px; padding: 6px 14px; font-size: 13px; color: #fff; }
.cw-btn.primary { background: var(--green); }
.cw-btn.danger { background: var(--red); }
@media (max-width: 768px), (pointer: coarse) and (max-height: 500px) { .call-widget { top: 10px; right: 10px; left: 10px; justify-content: space-between; } }


/* ===== 企业微信式截图选区 ===== */
.snip-overlay { position: fixed; inset: 0; z-index: 1000; cursor: crosshair; user-select: none; }
.snip-bg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: fill; }
.snip-mask { position: absolute; inset: 0; background: rgba(0,0,0,.45); }
.snip-rect {
  position: absolute; border: 1.5px solid var(--blue);
  box-shadow: 0 0 0 100000px rgba(0,0,0,.45);
}
.snip-rect::after {
  content: attr(data-size); position: absolute; top: -26px; left: 0;
  background: rgba(0,0,0,.7); color: #fff; font-size: 12px; padding: 2px 8px; border-radius: 4px; white-space: nowrap;
}
.snip-tip {
  position: absolute; top: 24px; left: 50%; transform: translateX(-50%);
  background: rgba(0,0,0,.7); color: #fff; font-size: 13px; padding: 8px 18px; border-radius: 20px;
}
.snip-bar {
  position: absolute; display: flex; gap: 6px; background: #fff; border-radius: 8px;
  padding: 6px; box-shadow: 0 4px 16px rgba(0,0,0,.25); cursor: default;
}
.snip-btn { padding: 6px 12px; border-radius: 6px; font-size: 14px; }
.snip-btn:hover { background: #f0f1f3; }
.snip-btn.ok { background: var(--blue); color: #fff; }
.snip-btn.ok:hover { background: var(--blue-dark); }


/* ===== @提及 ===== */
.mention { color: var(--blue); font-weight: 500; }
.bubble.mention-me { background: #fff7e8; border: 1px solid #ffd591; }
.mention-flag { color: var(--red); margin-right: 4px; }
.mention-pop {
  position: absolute; bottom: 100%; left: 14px; margin-bottom: 6px; z-index: 60;
  background: #fff; border: 1px solid var(--border); border-radius: 10px;
  box-shadow: 0 -4px 20px rgba(0,0,0,.12); width: 240px; max-height: 260px; overflow-y: auto; padding: 4px;
}
.input-area { position: relative; }
.mp-item { display: flex; align-items: center; gap: 8px; padding: 7px 10px; border-radius: 6px; cursor: pointer; font-size: 13px; }
.mp-item.active, .mp-item:hover { background: #eaf3fe; }
.mp-item .avatar { width: 26px; height: 26px; border-radius: 5px; font-size: 12px; }
.mp-all {
  width: 26px; height: 26px; border-radius: 5px; background: var(--orange); color: #fff;
  display: flex; align-items: center; justify-content: center; font-weight: 700; flex-shrink: 0;
}
.mp-sub { font-size: 11px; color: var(--text-sub); margin-left: auto; }

/* ===== 聊天记录查看器（企业微信样式） ===== */
.hist-tabs { display: flex; gap: 22px; border-bottom: 1px solid var(--border); margin: 6px 0 12px; }
.hist-tab { padding: 7px 2px; font-size: 14px; cursor: pointer; color: var(--text-sub); border-bottom: 2px solid transparent; }
.hist-tab.active { color: var(--blue); border-color: var(--blue); font-weight: 600; }
.hist-list { max-height: 50vh; min-height: 220px; overflow-y: auto; border: 1px solid var(--border); border-radius: 8px; padding: 4px 12px; }
.hist-item { padding: 10px 0; border-bottom: 1px solid #f0f1f3; }
.hist-item:last-child { border-bottom: none; }
.hist-meta { font-size: 12px; color: var(--text-sub); margin-bottom: 5px; }
.hist-text { font-size: 13.5px; word-break: break-word; line-height: 1.65; }
.hist-text a { color: var(--blue); text-decoration: none; word-break: break-all; }
.hist-text a:hover { text-decoration: underline; }
.hist-file { display: flex; align-items: center; gap: 10px; border: 1px solid var(--border); border-radius: 8px; padding: 10px 12px; cursor: pointer; max-width: 320px; background: #fff; }
.hist-file:hover { background: #f7f8fa; }
.hist-file .ic { width: 38px; height: 38px; min-width: 38px; border-radius: 8px; background: var(--blue); color: #fff; display: flex; align-items: center; justify-content: center; font-size: 17px; }
.hist-file .fname { font-size: 13px; word-break: break-all; }
.hist-file .fsize { font-size: 11px; color: var(--text-sub); margin-top: 2px; }
.hist-thumb { max-width: 150px; max-height: 110px; border-radius: 6px; cursor: zoom-in; display: block; }
.hist-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; padding: 8px 0; }
.hist-grid .cell { position: relative; aspect-ratio: 1; overflow: hidden; border-radius: 6px; cursor: zoom-in; background: #111; }
.hist-grid img, .hist-grid video { width: 100%; height: 100%; object-fit: cover; }
.hist-grid .play { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; color: #fff; font-size: 26px; text-shadow: 0 1px 8px rgba(0,0,0,.65); pointer-events: none; }
.lightbox { position: fixed; inset: 0; background: rgba(0,0,0,.86); z-index: 300; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 16px; }
.lightbox img, .lightbox video { max-width: 88vw; max-height: 78vh; border-radius: 4px; background: #000; }
.lightbox .lb-bar { display: flex; gap: 12px; }
/* sync-074526 */

/* ===== 截图标注（QQ式） ===== */
.snip-anno { position: fixed; inset: 0; z-index: 1001; pointer-events: none; }
.snip-bar { z-index: 1003; }
.snip-btn.active { background: var(--blue); color: #fff; }
.snip-sep { width: 1px; height: 18px; background: #e5e6e8; margin: 0 4px; }
.snip-color { width: 28px; height: 28px; padding: 0; border: 0; background: transparent; cursor: pointer; }
.snip-size { width: 72px; accent-color: var(--blue); }
.snip-text-input {
  position: fixed; z-index: 1002; background: rgba(255,255,255,.85); border: 1px dashed #ff3b30;
  color: #ff3b30; font: bold 16px "Microsoft YaHei", sans-serif; outline: none; min-width: 100px; padding: 2px 4px; border-radius: 3px;
}

/* 群成员移出按钮（悬停显示） */
.ms-item { position: relative; }
.ms-kick {
  display: none; margin-left: auto; width: 20px; height: 20px; border-radius: 4px;
  color: var(--red); font-size: 12px; line-height: 1; align-items: center; justify-content: center;
}
.ms-item:hover .ms-kick { display: flex; }
.ms-kick:hover { background: #fde8e7; }

/* ===== 右键浮动菜单（消息/会话/成员通用） ===== */
.ctx-menu { position: fixed; z-index: 9999; background: #fff; border: 1px solid var(--border); border-radius: 8px; box-shadow: 0 6px 24px rgba(0,0,0,.16); padding: 4px; min-width: 124px; }
.ctx-item { padding: 8px 14px; font-size: 13px; border-radius: 6px; cursor: pointer; white-space: nowrap; }
.ctx-item:hover { background: #f2f3f5; }
.ctx-item.danger { color: var(--red); }

/* ===== 引用预览条 ===== */
.quote-bar { display: flex; align-items: center; justify-content: space-between; gap: 8px; background: #f2f3f5; border-left: 3px solid #1485ee; border-radius: 4px; padding: 5px 9px; margin: 0 8px 6px; font-size: 12px; color: var(--text-sub); }
.quote-bar .q-text { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.quote-bar .q-x { border: 0; background: transparent; cursor: pointer; color: #8a9099; font-size: 13px; padding: 0 2px; }

/* ===== 群操作按钮 ===== */
.ms-actions { display: flex; flex-direction: column; gap: 8px; padding: 12px; border-top: 1px solid var(--border); }
.ms-act { padding: 9px; border: 1px solid var(--border); border-radius: 8px; background: #fff; cursor: pointer; font-size: 13px; }
.ms-act:hover { background: #f2f3f5; }
.ms-act.danger { color: var(--red); border-color: #f5c2c7; }

/* 成员条目可点 + 免打扰小红点 */
.ms-item { cursor: pointer; }
.conv-item .badge.dot { min-width: 8px; width: 8px; height: 8px; padding: 0; border-radius: 50%; }

/* ===== 群设置面板（右上角 ⋯ 打开，企业微信式） ===== */
.gs-sec { padding: 8px 0; }
.gs-rows { border-top: 8px solid #f2f3f5; }
.gs-row { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 13px 16px; font-size: 14px; border-bottom: 1px solid #f0f0f0; cursor: pointer; }
.gs-row:hover { background: #f7f8fa; }
.gs-l { color: #1f2329; white-space: nowrap; }
.gs-v { color: #8a9099; font-size: 13px; max-width: 140px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.gs-toggle { flex: 0 0 auto; width: 40px; height: 22px; border-radius: 11px; background: #d0d3d8; position: relative; transition: background .15s; }
.gs-toggle::after { content: ''; position: absolute; top: 2px; left: 2px; width: 18px; height: 18px; border-radius: 50%; background: #fff; transition: left .15s; }
.gs-toggle.on { background: #1485ee; }
.gs-toggle.on::after { left: 20px; }

/* 公司与成员管理 */
.company-admin-view { min-height: 100%; overflow: auto; background: #f6f7f9; }
.company-admin-head { position: sticky; top: 0; z-index: 4; background: #fff; }
.company-admin-head h2 { min-width: 0; }
.ca-gate-state { margin-left: auto; color: var(--text-sub); font-size: 12px; white-space: nowrap; }
.company-admin-tabs { margin: 0; padding: 10px 26px 0; background: #fff; border-bottom: 1px solid var(--border); }
.company-admin-body { padding: 18px 26px 34px; }
.company-admin-section { max-width: 1120px; margin: 0 auto 14px; padding: 18px 20px; background: #fff; border: 1px solid var(--border); border-radius: 6px; }
.company-admin-section h3 { margin: 0; font-size: 15px; }
.company-admin-section p { margin: 4px 0 0; color: var(--text-sub); font-size: 12px; }
.ca-create-company, .ca-member-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 18px; }
.ca-create-form, .ca-add-member { display: flex; align-items: center; justify-content: flex-end; gap: 8px; min-width: 0; }
.ca-create-form input, .ca-add-member input, .ca-add-member select, .ca-department-create input,
.ca-company-name, .ca-member-fields input, .ca-member-fields select, .ca-modal-field input {
  min-height: 38px; box-sizing: border-box; border: 1px solid var(--border); border-radius: 5px; background: #fff; color: var(--text); padding: 7px 10px; font: inherit;
}
.ca-create-form input[name="name"] { min-width: 210px; }
.ca-create-form input[name="code"] { width: 150px; text-transform: uppercase; }
.ca-section-title { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; margin-bottom: 10px; }
.ca-section-title span { color: var(--text-sub); font-size: 12px; }
.ca-company-list, .ca-member-list { border-top: 1px solid var(--border); }
.ca-company-row, .ca-member-row { display: grid; align-items: center; gap: 16px; padding: 14px 2px; border-bottom: 1px solid var(--border); }
.ca-company-row { grid-template-columns: minmax(260px, 1fr) auto; }
.ca-company-name { width: min(100%, 420px); font-weight: 600; }
.ca-company-meta { display: flex; flex-wrap: wrap; gap: 6px 14px; margin-top: 7px; color: var(--text-sub); font-size: 12px; }
.ca-company-meta code, .ca-member-identity code { color: #2f5f8f; background: #eef5fc; border-radius: 4px; padding: 2px 6px; letter-spacing: 0; }
.ca-company-actions, .ca-member-actions { display: flex; align-items: center; justify-content: flex-end; gap: 8px; }
.ca-switch { display: inline-flex; min-height: 38px; align-items: center; gap: 7px; cursor: pointer; color: var(--text-sub); font-size: 12px; white-space: nowrap; }
.ca-switch input { position: absolute; opacity: 0; pointer-events: none; }
.ca-switch span { position: relative; width: 40px; height: 22px; border-radius: 11px; background: #c8cdd4; transition: background .15s; }
.ca-switch span::after { content: ''; position: absolute; top: 2px; left: 2px; width: 18px; height: 18px; border-radius: 50%; background: #fff; transition: transform .15s; box-shadow: 0 1px 2px rgba(0,0,0,.15); }
.ca-switch input:checked + span { background: #1683e8; }
.ca-switch input:checked + span::after { transform: translateX(18px); }
.ca-switch input:focus-visible + span { outline: 2px solid #1683e8; outline-offset: 2px; }
.ca-switch input:disabled + span { opacity: .55; }
.ca-member-row { grid-template-columns: minmax(170px, .7fr) minmax(390px, 1.8fr) auto; }
.ca-member-row.is-removed { opacity: .72; }
.ca-member-identity { display: flex; align-items: flex-start; flex-direction: column; gap: 5px; min-width: 0; }
.ca-member-identity strong, .ca-member-summary span { overflow-wrap: anywhere; }
.ca-member-fields { display: grid; grid-template-columns: minmax(130px, .8fr) minmax(130px, .8fr) minmax(150px, 1fr); gap: 8px; }
.ca-member-fields label { display: flex; flex-direction: column; gap: 4px; color: var(--text-sub); font-size: 11px; }
.ca-member-summary { display: flex; flex-wrap: wrap; gap: 6px 14px; color: var(--text-sub); font-size: 12px; }
.ca-status { font-size: 11px; }
.ca-status.active { color: #137c43; }
.ca-status.removed { color: #9a4b47; }
.ca-department-create form { display: flex; justify-content: flex-end; gap: 8px; }
.ca-department-create input { width: min(100%, 320px); }
.ca-state { display: flex; min-height: 180px; align-items: center; justify-content: center; flex-direction: column; gap: 12px; color: var(--text-sub); text-align: center; }
.ca-state.ca-error { color: #a94242; }
.ca-confirm-text { line-height: 1.7; color: var(--text); overflow-wrap: anywhere; }
.ca-modal-field { display: flex; flex-direction: column; gap: 7px; margin-top: 14px; color: var(--text-sub); font-size: 12px; }
.set-identity-row { margin-top: 20px; padding-top: 18px; border-top: 1px solid var(--border); }
.set-identity-row > label { display: block; margin-bottom: 7px; color: var(--text-sub); font-size: 12px; }
.set-identity-control { display: flex; align-items: center; gap: 8px; }
.set-identity-control .set-input { flex: 1; margin: 0; font-family: Consolas, monospace; letter-spacing: 0; }
.set-identity-control .company-icon-button { flex: 0 0 40px; min-height: 40px; }

@media (max-width: 700px) {
  .company-admin-tabs { padding: 8px 14px 0; overflow-x: auto; flex-wrap: nowrap; }
  .company-admin-body { padding: 12px 10px calc(76px + env(safe-area-inset-bottom, 0px)); }
  .company-admin-section { padding: 14px 12px; margin-bottom: 10px; }
  .ca-create-company, .ca-member-toolbar { display: block; }
  .ca-create-form, .ca-add-member { display: grid; grid-template-columns: 1fr; margin-top: 12px; }
  .ca-create-form input[name="name"], .ca-create-form input[name="code"] { width: 100%; min-width: 0; }
  .ca-create-form button, .ca-add-member button { min-height: 44px; }
  .ca-company-row, .ca-member-row { grid-template-columns: minmax(0, 1fr); gap: 10px; }
  .ca-company-actions, .ca-member-actions { justify-content: flex-start; flex-wrap: wrap; }
  .ca-company-actions button, .ca-member-actions button { min-height: 42px; }
  .ca-member-fields { grid-template-columns: 1fr; }
  .ca-member-fields input, .ca-member-fields select { min-height: 42px; width: 100%; }
  .ca-department-create form { display: grid; grid-template-columns: 1fr auto; }
  .ca-department-create input { width: 100%; }
  .set-identity-control .set-input { min-width: 0; }
}
.gs-bottom { padding: 10px 0 4px; border-top: 8px solid #f2f3f5; }
.gs-exit { text-align: center; color: var(--red); padding: 12px; font-size: 14px; cursor: pointer; }
.gs-exit:hover { background: #fff0f0; }

/* 群设置浮层（点击 ⋯ 弹出，成员列表保持不变） */
.group-settings-pop {
  position: fixed; z-index: 9999; background: #fff; border: 1px solid var(--border); border-radius: 10px;
  box-shadow: 0 10px 34px rgba(0,0,0,.18); width: 268px; overflow: hidden; padding-top: 4px;
}
.group-settings-pop .gs-title { font-size: 13px; font-weight: 600; color: #1f2329; padding: 10px 16px 6px; }
.group-settings-pop .gs-rows { border-top: 1px solid #f0f0f0; }
.group-settings-pop .gs-bottom { border-top: 8px solid #f2f3f5; padding: 4px 0; }

/* 引用条 + 跳转高亮 */
.quote-ref {
  font-size: 12px; color: #6b7178; background: #f2f3f5; border-left: 3px solid #1485ee;
  border-radius: 4px; padding: 4px 8px; margin-bottom: 4px; max-width: 100%;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap; cursor: pointer;
}
.quote-ref:hover { background: #e8eef6; }
.msg-row.own .quote-ref { align-self: flex-end; }
.msg-highlight .bubble { animation: msgFlash 1.6s ease; }
@keyframes msgFlash { 0%, 40% { background: #ffe9a8; } 100% {} }
.title-editable { cursor: pointer; }
.title-editable:hover { color: #1485ee; }

/* ===== 待发附件预览区（图片+文本一起发） ===== */
.pending-bar { display: flex; flex-wrap: wrap; gap: 10px; padding: 8px; margin: 0 8px 6px; background: #f7f8fa; border-radius: 6px; }
.pend-item { position: relative; }
.pend-item img { width: 56px; height: 56px; object-fit: cover; border-radius: 6px; border: 1px solid var(--border); display: block; }
.pend-file { display: inline-block; max-width: 160px; padding: 8px 10px; background: #fff; border: 1px solid var(--border); border-radius: 6px; font-size: 12px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pend-x { position: absolute; top: -6px; right: -6px; width: 18px; height: 18px; border-radius: 50%; border: none; background: rgba(0,0,0,.6); color: #fff; font-size: 11px; line-height: 18px; text-align: center; cursor: pointer; padding: 0; }
/* 图片头像 */
.avatar.img { padding: 0; overflow: hidden; }
.avatar.img img { width: 100%; height: 100%; object-fit: cover; }

/* ===== APK / 移动端 WebView：修复列表与聊天消息不能上下滑动 =====
   旧版 Android WebView 对 overflow:auto 需开启触摸惯性滚动，否则手指拖动不滚动 */
.scroll-list, .msg-list, .work-area, .settings-main, .detail-pane,
.member-sidebar, .hist-list, .fwd-list, .article-view, .result-box,
.member-pick, .modal, .panel-list, .mention-pop, .send-mode-pop {
  -webkit-overflow-scrolling: touch;
  overscroll-behavior: contain;
}
.scroll-list, .msg-list, .work-area, .settings-main, .detail-pane, .member-sidebar {
  touch-action: pan-y;
}

/* B34：截图下拉箭头 + 录屏浮条 */
.shot-caret { font-size: 12px; opacity: .7; padding: 0 2px; }
.shot-caret:hover { opacity: 1; }
.rec-bar {
  position: fixed; left: 50%; top: 16px; transform: translateX(-50%);
  display: flex; align-items: center; gap: 10px; z-index: 9999;
  background: rgba(20,22,26,.92); color: #fff; padding: 8px 14px; border-radius: 22px;
  box-shadow: 0 6px 24px rgba(0,0,0,.3); font-size: 13px;
}
.rec-bar .rec-dot { width: 10px; height: 10px; border-radius: 50%; background: #fa5151; animation: recBlink 1s steps(2,start) infinite; }
@keyframes recBlink { 50% { opacity: .25; } }
.rec-bar .rec-stop { background: #fa5151; color: #fff; border-radius: 14px; padding: 5px 12px; font-size: 12px; }
.rec-bar .rec-stop:hover { background: #e34545; }

/* Art slicing embedded toolkit */
.module-panel.art-panel {
  display: flex;
  flex-direction: column;
  max-width: none;
  height: calc(100dvh - 24px);
  min-height: 0;
  padding: 12px;
  overflow: hidden;
  box-sizing: border-box;
}
.art-panel .panel-head {
  flex-shrink: 0;
  margin-bottom: 10px;
}
.art-frame-wrap {
  flex: 1;
  min-height: 0;
  overflow: hidden;
  border: 1px solid var(--border, #e9eaec);
  border-radius: 10px;
  background: #0f172a;
}
.art-frame {
  display: block;
  width: 100%;
  height: 100%;
  border: 0;
  background: #0f172a;
}

/* ===== 视频分析模块（v1.0.70 起：星云原生 UI） ===== */
/* 注意：va-panel 复用了 module-panel 类，这里覆盖其 max-width/padding，避免 height:100%+padding 撑破容器导致内部 tab 无法滚动 */
.va-panel { display: flex; flex-direction: column; height: 100%; overflow: hidden; max-width: none; padding: 0; box-sizing: border-box; }
.va-panel .panel-head { padding: 12px 16px; margin-bottom: 0; border-bottom: 1px solid var(--border, #e9eaec); }
.va-layout {
  display: grid; grid-template-columns: 300px 1fr; grid-template-rows: minmax(0, 1fr); gap: 14px;
  flex: 1; min-height: 0; padding: 14px;
}
@media (max-width: 760px) { .va-layout { grid-template-columns: 1fr; grid-template-rows: auto minmax(0, 1fr); } }

.va-side {
  background: var(--card-bg, #fff); border: 1px solid var(--border, #e9eaec);
  border-radius: 12px; display: flex; flex-direction: column; min-height: 0; overflow: hidden;
  box-shadow: 0 1px 2px rgba(0,0,0,.04);
}
.va-side-head { display: flex; align-items: center; justify-content: space-between; padding: 12px 14px; border-bottom: 1px solid var(--border); background: #fafbfc; }
.va-task-list { flex: 1; overflow-y: auto; padding: 6px; }
.va-empty { color: var(--text-sub, #8a9099); font-size: 12px; padding: 16px; text-align: center; }
.va-task {
  padding: 10px 12px; border-radius: 6px; cursor: pointer; margin-bottom: 4px;
  border: 1px solid transparent; transition: background .15s;
}
.va-task:hover { background: var(--hover, #f3f6fb); }
.va-task.active { background: var(--blue-soft, #eaf3fe); border-color: var(--blue, #1485ee); box-shadow: inset 3px 0 0 var(--blue, #1485ee); }
.va-task-title { font-size: 13px; font-weight: 500; line-height: 1.4; word-break: break-all; }
.va-task-meta { display: flex; gap: 8px; margin-top: 4px; align-items: center; font-size: 11px; }
.va-task-status { padding: 1px 6px; border-radius: 8px; background: #f0f2f5; }
.va-st-running { background: #eaf3fe; color: #1485ee; }
.va-st-complete { background: #e7f7ed; color: #1aad19; }
.va-st-partial { background: #fff7e3; color: #fa9d3b; }
.va-st-failed { background: #fdecec; color: #e0392b; }
.va-st-interrupted { background: #f3f3f3; color: #8a9099; }
.va-st-queued { background: #f0f4ff; color: #5b6fef; }
.va-task-pos { margin-top: 2px; font-size: 11px; color: var(--text-sub); }

.va-main { display: flex; flex-direction: column; gap: 14px; min-height: 0; }
.va-input { display: flex; flex-direction: column; gap: 12px; border-radius: 12px; box-shadow: 0 1px 2px rgba(0,0,0,.04); }
.va-upload {
  border: 1.5px dashed var(--border, #cfd3d8); border-radius: 12px;
  padding: 26px; text-align: center; cursor: pointer; transition: all .15s;
  background: #fcfdfe;
}
.va-upload:hover { border-color: var(--blue, #1485ee); background: #f3f8ff; }
.va-upload.dragging { border-color: var(--blue, #1485ee); background: #eaf3fe; }
.va-upload strong { display: block; font-size: 14px; margin-bottom: 4px; }
.va-status {
  font-size: 12px; color: var(--text-sub, #8a9099); padding: 6px 10px;
  background: var(--hover, #f5f6f8); border-radius: 6px;
}
.va-status[data-kind="error"] { color: #e0392b; background: #fdecec; }
.va-status[data-kind="success"] { color: #1aad19; background: #e7f7ed; }

.va-result {
  flex: 1; overflow: hidden; display: flex; flex-direction: column;
  background: #fff; border: 1px solid var(--border, #e9eaec); border-radius: 12px; box-shadow: 0 1px 2px rgba(0,0,0,.04);
}
.va-result .tabs {
  display: flex; gap: 4px; padding: 6px 12px 0; border-bottom: 1px solid var(--border); background: #fafbfc; border-radius: 12px 12px 0 0;
}
.va-result .tab {
  padding: 10px 16px; border: none; background: transparent; color: #5a6068;
  border-bottom: 2px solid transparent; cursor: pointer; font-size: 13px; transition: color .12s;
}
.va-result .tab:hover { color: var(--blue, #1485ee); }
.va-result .tab.active { color: var(--blue, #1485ee); border-bottom-color: var(--blue, #1485ee); font-weight: 600; }
.va-tab-body { flex: 1; overflow-y: auto; padding: 14px 16px; }

.va-meta-grid {
  display: grid; grid-template-columns: 1fr 1fr; gap: 0; margin-bottom: 18px;
  border: 1px solid var(--border, #eef0f2); border-radius: 10px; overflow: hidden; background: #fafbfc;
}
.va-meta-row { display: flex; align-items: baseline; gap: 10px; font-size: 13px; line-height: 1.6; padding: 9px 14px; border-bottom: 1px solid #f0f1f3; }
.va-meta-row:nth-last-child(-n+2) { border-bottom: none; }
.va-meta-row span { color: var(--text-sub); min-width: 64px; flex-shrink: 0; }
.va-meta-row strong { word-break: break-all; color: #2a2f36; font-weight: 600; }
@media (max-width: 640px) { .va-meta-grid { grid-template-columns: 1fr; } }

.va-block { margin-bottom: 18px; }
.va-block h4 { margin: 0 0 10px; font-size: 14px; color: #2a2f36; font-weight: 600; padding-left: 9px; border-left: 3px solid var(--blue, #1485ee); }
.va-block p { margin: 0; line-height: 1.85; font-size: 14px; color: #3a4047; background: #fafbfc; border: 1px solid #f0f1f3; border-radius: 10px; padding: 12px 14px; }
.va-block ul { margin: 0; padding: 0; list-style: none; }
.va-block li { position: relative; padding: 6px 0 6px 20px; line-height: 1.7; font-size: 14px; color: #3a4047; border-bottom: 1px dashed #f0f1f3; }
.va-block li:last-child { border-bottom: none; }
.va-block li::before { content: ''; position: absolute; left: 4px; top: 14px; width: 6px; height: 6px; border-radius: 50%; background: var(--blue, #1485ee); }

.va-error {
  background: linear-gradient(90deg, #fff6ec, #fffaf4); color: #a85e10; padding: 11px 14px;
  border: 1px solid #fad6a8; border-radius: 10px; font-size: 13px; margin-bottom: 16px; line-height: 1.6;
}

.va-frame-grid {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 10px;
}
.va-frame {
  position: relative; border-radius: 6px; overflow: hidden;
  background: #000; aspect-ratio: 16 / 9;
}
.va-frame img { width: 100%; height: 100%; object-fit: cover; }
.va-frame-ts {
  position: absolute; left: 8px; bottom: 6px;
  background: rgba(0,0,0,.6); color: #fff;
  padding: 1px 8px; border-radius: 10px; font-size: 11px;
}

.va-transcript { font-size: 13px; line-height: 1.7; }
.va-trans-row { display: flex; gap: 10px; padding: 6px 0; border-bottom: 1px solid var(--border-soft, #f0f0f0); }
.va-trans-row:last-child { border-bottom: none; }
.va-trans-ts {
  flex-shrink: 0; font-family: monospace; font-size: 11px;
  color: var(--text-sub); min-width: 130px;
}
.va-trans-text { flex: 1; }

.va-keywords { display: flex; flex-wrap: wrap; gap: 6px; }
.va-tag {
  background: var(--blue-soft, #eaf3fe); color: var(--blue, #1485ee);
  padding: 3px 10px; border-radius: 10px; font-size: 12px;
}
.va-chapters { display: flex; flex-direction: column; gap: 6px; }

.va-report {
  background: #f8f9fa; border: 1px solid var(--border);
  padding: 12px; border-radius: 6px;
  font-size: 13px; line-height: 1.8; white-space: pre-wrap; word-break: break-all;
  max-height: 400px; overflow-y: auto; font-family: inherit;
}

.va-dim {
  background: #f8f9fa; border-left: 3px solid var(--blue, #1485ee);
  padding: 10px 14px; margin-bottom: 8px; border-radius: 4px;
}
.va-dim strong { display: block; margin-bottom: 6px; font-size: 13px; color: var(--blue, #1485ee); }
.va-dim ul { margin: 0; padding-left: 20px; font-size: 13px; line-height: 1.7; }

.va-actions { margin-top: 16px; display: flex; gap: 10px; }

/* ===== 游戏榜单（平台内置·原生富 UI，自适应桌面/手机/竖屏） ===== */
.gr-wrap { display: flex; flex-direction: column; height: 100%; background: #f5f6f8; min-height: 0; position: relative; }
.gr-head { display: flex; align-items: center; gap: 8px; padding: 12px 18px; background: #fff; border-bottom: 1px solid var(--border); flex-shrink: 0; flex-wrap: wrap; }
.gr-title { font-size: 18px; margin: 0; }
.gr-updated { font-size: 12px; color: var(--text-sub); }
.gr-plats { display: flex; gap: 8px; padding: 10px 18px; background: #fff; border-bottom: 1px solid var(--border); flex-wrap: wrap; flex-shrink: 0; }
.gr-ptab { border: 1px solid var(--border); background: #fff; color: var(--text-sub); padding: 6px 16px; border-radius: 20px; font-size: 13px; cursor: pointer; transition: .15s; }
.gr-ptab:hover { border-color: #b9c0c9; }
.gr-ptab.on { background: #0071e3; border-color: #0071e3; color: #fff; font-weight: 600; }
.gr-body { flex: 1; overflow-y: auto; padding: 16px 18px 28px; min-height: 0; -webkit-overflow-scrolling: touch; }
.gr-empty { text-align: center; color: var(--text-sub); padding: 40px 16px; line-height: 1.9; }
/* 概览卡片 */
.gr-stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(132px, 1fr)); gap: 12px; margin-bottom: 18px; }
.gr-stat { position: relative; background: #fff; border: 1px solid var(--border); border-radius: 14px; padding: 14px 16px; box-shadow: 0 1px 2px rgba(0,0,0,.03); }
.gr-stat-ic { position: absolute; right: 12px; top: 11px; font-size: 18px; opacity: .5; }
.gr-stat-v { font-size: 26px; font-weight: 700; font-variant-numeric: tabular-nums; line-height: 1.1; }
.gr-stat-l { font-size: 12px; color: var(--text-sub); margin-top: 4px; }
.gr-stat-high .gr-stat-v { color: #e0392b; }
.gr-stat-med .gr-stat-v { color: #f08300; }
/* 区块 */
.gr-sec { background: #fff; border: 1px solid var(--border); border-radius: 14px; margin-bottom: 16px; overflow: hidden; box-shadow: 0 1px 2px rgba(0,0,0,.03); }
.gr-sec-h { padding: 13px 16px; font-size: 15px; font-weight: 600; border-bottom: 1px solid #f0f1f3; display: flex; align-items: baseline; gap: 8px; flex-wrap: wrap; }
.gr-sec-sub { font-size: 12px; font-weight: 400; color: var(--text-sub); }
/* 爆款卡片网格 */
.gr-hgrid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 10px; padding: 14px 16px; }
.gr-hcard { display: flex; align-items: center; gap: 11px; background: #fafbfc; border: 1px solid #eef0f2; border-radius: 12px; padding: 9px 12px; }
.gr-hidx { width: 22px; text-align: center; font-weight: 700; color: #b0b6bd; font-size: 13px; flex-shrink: 0; }
.gr-score { flex-shrink: 0; font-weight: 700; font-size: 17px; color: #e0392b; font-variant-numeric: tabular-nums; }
/* 列表行 */
.gr-filters { display: flex; gap: 12px; align-items: center; justify-content: space-between; padding: 12px 16px; flex-wrap: wrap; border-bottom: 1px solid #f0f1f3; }
.gr-rtabs, .gr-ctabs { display: flex; gap: 6px; flex-wrap: wrap; }
.gr-rtab, .gr-ctab { border: 1px solid var(--border); background: #fff; color: var(--text-sub); padding: 5px 13px; border-radius: 8px; font-size: 13px; cursor: pointer; transition: .15s; }
.gr-rtab.on { background: #eef5ff; border-color: #0071e3; color: #0071e3; font-weight: 600; }
.gr-ctab.on { background: #0071e3; border-color: #0071e3; color: #fff; font-weight: 600; }
.gr-list { padding: 6px 8px 10px; }
.gr-row, .gr-rrow { display: flex; align-items: center; gap: 12px; padding: 9px 8px; border-bottom: 1px solid #f4f5f7; }
.gr-row:last-child, .gr-rrow:last-child { border-bottom: none; }
.gr-rk { width: 30px; text-align: center; font-weight: 700; font-size: 15px; flex-shrink: 0; color: #6b7178; font-variant-numeric: tabular-nums; }
.gr-rank-top { color: #fff; border-radius: 8px; line-height: 26px; height: 26px; }
.gr-rank-1 { background: #f5b50a; } .gr-rank-2 { background: #b9c0c9; } .gr-rank-3 { background: #cd8b5b; }
.gr-ico { width: 44px; height: 44px; border-radius: 10px; flex-shrink: 0; background: #eef0f2; overflow: hidden; }
.gr-ico img { width: 100%; height: 100%; object-fit: cover; display: block; }
.gr-main { flex: 1; min-width: 0; }
.gr-nm { font-size: 14px; font-weight: 500; display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.gr-sub { font-size: 12px; color: var(--text-sub); margin-top: 2px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.gr-chip { display: inline-block; font-size: 11px; color: #5a6068; background: #eef0f2; border-radius: 5px; padding: 1px 7px; }
.gr-hit { font-size: 11px; font-weight: 600; border-radius: 5px; padding: 1px 7px; }
.gr-hit-high { color: #e0392b; background: #fdecea; }
.gr-hit-med { color: #f08300; background: #fff3e0; }
.gr-chg { font-size: 11px; font-weight: 700; border-radius: 5px; padding: 1px 6px; font-variant-numeric: tabular-nums; }
.gr-up { color: #1a8a4f; background: #e7f6ed; }
.gr-down { color: #b9c0c9; background: #f2f3f5; }
.gr-flat { color: #b0b6bd; }
.gr-new { color: #0071e3; background: #e8f1fe; }
/* 生成日志浮层 */
.gr-logbox { position: absolute; left: 0; right: 0; bottom: 0; height: 44%; background: #0b0e14; flex-direction: column; box-shadow: 0 -6px 22px rgba(0,0,0,.3); z-index: 5; }
.gr-loghd { display: flex; align-items: center; gap: 8px; padding: 8px 12px; background: #141a24; flex-shrink: 0; color: #cdd6e4; font-size: 13px; font-weight: 600; }
.gr-logbody { flex: 1; margin: 0; padding: 10px 14px; overflow: auto; font-size: 12px; line-height: 1.65; color: #cdd6e4; font-family: Menlo, Consolas, monospace; white-space: pre-wrap; word-break: break-word; }
@media (max-width: 768px), (pointer: coarse) and (max-height: 500px) {
  .gr-head { padding: 10px 12px; }
  .gr-title { font-size: 16px; }
  .gr-plats { padding: 8px 12px; }
  .gr-ptab { padding: 5px 13px; font-size: 12px; }
  .gr-body { padding: 12px 12px 24px; }
  .gr-stats { grid-template-columns: repeat(auto-fit, minmax(104px, 1fr)); gap: 9px; }
  .gr-stat { padding: 11px 12px; }
  .gr-stat-v { font-size: 22px; }
  .gr-hgrid { grid-template-columns: 1fr; padding: 10px 12px; }
  .gr-ico { width: 40px; height: 40px; }
  .gr-filters { padding: 10px 12px; gap: 8px; }
}

.va-tools-table { width: 100%; border-collapse: collapse; font-size: 13px; margin-top: 10px; }
.va-tools-table th, .va-tools-table td { padding: 8px 10px; text-align: left; border-bottom: 1px solid var(--border); }
.va-tools-table th { background: #f8f9fa; font-weight: 600; }

/* 平台搜索（Phase 3） */
.va-search-row { display: flex; gap: 8px; align-items: center; }
.va-search-row select { padding: 6px 8px; border: 1px solid var(--border); border-radius: 6px; font-size: 13px; }
.va-search-results { display: flex; flex-direction: column; gap: 6px; max-height: 220px; overflow-y: auto; }
.va-search-item {
  padding: 8px 12px; border: 1px solid var(--border); border-radius: 6px;
  cursor: pointer; transition: background .15s;
}
.va-search-item:hover { background: var(--hover, #f3f6fb); border-color: var(--blue, #1485ee); }
.va-search-title { font-size: 13px; font-weight: 500; line-height: 1.4; }
.va-search-meta { font-size: 11px; color: var(--text-sub); margin-top: 3px; display: flex; gap: 6px; }

/* Mobile module adaptation */
@media (max-width: 768px), (pointer: coarse) and (max-height: 500px) {
  .work-area { padding-bottom: calc(var(--navh, 56px) + 10px); }
  .module-panel { max-width: none; padding: 10px; }
  .module-panel .panel-head {
    position: sticky;
    top: 0;
    z-index: 20;
    margin: -10px -10px 10px;
    padding: 10px;
    background: #f2f3f7;
    flex-wrap: wrap;
  }
  .module-panel .panel-head h2 { min-width: 0; font-size: 16px; line-height: 1.35; }
  .module-panel .panel-head .btn-primary,
  .module-panel .panel-head .btn-secondary { min-height: 36px; padding: 8px 10px; }
  .module-panel .card { padding: 12px; border-radius: 10px; margin-bottom: 10px; }
  .module-panel .form-row { flex-direction: column; align-items: stretch; gap: 8px; }
  .module-panel .form-row .grow,
  .module-panel .form-row input,
  .module-panel .form-row select,
  .module-panel .form-row textarea { width: 100%; min-width: 0; box-sizing: border-box; }
  .module-panel .tabs { overflow-x: auto; flex-wrap: nowrap; padding-bottom: 4px; -webkit-overflow-scrolling: touch; scrollbar-width: none; }
  .module-panel .tabs .tab { flex: 0 0 auto; min-height: 36px; display: inline-flex; align-items: center; }
  .module-panel .table-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }
}

@media (max-width: 768px) {
  .module-panel.art-panel {
    height: calc(100dvh - var(--navh, 56px));
    min-height: 0;
    padding: 0;
    border-radius: 0;
    background: #0f172a;
  }
  .art-panel .panel-head {
    margin: 0;
    padding: 10px;
    border-bottom: 1px solid var(--border, #e9eaec);
    background: #f2f3f7;
  }
  .art-panel .panel-head .btn-secondary {
    display: none;
  }
  .art-frame-wrap {
    border: 0;
    border-radius: 0;
  }
}

@media (max-width: 768px), (pointer: coarse) and (max-height: 500px) {
  .va-panel {
    height: auto;
    min-height: calc(100dvh - var(--navh, 56px));
    overflow: visible;
  }
  .va-panel .panel-head { align-items: flex-start; }
  .va-layout {
    display: flex;
    flex-direction: column;
    min-height: 0;
    padding: 10px;
    gap: 10px;
  }
  .va-side {
    width: 100%;
    max-height: 210px;
    min-height: 0;
  }
  .va-task-list { max-height: 150px; }
  .va-main { min-height: 0; overflow: visible; }
  .va-upload { padding: 14px; }
  .va-result { min-height: 0; overflow: visible; }
  .va-result .tabs {
    overflow-x: auto;
    flex-wrap: nowrap;
    white-space: nowrap;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
  }
  .va-result .tab { flex: 0 0 auto; }
  .va-actions { display: flex; flex-wrap: wrap; gap: 8px; }
  .va-actions button { flex: 1 1 120px; min-height: 36px; }
  .va-trans-row { display: block; }
  .va-trans-ts { min-width: 0; margin-bottom: 4px; }
  .va-frame-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .va-search-row { flex-direction: column; align-items: stretch; }
  .va-search-row select,
  .va-search-row input,
  .va-search-row button { width: 100%; min-height: 36px; }
  .va-search-meta { flex-wrap: wrap; white-space: normal; }
  .va-tools-table { display: block; overflow-x: auto; min-width: 620px; }
}

@media (max-width: 768px), (pointer: coarse) and (max-height: 500px) {
  #task-tabs { overflow-x: auto; flex-wrap: nowrap; padding-bottom: 4px; -webkit-overflow-scrolling: touch; scrollbar-width: none; }
  .bug-module-panel,
  .task-module-panel { height: 100%; min-height: 0; overflow: hidden; display: flex; flex-direction: column; }
  .bug-module-panel .panel-head,
  .task-module-panel .panel-head { flex: 0 0 auto; }
  .task-module-scroll { flex: 1; min-height: 0; overflow-y: auto; overscroll-behavior: contain; -webkit-overflow-scrolling: touch; padding-bottom: 12px; }
  #task-tabs .tab { flex: 0 0 auto; min-height: 36px; }
  .task-analysis-card > div:first-child { align-items: flex-start !important; flex-wrap: wrap; }
  .task-analysis-card h3 { width: 100%; font-size: 15px; line-height: 1.35; }
  .task-analysis-card #ta-run { margin-left: 0 !important; }
  .task-create-card h3 { margin-top: 0; font-size: 16px; }
  .task-create-card .form-row,
  .task-create-card #t-filedrop { flex-direction: column !important; align-items: stretch !important; gap: 8px !important; }
  .task-create-card input,
  .task-create-card select,
  .task-create-card textarea,
  .task-create-card button { width: 100%; min-width: 0; box-sizing: border-box; }
  .task-create-card textarea { min-height: 78px; }
  .task-list-card { padding: 0 !important; background: transparent; box-shadow: none; border: none; }
  .task-table-wrap { overflow: visible !important; }
  .task-table,
  .task-table tbody,
  .task-table tr,
  .task-table td { display: block; width: 100%; box-sizing: border-box; }
  .task-table tr:first-child { display: none; }
  .task-table tr {
    background: #fff;
    border: 1px solid var(--border);
    border-radius: 12px;
    padding: 10px 12px;
    margin: 10px 0;
    box-shadow: 0 1px 2px rgba(0,0,0,.03);
  }
  .task-table td { border: none !important; padding: 4px 0; color: #38404a; }
  .task-table td:nth-child(1) { display: inline-flex; width: auto; margin-right: 8px; }
  .task-table td:nth-child(2) { font-size: 15px; font-weight: 600; line-height: 1.45; padding: 6px 0 8px; }
  .task-table td:nth-child(3)::before { content: '负责人：'; color: var(--text-sub); }
  .task-table td:nth-child(4)::before { content: '优先级：'; color: var(--text-sub); }
  .task-table td:nth-child(5)::before { content: '状态：'; color: var(--text-sub); }
  .task-table td:nth-child(6)::before { content: '截止：'; color: var(--text-sub); }
  .task-table td:last-child { display: flex; justify-content: flex-end; padding-top: 8px; }
  .task-table td:last-child .btn-mini { width: 92px; min-height: 40px; padding: 7px 12px; }
  .task-table .task-status-select { width: 100%; min-height: 40px; padding: 7px 32px 7px 10px; border: 1px solid #d9e1ea; border-radius: 8px; background-color: #fff; color: #38404a; }
  .task-table .action-danger { border: 1px solid #f5d1d5; border-radius: 8px; background: #fff0f1; color: #c93443; font-weight: 600; box-shadow: 0 2px 7px rgba(201,52,67,.08); }
  .task-table .action-danger:active { transform: translateY(1px); box-shadow: none; }
  .task-risk-table { min-width: 680px; }
  .task-detail-card { padding: 14px !important; }
  .task-detail-back { display: inline-flex; align-items: center; min-height: 36px; margin-bottom: 8px; }
  .task-detail-title { font-size: 18px; line-height: 1.4; word-break: break-word; }
  .task-detail-meta { display: block; word-break: break-word; }
  .task-detail-steps { white-space: pre-wrap; word-break: break-word; }
  .task-detail-imgs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
  .task-detail-imgs img { width: 100%; height: auto; border-radius: 8px; object-fit: cover; }
  .task-detail-files a { display: block; word-break: break-all; }
}

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}