/* ========== 工作汇报与专项跟踪系统 · 蓝色商务风（移动端优先） ========== */
@import url("https://fonts.googleapis.cn/css2?family=Noto+Sans+SC:wght@400;500;700&display=swap");

:root {
  --navy: #102A56;
  --blue: #2563EB;
  --primary: #2563EB;
  --main: #2563EB;
  --blue-press: #1D4ED8;
  --blue-bg: #EFF4FF;
  --page-bg: #F2F5FA;
  --card: #FFFFFF;
  --text: #1E293B;
  --text-sub: #64748B;
  --line: #E5EAF2;
  --red: #DC2626;
  --red-bg: #FEF2F2;
  --green: #16A34A;
  --green-bg: #F0FDF4;
  --amber: #D97706;
  --amber-bg: #FFFBEB;
  --radius-card: 12px;
  --radius-btn: 10px;
  --shadow: 0 2px 10px rgba(16, 42, 86, .06);
  --tab-h: 58px;
}

* { box-sizing: border-box; -webkit-tap-highlight-color: transparent; }
html, body { margin: 0; padding: 0; }
body {
  font-family: "Noto Sans SC", -apple-system, "PingFang SC", "Microsoft YaHei", sans-serif;
  background: var(--page-bg);
  color: var(--text);
  font-size: 15px;
  line-height: 1.55;
  font-variant-numeric: tabular-nums;
}
button { font-family: inherit; cursor: pointer; border: none; }
input, textarea, select { font-family: inherit; font-size: 15px; }
a { color: var(--blue); text-decoration: none; }
img { max-width: 100%; }

#app { max-width: 560px; margin: 0 auto; min-height: 100vh; position: relative; background: var(--page-bg); }

/* ---------- 登录页 ---------- */
.login-page {
  min-height: 100vh; display: flex; flex-direction: column;
  background: linear-gradient(180deg, var(--navy) 0%, #173A73 38%, var(--page-bg) 38%);
  padding: 56px 24px 32px;
}
.login-logo {
  width: 64px; height: 64px; border-radius: 16px; background: #fff; color: var(--navy);
  display: flex; align-items: center; justify-content: center; font-size: 30px; font-weight: 700;
  margin: 0 auto 14px; box-shadow: var(--shadow);
}
.login-title { color: #fff; text-align: center; font-size: 20px; font-weight: 700; letter-spacing: 1px; }
.login-sub { color: rgba(255,255,255,.72); text-align: center; font-size: 13px; margin-top: 6px; }
.login-card {
  background: var(--card); border-radius: var(--radius-card); box-shadow: var(--shadow);
  padding: 26px 20px 22px; margin-top: 34px;
}
.login-hint {
  background: var(--blue-bg); color: var(--blue); font-size: 12.5px; border-radius: 8px;
  padding: 8px 12px; margin-bottom: 18px;
}
.field { margin-bottom: 14px; }
.field label { display: block; font-size: 13px; color: var(--text-sub); margin-bottom: 6px; font-weight: 500; }
.field input, .field textarea, .field select {
  width: 100%; border: 1px solid var(--line); border-radius: var(--radius-btn);
  padding: 11px 12px; background: #fff; color: var(--text); outline: none;
  transition: border-color .15s ease-out;
}
.field input:focus, .field textarea:focus, .field select:focus { border-color: var(--blue); }
.field textarea { resize: vertical; min-height: 84px; }
.remember-row { display: flex; align-items: center; gap: 7px; font-size: 13px; color: var(--text-sub); margin: 4px 0 16px; }
.remember-row input { width: 16px; height: 16px; accent-color: var(--blue); }

/* ---------- 按钮 ---------- */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 6px;
  border-radius: var(--radius-btn); padding: 11px 18px; font-size: 15px; font-weight: 500;
  background: var(--blue); color: #fff; transition: transform .12s ease-out, opacity .12s, background .15s;
  width: 100%;
}
.btn:active { transform: scale(.97); background: var(--blue-press); }
.btn:disabled { opacity: .55; cursor: not-allowed; }
.btn-ghost { background: #fff; color: var(--blue); border: 1px solid var(--blue); }
.btn-ghost:active { background: var(--blue-bg); }
.btn-sub { background: var(--navy); }
.btn-danger { background: var(--red); }
.btn-danger:active { background: #B91C1C; }
.btn-sm { padding: 7px 14px; font-size: 13px; width: auto; border-radius: 8px; }
.btn-block { width: 100%; }

/* ---------- 主框架 ---------- */
.page { padding-bottom: calc(var(--tab-h) + env(safe-area-inset-bottom, 0px) + 20px); min-height: 100vh; }
.page.no-tab { padding-bottom: calc(24px + env(safe-area-inset-bottom, 0px)); }
.topbar {
  position: sticky; top: 0; z-index: 20; background: var(--navy); color: #fff;
  padding: 14px 16px; display: flex; align-items: center; gap: 10px;
}
.topbar .back {
  width: 30px; height: 30px; border-radius: 8px; background: rgba(255,255,255,.12);
  color: #fff; font-size: 17px; display: flex; align-items: center; justify-content: center; flex: none;
}
.topbar h1 { font-size: 17px; margin: 0; font-weight: 700; flex: 1; }
.topbar .act { font-size: 13px; color: #fff; background: rgba(255,255,255,.14); padding: 6px 12px; border-radius: 999px; }
.content { padding: 14px 14px 0; }

/* ---------- 红色提醒横幅 ---------- */
.alert-banner {
  background: var(--red); color: #fff; border-radius: var(--radius-card);
  padding: 13px 15px; margin-bottom: 12px; box-shadow: 0 4px 14px rgba(220,38,38,.28);
  display: flex; gap: 11px; align-items: flex-start;
  animation: banner-in .25s ease-out, banner-breathe 2.4s ease-in-out .3s infinite;
}
@keyframes banner-in { from { opacity: 0; transform: translateY(-8px); } to { opacity: 1; transform: none; } }
@keyframes banner-breathe { 0%,100% { box-shadow: 0 4px 14px rgba(220,38,38,.28); } 50% { box-shadow: 0 4px 22px rgba(220,38,38,.5); } }
.alert-banner .ab-icon { font-size: 19px; line-height: 1.3; flex: none; }
.alert-banner .ab-title { font-weight: 700; font-size: 14.5px; }
.alert-banner .ab-desc { font-size: 12.5px; opacity: .92; margin-top: 2px; }
.alert-banner .ab-go {
  margin-left: auto; flex: none; align-self: center; background: rgba(255,255,255,.2);
  border-radius: 999px; padding: 6px 12px; font-size: 12.5px; color: #fff;
}

/* ---------- 卡片 ---------- */
.card {
  background: var(--card); border-radius: var(--radius-card); box-shadow: var(--shadow);
  padding: 15px; margin-bottom: 12px;
}
.card-title { font-size: 15px; font-weight: 700; margin: 0 0 10px; display: flex; align-items: center; gap: 7px; }
.card-title .more { margin-left: auto; font-size: 12.5px; color: var(--text-sub); font-weight: 400; }
.card-title .bar { width: 4px; height: 15px; border-radius: 2px; background: var(--blue); flex: none; }

/* ---------- 徽章 ---------- */
.badge {
  display: inline-block; padding: 2px 9px; border-radius: 999px; font-size: 12px; font-weight: 500;
  white-space: nowrap;
}
.badge-normal { background: var(--green-bg); color: var(--green); }
.badge-late { background: var(--amber-bg); color: var(--amber); }
.badge-makeup { background: var(--blue-bg); color: var(--blue); }
.badge-missing { background: var(--red-bg); color: var(--red); }
.badge-pending { background: #F1F5F9; color: var(--text-sub); }
.badge-gray { background: #F1F5F9; color: var(--text-sub); }
.badge-role { background: var(--navy); color: #fff; }
.badge-role-supervisor { background: var(--blue); color: #fff; }

/* ---------- 今日待办 ---------- */
.todo-item {
  display: flex; align-items: center; gap: 12px; padding: 12px 0; border-top: 1px solid var(--line);
}
.todo-item:first-of-type { border-top: none; padding-top: 2px; }
.todo-item .ti-icon {
  width: 38px; height: 38px; border-radius: 10px; background: var(--blue-bg); color: var(--blue);
  display: flex; align-items: center; justify-content: center; font-size: 18px; flex: none;
}
.todo-item.done .ti-icon { background: var(--green-bg); color: var(--green); }
.todo-item .ti-main { flex: 1; min-width: 0; }
.todo-item .ti-name { font-weight: 600; font-size: 14.5px; }
.todo-item .ti-desc { font-size: 12.5px; color: var(--text-sub); margin-top: 1px; }
.todo-item .btn { width: auto; padding: 7px 16px; font-size: 13px; }

/* ---------- 列表行 ---------- */
.list-row {
  display: flex; align-items: center; gap: 10px; padding: 12px 0; border-top: 1px solid var(--line);
}
.list-row:first-child { border-top: none; }
.list-row .lr-main { flex: 1; min-width: 0; }
.list-row .lr-title { font-weight: 600; font-size: 14px; }
.list-row .lr-sub { font-size: 12.5px; color: var(--text-sub); margin-top: 2px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.avatar {
  width: 40px; height: 40px; border-radius: 12px; background: var(--navy); color: #fff;
  display: flex; align-items: center; justify-content: center; font-size: 16px; font-weight: 700; flex: none;
}
.avatar.light { background: var(--blue-bg); color: var(--blue); }

/* ---------- 底部 Tab ---------- */
.tabbar {
  position: fixed; bottom: 0; left: 50%; transform: translateX(-50%);
  width: 100%; max-width: 560px; min-height: var(--tab-h); background: #fff;
  border-top: 1px solid var(--line); display: flex; z-index: 30;
  padding-bottom: env(safe-area-inset-bottom, 0px);
  box-shadow: 0 -2px 12px rgba(16, 42, 86, .08);
}
.tabbar .tab {
  flex: 1; min-height: var(--tab-h); display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px;
  color: var(--text-sub); font-size: 11.5px; background: none; transition: color .15s; line-height: 1.2;
}
.tabbar .tab .tab-ic { font-size: 21px; line-height: 1.1; }
.tabbar .tab.active { color: var(--blue); font-weight: 600; }
.tabbar .tab .dot {
  position: absolute; top: 8px; min-width: 16px; height: 16px; padding: 0 4px; border-radius: 999px;
  background: var(--red); color: #fff; font-size: 10.5px; display: none; align-items: center; justify-content: center;
}
.tabbar .tab { position: relative; }
.tabbar .tab .dot.show { display: inline-flex; }

/* ---------- 汇报 ---------- */
.report-card .rc-head { display: flex; align-items: center; gap: 9px; margin-bottom: 8px; }
.report-card .rc-head .rc-name { font-weight: 700; font-size: 14.5px; }
.report-card .rc-head .rc-meta { font-size: 12px; color: var(--text-sub); margin-left: auto; text-align: right; }
.report-section { margin-bottom: 8px; }
.report-section .rs-title { font-size: 12.5px; color: var(--blue); font-weight: 600; margin-bottom: 3px; }
.report-section .rs-text { font-size: 14px; white-space: pre-wrap; word-break: break-word; }
.rc-gps {
  display: inline-flex; align-items: center; gap: 5px; font-size: 12px; color: var(--green);
  background: var(--green-bg); border-radius: 8px; padding: 4px 10px; margin-top: 6px;
}
.rc-gps-none { color: var(--sub, #64748B); background: #F1F5F9; }
.rc-imgs { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 9px; }
.rc-imgs img { width: 74px; height: 74px; object-fit: cover; border-radius: 9px; border: 1px solid var(--line); }

/* 点评 */
.comment { border-top: 1px solid var(--line); padding: 11px 0; }
.comment:first-child { border-top: none; }
.comment .cm-head { display: flex; align-items: center; gap: 7px; font-size: 13px; margin-bottom: 4px; }
.comment .cm-name { font-weight: 700; }
.comment .cm-vis { font-size: 11px; color: var(--text-sub); background: #F1F5F9; border-radius: 6px; padding: 1px 7px; }
.comment .cm-time { font-size: 11.5px; color: var(--text-sub); margin-left: auto; }
.comment .cm-text { font-size: 14px; white-space: pre-wrap; }
.comment-box { margin-top: 12px; border-top: 1px dashed var(--line); padding-top: 12px; }
.comment-box textarea { width: 100%; border: 1px solid var(--line); border-radius: 10px; padding: 10px; min-height: 72px; outline: none; }
.comment-box textarea:focus { border-color: var(--blue); }
.comment-box .cb-opt { display: flex; align-items: center; gap: 7px; font-size: 12.5px; color: var(--text-sub); margin: 8px 0; }
.comment-box .cb-opt input { accent-color: var(--blue); width: 15px; height: 15px; }

/* 关键词高亮 */
.kw { font-weight: 600; padding: 0 2px; border-radius: 3px; }

/* 图片上传 */
.uploader { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 8px; }
.uploader .up-item { position: relative; width: 74px; height: 74px; }
.uploader .up-item img { width: 74px; height: 74px; object-fit: cover; border-radius: 9px; border: 1px solid var(--line); }
.uploader .up-item .up-del {
  position: absolute; top: -7px; right: -7px; width: 20px; height: 20px; border-radius: 50%;
  background: var(--red); color: #fff; font-size: 12px; line-height: 20px; text-align: center;
}
.uploader .up-add {
  width: 74px; height: 74px; border: 1.5px dashed #B7C3D8; border-radius: 9px; background: #FAFBFE;
  color: var(--text-sub); font-size: 26px; display: flex; align-items: center; justify-content: center;
}
.gps-row {
  display: flex; align-items: center; gap: 8px; font-size: 13px; background: var(--green-bg);
  color: var(--green); border-radius: 10px; padding: 10px 12px; margin-top: 10px;
}
.gps-row.locating { background: var(--blue-bg); color: var(--blue); }
.gps-row.gps-fail { background: var(--amber-bg); color: var(--amber); }

/* ---------- 专项任务 ---------- */
.task-card .tc-tag { font-size: 11.5px; border-radius: 6px; padding: 2px 8px; }
.tag-open { background: var(--green-bg); color: var(--green); }
.tag-closed { background: #F1F5F9; color: var(--text-sub); }
.q-item { margin-bottom: 12px; }
.q-item .q-title { font-weight: 600; font-size: 14px; margin-bottom: 6px; }
.q-item .q-title .q-no { color: var(--blue); margin-right: 5px; }
.answer-item { background: #F8FAFD; border-radius: 10px; padding: 10px 12px; margin-bottom: 8px; }
.answer-item .ai-head { font-size: 12.5px; font-weight: 600; margin-bottom: 4px; display: flex; gap: 7px; align-items: center; }
.answer-item .ai-head .ai-date { color: var(--text-sub); font-weight: 400; margin-left: auto; }

/* ---------- 专项回复：展开/图片/追踪意见 ---------- */
.tr-record { background: #F8FAFD; border-radius: 10px; padding: 10px 12px; margin-bottom: 8px; }
.tr-rec-head { cursor: pointer; user-select: none; }
.tr-rec-body { margin-top: 4px; }
.tr-record:not(.is-open) .tr-rec-body { display: none; }
.tr-imgs { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.tr-imgs img { width: 64px; height: 64px; object-fit: cover; border-radius: 8px; border: 1px solid var(--line); cursor: zoom-in; background:#fff; }
.tr-notes { margin-top: 8px; display: flex; flex-direction: column; gap: 6px; }
.tr-note { background: #fff; border: 1px solid var(--line); border-left: 3px solid var(--primary); border-radius: 8px; padding: 7px 9px; }
.tr-note-head { display: flex; align-items: center; gap: 6px; font-size: 12px; color: var(--text-sub); }
.tr-note-head b { color: var(--text); }
.tr-note-head span:last-child { margin-left: auto; }
.tr-note-tag { font-size: 10.5px; padding: 1px 6px; border-radius: 6px; }
.tr-note-mgr { background: #E7F0FF; color: var(--primary); }
.tr-note-member { background: #E8F7EE; color: var(--green); }
.tr-note-body { margin-top: 3px; font-size: 13px; color: var(--text); white-space: pre-wrap; word-break: break-word; }
.tr-note-input { display: flex; gap: 6px; margin-top: 8px; }
.tr-note-input input { flex: 1; min-width: 0; border: 1px solid var(--line); border-radius: 8px; padding: 7px 10px; font-size: 13px; }
.tr-note-input button { border: none; background: var(--primary); color: #fff; border-radius: 8px; padding: 0 14px; font-size: 13px; }
.rp-uploader { display: flex; flex-wrap: wrap; gap: 8px; }
.rp-add-img { width: 64px; height: 64px; border: 1px dashed var(--text-sub); border-radius: 8px; background: #F8FAFD; font-size: 24px; color: var(--text-sub); }
.rp-thumb { position: relative; width: 64px; height: 64px; }
.rp-thumb img { width: 64px; height: 64px; object-fit: cover; border-radius: 8px; border: 1px solid var(--line); }
.rp-thumb .rp-x { position: absolute; top: -6px; right: -6px; width: 18px; height: 18px; line-height: 16px; text-align: center; background: rgba(0,0,0,.6); color: #fff; border-radius: 50%; font-size: 12px; cursor: pointer; }

/* ---------- 我的 / 菜单 ---------- */
.profile-card { display: flex; align-items: center; gap: 13px; }
.profile-card .avatar { width: 54px; height: 54px; font-size: 21px; border-radius: 14px; }
.profile-card .p-name { font-size: 18px; font-weight: 700; }
.profile-card .p-sub { font-size: 12.5px; color: var(--text-sub); margin-top: 2px; }
.menu-item {
  display: flex; align-items: center; gap: 12px; padding: 14px 2px; border-top: 1px solid var(--line);
  background: none; width: 100%; text-align: left; font-size: 15px; color: var(--text);
}
.menu-item:first-child { border-top: none; }
.menu-item .mi-ic {
  width: 34px; height: 34px; border-radius: 9px; background: var(--blue-bg); color: var(--blue);
  display: flex; align-items: center; justify-content: center; font-size: 16px; flex: none;
}
.menu-item .mi-arrow { margin-left: auto; color: #B7C3D8; }
.menu-item .mi-badge { margin-left: auto; background: var(--red); color: #fff; font-size: 11px;
  border-radius: 999px; min-width: 19px; height: 19px; display: inline-flex; align-items: center; justify-content: center; padding: 0 6px; }

/* ---------- 管理后台 ---------- */
.seg { display: flex; gap: 8px; overflow-x: auto; padding-bottom: 12px; -webkit-overflow-scrolling: touch; }
.seg .seg-btn {
  flex: none; background: #fff; border: 1px solid var(--line); border-radius: 999px;
  padding: 7px 15px; font-size: 13.5px; color: var(--text-sub); transition: all .15s;
}
.seg .seg-btn.active { background: var(--blue); border-color: var(--blue); color: #fff; font-weight: 600; }
.stat-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.stat-box { background: #F8FAFD; border-radius: 10px; padding: 12px; }
.stat-box .sb-num { font-size: 22px; font-weight: 700; }
.stat-box .sb-label { font-size: 12px; color: var(--text-sub); }
.rank-row { display: flex; align-items: center; gap: 10px; padding: 10px 0; border-top: 1px solid var(--line); }
.rank-row:first-child { border-top: none; }
.rank-no {
  width: 24px; height: 24px; border-radius: 8px; background: #F1F5F9; color: var(--text-sub);
  font-size: 13px; font-weight: 700; display: flex; align-items: center; justify-content: center; flex: none;
}
.rank-no.top { background: var(--blue); color: #fff; }
.progress { flex: 1; height: 7px; background: #EDF1F7; border-radius: 999px; overflow: hidden; min-width: 80px; }
.progress > i { display: block; height: 100%; background: var(--blue); border-radius: 999px; transition: width .3s ease-out; }
.rate { font-size: 13px; font-weight: 700; width: 52px; text-align: right; }

.table-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; border-radius: 10px; border: 1px solid var(--line); }
table.data-tb { border-collapse: collapse; width: 100%; font-size: 13px; background: #fff; min-width: 480px; }
.data-tb th, .data-tb td { padding: 9px 11px; text-align: left; border-bottom: 1px solid var(--line); white-space: nowrap; }
.data-tb th { background: var(--navy); color: #fff; font-weight: 600; font-size: 12.5px; }
.data-tb tr:last-child td { border-bottom: none; }

/* ---------- 弹窗 ---------- */
.modal-mask {
  position: fixed; inset: 0; background: rgba(16,42,86,.45); z-index: 100;
  display: flex; align-items: flex-end; justify-content: center;
  animation: mask-in .18s ease-out;
}
.modal-mask.center { align-items: center; padding: 20px; }
@keyframes mask-in { from { opacity: 0; } to { opacity: 1; } }
.modal {
  background: #fff; width: 100%; max-width: 560px; border-radius: 18px 18px 0 0;
  max-height: 88vh; overflow-y: auto; padding: 18px 16px calc(18px + env(safe-area-inset-bottom));
  animation: sheet-in .22s ease-out;
}
.modal-mask.center .modal { border-radius: 16px; max-width: 460px; }
@keyframes sheet-in { from { transform: translateY(40px); opacity: .6; } to { transform: none; opacity: 1; } }
.modal-head { display: flex; align-items: center; margin-bottom: 14px; }
.modal-head h3 { margin: 0; font-size: 16.5px; font-weight: 700; flex: 1; }
.modal-head .m-close { background: #F1F5F9; color: var(--text-sub); width: 28px; height: 28px; border-radius: 50%; font-size: 15px; }
.modal-foot {
  display: flex; gap: 10px; margin-top: 16px;
  position: sticky; bottom: -18px; padding: 12px 0 calc(14px + env(safe-area-inset-bottom, 0px));
  background: #fff; border-top: 1px solid var(--line); margin-left: -16px; margin-right: -16px;
  padding-left: 16px; padding-right: 16px; z-index: 2;
}
.modal-foot .btn { flex: 1; }

/* 汇报填写时间窗口提示 */
.window-tip {
  border-radius: 10px; padding: 10px 12px; font-size: 13px; line-height: 1.5;
  display: flex; flex-wrap: wrap; align-items: center; gap: 4px;
}
.window-tip.open { background: var(--green-bg); color: #15803d; }
.window-tip.locked { background: var(--amber-bg); color: #b45309; }
.window-tip .wt-now { width: 100%; font-size: 12.5px; }

/* GPS 定位失败提示 */
.gps-row.gps-fail { color: #b45309; background: var(--amber-bg); }
.gps-row { border-radius: 10px; }

/* 公告弹窗 */
.notice-modal .notice-title { font-size: 18px; font-weight: 700; text-align: center; margin-bottom: 4px; }
.notice-modal .notice-meta { text-align: center; font-size: 12px; color: var(--text-sub); margin-bottom: 12px; }
.notice-modal .notice-content { white-space: pre-wrap; font-size: 14.5px; background: #F8FAFD; border-radius: 10px; padding: 13px; max-height: 46vh; overflow-y: auto; }
.notice-pin { display: inline-block; background: var(--red-bg); color: var(--red); font-size: 11px; border-radius: 6px; padding: 1px 7px; vertical-align: middle; margin-left: 6px; }

/* ---------- Toast / 空态 ---------- */
.toast {
  position: fixed; top: 18%; left: 50%; transform: translateX(-50%) translateY(-8px);
  background: rgba(16,42,86,.92); color: #fff; padding: 10px 20px; border-radius: 999px;
  font-size: 14px; z-index: 200; opacity: 0; pointer-events: none; transition: all .2s ease-out;
  max-width: 84%; text-align: center;
}
.toast.show { opacity: 1; transform: translateX(-50%) translateY(0); }
.toast.err { background: var(--red); }
.empty { text-align: center; color: var(--text-sub); font-size: 13.5px; padding: 34px 10px; }
.empty .e-ic { font-size: 38px; display: block; margin-bottom: 8px; opacity: .5; }

.section-gap { height: 4px; }
.text-sub { color: var(--text-sub); font-size: 12.5px; }
.text-red { color: var(--red); }
.text-green { color: var(--green); }
.text-amber { color: var(--amber); }
.mt8 { margin-top: 8px; } .mt12 { margin-top: 12px; } .mt16 { margin-top: 16px; }
.flex { display: flex; align-items: center; gap: 8px; }
.flex-between { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.chip-row { display: flex; flex-wrap: wrap; gap: 7px; }
.chip { background: #F1F5F9; border-radius: 999px; padding: 5px 12px; font-size: 12.5px; color: var(--text); border: none; }
.chip.active { background: var(--blue-bg); color: var(--blue); font-weight: 600; }
.weekday-tabs { display: flex; gap: 6px; overflow-x: auto; padding-bottom: 4px; }
.weekday-tabs .wd {
  flex: none; min-width: 42px; text-align: center; background: #fff; border: 1px solid var(--line);
  border-radius: 10px; padding: 6px 4px; font-size: 12px; color: var(--text-sub);
}
.weekday-tabs .wd .wd-dot { width: 6px; height: 6px; border-radius: 50%; margin: 4px auto 0; background: #CBD5E1; }
.weekday-tabs .wd.done .wd-dot { background: var(--green); }
.weekday-tabs .wd.miss .wd-dot { background: var(--red); }
.weekday-tabs .wd.active { border-color: var(--blue); color: var(--blue); font-weight: 700; background: var(--blue-bg); }

/* 通用输入框（员工搜索 / 日期筛选） */
.input {
  width: 100%;
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 10px 12px;
  font-size: 15px;
  outline: none;
  background: #fff;
  box-sizing: border-box;
}
.input:focus { border-color: var(--blue); }

/* 员工搜索选择列表 */
.pick-row {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 12px;
  cursor: pointer;
  transition: border-color .15s ease, background .15s ease;
}
.pick-row:active { transform: scale(.99); }
.pick-row.active { border-color: var(--blue); background: var(--blue-bg); }

/* 档案页统计数字（复用 .stat-box 结构） */
.stat-box { text-align: center; }
.stat-num { font-size: 20px; font-weight: 700; font-variant-numeric: tabular-nums; line-height: 1.2; }
.stat-label { font-size: 12px; color: var(--text-sub); margin-top: 2px; }

/* 大桌面适配：居中显示 */
@media (min-width: 561px) {
  body { background: #E6EBF3; }
  #app { box-shadow: 0 0 34px rgba(16,42,86,.12); }
}

/* 团队今日看板 */
.team-hero .progress-bar {
  height: 8px; background: var(--line); border-radius: 999px; overflow: hidden; margin-top: 12px;
}
.team-hero .progress-fill {
  height: 100%; background: var(--main);
  border-radius: 999px; transition: width .4s ease-out;
}
/* 看板日期切换 */
.board-datebar { display: flex; align-items: center; gap: 8px; margin: 2px 0 12px; }
.bd-arrow {
  width: 34px; height: 34px; flex: 0 0 34px; border-radius: 10px;
  border: 1px solid var(--line); background: #fff; color: var(--main);
  font-size: 20px; line-height: 1; cursor: pointer; padding: 0;
}
.bd-arrow:active { background: var(--blue-bg); }
.bd-arrow:disabled { color: #C3CBD8; cursor: not-allowed; background: #F7F9FC; }
.bd-date {
  flex: 1; height: 34px; border-radius: 10px; border: 1px solid var(--line);
  background: var(--blue-bg); color: var(--main); font-size: 13.5px; font-weight: 600;
  cursor: pointer; padding: 0 10px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.badge-gray { background: #EEF2F7; color: var(--sub); }

/* 批量导入 */
.import-tips { margin: 0 0 12px; padding-left: 18px; color: var(--text-sub); font-size: 13.5px; line-height: 1.9; }
.import-tips b { color: var(--text); }
.imp-summary { display: flex; gap: 8px; margin-bottom: 12px; }
.imp-tag { flex: 1; text-align: center; padding: 10px 0; border-radius: 10px; font-weight: 600; font-size: 14px; }
.imp-tag.s-ok { background: #F0FDF4; color: #16A34A; }
.imp-tag.s-skip { background: #FFFBEB; color: #D97706; }
.imp-tag.s-err { background: #FEF2F2; color: #DC2626; }
.imp-list { max-height: 320px; overflow-y: auto; border: 1px solid var(--line); border-radius: 10px; padding: 6px 10px; }
.imp-line { padding: 7px 0; border-bottom: 1px dashed var(--line); font-size: 13.5px; line-height: 1.5; }
.imp-line:last-child { border-bottom: none; }
.imp-line.ok { color: var(--text); }
.imp-line.err { color: var(--red); }

/* ---------- 开票信息 ---------- */
.inv-tip { font-size: 12.5px; color: var(--sub); line-height: 1.6; margin: 4px 2px 12px; }
.inv-card { padding: 14px 16px; margin-bottom: 12px; }
.inv-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; margin-bottom: 8px; }
.inv-company { font-size: 15.5px; font-weight: 700; color: var(--text); line-height: 1.4; }
.inv-ops { flex-shrink: 0; display: flex; gap: 4px; }
.inv-del { color: var(--red) !important; }
.inv-row { display: flex; font-size: 13px; line-height: 1.5; padding: 3px 0; }
.inv-k { color: var(--sub); width: 92px; flex-shrink: 0; }
.inv-v { color: var(--text); flex: 1; word-break: break-all; }
.inv-v[onclick] { cursor: pointer; }
.inv-mini-copy { font-style: normal; font-size: 11px; color: var(--blue); background: var(--blue-bg); border-radius: 4px; padding: 0 5px; margin-left: 6px; vertical-align: middle; }
.inv-copy-all { width: 100%; margin-top: 10px; }
.inv-empty { text-align: center; color: var(--sub); padding: 32px 16px; font-size: 13px; }
.inv-add-btn { width: 100%; margin: 2px 0 12px; padding: 12px; font-size: 15px; }

/* ---------- 报销管理（财务/老板）---------- */
.rb-date-row { display: flex; gap: 10px; }
.rb-date-row .field { min-width: 0; }
.rb-pick { display: inline-flex; align-items: center; gap: 8px; font-size: 15px; }
.rb-pick input[type=checkbox] { width: 18px; height: 18px; accent-color: var(--blue); cursor: pointer; }
.rb-stage-line { display: flex; align-items: center; gap: 6px; flex-wrap: wrap;
  background: #F1F5FB; border-radius: 8px; padding: 6px 10px; font-size: 12.5px; }
.rb-stage-dot { line-height: 1; }
.rb-stage-label { font-weight: 700; color: #1E3A8A; }
.rb-stage-handler { color: #475569; }
.rb-stage-handler::before { content: "·"; margin-right: 6px; color: #94A3B8; }
.hide { display: none !important; }
.rb-batch-bar {
  position: sticky; bottom: 62px; z-index: 5;
  display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
  background: #fff; border: 1px solid var(--line); border-radius: 12px;
  padding: 9px 12px; margin: 4px 0 12px;
  box-shadow: 0 2px 10px rgba(16,42,86,.08);
}
.rb-all { display: inline-flex; align-items: center; gap: 6px; font-size: 13.5px; white-space: nowrap; cursor: pointer; }
.rb-all input[type=checkbox] { width: 17px; height: 17px; accent-color: var(--blue); }
.rb-batch-bar #rb-sel-count { font-size: 12.5px; white-space: nowrap; }
.rb-entity-row { display:flex; gap:8px; flex-wrap:wrap; }
.rb-echip { border:1px solid var(--line); background:#fff; color:var(--text-sub); border-radius:999px; padding:6px 14px; font-size:13px; cursor:pointer; transition:all .15s ease-out; }
.rb-echip.on { background:var(--brand,#2563EB); border-color:var(--brand,#2563EB); color:#fff; }
.rb-echip:active { opacity:.8; }
.rb-form-entity { display:flex; gap:8px; }
.rb-form-entity .rb-echip { flex:1; text-align:center; padding:10px 0; font-size:14px; }
.rb-entity-row { display:flex; flex-wrap:wrap; gap:8px; margin-bottom:8px; }

.uf-mgr-list { display: flex; flex-wrap: wrap; gap: 6px 14px; border:1px solid var(--line); border-radius:10px; padding:10px 12px; max-height:160px; overflow:auto; }
.uf-mgr-item { font-size:14px; margin:0; white-space:nowrap; }

/* ========== 全局搜索 ========== */
.home-search-bar { display:flex; align-items:center; gap:8px; width:100%; background:#fff; border:1px solid var(--line); border-radius:999px; padding:10px 16px; margin:0 0 12px; box-shadow:0 2px 10px rgba(16,42,86,.05); cursor:pointer; transition:box-shadow .15s ease-out; }
.home-search-bar:active { box-shadow:0 1px 4px rgba(16,42,86,.1); }
.hsb-ico { font-size:15px; }
.hsb-ph { color:var(--text-sub); font-size:13.5px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }

.sr-bar { display:flex; gap:8px; align-items:center; margin-bottom:10px; }
.sr-input-wrap { position:relative; flex:1; }
.sr-search-ico { position:absolute; left:12px; top:50%; transform:translateY(-50%); font-size:14px; opacity:.55; }
.sr-input { width:100%; border:1px solid var(--line); border-radius:999px; padding:10px 34px 10px 34px; font-size:14px; background:#fff; outline:none; }
.sr-input:focus { border-color:var(--blue); box-shadow:0 0 0 3px rgba(37,99,235,.12); }
.sr-clear { position:absolute; right:8px; top:50%; transform:translateY(-50%); border:none; background:var(--page-bg); border-radius:50%; width:22px; height:22px; font-size:11px; color:var(--text-sub); cursor:pointer; }
.sr-go { border:none; background:var(--blue); color:#fff; border-radius:999px; padding:10px 16px; font-size:14px; font-weight:600; }
.sr-go:active { background:var(--blue-press); }

.sr-quick-row { display:flex; gap:8px; overflow-x:auto; padding-bottom:4px; margin-bottom:8px; -webkit-overflow-scrolling:touch; }
.sr-quick-row::-webkit-scrollbar { display:none; }
.sr-quick { white-space:nowrap; border:1px solid var(--line); background:#fff; border-radius:999px; padding:6px 12px; font-size:12.5px; color:var(--text); cursor:pointer; }
.sr-quick.on { background:var(--blue-bg); border-color:var(--blue); color:var(--blue); font-weight:600; }

.sr-type-row { display:flex; gap:6px; flex-wrap:wrap; margin-bottom:10px; }
.sr-typechip { border:1px solid var(--line); background:#fff; border-radius:999px; padding:5px 11px; font-size:12.5px; color:var(--text); cursor:pointer; }
.sr-typechip.on { background:var(--blue); border-color:var(--blue); color:#fff; font-weight:600; }
.sr-typechip.more { margin-left:auto; color:var(--blue); border-color:var(--blue); }

.sr-filter { background:#fff; border:1px solid var(--line); border-radius:12px; padding:12px; margin-bottom:12px; }
.sr-f-title { font-size:12.5px; font-weight:600; color:var(--text-sub); margin:8px 0 6px; }
.sr-f-title:first-child { margin-top:0; }
.sr-f-date { display:flex; align-items:center; gap:8px; }
.sr-f-date input { flex:1; border:1px solid var(--line); border-radius:8px; padding:8px; font-size:13px; }
.sr-f-date span { color:var(--text-sub); }
.sr-select { width:100%; border:1px solid var(--line); border-radius:8px; padding:8px; font-size:13px; background:#fff; }
.sr-f-actions { display:flex; gap:8px; justify-content:flex-end; margin-top:12px; }
.sr-quick-tip { background:var(--blue-bg); color:var(--blue); border-radius:8px; padding:8px 12px; font-size:12.5px; margin-bottom:10px; display:flex; align-items:center; justify-content:space-between; }
.sr-clearq { border:none; background:none; color:var(--blue); font-size:12px; cursor:pointer; }

.sr-result-head { font-size:12.5px; color:var(--text-sub); margin:4px 2px 10px; }
.sr-result-head b { color:var(--blue); font-size:15px; font-variant-numeric:tabular-nums; }

.sr-card { background:#fff; border-radius:12px; padding:12px 14px; margin-bottom:10px; box-shadow:0 2px 10px rgba(16,42,86,.05); cursor:pointer; transition:transform .12s ease-out; }
.sr-card:active { transform:scale(.99); }
.sr-card-top { display:flex; align-items:center; gap:8px; }
.sr-ico { font-size:16px; }
.sr-title { font-weight:600; font-size:14px; flex:1; line-height:1.35; }
.sr-badge { font-size:11px; padding:2px 8px; border-radius:999px; white-space:nowrap; }
.sr-badge.ok { background:var(--green-bg); color:var(--green); }
.sr-badge.warn { background:var(--amber-bg); color:var(--amber); }
.sr-badge.bad { background:var(--red-bg); color:var(--red); }
.sr-snip { font-size:13px; color:var(--text-sub); line-height:1.5; margin:6px 0; }
.sr-meta { font-size:11.5px; color:var(--text-sub); display:flex; flex-wrap:wrap; gap:4px; align-items:center; }
.sr-type-label { color:var(--blue); font-weight:600; }
.sr-gps { color:var(--blue); }
.sr-hl { background:#FFF3B0; color:inherit; border-radius:2px; padding:0 1px; }

.sr-more { text-align:center; color:var(--text-sub); font-size:13px; padding:12px; }
.sr-empty { text-align:center; color:var(--text-sub); padding:40px 20px; font-size:14px; }

.sr-welcome { }
.sr-w-title { font-size:13px; font-weight:600; color:var(--text); margin:14px 2px 8px; }
.sr-w-title-row { display:flex; justify-content:space-between; align-items:center; }
.sr-hist-clear { border:none; background:none; color:var(--text-sub); font-size:12px; cursor:pointer; }
.sr-sug-row, .sr-hist-row { display:flex; flex-wrap:wrap; gap:8px; }
.sr-sug { border:1px solid var(--line); background:#fff; border-radius:999px; padding:7px 13px; font-size:13px; cursor:pointer; color:var(--text); }
.sr-sug:active { background:var(--blue-bg); }
.sr-hist { border:1px solid var(--line); background:#fff; border-radius:999px; padding:6px 12px; font-size:12.5px; color:var(--text-sub); cursor:pointer; }

/* ---------- 工作日历 ---------- */
/* 工作日历：紧凑一屏 */
.cal-wrap { width:100%; max-width:100%; box-sizing:border-box; overflow:hidden; }
.cal-head-row { display:flex; align-items:center; justify-content:space-between; gap:6px; }
.cal-nav-btn {
  flex:0 0 auto; width:32px; height:32px; padding:0; border-radius:8px;
  border:1px solid var(--line); background:#fff; color:var(--blue);
  font-size:18px; line-height:1; display:inline-flex; align-items:center; justify-content:center; cursor:pointer;
}
.cal-nav-btn:active { background:var(--blue-bg); }
.cal-title { font-size:16px; font-weight:700; color:var(--text); font-variant-numeric:tabular-nums; white-space:nowrap; }
.cal-stats { display:flex; align-items:center; gap:12px; margin:10px 0 2px; font-size:12.5px; color:var(--text-sub); }
.cal-stats b { font-variant-numeric:tabular-nums; font-size:13.5px; }
.cal-cnt-work b { color:var(--blue); }
.cal-cnt-rest b { color:var(--red); }
.cal-today-link { margin-left:auto; color:var(--blue); font-size:12.5px; background:none; border:none; padding:0; cursor:pointer; white-space:nowrap; }

.cal-card { padding:12px; }
.cal-grid { width:100%; display:grid; grid-template-columns:repeat(7,minmax(0,1fr)); gap:2px; box-sizing:border-box; }
.cal-wd { margin:8px 0 2px; }
.cal-wd-cell { text-align:center; font-size:11.5px; color:var(--text-sub); font-weight:600; padding:2px 0; }
.cal-cell {
  position:relative; border:none; background:transparent; box-sizing:border-box;
  aspect-ratio:1/1; width:100%; min-width:0; border-radius:8px;
  display:flex; align-items:center; justify-content:center;
  color:var(--text); cursor:pointer; padding:0;
  transition:background .15s ease-out, transform .1s ease-out;
}
.cal-cell:disabled { cursor:default; }
.cal-cell:not(:disabled):active { background:var(--blue-bg); transform:scale(.92); }
.cal-num {
  position:relative; z-index:2; font-size:14px; line-height:1; font-variant-numeric:tabular-nums;
  display:inline-flex; align-items:center; justify-content:center;
}
.cal-out { opacity:.3; }
.cal-today { background:var(--blue); }
.cal-today .cal-num { color:#fff; font-weight:700; }
.cal-today.cal-holiday, .cal-today.cal-makeup { background:var(--blue); }
.cal-today.cal-holiday .cal-badge, .cal-today.cal-makeup .cal-badge { color:#fff; border-color:rgba(255,255,255,.7); }
.cal-workday .cal-num, .cal-makeup .cal-num { color:var(--text); }
.cal-weekend .cal-num, .cal-holiday .cal-num { color:var(--red); }
.cal-holiday:not(.cal-today) { background:var(--red-bg); }
.cal-makeup:not(.cal-today) { background:var(--amber-bg); }
.cal-badge {
  position:absolute; right:2px; bottom:2px; z-index:3;
  font-size:8px; line-height:1; min-width:11px; height:11px; padding:0 2px; border-radius:3px;
  display:inline-flex; align-items:center; justify-content:center; font-weight:700;
}
.cal-badge-holiday { color:var(--red); background:rgba(220,38,38,.12); }
.cal-badge-makeup { color:var(--amber); background:rgba(217,119,6,.14); }

.cal-legend { padding:11px 12px; }
.cal-legend-row { display:flex; flex-wrap:wrap; gap:7px 14px; align-items:center; margin-top:8px; font-size:12px; color:var(--text-sub); }
.cal-legend-item { display:inline-flex; align-items:center; gap:5px; white-space:nowrap; }
.cal-lg { width:12px; height:12px; border-radius:4px; display:inline-block; flex:0 0 auto; }
.cal-lg-work { background:#fff; border:1px solid var(--line); }
.cal-lg-holiday { background:var(--red-bg); border:1px solid var(--red); }
.cal-lg-weekend { background:#fff; border:1px solid var(--red); }
.cal-lg-makeup { background:var(--amber-bg); border:1px solid var(--amber); }
.cal-tip { font-size:12px; line-height:1.5; margin-top:9px; }
.cal-name-input { width:100%; margin-top:6px; }
.cal-edit-actions { display:flex; flex-direction:column; gap:8px; margin-top:12px; }
.cal-act { width:100%; }

/* 首页快捷入口按钮 + 角标 */
.quick-btn { position:relative; background:#F8FAFD; border:none; border-radius:10px; padding:14px 4px; display:flex; flex-direction:column; align-items:center; gap:6px; color:var(--text); cursor:pointer; transition:background .15s ease-out, transform .12s ease-out; }
.quick-btn:active { background:var(--blue-bg); transform:scale(.96); }
.quick-ic { position:relative; font-size:22px; line-height:1; }
.quick-lb { font-size:12.5px; }
.quick-badge { position:absolute; top:-9px; right:-11px; min-width:16px; height:16px; padding:0 4px; border-radius:999px; background:var(--red); color:#fff; font-size:10.5px; font-style:normal; font-weight:600; line-height:16px; text-align:center; box-shadow:0 0 0 2px #fff; font-variant-numeric:tabular-nums; }

/* 看板可点数字 */
.stat-tap { cursor:pointer; transition:background .15s ease-out, transform .12s ease-out; }
.stat-tap:active { background:var(--blue-bg); transform:scale(.97); }

/* 系统更新日志页 */
.cl-tip { font-size:12px; color:var(--text-sub); text-align:center; margin:2px 2px 10px; line-height:1.5; }
.cl-card { background:var(--card,#fff); border-radius:12px; padding:14px; margin-bottom:12px; box-shadow:0 2px 10px rgba(16,42,86,.06); border:1px solid var(--line); }
.cl-latest { border:1px solid var(--blue); }
.cl-head { display:flex; align-items:center; justify-content:space-between; margin-bottom:6px; }
.cl-ver { display:flex; align-items:center; gap:6px; font-size:14px; font-weight:700; color:var(--blue); font-variant-numeric:tabular-nums; }
.cl-new { font-size:10px; font-weight:700; color:#fff; background:var(--blue); border-radius:999px; padding:2px 7px; line-height:1; }
.cl-date { font-size:12px; color:var(--text-sub); font-variant-numeric:tabular-nums; }
.cl-title { font-size:15px; font-weight:700; color:var(--text); margin-bottom:8px; }
.cl-list { list-style:none; margin:0; padding:0; }
.cl-item { position:relative; padding:5px 0 5px 16px; font-size:13px; color:var(--text); line-height:1.6; }
.cl-item::before { content:""; position:absolute; left:2px; top:13px; width:5px; height:5px; border-radius:50%; background:var(--blue); }

/* 图片灯箱：应用内全屏看图 + 明显关闭按钮 + 放大拖动 */
.lb-mask { position:fixed; inset:0; z-index:2000; background:rgba(8,16,32,.92);
  display:flex; align-items:center; justify-content:center; padding:16px; overflow:hidden; }
.lb-viewport { width:100%; height:100%; display:flex; align-items:center; justify-content:center;
  overflow:hidden; touch-action:none; }
.lb-img { max-width:100%; max-height:100%; border-radius:8px; box-shadow:0 10px 40px rgba(0,0,0,.5);
  object-fit:contain; transform-origin:center center;
  cursor:grab; user-select:none; -webkit-user-drag:none; touch-action:none; will-change:transform; }
.lb-close { position:absolute; top:14px; right:14px; width:40px; height:40px; border-radius:50%;
  background:rgba(255,255,255,.16); color:#fff; font-size:20px; line-height:1; border:0; z-index:2;
  display:flex; align-items:center; justify-content:center; }
.lb-close:active { background:rgba(255,255,255,.32); }
.lb-tip { position:absolute; bottom:26px; left:50%; transform:translateX(-50%); z-index:2;
  color:rgba(255,255,255,.82); font-size:12px; background:rgba(0,0,0,.34);
  padding:5px 12px; border-radius:14px; white-space:nowrap; pointer-events:none; }
.rc-img { cursor:zoom-in; }

/* 用户管理：移动端紧凑列表 */
.user-compact { list-style:none; margin:0; padding:0; }
.uc-row { display:flex; align-items:center; gap:8px; padding:8px 2px;
  border-bottom:1px solid var(--line); }
.uc-row:last-child { border-bottom:none; }
.uc-main { flex:1; min-width:0; }
.uc-tap { cursor:pointer; }
.uc-line1 { display:flex; align-items:center; gap:6px; }
.uc-name { font-size:14px; color:var(--text); }
.uc-role { font-size:11px; color:var(--blue); background:var(--blue-bg);
  border-radius:4px; padding:1px 5px; }
.uc-tag { font-size:11px; color:#B45309; background:#FEF3C7; border-radius:4px; padding:1px 5px; }
.uc-job { font-size:11px; color:#047857; background:#D1FAE5; border-radius:4px; padding:1px 6px; }
.uc-state { margin-left:auto; font-size:11px; border-radius:4px; padding:1px 6px; }
.uc-state-on { color:#15803D; background:#DCFCE7; }
.uc-state-off { color:#B91C1C; background:#FEE2E2; }
.uc-wx { font-size:11px; border-radius:4px; padding:1px 6px; }
.uc-wx-on { color:#1D4ED8; background:#DBEAFE; }
.uc-wx-off { color:#B45309; background:#FEF3C7; }
.wx-filter-bar { display:flex; align-items:center; gap:6px; flex-wrap:wrap; margin:4px 0 12px; }
.wx-filter-label { font-size:12px; color:#64748B; margin-right:2px; }
.wx-chip { border:1px solid #CBD5E1; background:#fff; color:#475569; border-radius:14px; padding:3px 12px; font-size:12px; cursor:pointer; }
.wx-chip em { font-style:normal; color:#94A3B8; margin-left:2px; }
.wx-chip.on { background:#2563EB; border-color:#2563EB; color:#fff; }
.wx-chip.on em { color:#BFDBFE; }
.uc-line2 { font-size:12px; color:var(--text-sub); margin-top:2px;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.uc-dot { margin:0 4px; color:var(--line); }
.uc-mgr { color:var(--text-sub); }
.uc-actions { display:flex; flex-shrink:0; gap:6px; }
.uc-btn { font-size:12px; color:var(--text-sub); background:#fff; border:1px solid var(--line);
  border-radius:7px; padding:5px 8px; line-height:1; }
.uc-btn:active { background:var(--page-bg); }
.uc-btn-edit { color:var(--blue); border-color:#BFD0F5; }
.uc-off .uc-name { color:var(--text-sub); }



/* ---- 点评消息提醒（红色强提醒，老板/员工一致） ---- */
.badge-blue{background:var(--blue-bg,#EFF4FF);color:var(--blue,#2563EB)}
.comment-notice-card{border:1px solid rgba(220,38,38,.28);border-left:4px solid var(--red,#DC2626);background:linear-gradient(0deg,#FFF5F5,#FFFFFF);box-shadow:0 2px 12px rgba(220,38,38,.10)}
.comment-notice-card .card-title{color:var(--red,#DC2626);font-weight:700}
.comment-notice-card .card-title .bar{background:var(--red,#DC2626)}
.comment-notice-card .cn-badge{background:var(--red,#DC2626);color:#fff;font-weight:600;animation:cnPulse 1.8s ease-in-out infinite}
.cn-hint{font-size:12px;color:var(--red,#DC2626);font-weight:500}
@keyframes cnPulse{0%,100%{opacity:1}50%{opacity:.55}}
.comment-notice-card .cn-row{display:flex;align-items:flex-start;gap:10px;width:100%;background:none;border:none;border-top:1px solid rgba(220,38,38,.14);padding:11px 14px;text-align:left;cursor:pointer}
.comment-notice-card .cn-row:first-of-type{border-top:none}
.comment-notice-card .cn-row:active{background:rgba(220,38,38,.06)}
.cn-ava{width:34px;height:34px;min-width:34px;font-size:13px;background:var(--red,#DC2626)!important;color:#fff!important}
.cn-main{flex:1;min-width:0}
.cn-line1{font-size:13.5px;color:#B91C1C;line-height:1.4}
.cn-line1 b{font-weight:700;color:var(--red,#DC2626)}
.cn-date{color:#DC2626;font-size:12px;margin-left:4px;opacity:.85}
.cn-line2{font-size:12.5px;color:var(--red,#DC2626);margin-top:2px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;opacity:.92}
.cn-go{color:var(--red,#DC2626);font-size:18px;line-height:1.2;font-weight:700}
.cm-reply{margin-left:22px;border-left:2px solid var(--blue-bg,#EFF4FF);padding-left:10px}
.cm-reply-btn{margin-left:auto;background:none;border:none;color:var(--blue,#2563EB);font-size:12px;cursor:pointer;padding:0}

/* ---- 微信服务号通知 ---- */
.wx-status{display:flex;align-items:center;gap:8px;padding:11px 12px;border-radius:12px;background:#f8fafc;color:#64748b;font-size:13.5px;font-weight:600;margin-bottom:12px}
.wx-status.ok{background:#ecfdf5;color:#047857}
.wx-status-dot{width:9px;height:9px;border-radius:50%;background:#94a3b8}
.wx-status.ok .wx-status-dot{background:#10b981;box-shadow:0 0 0 4px rgba(16,185,129,.13)}
.wx-steps{margin:0;padding-left:20px;color:var(--text-sub,#64748b);font-size:13px;line-height:1.9}
.wx-code-box{margin:12px 0 4px;padding:14px;border:1px dashed var(--blue,#2563EB);border-radius:14px;background:var(--blue-bg,#EFF4FF)}
.wx-code{text-align:center;font-size:30px;font-weight:800;letter-spacing:6px;color:var(--blue,#2563EB);font-variant-numeric:tabular-nums}
.wx-callback{display:flex;gap:8px;align-items:center}
.wx-callback .input{flex:1;min-width:0}
.wx-token-status{font-size:12.5px;margin-top:10px;padding:9px 11px;border-radius:10px;background:#fef2f2;color:#b91c1c}
.wx-token-status.ok{background:#ecfdf5;color:#047857}
.wx-tpl-row{margin-bottom:12px}
.wx-tpl-row label{display:block;font-size:13px;font-weight:600;margin-bottom:6px;color:var(--text,#1f2937)}
.switch-line{display:inline-flex;align-items:center;gap:5px;font-size:13px;color:var(--text-sub,#64748b)}
.switch-line input{accent-color:var(--blue,#2563EB)}

/* 回退提示条：今天暂无采集数据，自动回退到最近有数据的日期 */
.stock-fallback-tip {
  border: 1px dashed #FCD34D;
  background: #FFFBEB;
  color: #B45309;
  border-radius: 10px;
  padding: 10px 12px;
  font-size: 12.5px;
  line-height: 1.5;
}
.stock-fallback-tip b { color: #92400E; }

/* ===== 库存预警模块 ===== */
.stock-wrap{display:flex;flex-direction:column;gap:12px}
.stock-sum-2zone{display:flex;gap:10px;padding:14px;align-items:stretch}
.stock-sum-zone{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px}
.stock-sum-zone.stock-sum-unsettled{flex:1.4;background:#FEF2F2;border-radius:10px;padding:12px 8px}
.stock-sum-zone.stock-sum-unsettled.has-pending{border:1px solid #FCA5A5}
.stock-sum-zone.stock-sum-handled{flex:1;background:#F8FAFC;border-radius:10px;padding:12px 8px}
.stock-sum-zone-num{font-size:28px;font-weight:800;line-height:1;color:#1D4ED8}
.stock-sum-zone.has-pending .stock-sum-zone-num{color:#DC2626}
.stock-sum-handled .stock-sum-zone-num{color:#64748B}
.stock-sum-zone-label{font-size:13px;font-weight:600;color:#334155}
.stock-sum-handled .stock-sum-zone-label{color:#64748B}
.stock-sum-sub{display:flex;gap:12px;margin-top:6px;font-size:11.5px}
.stock-sum-sub b{font-size:14px;font-weight:700}
.ss-pending{color:#DC2626}
.ss-replied{color:#B45309}
.stock-summary{display:flex;gap:8px;padding:14px}
.stock-sum-item{flex:1;display:flex;flex-direction:column;align-items:center;gap:4px}
.stock-sum-item b{font-size:22px;color:#1D4ED8}
.stock-sum-item.is-pending b{color:#DC2626}
.stock-sum-item span{font-size:12px;color:#64748B}
.stock-head-row{display:flex;align-items:center;justify-content:space-between;gap:8px;flex-wrap:wrap}
.stock-date{font-size:14px;font-weight:600;color:#1E293B}
.stock-filter-seg{display:flex;gap:6px;flex-wrap:wrap}
.stock-filter-seg button.seg-pending{border-color:#FCA5A5}
.stock-filter-seg button.seg-pending.on{background:#DC2626;border-color:#DC2626;color:#fff}
.stock-filter-seg button.seg-replied{border-color:#FCD34D}
.stock-filter-seg button.seg-replied.on{background:#D97706;border-color:#D97706;color:#fff}
.stock-filter-seg button.seg-handled{border-color:#CBD5E1}
.stock-filter-seg button.seg-handled.on{background:#64748B;border-color:#64748B;color:#fff}
.stock-filter-seg button,.stock-op-chip{border:1px solid #CBD5E1;background:#fff;color:#475569;border-radius:16px;padding:4px 12px;font-size:12px;cursor:pointer;white-space:nowrap}
.stock-filter-seg button.on,.stock-op-chip.on{background:#2563EB;border-color:#2563EB;color:#fff}
.stock-op-chip.has-pending{border-color:#FCA5A5;color:#DC2626}
.stock-people-bar{display:flex;gap:6px;overflow-x:auto;padding-bottom:4px}
.stock-card{background:#fff;border-radius:12px;padding:14px;box-shadow:0 1px 3px rgba(15,23,42,.06);border-left:4px solid #CBD5E1}
.stock-card.is-pending{border-left-color:#DC2626}
.stock-card.is-replied{border-left-color:#D97706}
.stock-card.is-handled{border-left-color:#94A3B8;opacity:.62}
.stock-card.is-handled .stock-actions{display:none}
.stock-card-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:6px}
.stock-plat{font-size:13px;font-weight:700;color:#1D4ED8;background:#EFF6FF;padding:2px 8px;border-radius:6px}
.stock-status{font-size:12px;font-weight:600;padding:2px 8px;border-radius:10px}
.stock-status.st-pending{background:#FEE2E2;color:#DC2626}
.st-replied{background:#FEF3C7;color:#B45309}
.stock-status.st-replied{background:#FEF3C7;color:#B45309}
.stock-status.st-handled{background:#F1F5F9;color:#64748B}
.stock-device{font-size:15px;font-weight:600;color:#0F172A;margin-bottom:6px}
.stock-cont-tag{display:inline-block;font-size:11px;font-weight:600;color:#B45309;background:#FEF3C7;border:1px solid #FCD34D;padding:1px 6px;border-radius:8px;margin-left:6px;vertical-align:middle}
.stock-meta{font-size:12px;color:#64748B;display:flex;flex-direction:column;gap:4px}
.stock-meta b{color:#334155;font-weight:600}
.stock-op-name{font-size:12px;color:#475569}
.stock-reply{margin-top:8px;background:#FFFBEB;border:1px solid #FCD34D;border-radius:8px;padding:8px 10px}
.stock-reply-head{font-size:12px;color:#B45309;font-weight:600;margin-bottom:4px}
.stock-reply-body{font-size:13px;color:#0F172A;white-space:pre-wrap;word-break:break-word}
.stock-no-reply{margin-top:8px;font-size:12px;color:#B91C1C;background:#FEF2F2;border-radius:8px;padding:8px 10px}
.stock-no-reply-handled{color:#64748B;background:#F8FAFC}
.stock-actions{display:flex;gap:8px;margin-top:10px}
.stock-actions button{flex:1;border:none;border-radius:8px;padding:8px;font-size:13px;font-weight:600;cursor:pointer}
.stock-btn-primary{background:#2563EB;color:#fff}
.stock-btn-ghost{background:#F1F5F9;color:#334155}
.stock-comments{margin-top:10px;border-top:1px dashed #E2E8F0;padding-top:8px;display:flex;flex-direction:column;gap:6px}
.stock-comment{background:#F8FAFC;border-radius:8px;padding:8px 10px}
.stock-comment-head{font-size:12px;color:#64748B;margin-bottom:2px}
.stock-comment-body{font-size:13px;color:#1E293B;white-space:pre-wrap;word-break:break-word}
.stock-empty{text-align:center;color:#94A3B8;font-size:13px;padding:40px 0}
.stock-kpis{display:flex;gap:10px}
.stock-kpi-zone{flex:1;border-radius:10px;padding:14px 8px;display:flex;flex-direction:column;align-items:center;gap:4px;box-shadow:0 1px 3px rgba(15,23,42,.06)}
.stock-kpi-zone.stock-kpi-unsettled{flex:1.4;background:#FEF2F2;border:1px solid #FCA5A5}
.stock-kpi-zone.stock-kpi-handled{background:#F8FAFC;border:1px solid #E2E8F0}
.stock-kpi-zone b{font-size:26px;color:#DC2626;line-height:1}
.stock-kpi-unsettled:not(.has-pending) b{color:#1D4ED8}
.stock-kpi-handled b{color:#64748B}
.stock-kpi-zone span{font-size:13px;font-weight:600;color:#334155}
.stock-kpi-handled span{color:#64748B}
.stock-kpi-sub{display:flex;gap:10px;margin-top:5px}
.stock-kpi-sub em{font-size:11px;font-style:normal;white-space:nowrap}
.sk-pending{color:#DC2626}
.sk-replied{color:#B45309}
.stock-platforms{background:#fff;border-radius:12px;padding:14px;display:flex;flex-direction:column;gap:10px;box-shadow:0 1px 3px rgba(15,23,42,.06)}
.stock-plat-row{display:flex;align-items:center;gap:8px;font-size:12px}
.stock-plat-name{width:56px;color:#334155;font-weight:600}
.stock-plat-bar{flex:1;height:8px;background:#E2E8F0;border-radius:4px;overflow:hidden}
.stock-plat-bar i{display:block;height:100%;background:#2563EB;border-radius:4px}
.stock-plat-num{width:74px;text-align:right;color:#64748B}
.stock-plat-pending{color:#DC2626;font-style:normal}
.stock-operators{background:#fff;border-radius:12px;padding:14px;display:flex;flex-direction:column;gap:8px;box-shadow:0 1px 3px rgba(15,23,42,.06);margin-bottom:calc(var(--tab-h) + 16px)}
.stock-operators .stock-op-chip{display:flex;align-items:center;justify-content:flex-start;width:100%;border-radius:10px;padding:10px 12px;font-size:13px;text-align:left}
.stock-operators .stock-op-chip em{margin-left:auto;font-style:normal;font-size:12px;color:#64748B;padding-left:8px}
.stock-op-row{display:flex;align-items:center;justify-content:space-between;font-size:13px;padding:6px 0;border-bottom:1px solid #F1F5F9}
.stock-op-row:last-child{border-bottom:none}
.stock-key-row{display:flex;justify-content:flex-end}
.stock-key-box{margin-top:10px;background:#0F172A;color:#7DD3FC;border-radius:8px;padding:10px;font-size:12px;font-family:monospace;word-break:break-all;user-select:all}
.stock-key-btns{display:flex;gap:8px;margin-top:10px}
.stock-textarea{width:100%;border:1px solid #CBD5E1;border-radius:8px;padding:10px;font-size:14px;resize:vertical;box-sizing:border-box;font-family:inherit}
.stock-textarea:focus{outline:none;border-color:#2563EB}


/* === 看板固定区域四向滑动 + 表头/合计行吸附 v20260920h === */
/* 表格正向显示不旋转；在固定高度区域内可上下左右滑动 */
/* 上下滑时表头固定在区域顶部、合计行固定在区域底部，不随内容滚走 */

/* 滑动提示语（仅看板页出现） */
.dash-scroll-hint {
  display: block;
  font-size: 13px; color: var(--blue); background: var(--blue-bg);
  padding: 9px 12px; border-radius: 8px; margin: 0 0 10px;
  text-align: center; font-weight: 500;
}

/* 看板卡片内的滑动容器：固定高度、四向滚动 */
.dash-card .table-wrap {
  overflow: auto;                  /* 上下左右都能滑 */
  max-height: calc(100vh - 300px); /* 屏幕高度 - 标题/切换条/提示语/tab等占位 */
  min-height: 220px;
}

/* 表头吸附：上下滚动时固定在容器顶部（配合 th 自带深色背景遮住穿过的内容） */
.dash-card .data-tb thead th {
  position: sticky;
  top: 0;
  z-index: 3;
  box-shadow: 0 1px 0 var(--line);
}

/* 合计行吸附：固定在容器底部 */
.dash-card .data-tb .dash-total-row th,
.dash-card .data-tb .dash-total-row td {
  position: sticky;
  bottom: 0;
  z-index: 3;
  background: var(--blue-bg);
  box-shadow: 0 -1px 0 var(--line);
}

/* 首列吸附（横向滑动时主体名称/合计标签不消失）+ 各吸附格背景与层级
   层级：表头左上角(5) > 合计行首格(4) > 表头/合计行其余格(3) > 数据行首格(2) */
.dash-card .data-tb thead th:first-child,
.dash-card .data-tb td.dash-name,
.dash-card .data-tb .dash-total-row td:first-child {
  position: sticky;
  left: 0;
  box-shadow: 2px 0 0 var(--line); /* 吸附列右侧分隔线 */
}
.dash-card .data-tb thead th:first-child {
  z-index: 5;
  background: var(--navy);
  box-shadow: 2px 0 0 var(--line), 0 1px 0 var(--line); /* 右侧+底部分隔线 */
}
.dash-card .data-tb .dash-total-row td:first-child {
  z-index: 4;
  background: var(--blue-bg);
  box-shadow: 2px 0 0 var(--line), 0 -1px 0 var(--line); /* 右侧+顶部分隔线 */
}
.dash-card .data-tb td.dash-name {
  z-index: 2;
  background: #fff;
}

/* 看板表格紧凑字号（375px 竖屏一屏尽量多显示列） */
.dash-card .data-tb { font-size: 11px !important; min-width: 0 !important; }
.dash-card .data-tb th, .dash-card .data-tb td { padding: 5px 6px !important; }
.dash-card .dash-name { min-width: 80px; white-space: nowrap; }

/* --- 横屏（landscape）：解除滑动容器高度限制，表格随页滚动 --- */
@media (orientation: landscape) and (max-width: 1100px) {
  #app { max-width: 100% !important; }
  .page, .content { padding: 6px 8px !important; }
  /* 保留 tabbar 高度的底部留白，避免悬浮导航遮挡表格最后一行 */
  .page:not(.no-tab) { padding-bottom: calc(var(--tab-h) + 16px) !important; }
  .dash-card .table-wrap { max-height: none; min-height: 0; overflow-x: auto; }
  table.data-tb { font-size: 11px !important; min-width: 600px; }
  .data-tb th, .data-tb td { padding: 5px 6px !important; }
  .dash-name { min-width: 80px; white-space: nowrap; }
  .seg { flex-wrap: wrap; }
  .card { margin-bottom: 8px !important; }
  .card-title { font-size: 14px !important; }
}

/* ========== 管理后台 tab 分组折叠 ========== */
.seg-group-header {
  display: flex; align-items: center; gap: 8px;
  padding: 8px 4px; margin: 4px 0 2px;
  cursor: pointer; user-select: none;
  border-top: 1px dashed var(--line); border-bottom: 1px dashed var(--line);
}
.seg-group-header:active { background: var(--blue-bg); }
.seg-group-label { font-size: 13px; font-weight: 600; color: var(--text-sub); flex: 1; }
.seg-group-arrow { font-size: 14px; color: var(--text-sub); }

/* ========== 员工隶属关系拓扑图 ========== */
.oc-tree { display: flex; flex-direction: column; align-items: center; }
.oc-boss-node { display: flex; flex-direction: column; align-items: center; width: 100%; }
.oc-boss-trunk {
  width: 2px; height: 28px; background: var(--blue);
  margin: 0 auto;
}
.oc-managers { width: 100%; display: flex; flex-direction: column; gap: 0; }
.oc-group {
  background: #fff; border-radius: 12px; padding: 14px;
  margin-bottom: 12px; box-shadow: var(--shadow);
  border-left: 4px solid var(--blue);
  position: relative;
}
.oc-connector {
  position: absolute; top: -12px; left: 30px;
  width: 2px; height: 12px; background: var(--blue);
}
.oc-group:first-child .oc-connector { display: block; }
.oc-group:nth-child(n+2) .oc-connector { display: block; }
.oc-mgr {
  display: flex; align-items: center; gap: 10px; padding-bottom: 10px;
  border-bottom: 1px solid var(--line);
}
.oc-mgr.oc-boss { border-bottom: none; padding-bottom: 0; }
.oc-boss { background: var(--navy); color: #fff; border-radius: 12px; padding: 16px; }
.oc-boss .oc-avatar { background: rgba(255,255,255,.2); color: #fff; }
.oc-boss .oc-info b { color: #fff; }
.oc-boss .oc-role { color: rgba(255,255,255,.7); background: rgba(255,255,255,.12); }
.oc-boss .oc-count { color: rgba(255,255,255,.8); }
.oc-avatar {
  width: 42px; height: 42px; border-radius: 12px; background: var(--blue-bg);
  color: var(--blue); font-size: 17px; font-weight: 700;
  display: flex; align-items: center; justify-content: center; flex: none;
}
.oc-avatar-sm {
  width: 32px; height: 32px; border-radius: 10px; background: #F1F5F9;
  color: var(--text); font-size: 13px; font-weight: 600;
  display: flex; align-items: center; justify-content: center; flex: none;
}
.oc-info { flex: 1; min-width: 0; }
.oc-info b { font-size: 14.5px; font-weight: 700; color: var(--text); display: block; line-height: 1.3; }
.oc-role { font-size: 11.5px; color: var(--blue); background: var(--blue-bg); padding: 1px 7px; border-radius: 6px; display: inline-block; margin-top: 3px; }
.oc-count { font-size: 12.5px; color: var(--text-sub); white-space: nowrap; flex: none; }
.oc-subs { display: flex; flex-direction: column; gap: 8px; padding-top: 10px; }
.oc-sub {
  display: flex; align-items: center; gap: 8px;
  padding: 8px 10px; background: #F8FAFD; border-radius: 10px;
  position: relative;
}
.oc-sub-line {
  position: absolute; left: -14px; top: 50%;
  width: 14px; height: 2px; background: var(--blue);
}
.oc-sub:first-child .oc-sub-line {
  top: 50%;
}
.oc-sub:active { background: var(--blue-bg); }
.oc-sub span { font-size: 13.5px; color: var(--text); flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.oc-sub-role { font-size: 11px; color: var(--text-sub); background: #F1F5F9; border-radius: 6px; padding: 1px 6px; flex: none; }
.oc-off { font-size: 11px; color: var(--red); background: var(--red-bg); border-radius: 6px; padding: 1px 6px; flex: none; }
.oc-empty { text-align: center; font-size: 13px; color: var(--text-sub); padding: 16px 0; }

/* ========== 报销 PDF 上传与展示 ========== */
.uploader-pdf { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 8px; }
.up-pdf-item {
  position: relative; display: flex; align-items: center; gap: 6px;
  background: #F8FAFD; border: 1px solid var(--line); border-radius: 9px;
  padding: 8px 10px; font-size: 12.5px; color: var(--text); max-width: 100%;
}
.up-pdf-item .up-pdf-ico { font-size: 18px; flex: none; }
.up-pdf-item .up-pdf-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 120px; }
.up-pdf-item .up-del {
  position: absolute; top: -7px; right: -7px; width: 20px; height: 20px; border-radius: 50%;
  background: var(--red); color: #fff; font-size: 12px; line-height: 20px; text-align: center; cursor: pointer;
}
.up-pdf-add {
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px;
  width: 74px; height: 74px; border: 1.5px dashed #B7C3D8; border-radius: 9px; background: #FAFBFE;
  color: var(--text-sub); font-size: 11px; cursor: pointer;
}
.up-pdf-add .up-pdf-plus { font-size: 22px; }
.rc-pdfs { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 8px; }
.rc-pdf-link {
  display: inline-flex; align-items: center; gap: 6px;
  background: #F8FAFD; border: 1px solid var(--line); border-radius: 9px;
  padding: 8px 12px; font-size: 12.5px; color: var(--blue); cursor: pointer;
  text-decoration: none; transition: background .15s ease-out;
}
.rc-pdf-link:active { background: var(--blue-bg); }
.rc-pdf-link .rc-pdf-ico { font-size: 16px; flex: none; }