/* ==========================================================================
   云创记工台账单核对管理平台 · Web 版（电脑端优先）
   设计令牌与小程序版一致：主色 #409eff / 成功 #22c55e / 警示 #f59e0b / 危险 #ef4444
   ========================================================================== */
:root {
  --c-bg: #f5f7fa;
  --c-surface: #ffffff;
  --c-surface-2: #fafbfd;
  --c-surface-3: #f2f5f9;
  --c-primary: #409eff;
  --c-primary-600: #2b83e8;
  --c-primary-700: #1e6fd0;
  --c-primary-soft: #eaf3ff;
  --c-success: #22c55e;
  --c-success-700: #16a34a;
  --c-success-soft: #e9f9ef;
  --c-danger: #ef4444;
  --c-danger-700: #dc2626;
  --c-danger-soft: #fdecec;
  --c-warn: #f59e0b;
  --c-warn-700: #b45309;
  --c-warn-soft: #fff6e6;
  --c-text: #1f2d3d;
  --c-text-2: #5c6b7a;
  --c-text-3: #8b98a5;
  --c-line: #e4e9f0;
  --c-line-2: #cfd8e3;
  --c-side: #0f1b2d;
  --c-side-2: #16253c;
  --radius: 12px;
  --radius-sm: 8px;
  --shadow-sm: 0 1px 2px rgba(16, 30, 54, .06);
  --shadow: 0 6px 20px rgba(16, 30, 54, .08);
  --shadow-lg: 0 18px 48px rgba(16, 30, 54, .16);
  --sidebar-w: 218px;
  --topbar-h: 58px;
}

* { box-sizing: border-box; }

html, body { height: 100%; }

body {
  margin: 0;
  background: var(--c-bg);
  color: var(--c-text);
  font-family: -apple-system, BlinkMacSystemFont, "PingFang SC", "Microsoft YaHei", "Segoe UI", Roboto, sans-serif;
  font-size: 14px;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
}

a { color: var(--c-primary-700); text-decoration: none; }
button, input, select, textarea { font-family: inherit; font-size: inherit; color: inherit; }
h1, h2, h3, h4, p { margin: 0; }

::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-thumb { background: #cfd8e3; border-radius: 6px; border: 2px solid transparent; background-clip: content-box; }
::-webkit-scrollbar-thumb:hover { background: #b7c2d0; background-clip: content-box; }
::-webkit-scrollbar-track { background: transparent; }

/* ---------------- 启动态 ---------------- */
.boot { display: flex; height: 100vh; flex-direction: column; align-items: center; justify-content: center; gap: 14px; }
.boot__logo {
  width: 56px; height: 56px; border-radius: 16px; display: grid; place-items: center;
  background: linear-gradient(135deg, #409eff, #1e6fd0); color: #fff; font-size: 26px; font-weight: 700;
  box-shadow: var(--shadow);
}
.boot__txt { color: var(--c-text-3); font-size: 13px; }

/* ---------------- 整体布局 ---------------- */
.layout { display: flex; min-height: 100vh; }

.sidebar {
  width: var(--sidebar-w);
  flex: 0 0 var(--sidebar-w);
  background: linear-gradient(180deg, var(--c-side) 0%, var(--c-side-2) 100%);
  color: #c7d2e0;
  display: flex;
  flex-direction: column;
  position: sticky;
  top: 0;
  height: 100vh;
  z-index: 30;
}
.brand { display: flex; align-items: center; gap: 10px; padding: 18px 18px 14px; }
.brand__logo {
  width: 34px; height: 34px; border-radius: 10px; display: grid; place-items: center;
  background: linear-gradient(135deg, #409eff, #1e6fd0); color: #fff; font-weight: 700; font-size: 17px;
  box-shadow: 0 4px 12px rgba(64, 158, 255, .35);
}
.brand__name { color: #fff; font-size: 15px; font-weight: 600; letter-spacing: .3px; }
.brand__sub { font-size: 11px; color: #7d8da3; letter-spacing: .5px; }

/* 图片版 logo（替换旧「云」字方块） */
img.boot__logo, img.brand__logo, img.login__logo { object-fit: cover; background: #fff; display: block; }

/* 主页公司全称大字 */
.home-comp {
  font-size: 27px; font-weight: 800; color: #fff; letter-spacing: 1.5px;
  margin-bottom: 14px; text-shadow: 0 2px 12px rgba(0, 30, 70, .4);
  border-bottom: 1px solid rgba(255, 255, 255, .18); padding-bottom: 12px;
}

.nav { padding: 6px 10px; flex: 1; overflow-y: auto; }
.nav__group { font-size: 11px; color: #64748b; padding: 14px 10px 6px; letter-spacing: 1px; }
.nav__item {
  display: flex; align-items: center; gap: 10px; padding: 9px 12px; border-radius: 9px;
  color: #c2cedd; cursor: pointer; font-size: 13.5px; margin-bottom: 2px; user-select: none;
  transition: background .15s, color .15s;
}
.nav__item:hover { background: rgba(255, 255, 255, .06); color: #fff; }
.nav__item.active { background: linear-gradient(90deg, rgba(64, 158, 255, .22), rgba(64, 158, 255, .08)); color: #fff; box-shadow: inset 2px 0 0 #409eff; }
.nav__ico { width: 18px; text-align: center; font-size: 15px; opacity: .9; }
.nav__badge { margin-left: auto; background: #ef4444; color: #fff; font-size: 11px; border-radius: 9px; padding: 0 6px; line-height: 17px; }

.sidebar__foot { padding: 12px; border-top: 1px solid rgba(255, 255, 255, .07); }
.sideuser { display: flex; align-items: center; gap: 9px; padding: 6px; border-radius: 9px; cursor: pointer; }
.sideuser:hover { background: rgba(255, 255, 255, .06); }
.sideuser__ava {
  width: 32px; height: 32px; border-radius: 50%; display: grid; place-items: center;
  background: rgba(64, 158, 255, .2); color: #8ec5ff; font-size: 13px; font-weight: 600; flex: 0 0 32px;
}
.sideuser__n { color: #e6edf6; font-size: 13px; line-height: 1.3; }
.sideuser__r { color: #7d8da3; font-size: 11px; }

.main { flex: 1; min-width: 0; display: flex; flex-direction: column; }

.topbar {
  height: var(--topbar-h); background: rgba(255, 255, 255, .92); backdrop-filter: blur(8px);
  border-bottom: 1px solid var(--c-line); display: flex; align-items: center; gap: 14px;
  padding: 0 22px; position: sticky; top: 0; z-index: 20;
}
.topbar__title { font-size: 15.5px; font-weight: 600; }
.topbar__crumb { font-size: 12.5px; color: var(--c-text-3); }
.topbar__sp { flex: 1; }

.content { padding: 20px 24px 48px; width: 100%; max-width: 1500px; margin: 0 auto; }

/* ---------------- 通用组件 ---------------- */
.card { background: var(--c-surface); border: 1px solid var(--c-line); border-radius: var(--radius); box-shadow: var(--shadow-sm); }
.card + .card { margin-top: 16px; }
.card__head { display: flex; align-items: center; gap: 10px; padding: 14px 18px; border-bottom: 1px solid var(--c-line); }
.card__title { font-size: 14.5px; font-weight: 600; }
.card__sub { font-size: 12.5px; color: var(--c-text-3); }
.card__head .grow { flex: 1; }
.card__body { padding: 18px; }
.card__body--tight { padding: 12px 18px; }
.card__foot { padding: 12px 18px; border-top: 1px solid var(--c-line); display: flex; gap: 10px; align-items: center; }

.grid { display: grid; gap: 16px; }
.grid--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.grid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.grid--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.grid--side { grid-template-columns: minmax(0, 1fr) 460px; }

.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 6px;
  height: 36px; padding: 0 16px; border-radius: var(--radius-sm);
  border: 1px solid var(--c-line-2); background: #fff; color: var(--c-text);
  cursor: pointer; font-size: 13.5px; white-space: nowrap; transition: all .15s; font-weight: 500;
}
.btn:hover { border-color: var(--c-primary); color: var(--c-primary-700); }
.btn:active { transform: translateY(1px); }
.btn:disabled { opacity: .55; cursor: not-allowed; transform: none; }
.btn--primary { background: var(--c-primary); border-color: var(--c-primary); color: #fff; }
.btn--primary:hover { background: var(--c-primary-600); border-color: var(--c-primary-600); color: #fff; }
.btn--success { background: var(--c-success); border-color: var(--c-success); color: #fff; }
.btn--success:hover { background: var(--c-success-700); color: #fff; }
.btn--danger { background: #fff; border-color: #f3b9b9; color: var(--c-danger-700); }
.btn--danger:hover { background: var(--c-danger-soft); border-color: var(--c-danger); color: var(--c-danger-700); }
.btn--ghost { background: var(--c-surface-3); border-color: transparent; color: var(--c-text-2); }
.btn--ghost:hover { background: #e8eef6; color: var(--c-text); }
.btn--sm { height: 30px; padding: 0 11px; font-size: 12.5px; border-radius: 7px; }
.btn--lg { height: 44px; padding: 0 22px; font-size: 15px; border-radius: 10px; }
.btn--block { width: 100%; }
.btn--icon { width: 36px; padding: 0; }

.input, .select, .textarea {
  width: 100%; height: 36px; padding: 0 11px; border: 1px solid var(--c-line-2);
  border-radius: var(--radius-sm); background: #fff; outline: none; transition: border .15s, box-shadow .15s;
}
.textarea { height: auto; min-height: 88px; padding: 9px 11px; resize: vertical; line-height: 1.6; }
.input:focus, .select:focus, .textarea:focus { border-color: var(--c-primary); box-shadow: 0 0 0 3px rgba(64, 158, 255, .14); }
.input::placeholder, .textarea::placeholder { color: #b3bdc9; }
.select { appearance: none; background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath d='M2 4l4 4 4-4' stroke='%238b98a5' stroke-width='1.6' fill='none' stroke-linecap='round'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 10px center; padding-right: 28px; }

.field { margin-bottom: 14px; }
.field__label { font-size: 12.5px; color: var(--c-text-2); margin-bottom: 6px; display: flex; align-items: center; gap: 5px; }
.field__req { color: var(--c-danger); }
.field__hint { font-size: 12px; color: var(--c-text-3); margin-top: 5px; }
.field--err .input, .field--err .select, .field--err .textarea { border-color: var(--c-danger); }

.toolbar { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; }
.toolbar .input, .toolbar .select { width: auto; }
.toolbar__sp { flex: 1; }

.search { position: relative; }
.search .input { padding-left: 32px; min-width: 220px; }
.search__ico { position: absolute; left: 11px; top: 50%; transform: translateY(-50%); color: var(--c-text-3); font-size: 13px; }

.tag {
  display: inline-flex; align-items: center; gap: 4px; height: 22px; padding: 0 8px;
  border-radius: 6px; font-size: 12px; background: var(--c-surface-3); color: var(--c-text-2); white-space: nowrap;
}
.tag--blue { background: var(--c-primary-soft); color: var(--c-primary-700); }
.tag--green { background: var(--c-success-soft); color: var(--c-success-700); }
.tag--warn { background: var(--c-warn-soft); color: var(--c-warn-700); }
.tag--red { background: var(--c-danger-soft); color: var(--c-danger-700); }
.tag--gray { background: #eef1f5; color: var(--c-text-3); }

.table-wrap { overflow-x: auto; }
.table { width: 100%; border-collapse: separate; border-spacing: 0; font-size: 13.5px; }
.table th {
  text-align: left; font-weight: 600; color: var(--c-text-2); background: var(--c-surface-2);
  padding: 10px 14px; border-bottom: 1px solid var(--c-line); white-space: nowrap; font-size: 12.5px;
  position: sticky; top: 0; z-index: 1;
}
.table td { padding: 11px 14px; border-bottom: 1px solid #f0f3f7; vertical-align: middle; }
.table tbody tr:hover { background: #f8fbff; }
.table tbody tr:last-child td { border-bottom: none; }
.table .num { font-variant-numeric: tabular-nums; text-align: right; white-space: nowrap; }
.table .act { white-space: nowrap; text-align: right; }
.table .muted { color: var(--c-text-3); }
.table--compact td { padding: 8px 12px; }
.linkbtn { color: var(--c-primary-700); cursor: pointer; font-size: 13px; }
.linkbtn:hover { text-decoration: underline; }
.linkbtn + .linkbtn { margin-left: 12px; }
.linkbtn--danger { color: var(--c-danger-700); }
.linkbtn--muted { color: var(--c-text-3, #98a5b3); cursor: help; }

.empty { text-align: center; padding: 56px 20px; color: var(--c-text-3); }
.empty__ico { font-size: 34px; opacity: .5; margin-bottom: 8px; }

.pager { display: flex; align-items: center; gap: 8px; justify-content: flex-end; padding: 12px 18px; font-size: 13px; color: var(--c-text-2); }
.pager__btn { min-width: 30px; height: 30px; border-radius: 7px; border: 1px solid var(--c-line-2); background: #fff; cursor: pointer; padding: 0 8px; }
.pager__btn:hover:not(:disabled) { border-color: var(--c-primary); color: var(--c-primary-700); }
.pager__btn:disabled { opacity: .45; cursor: not-allowed; }
.pager__btn.active { background: var(--c-primary); border-color: var(--c-primary); color: #fff; }

/* 统计卡 */
.stat { position: relative; padding: 16px 18px; background: var(--c-surface); border: 1px solid var(--c-line); border-radius: var(--radius); overflow: hidden; }
.stat__label { font-size: 12.5px; color: var(--c-text-3); display: flex; align-items: center; gap: 6px; }
.stat__value { font-size: 26px; font-weight: 700; font-variant-numeric: tabular-nums; margin-top: 6px; letter-spacing: -.4px; }
.stat__sub { font-size: 12px; color: var(--c-text-3); margin-top: 4px; }
.stat::after { content: ''; position: absolute; right: -28px; top: -28px; width: 86px; height: 86px; border-radius: 50%; background: var(--c-primary-soft); opacity: .7; }
.stat--blue .stat__value { color: var(--c-primary-700); }
.stat--green .stat__value { color: var(--c-success-700); }
.stat--warn .stat__value { color: var(--c-warn-700); }
.stat--red .stat__value { color: var(--c-danger-700); }
.stat--green::after { background: var(--c-success-soft); }
.stat--warn::after { background: var(--c-warn-soft); }
.stat--red::after { background: var(--c-danger-soft); }

/* 横向条形 */
.bars { display: flex; flex-direction: column; gap: 12px; }
.bar__row { display: flex; align-items: center; gap: 10px; font-size: 13px; }
.bar__label { width: 74px; color: var(--c-text-2); flex: 0 0 74px; }
.bar__track { flex: 1; height: 8px; background: var(--c-surface-3); border-radius: 5px; overflow: hidden; }
.bar__fill { display: block; height: 100%; border-radius: 5px; background: linear-gradient(90deg, #6cb4ff, #409eff); }
.bar__val { width: 84px; text-align: right; font-variant-numeric: tabular-nums; color: var(--c-text-2); }

/* 时间线 */
.timeline { position: relative; padding-left: 18px; }
.timeline::before { content: ''; position: absolute; left: 5px; top: 6px; bottom: 6px; width: 2px; background: var(--c-line); }
.tl__item { position: relative; padding: 0 0 16px 4px; }
.tl__item:last-child { padding-bottom: 0; }
.tl__dot { position: absolute; left: -18px; top: 6px; width: 9px; height: 9px; border-radius: 50%; background: var(--c-primary); box-shadow: 0 0 0 3px var(--c-primary-soft); }
.tl__title { font-size: 13.5px; }
.tl__meta { font-size: 12px; color: var(--c-text-3); margin-top: 2px; }

/* 弹窗 */
.modal-mask { position: fixed; inset: 0; background: rgba(16, 30, 54, .45); display: flex; align-items: center; justify-content: center; z-index: 900; padding: 24px; animation: fade .16s ease; }
.modal { background: #fff; border-radius: 14px; box-shadow: var(--shadow-lg); width: 520px; max-width: 100%; max-height: 88vh; display: flex; flex-direction: column; animation: pop .18s ease; }
.modal--wide { width: 760px; }
.modal--full { width: 1000px; }
.modal__head { padding: 16px 20px; border-bottom: 1px solid var(--c-line); display: flex; align-items: center; gap: 10px; }
.modal__title { font-size: 15.5px; font-weight: 600; }
.modal__close { margin-left: auto; border: none; background: none; font-size: 20px; line-height: 1; color: var(--c-text-3); cursor: pointer; padding: 2px 6px; border-radius: 6px; }
.modal__close:hover { background: var(--c-surface-3); color: var(--c-text); }
.modal__body { padding: 20px; overflow-y: auto; }
.modal__foot { padding: 14px 20px; border-top: 1px solid var(--c-line); display: flex; gap: 10px; justify-content: flex-end; }
@keyframes fade { from { opacity: 0 } to { opacity: 1 } }
@keyframes pop { from { opacity: 0; transform: translateY(10px) scale(.985) } to { opacity: 1; transform: none } }

/* 轻提示 */
.toast-root { position: fixed; top: 18px; left: 50%; transform: translateX(-50%); z-index: 950; display: flex; flex-direction: column; gap: 8px; align-items: center; pointer-events: none; }
.toast {
  background: rgba(31, 45, 61, .94); color: #fff; padding: 9px 16px; border-radius: 9px; font-size: 13.5px;
  box-shadow: var(--shadow); animation: drop .2s ease; max-width: 70vw;
}
.toast--ok { background: #16a34a; }
.toast--err { background: #dc2626; }
@keyframes drop { from { opacity: 0; transform: translateY(-8px) } to { opacity: 1; transform: none } }

/* 登录页 */
.login { min-height: 100vh; display: flex; background: radial-gradient(1200px 600px at 15% 0%, #1a3355 0%, #0f1b2d 55%, #0b1421 100%); }
.login__main { flex: 1; display: flex; min-height: 0; }
.login__left { flex: 1; color: #dbe7f5; padding: 6vh 4.2vw; display: flex; flex-direction: column; justify-content: center; gap: 28px; }
.login__brand { display: flex; align-items: center; gap: 20px; }
.login__logo { width: 96px; height: 96px; border-radius: 24px; background: linear-gradient(135deg, #409eff, #1e6fd0); display: grid; place-items: center; font-size: 34px; font-weight: 700; color: #fff; box-shadow: 0 12px 30px rgba(64, 158, 255, .32); }
.login__brandname { color: #fff; font-size: 44px; line-height: 1.15; font-weight: 700; letter-spacing: 1px; text-shadow: 0 6px 20px rgba(0, 0, 0, .28); }
.login__h1 { font-size: 38px; line-height: 1.3; font-weight: 700; color: #fff; letter-spacing: 2.5px; white-space: nowrap; }
.login__h1gap { display: inline-block; width: .8em; }
.login__desc { font-size: 21px; color: #b0c3da; max-width: 680px; line-height: 1.8; }
.login__pts { display: flex; flex-wrap: wrap; gap: 10px; }
.login__pt { border: 1px solid rgba(255, 255, 255, .12); background: rgba(255, 255, 255, .05); color: #bfd1e6; padding: 9px 17px; border-radius: 999px; font-size: 15.5px; }
.login__right { width: 660px; flex: 0 0 660px; display: flex; align-items: center; justify-content: center; padding: 18px 78px 18px 4px; background: rgba(255, 255, 255, .03); }
.login__card { width: 100%; max-width: 578px; min-height: 620px; display: flex; flex-direction: column; justify-content: center; background: #fff; border-radius: 22px; padding: 46px 48px 44px; box-shadow: 0 24px 60px rgba(0, 0, 0, .35); }
.login__title { font-size: 22px; font-weight: 700; }
.login__sub { color: var(--c-text-3); font-size: 13.5px; margin-top: 5px; margin-bottom: 28px; }

/* 登录卡片放大后，内部文字同步放大，避免大框小字 */
.login__card .login__title { font-size: 30px; }
.login__card .login__sub { font-size: 17.5px; margin-bottom: 26px; }
.login__card .field { margin-bottom: 16px; }
.login__card .field__label { font-size: 16px; margin-bottom: 8px; }
.login__card .input { height: 50px; font-size: 17.5px; }
.login__card .login__meta { font-size: 15.5px; margin-top: 22px; }
.login__card .login__agree { font-size: 15px; margin-top: 14px; }
.login__card .login__agree-tip { font-size: 14px; }
.login__card .login-quick__txt { font-size: 15px; }
.login__card .btn--lg { height: 54px; font-size: 19px; }
.login__card .btn--sm { font-size: 15px; }

/* 桌面端（≥1121px）：深蓝背景、缩小并左移登录白框、隐藏框内协议与备案、改用页面底部条；移动端保持原样 */
@media (min-width: 1121px) {
  .login { flex-direction: column; background: linear-gradient(135deg, #1b2a4a 0%, #16223d 100%); }
  .login__right { align-items: center; justify-content: flex-start; padding: 20px 44px 20px 40px; }
  .login__card {
    position: relative;
    max-width: 360px;
    min-height: 0;
    padding: 32px 34px 30px;
    justify-content: flex-start;
  }
  .login__card .login__title { font-size: 23px; }
  .login__card .login__sub { font-size: 14px; margin-bottom: 22px; }
  .login__card .field { margin-bottom: 14px; }
  .login__card .field__label { font-size: 14.5px; margin-bottom: 7px; }
  .login__card .input { height: 46px; font-size: 16px; }
  .login__card .login__meta { font-size: 13.5px; margin-top: 16px; }
  .login__card .btn--lg { height: 48px; font-size: 17px; }
  .login__card .btn--sm { font-size: 14px; }
  .login__noacc-row { margin-top: 18px; }
  /* 桌面端封面：框内协议勾选块与备案信息隐藏，统一由底部条展示 */
  .login__agree, .login__agree-tip, .login__footer { display: none; }
  .login__page-footer { display: block; }
}
.login__meta { display: flex; justify-content: space-between; align-items: center; margin-top: 18px; font-size: 12.5px; }
.login__remember { display: flex; align-items: center; gap: 6px; color: var(--c-text-2); cursor: pointer; user-select: none; }
.login__remember input { accent-color: var(--c-primary); cursor: pointer; }
.login__forgot { color: var(--c-primary); cursor: pointer; user-select: none; }
.login__forgot:hover { text-decoration: underline; }

/* 登录页底部备案 / 版权条：默认隐藏，仅桌面端（≥1121px）显示；移动端沿用框内备案信息 */
.login__page-footer { display: none; background: #0f1d33; color: #8fa1bd; text-align: center; padding: 14px 20px; font-size: 12.5px; line-height: 1.9; }
.login__page-footer a { color: #9fb4d4; text-decoration: none; }
.login__page-footer a:hover { text-decoration: underline; }
.login__page-footer .pf-sep { color: #3f5474; margin: 0 8px; }
.login__page-footer .pf-copy { color: #9fb4d4; }
.login__page-footer .pf-beian { color: #8fa1bd; }
.login__page-footer .pf-shield { width: 13px; height: 13px; vertical-align: -2px; margin-right: 4px; }

/* 页面水印（屏幕显示用，导出文件不含水印） */
#ycWm { position: fixed; inset: 0; pointer-events: none; z-index: 9999; overflow: hidden; }
#ycWm span {
  position: absolute;
  transform: rotate(-24deg);
  font-size: 13px;
  color: rgba(30, 60, 100, .055);
  white-space: nowrap;
  user-select: none;
  letter-spacing: 1px;
}

/* 未连接服务器 */
.setup { max-width: 760px; margin: 8vh auto; padding: 0 20px; }
.setup__card { background: #fff; border-radius: 16px; padding: 30px; box-shadow: var(--shadow); }
.setup__steps { counter-reset: s; margin: 18px 0 22px; }
.setup__step { counter-increment: s; position: relative; padding-left: 34px; margin-bottom: 14px; font-size: 13.5px; color: var(--c-text-2); }
.setup__step::before {
  content: counter(s); position: absolute; left: 0; top: 1px; width: 22px; height: 22px; border-radius: 50%;
  background: var(--c-primary-soft); color: var(--c-primary-700); display: grid; place-items: center; font-size: 12px; font-weight: 600;
}
.code { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; background: var(--c-surface-3); padding: 2px 6px; border-radius: 5px; font-size: 12.5px; color: #b02a37; }

/* 详情描述 */
.desc { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1px; background: var(--c-line); border-radius: 10px; overflow: hidden; }
.desc__item { background: #fff; padding: 12px 14px; }
.desc__k { font-size: 12px; color: var(--c-text-3); margin-bottom: 3px; }
.desc__v { font-size: 14px; word-break: break-all; }
.desc__item--full { grid-column: 1 / -1; }

/* 消息 */
.chat { display: grid; grid-template-columns: 280px minmax(0, 1fr); height: calc(100vh - var(--topbar-h) - 68px); border: 1px solid var(--c-line); border-radius: var(--radius); overflow: hidden; background: #fff; }
.chat__list { border-right: 1px solid var(--c-line); overflow-y: auto; }
.chat__item { padding: 12px 14px; border-bottom: 1px solid #f0f3f7; cursor: pointer; display: flex; gap: 10px; }
.chat__item:hover { background: var(--c-surface-2); }
.chat__item.active { background: var(--c-primary-soft); }
.chat__ava { width: 36px; height: 36px; border-radius: 50%; background: var(--c-surface-3); display: grid; place-items: center; color: var(--c-text-2); flex: 0 0 36px; font-size: 13px; }
.chat__main { flex: 1; min-width: 0; }
.chat__name { font-size: 13.5px; font-weight: 500; display: flex; justify-content: space-between; gap: 6px; }
.chat__last { font-size: 12.5px; color: var(--c-text-3); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.chat__panel { display: flex; flex-direction: column; min-width: 0; }
.chat__head { padding: 12px 16px; border-bottom: 1px solid var(--c-line); font-weight: 600; }
.chat__body { flex: 1; overflow-y: auto; padding: 16px; background: var(--c-surface-2); display: flex; flex-direction: column; gap: 12px; }
.bubble { max-width: 62%; padding: 9px 13px; border-radius: 12px; font-size: 13.5px; line-height: 1.6; position: relative; word-break: break-word; }
.bubble--in { background: #fff; border: 1px solid var(--c-line); align-self: flex-start; }
.bubble--out { background: var(--c-primary); color: #fff; align-self: flex-end; }
.bubble__meta { font-size: 11px; opacity: .7; margin-top: 3px; }
.chat__input { border-top: 1px solid var(--c-line); padding: 10px 12px; display: flex; gap: 10px; align-items: flex-end; }
.chat__input .textarea { min-height: 40px; max-height: 120px; }

/* 签名板 */
.signpad { border: 1px dashed var(--c-line-2); border-radius: 10px; background: #fff; position: relative; }
.signpad canvas { display: block; width: 100%; height: 400px; border-radius: 10px; cursor: crosshair; touch-action: none; }
.signpad__tip { position: absolute; inset: 0; display: grid; place-items: center; color: #c3ccd7; font-size: 13px; pointer-events: none; }

/* 导出 */
.exp-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 10px; }
.exp-opt { border: 1px solid var(--c-line-2); border-radius: 10px; padding: 12px 14px; cursor: pointer; transition: all .15s; background: #fff; }
.exp-opt:hover { border-color: var(--c-primary); background: #fbfdff; }
.exp-opt.active { border-color: var(--c-primary); background: var(--c-primary-soft); box-shadow: 0 0 0 3px rgba(64, 158, 255, .1); }
.exp-opt__t { font-size: 13.5px; font-weight: 600; }
.exp-opt__d { font-size: 12px; color: var(--c-text-3); margin-top: 2px; line-height: 1.5; }

/* 选择框组 */
.checks { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 8px; }
.check { display: flex; align-items: center; gap: 7px; border: 1px solid var(--c-line-2); border-radius: 8px; padding: 7px 10px; cursor: pointer; font-size: 13px; background: #fff; }
.check:hover { border-color: var(--c-primary); }
.check input { accent-color: var(--c-primary); }
.check.on { border-color: var(--c-primary); background: var(--c-primary-soft); }

/* Tab */
.tabs { display: flex; gap: 4px; border-bottom: 1px solid var(--c-line); margin-bottom: 16px; overflow-x: auto; }
.tab { padding: 9px 14px; cursor: pointer; font-size: 13.5px; color: var(--c-text-2); border-bottom: 2px solid transparent; white-space: nowrap; }
.tab:hover { color: var(--c-primary-700); }
.tab.active { color: var(--c-primary-700); border-bottom-color: var(--c-primary); font-weight: 600; }

.notice-bar { display: flex; gap: 9px; align-items: flex-start; padding: 11px 14px; border-radius: 9px; background: var(--c-primary-soft); color: var(--c-primary-700); font-size: 13px; line-height: 1.65; }
.notice-bar--warn { background: var(--c-warn-soft); color: var(--c-warn-700); }
.notice-bar--gray { background: var(--c-surface-3); color: var(--c-text-2); }

.skeleton { background: linear-gradient(90deg, #eef2f7 25%, #f6f9fc 37%, #eef2f7 63%); background-size: 400% 100%; animation: sk 1.3s ease infinite; border-radius: 8px; }
@keyframes sk { 0% { background-position: 100% 50% } 100% { background-position: 0 50% } }

.mt0 { margin-top: 0 } .mt8 { margin-top: 8px } .mt12 { margin-top: 12px } .mt16 { margin-top: 16px } .mt24 { margin-top: 24px }
.row { display: flex; align-items: center; gap: 10px; }
.row--between { justify-content: space-between; }
.row--wrap { flex-wrap: wrap; }
.grow { flex: 1; min-width: 0; }
.muted { color: var(--c-text-3); }
.dim { color: var(--c-text-2); }
.bold { font-weight: 600; }
.tnum { font-variant-numeric: tabular-nums; }
.center { text-align: center; }
.right { text-align: right; }
.nowrap { white-space: nowrap; }
.hide { display: none !important; }

/* ---------------- 响应式 ---------------- */
@media (max-width: 1320px) {
  .grid--4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 1120px) {
  .grid--side { grid-template-columns: minmax(0, 1fr); }
  .login__left { display: none; }
  .login__right { flex: 1; width: auto; padding: 20px; }
  .content { padding: 16px 16px 40px; }
}
@media (max-width: 900px) {
  :root { --sidebar-w: 64px; }
  .brand__name, .brand__sub, .sideuser__n, .sideuser__r, .nav__group, .nav__badge { display: none; }
  .brand { justify-content: center; padding: 16px 8px 12px; }
  .nav__item { justify-content: center; padding: 11px 6px; }
  .nav__ico { font-size: 17px; }
  .sideuser { justify-content: center; }
  .grid--2, .grid--3 { grid-template-columns: minmax(0, 1fr); }
  .desc { grid-template-columns: minmax(0, 1fr); }
  .chat { grid-template-columns: 200px minmax(0, 1fr); }
}
@media (max-width: 640px) {
  .grid--4 { grid-template-columns: minmax(0, 1fr); }
  .topbar { padding: 0 12px; }
  .card__body { padding: 14px; }
  .chat { grid-template-columns: minmax(0, 1fr); }
  .chat__list { display: none; }
  .login__card { padding: 22px; }
}

/* 打印（导出 PDF 用浏览器打印时） */
@media print {
  .sidebar, .topbar, .btn, .pager, .toolbar { display: none !important; }
  .content { padding: 0; max-width: none; }
  .card { border: 1px solid #ddd; box-shadow: none; break-inside: avoid; }
  body { background: #fff; }
}

/* ---------------- 聊天：图片 / 文件 / 操作（Web 功能对齐） ---------------- */
.chat__newbtns { display: flex; flex-direction: column; gap: 8px; padding: 12px 14px; border-bottom: 1px solid var(--c-line); }
.bubble-row { display: flex; flex-direction: column; margin-bottom: 10px; }
.bubble-row.out { align-items: flex-end; }
.bubble-row.in { align-items: flex-start; }
.bubble__from { font-size: 11.5px; color: #8b98a5; margin-bottom: 2px; }
.bubble { position: relative; }
.bimg { display: block; max-width: 260px; max-height: 220px; border-radius: 8px; cursor: zoom-out; border: 1px solid rgba(0,0,0,.06); }
.bubble--out .bimg { cursor: zoom-out; }
.bfile { display: inline-block; padding: 8px 12px; border-radius: 8px; background: var(--c-surface-3, #f0f4f8); font-size: 13px; color: var(--c-primary-700, #1565c0); text-decoration: none; }
a.bfile:hover { text-decoration: underline; }
.msg-recalled { font-size: 12px; color: #9aa8b6; font-style: italic; }
.bubble__txt { white-space: normal; word-break: break-word; }
.bubble__acts { position: absolute; top: -12px; right: 0; display: none; gap: 8px; background: #fff; border: 1px solid var(--c-line); border-radius: 6px; padding: 2px 8px; box-shadow: var(--shadow-sm); }
.bubble:hover .bubble__acts { display: inline-flex; }
.bubble__acts a { font-size: 11.5px; cursor: pointer; color: var(--c-primary-700, #1565c0); }
.bubble__acts a:last-child { color: var(--c-danger, #d64541); }

/* ---------------- 单聊 / 群聊选择 ---------------- */
.seg { display: flex; background: var(--c-surface-3, #f0f4f8); border-radius: 9px; padding: 3px; }
.seg__btn { flex: 1; border: none; background: none; padding: 7px 0; font-size: 13px; border-radius: 7px; cursor: pointer; color: var(--c-text-2, #5a6b7d); }
.seg__btn--on { background: #fff; color: var(--c-primary-700, #1565c0); font-weight: 600; box-shadow: 0 1px 3px rgba(0,0,0,.08); }
.contact-list { max-height: 300px; overflow-y: auto; border: 1px solid var(--c-line); border-radius: 9px; }
.contact-item { display: flex; align-items: center; gap: 9px; padding: 8px 12px; border-bottom: 1px solid var(--c-line); cursor: pointer; font-size: 13.5px; }
.contact-item:last-child { border-bottom: none; }
.contact-item:hover { background: var(--c-surface-3, #f0f4f8); }
.contact-ava { width: 28px; height: 28px; border-radius: 50%; background: var(--c-primary, #409eff); color: #fff; display: inline-flex; align-items: center; justify-content: center; font-size: 13px; flex: 0 0 auto; }
.contact-name { font-weight: 500; }
.contact-role { margin-left: auto; font-size: 12px; }

/* ---------------- 弹窗右上角 ×：加大热区、更醒目 ---------------- */
.modal__close {
  margin-left: auto; border: none; background: none; cursor: pointer;
  width: 30px; height: 30px; border-radius: 50%;
  font-size: 22px; line-height: 28px; text-align: center; color: var(--c-text-3);
  padding: 0; transition: background .12s, color .12s, transform .12s;
}
.modal__close:hover { background: #fdecec; color: #d64541; transform: scale(1.08); }

/* ---------------- 聊天增强：表情面板 / 语音 / 气泡头像 ---------------- */
.chat__panel { position: relative; }
.baudio:hover { opacity: .8; }
.bubble--out .baudio { color: inherit; }
.bubble__ava { box-shadow: 0 0 0 1px rgba(0,0,0,.05); }

/* 签名区大小滑块 */
.signpad-bar { display: flex; align-items: center; gap: 10px; margin-bottom: 8px; }
.signpad-bar input[type="range"] { flex: 1; accent-color: #409eff; cursor: pointer; }
.signpad canvas { transition: height .1s ease; }

/* ==========================================================================
   美化层 20261023i：渐变 · 光效 · 悬浮动效（叠加式，不破坏原布局）
   ========================================================================== */

/* 全局背景：淡蓝渐变底色 */
body {
  background:
    radial-gradient(1200px 600px at 85% -10%, rgba(64, 158, 255, .08), transparent 60%),
    radial-gradient(900px 500px at -10% 110%, rgba(34, 197, 94, .05), transparent 55%),
    var(--c-bg);
  background-attachment: fixed;
}

/* 卡片：更大圆角 + 柔和投影 */
.card, .setup__card, .login__card, .modal, .signpad, .sheet {
  border-radius: 14px;
  box-shadow: 0 2px 6px rgba(16, 30, 54, .04), 0 10px 28px rgba(16, 30, 54, .07);
}

/* 主按钮：渐变 + 悬浮升起 */
.btn--primary {
  background: linear-gradient(135deg, #4da6ff 0%, #2b83e8 100%);
  box-shadow: 0 4px 14px rgba(43, 131, 232, .32);
  transition: all .18s ease;
}
.btn--primary:hover { transform: translateY(-1px); box-shadow: 0 6px 18px rgba(43, 131, 232, .42); }
.btn--primary:active { transform: translateY(0); }
.btn--lg { border-radius: 10px; letter-spacing: 4px; }

/* 顶栏：毛玻璃 */
.topbar {
  background: rgba(255, 255, 255, .82);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}

/* 统计卡：渐变底 + 悬浮升起 */
.stat { border-radius: 14px; transition: transform .18s ease, box-shadow .18s ease; cursor: pointer; }
.stat:hover { transform: translateY(-3px); box-shadow: 0 12px 26px rgba(16, 30, 54, .13); }
.stat--blue   { background: linear-gradient(135deg, #eaf3ff, #dcecfd); }
.stat--green  { background: linear-gradient(135deg, #e9f9ef, #d8f5e3); }
.stat--amber  { background: linear-gradient(135deg, #fff6e6, #ffedcc); }
.stat--slate  { background: linear-gradient(135deg, #eef1f5, #e3e9f0); }

/* 功能宫格：悬浮升起 + 图标微放大 */
.grid-menu__item { border-radius: 12px; padding: 12px 4px; transition: all .16s ease; cursor: pointer; }
.grid-menu__item:hover { background: var(--c-primary-soft); transform: translateY(-2px); }
.grid-menu__item:hover .grid-menu__ico { transform: scale(1.08); }
.grid-menu__ico { border-radius: 11px; transition: transform .16s ease; box-shadow: 0 3px 8px rgba(16, 30, 54, .08); }

/* 表格行悬浮 */
.table tbody tr { transition: background .12s ease; }
.table tbody tr:hover { background: #f4f8fd; }

/* 徽标微光 */
.badge--ok { box-shadow: 0 0 0 3px rgba(34, 197, 94, .12); }
.badge--warn { box-shadow: 0 0 0 3px rgba(245, 158, 11, .12); }

/* 登录页：更深邃的渐变 + 装饰光斑 + 入场动画 */
.login__left {
  background:
    radial-gradient(700px 360px at 80% 15%, rgba(64, 158, 255, .28), transparent 60%),
    radial-gradient(520px 320px at 15% 90%, rgba(34, 197, 94, .14), transparent 55%),
    linear-gradient(160deg, #0d1a30 0%, #12233f 55%, #0f1b2d 100%);
}
.login__h1 {
  background: linear-gradient(120deg, #ffffff 30%, #9ecbff 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}
.login__card { animation: ycFadeUp .45s ease both; }
.login__pt { transition: all .15s ease; }
.login__pt:hover { background: rgba(64, 158, 255, .18); border-color: rgba(64, 158, 255, .4); color: #dceaff; }
@keyframes ycFadeUp {
  from { opacity: 0; transform: translateY(16px); }
  to { opacity: 1; transform: translateY(0); }
}

/* 主内容入场 */
.content > * { animation: ycFadeUp .3s ease both; }

/* 导航悬浮更顺滑 */
.nav__item { transition: background .15s, color .15s, padding-left .15s; }
.nav__item:hover { padding-left: 15px; }

/* 一键登录条（token 方案，不存密码） */
.login-quick {
  display: flex; align-items: center; gap: 10px;
  padding: 10px 12px; margin-bottom: 14px;
  background: linear-gradient(135deg, #eaf3ff, #f4faff);
  border: 1px solid #cfe4fb; border-radius: 10px;
}
.login-quick__dot { width: 8px; height: 8px; border-radius: 50%; background: #34c759; box-shadow: 0 0 0 3px rgba(52, 199, 89, .18); flex: none; }
.login-quick__txt { flex: 1; font-size: 12.5px; color: #3c5a78; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.login-quick .btn--sm { padding: 6px 14px; font-size: 12.5px; border-radius: 8px; }
.login-quick__x { font-size: 12px; color: #98a8b8; cursor: pointer; user-select: none; }
.login-quick__x:hover { color: #e05252; }

/* ==========================================================================
   技术安全中心（Web 版专用）
   ========================================================================== */
.sec-cols { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 14px; }
@media (max-width: 1180px) { .sec-cols { grid-template-columns: minmax(0, 1fr); } }

.sec-find { padding: 11px 0; border-bottom: 1px dashed var(--c-line); }
.sec-find:last-child { border-bottom: none; }
.sec-find__head { display: flex; align-items: center; gap: 8px; font-size: 13.5px; }
.sec-find__desc { font-size: 12.5px; color: var(--c-text-2); margin-top: 5px; line-height: 1.7; }

.sec-trend { display: flex; align-items: flex-end; gap: 8px; height: 132px; }
.sec-trend__col { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: flex-end; height: 100%; gap: 4px; }
.sec-trend__num { font-size: 11px; color: var(--c-text-3); }
.sec-trend__bar { width: 100%; max-width: 34px; background: linear-gradient(180deg, #7cb8ff, var(--c-primary)); border-radius: 5px 5px 2px 2px; min-height: 3px; transition: height .3s; }
.sec-trend__x { font-size: 11px; color: var(--c-text-3); }

.sec-top { display: flex; align-items: center; gap: 8px; font-size: 12.5px; margin-bottom: 5px; }
.sec-top__k { width: 128px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-variant-numeric: tabular-nums; }
.sec-top__bar { flex: 1; height: 7px; background: var(--c-surface-3); border-radius: 4px; overflow: hidden; }
.sec-top__bar i { display: block; height: 100%; background: linear-gradient(90deg, #ffb4b4, var(--c-danger)); border-radius: 4px; }
.sec-top__v { width: 34px; text-align: right; color: var(--c-text-2); font-variant-numeric: tabular-nums; }

.sec-chips { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 10px; }
.sec-chip { border: 1px solid var(--c-line); background: #fff; color: var(--c-text-2); font-size: 12.5px; padding: 4px 11px; border-radius: 999px; cursor: pointer; transition: all .14s; }
.sec-chip:hover { border-color: var(--c-primary); color: var(--c-primary-700); }
.sec-chip.is-on { background: var(--c-primary); border-color: var(--c-primary); color: #fff; }

.sec-note { font-size: 12px; color: var(--c-text-3); background: var(--c-surface-3); border-radius: 8px; padding: 8px 12px; margin-bottom: 12px; line-height: 1.7; }

.sec-ev { border: 1px solid var(--c-line); border-radius: 10px; padding: 12px 14px; margin-bottom: 10px; background: var(--c-surface); }
.sec-ev--done { opacity: .68; background: var(--c-surface-2); }
.sec-ev__head { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.sec-ev__ip { font-family: ui-monospace, SFMono-Regular, Consolas, monospace; font-size: 14px; }
.sec-ev__loc { font-size: 13px; color: var(--c-primary-700); margin-top: 6px; }
.sec-ev__detail { font-size: 12.5px; color: var(--c-text-2); margin-top: 5px; line-height: 1.7; }
.sec-ev__meta { display: flex; flex-wrap: wrap; gap: 14px; font-size: 12px; color: var(--c-text-3); margin-top: 6px; }
.sec-ev__ops { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 10px; }

.sec-switch { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.sec-sw { position: relative; display: inline-block; width: 44px; height: 24px; flex: none; }
.sec-sw input { opacity: 0; width: 0; height: 0; }
.sec-sw i { position: absolute; inset: 0; background: #d3dbe6; border-radius: 999px; transition: background .18s; cursor: pointer; }
.sec-sw i::after { content: ''; position: absolute; left: 3px; top: 3px; width: 18px; height: 18px; background: #fff; border-radius: 50%; box-shadow: 0 1px 3px rgba(0,0,0,.18); transition: transform .18s; }
.sec-sw input:checked + i { background: var(--c-primary); }
.sec-sw input:checked + i::after { transform: translateX(20px); }

/* ==========================================================================
 * 路由切换体验优化（2026-10）
 * 切页时保留上一页内容并压暗，顶部显示一条进度线，避免每次换页都闪白屏
 * ========================================================================== */
#view { transition: opacity .12s ease; }
#view.view--busy { opacity: .42; pointer-events: none; filter: saturate(.7); }

body::after {
  content: '';
  position: fixed;
  top: 0; left: 0;
  height: 2px;
  width: 0;
  background: linear-gradient(90deg, #2b83e8, #22a06b);
  box-shadow: 0 0 8px rgba(43, 131, 232, .55);
  z-index: 99999;
  opacity: 0;
  transition: opacity .18s ease;
  pointer-events: none;
}
body.is-routing::after { opacity: 1; }
body.is-routing::after { animation: routeBar 1.2s ease forwards; }
@keyframes routeBar {
  0%   { width: 6%; }
  55%  { width: 62%; }
  100% { width: 88%; }
}

/* ===== 企业头像（企业管理卡片 / 企业信息）：网页端此前只有首字母色块，与小程序头像不一致 ===== */
.comp-ava-wrap {
  width: 44px; height: 44px; flex: 0 0 44px;
  border-radius: 12px; overflow: hidden;
  background: var(--c-primary-soft);
  border: 1px solid var(--c-line);
  display: grid; place-items: center;
  position: relative;
}
.comp-ava-wrap[data-cava] { cursor: pointer; }
.comp-ava-wrap[data-cava]:hover::after {
  content: '换';
  position: absolute; inset: 0;
  background: rgba(20, 34, 52, .55); color: #fff;
  font-size: 12px; display: grid; place-items: center;
}
.comp-ava-img { width: 100%; height: 100%; object-fit: cover; display: block; }
.comp-ava-ph {
  width: 100%; height: 100%;
  display: grid; place-items: center;
  font-weight: 600; color: var(--c-primary-700); font-size: 17px;
}
/* 列表里的小头像：姓名左侧统一用这个尺寸，保证「上级看得见」时排版不跳 */
.ava-mini {
  width: 30px; height: 30px; flex: 0 0 30px;
  border-radius: 50%; overflow: hidden;
  background: var(--c-surface-3);
  border: 1px solid #e4e9f0;
  display: grid; place-items: center;
  font-size: 12px; color: #5c6b7a;
}
.ava-mini img { width: 100%; height: 100%; object-fit: cover; display: block; }
.ava-xs {
  width: 22px; height: 22px; flex: 0 0 22px;
  border-radius: 50%; overflow: hidden;
  background: var(--c-primary-soft);
  display: inline-grid; place-items: center;
  font-size: 11px; color: var(--c-primary-700);
}
.ava-xs img { width: 100%; height: 100%; object-fit: cover; display: block; }

/* ===== 登录协议合规（与小程序端一致） ===== */
.login__agree { display: flex; align-items: center; gap: 4px; margin: 12px 0 0; font-size: 12.5px; flex-wrap: wrap; }
.login__agree.is-locked #agreeChk { opacity: .5; cursor: not-allowed; }
.login__agree-txt { color: #5a6b7d; }
.login__agree-link { color: #409eff; cursor: pointer; text-decoration: none; }
.login__agree-link:hover { text-decoration: underline; }
.login__agree-tip { font-size: 12px; color: #e67e22; margin-top: 6px; }
.is-dim { opacity: .55; cursor: not-allowed; }
.legal-doc { font-size: 13.5px; line-height: 1.8; color: #3d4a57; }
.legal-doc .h1 { font-size: 17px; font-weight: 700; color: #1a2b3c; margin: 18px 0 8px; }
.legal-doc .h2 { font-size: 15px; font-weight: 700; color: #1a2b3c; margin: 16px 0 6px; }
.legal-doc .ver { font-size: 12.5px; color: #3d4a57; font-weight: 700; margin-bottom: 10px; }
.legal-doc .p { margin-bottom: 8px; text-align: justify; }

/* 协议合并弹窗：主标题与两份协议大标题（加粗 · 大字 · 居中） */
.legal-main-title { font-size: 17px; font-weight: 700; color: #1a2b3c; text-align: center; margin: 4px 0 14px; }
.legal-doc-title { font-size: 16px; font-weight: 700; color: #1a2b3c; text-align: center; margin: 18px 0 8px; }

/* ==========================================================================
 * 手机端模式（body.mobile-mode）：与微信小程序一致的底部导航布局
 * ========================================================================== */
.mtabs { display: none; }
body.mobile-mode .sidebar { display: none !important; }
body.mobile-mode .layout { display: block; }
body.mobile-mode .main { display: flex; flex-direction: column; min-height: 100vh; }
body.mobile-mode .topbar { padding: 10px 14px; }
body.mobile-mode .topbar__crumb { display: none; }
body.mobile-mode .content {
  flex: 1;
  width: 100%;
  max-width: 560px;
  margin: 0 auto;
  padding: 12px 12px calc(76px + env(safe-area-inset-bottom, 0px));
}
body.mobile-mode .content .card { border-radius: 14px; }
body.mobile-mode .content .toolbar { flex-wrap: wrap; gap: 8px; }
body.mobile-mode .grid { grid-template-columns: 1fr 1fr; }
body.mobile-mode .grid--3, body.mobile-mode .grid--4 { grid-template-columns: 1fr 1fr; }
body.mobile-mode .grid--side { grid-template-columns: 1fr; }
body.mobile-mode .mtabs {
  display: flex;
  position: fixed;
  left: 0; right: 0; bottom: 0;
  height: calc(58px + env(safe-area-inset-bottom, 0px));
  padding-bottom: env(safe-area-inset-bottom, 0px);
  background: #fff;
  border-top: 1px solid var(--c-line);
  box-shadow: 0 -6px 18px rgba(16, 32, 64, .08);
  z-index: 60;
  max-width: 100%;
}
body.mobile-mode .mtabs__item {
  flex: 1;
  display: flex; flex-direction: column;
  align-items: center; justify-content: center;
  gap: 2px;
  color: #8b98a5;
  font-size: 11px;
  cursor: pointer;
  user-select: none;
}
body.mobile-mode .mtabs__ico { font-size: 19px; line-height: 1; }
body.mobile-mode .mtabs__item.active { color: var(--c-primary-700, #1e6fd0); font-weight: 600; }

/* ==========================================================================
 * 订单页批量操作条（常显，勾选后按可执行数量启用按钮）
 * ========================================================================== */
.batchbar {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 10px;
  padding: 10px 12px;
  background: var(--c-surface-2, #f6f9fc);
  border: 1px dashed var(--c-line-2, #d9e3ee);
  border-radius: 9px;
  font-size: 13px;
}
.batchbar__title { font-weight: 700; color: var(--c-text, #17325a); }
.batchbar__sel { color: var(--c-text-2, #5c6b7a); }
.batchbar__sel b { color: var(--c-primary-700, #1e6fd0); }
.batchbar__tip { color: #b45309; font-size: 12px; }
.batchbar .btn[disabled] { opacity: .45; cursor: not-allowed; }

/* 重复订单识别面板（订单页 → 🧹 重复订单） */
.dupbar { display: flex; align-items: center; gap: 8px; margin: 10px 0 2px; flex-wrap: wrap; }
.dupgrp { border: 1px solid var(--c-line); border-radius: 12px; padding: 10px 12px; margin-top: 10px; background: #fff; }
.dupgrp__h { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; font-size: 12.5px; color: var(--c-text-2); padding-bottom: 8px; border-bottom: 1px dashed var(--c-line); }
.dupgrp__h b { font-size: 14px; color: var(--c-text); }
.dupitem { display: flex; align-items: center; gap: 12px; padding: 7px 0; font-size: 12.5px; border-bottom: 1px dashed #f0f3f7; cursor: pointer; }
.dupitem:last-child { border-bottom: none; }
.dupitem__t { color: var(--c-text-2); min-width: 132px; }
.dupitem--keep { background: #f6fbf6; }
.dupitem__keep { margin-left: auto; font-size: 11.5px; color: #2f9e44; }
body.mobile-mode .dupitem { flex-wrap: wrap; gap: 4px 10px; }
body.mobile-mode .dupitem__t { min-width: 0; }
body.mobile-mode .dupitem__keep { margin-left: 0; }
body.mobile-mode .batchbar { gap: 6px; padding: 8px 10px; font-size: 12px; }
body.mobile-mode .batchbar .btn { flex: 1 1 44%; }

/* ==========================================================================
 * 登录页 · 手机端登录布局（与微信小程序一致；切换入口已取消，系统自动识别）
 * ========================================================================== */

/* 手机端：隐藏左侧宣传区，登录卡片居中铺满，形态贴合小程序 */
body.mobile-mode .login {
  display: block;
  min-height: 100vh;
  padding: 0;
  background: linear-gradient(180deg, #eef5ff 0%, #f7fafd 46%, #ffffff 100%);
}
body.mobile-mode .login__left { display: none !important; }
body.mobile-mode .login__right {
  width: 100%;
  max-width: 480px;
  margin: 0 auto;
  padding: 58px 18px 28px;
  flex: none;
}
body.mobile-mode .login__card {
  max-width: 100%;
  min-height: auto;
  padding: 26px 20px 24px;
  border-radius: 18px;
  box-shadow: 0 10px 30px rgba(20, 48, 84, .10);
}
body.mobile-mode .login__card .login__title { font-size: 23px; }
body.mobile-mode .login__card .login__sub { font-size: 13.5px; line-height: 1.6; }
body.mobile-mode .login__card .input { height: 46px; font-size: 16px; }
body.mobile-mode .login__card .btn--lg { height: 50px; font-size: 17px; }
body.mobile-mode .login__card .field__label { font-size: 14px; }

/* ==========================================================================
 * 登录页公告 / 广告栏（一级发布的广告 + 标记登录页展示的公告）
 * ========================================================================== */
.login-ann {
  background: rgba(255, 255, 255, .96);
  border: 1px solid var(--c-line-2, #d9e3ee);
  border-left: 4px solid var(--c-primary, #409eff);
  border-radius: 12px;
  padding: 12px 14px;
  margin-bottom: 14px;
  box-shadow: 0 6px 18px rgba(20, 48, 84, .07);
  max-width: 578px;
}
.login-ann__head { display: flex; align-items: center; gap: 8px; }
.login-ann__tag {
  flex: none; font-size: 11px; font-weight: 700; color: #b45309;
  background: #fff6e6; border-radius: 6px; padding: 2px 7px;
}
.login-ann__title { flex: 1; min-width: 0; font-size: 14px; font-weight: 600; color: var(--c-text, #17325a); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.login-ann__x { flex: none; color: #a3aeba; font-size: 12px; cursor: pointer; padding: 0 2px; }
.login-ann__x:hover { color: #d9534f; }
.login-ann__body {
  margin-top: 6px; font-size: 12.5px; line-height: 1.7; color: var(--c-text-2, #5c6b7a);
  display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden;
  white-space: pre-wrap; word-break: break-word;
}
.login-ann__imgs { display: flex; gap: 8px; margin-top: 8px; }
.login-ann__imgs img { width: 66px; height: 66px; border-radius: 8px; object-fit: cover; border: 1px solid var(--c-line-2); }
.login-ann__files { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 8px; font-size: 12px; }
.login-ann__files a { color: var(--c-primary-700, #1e6fd0); text-decoration: none; }
.login-ann__files a:hover { text-decoration: underline; }
body.mobile-mode .login-ann { max-width: 100%; margin-bottom: 12px; padding: 10px 12px; }
body.mobile-mode .login-ann__body { -webkit-line-clamp: 2; font-size: 12px; }

/* 「没有账号密码请点击」入口 + 平台介绍大弹窗 */
.login__noacc-row { text-align: center; margin-top: 12px; }
.login__noacc {
  display: inline-block; font-size: 14px; color: var(--c-primary-700, #1e6fd0);
  cursor: pointer; user-select: none; padding: 4px 10px; border-radius: 8px;
}
.login__noacc:hover { background: var(--c-primary-50, #eaf3ff); text-decoration: underline; }
.admodal { max-height: 62vh; overflow: auto; }
.admodal__item { padding: 14px 4px 16px; border-bottom: 1px dashed var(--c-line-2); text-align: center; }
.admodal__item:last-child { border-bottom: none; }
.admodal__title { font-size: 19px; font-weight: 700; color: #1f2d3d; }
.admodal__star { color: #f59e0b; margin-right: 6px; }
.admodal__txt { font-size: 15px; line-height: 1.9; color: #33445a; white-space: pre-wrap; margin-top: 8px; text-align: left; }
.admodal__imgs { display: flex; flex-direction: column; align-items: center; gap: 10px; margin-top: 12px; }
.admodal__imgs img { max-width: 100%; max-height: 460px; border-radius: 10px; border: 1px solid var(--c-line-2); object-fit: contain; background: #fff; }
.admodal__files { display: flex; flex-wrap: wrap; gap: 12px; justify-content: center; margin-top: 12px; font-size: 14px; }
.admodal__files a { color: var(--c-primary-700, #1e6fd0); text-decoration: none; }
.admodal__files a:hover { text-decoration: underline; }

/* ==========================================================================
 * 手机端模式 · 真·小程序形态（不是把网页缩小）
 *   表格 → 卡片列表；工具栏 → 竖排；卡片 → 圆角大间距；弹窗 → 全屏
 * ========================================================================== */
body.mobile-mode { background: #f2f6fb; }
body.mobile-mode .topbar {
  position: sticky; top: 0; z-index: 40;
  padding: 10px 14px;
  background: rgba(255, 255, 255, .96);
  backdrop-filter: blur(8px);
  border-bottom: 1px solid var(--c-line);
}
body.mobile-mode .topbar__title { font-size: 17px; }
body.mobile-mode .topbar .btn--sm { padding: 6px 10px; font-size: 12.5px; }
body.mobile-mode .content { padding: 10px 12px calc(72px + env(safe-area-inset-bottom, 0px)); }

/* 工具栏：输入框/按钮占满整行，避免横向挤压 */
body.mobile-mode .toolbar { display: flex; flex-direction: column; align-items: stretch; gap: 8px; }
body.mobile-mode .toolbar > * { width: 100% !important; }
body.mobile-mode .toolbar .toolbar__sp { display: none; }
body.mobile-mode .toolbar .search { width: 100%; }
body.mobile-mode .toolbar .input, body.mobile-mode .toolbar .select { height: 42px; font-size: 15px; }
body.mobile-mode .toolbar .btn { height: 42px; font-size: 14.5px; }

/* 卡片头：允许换行，标题与操作不叠在一起 */
body.mobile-mode .card__head { flex-wrap: wrap; gap: 6px; }
body.mobile-mode .card__body { padding: 12px; }
body.mobile-mode .card__title { font-size: 16px; }

/* 表格折成卡片：每行一张卡，字段名 + 值 */
body.mobile-mode .table-wrap { overflow: visible; }
body.mobile-mode .table { display: block; width: 100%; border: none; background: transparent; }
body.mobile-mode .table thead { display: none; }
body.mobile-mode .table tbody { display: block; }
body.mobile-mode .table tr {
  display: block;
  background: #fff;
  border: 1px solid var(--c-line);
  border-radius: 14px;
  padding: 12px 14px;
  margin-bottom: 10px;
  box-shadow: 0 3px 12px rgba(16, 32, 64, .05);
}
body.mobile-mode .table tr:hover { background: #fff; }
body.mobile-mode .table td {
  display: flex; align-items: flex-start; gap: 10px;
  padding: 5px 0; border: none; text-align: left;
  font-size: 15px; line-height: 1.55; white-space: normal; word-break: break-word;
}
body.mobile-mode .table td::before {
  content: attr(data-label);
  flex: 0 0 76px;
  color: #8b98a5;
  font-size: 13px;
  line-height: 1.7;
}
body.mobile-mode .table td:first-child::before,
body.mobile-mode .table td.act::before { content: none; }
body.mobile-mode .table td.num { justify-content: flex-start; }
body.mobile-mode .table td.act {
  display: flex; flex-wrap: wrap; gap: 8px;
  margin-top: 8px; padding-top: 10px;
  border-top: 1px dashed #e6ecf3;
}
body.mobile-mode .table td.act .linkbtn {
  padding: 7px 12px; border-radius: 8px; background: #f2f7fd;
  font-size: 13.5px; text-decoration: none;
}
body.mobile-mode .table td.act .linkbtn--danger { background: #fdf1f1; }
body.mobile-mode .table tr > td:first-child:not([data-label]) { padding-bottom: 2px; }

/* 描述型信息块：单列 */
body.mobile-mode .desc { display: block; }
body.mobile-mode .desc__item { display: flex; justify-content: space-between; gap: 12px; padding: 8px 0; border-bottom: 1px dashed #eef2f7; }
body.mobile-mode .desc__k { color: #8b98a5; font-size: 13.5px; }
body.mobile-mode .desc__v { font-size: 14.5px; text-align: right; }

/* 页签：横向可滑动，不换行挤压 */
body.mobile-mode .tabs { display: flex; gap: 6px; overflow-x: auto; flex-wrap: nowrap; -webkit-overflow-scrolling: touch; }
body.mobile-mode .tab { flex: 0 0 auto; padding: 8px 14px; font-size: 14px; }
body.mobile-mode .grid, body.mobile-mode .grid--2, body.mobile-mode .grid--3, body.mobile-mode .grid--4 { display: block; }
body.mobile-mode .grid > * + * { margin-top: 10px; }

/* 弹窗：接近全屏，操作按钮大而好点 */
body.mobile-mode .modal, body.mobile-mode .modal--wide, body.mobile-mode .modal--full {
  width: calc(100vw - 16px) !important; max-width: none; max-height: 90vh; border-radius: 16px;
}
body.mobile-mode .modal-mask { padding: 8px; align-items: flex-end; }
body.mobile-mode .modal__head { padding: 14px 16px; }
body.mobile-mode .modal__foot { padding: 12px 16px; }
body.mobile-mode .modal__body { max-height: 64vh; padding: 14px; }
body.mobile-mode .modal .field__label { font-size: 14px; }
body.mobile-mode .modal .input, body.mobile-mode .modal .select, body.mobile-mode .modal .textarea { font-size: 16px; min-height: 44px; }
body.mobile-mode .modal .btn { min-height: 44px; font-size: 15px; }

/* 空态、分页、链接按钮手机尺寸 */
body.mobile-mode .empty { padding: 40px 16px; font-size: 14px; }
body.mobile-mode .pager { gap: 6px; }
body.mobile-mode .linkbtn { font-size: 14px; }

/* ==========================================================================
 * 手机端 · 工作台（内容与排版同微信小程序工作台）
 * ========================================================================== */
body.mobile-mode .mhome-stats { display: flex; align-items: stretch; padding: 14px 6px; }
body.mobile-mode .mhome-stat { flex: 1; text-align: center; cursor: pointer; padding: 2px 4px; }
body.mobile-mode .mhome-stat + .mhome-stat { border-left: 1px solid #eef2f7; }
body.mobile-mode .mhome-stat:active { opacity: .7; }
body.mobile-mode .mhome-stat b { display: block; font-size: 20px; font-weight: 700; color: #1f4a7c; font-variant-numeric: tabular-nums; }
body.mobile-mode .mhome-stat span { display: block; font-size: 12px; color: #8b98a5; margin-top: 3px; }
body.mobile-mode .mhome-grid { display: grid !important; grid-template-columns: repeat(4, 1fr) !important; gap: 16px 4px !important; }
body.mobile-mode .mhome-cell { display: flex; flex-direction: column; align-items: center; gap: 6px; cursor: pointer; }
body.mobile-mode .mhome-cell:active { opacity: .7; }
body.mobile-mode .mhome-cell__ico {
  width: 46px; height: 46px; border-radius: 14px; display: grid; place-items: center;
  font-size: 20px; color: #fff; background: linear-gradient(135deg, #4aa0f5, #1e6fd0);
  box-shadow: 0 4px 10px rgba(30, 111, 208, .22);
}
body.mobile-mode .mhome-cell:nth-child(4n+2) .mhome-cell__ico { background: linear-gradient(135deg, #34d399, #0ea573); box-shadow: 0 4px 10px rgba(14, 165, 115, .2); }
body.mobile-mode .mhome-cell:nth-child(4n+3) .mhome-cell__ico { background: linear-gradient(135deg, #fbbf24, #f59e0b); box-shadow: 0 4px 10px rgba(245, 158, 11, .2); }
body.mobile-mode .mhome-cell:nth-child(4n+4) .mhome-cell__ico { background: linear-gradient(135deg, #a78bfa, #7c5cf0); box-shadow: 0 4px 10px rgba(124, 92, 240, .2); }
body.mobile-mode .mhome-cell__t { font-size: 12.5px; color: #33445a; }
/* 英雄卡、账单卡手机端收窄内边距，与小程序观感一致 */
body.mobile-mode .content .card__body[style*="padding:22px 24px"] { padding: 18px 16px !important; }
body.mobile-mode .mhome-grid + .mt12 { margin-top: 12px; }

/* ==========================================================================
 * 手机端二次瘦身（屏小空间宝贵：压缩英雄卡、卡片行距与字号）
 * ========================================================================== */
/* 企业形象背景图不再按原始比例撑开（那是「一大片空白」的来源），限高裁切 */
body.mobile-mode .content img[alt="企业形象"] { max-height: 150px; width: 100%; object-fit: cover; }
body.mobile-mode .content .card__body { padding: 11px 12px; }
body.mobile-mode .content .card__head { padding: 10px 12px; }
/* 卡片行：字号 / 行距 / 间距整体收紧 */
body.mobile-mode .table tr { padding: 9px 12px; margin-bottom: 8px; border-radius: 12px; }
body.mobile-mode .table td { padding: 3px 0; font-size: 14px; gap: 8px; line-height: 1.5; }
body.mobile-mode .table td::before { flex: 0 0 62px; font-size: 12px; line-height: 1.6; }
body.mobile-mode .table td.act { margin-top: 6px; padding-top: 8px; }
body.mobile-mode .table td.act .linkbtn { padding: 5px 10px; font-size: 12.5px; }
/* 工作台统计与迷你数字略缩 */
body.mobile-mode .mhome-stat b { font-size: 18px; }
body.mobile-mode .mini-stat-v, body.mobile-mode [style*="font-size:22px"] { font-size: 18px !important; }

/* ==========================================================================
 * 手机端 · 订单卡对齐微信小程序（卡片头 = 订单名 + 右上角状态胶囊；金额加粗；操作按钮成排）
 * ========================================================================== */
body.mobile-mode .table tr { position: relative; }
/* 第一列「订单信息」作为卡片头：隐藏字段名前缀，标题加粗 + 客户/时间副行 */
body.mobile-mode .table td[data-label="订单信息"] {
  display: block;
  padding: 0 0 7px;
  margin-bottom: 5px;
  border-bottom: 1px solid #f0f3f7;
}
body.mobile-mode .table td[data-label="订单信息"]::before { display: none; }
body.mobile-mode .table td[data-label="订单信息"] .bold { font-size: 15.5px; font-weight: 700; color: #1f2d3d; }
/* 状态胶囊：绝对定位到卡片右上角（与小程序 order-card__top 同位） */
body.mobile-mode .table td[data-label="状态"] { position: absolute; top: 9px; right: 12px; padding: 0; }
body.mobile-mode .table td[data-label="状态"]::before { display: none; }
body.mobile-mode .table td[data-label="状态"] .tag {
  display: inline-block; font-size: 11.5px; padding: 3px 10px; border-radius: 999px; font-weight: 600; white-space: nowrap;
}
/* 金额行突出（小程序卡片金额加粗醒目） */
body.mobile-mode .table td[data-label="金额"] b { font-size: 15px; color: #1f4a7c; }
/* 操作按钮：与小程序底部按钮一致，成排铺开、加大点击区 */
body.mobile-mode .table td.act {
  display: flex; flex-wrap: wrap; gap: 8px; justify-content: flex-end;
  margin-top: 8px; padding-top: 9px; border-top: 1px dashed #eef2f7;
}
body.mobile-mode .table td.act::before { display: none; }
body.mobile-mode .table td.act .linkbtn {
  padding: 7px 14px; font-size: 13px; border-radius: 8px; background: #f2f6fb; border: 1px solid #e2eaf3;
}
body.mobile-mode .table td.act .linkbtn--danger { background: #fdf1f1; border-color: #f5d9d9; }
/* 搜索框/工具栏：同小程序筛选条样式 */
body.mobile-mode .toolbar { gap: 8px; }
body.mobile-mode .toolbar .search .input, body.mobile-mode .toolbar .input, body.mobile-mode .toolbar .select {
  height: 40px; font-size: 14.5px;
}
body.mobile-mode .toolbar .btn { height: 40px; font-size: 14px; padding: 0 14px; }

/* ==========================================================================
 * 手机端 · 订单列表 1:1 还原微信小程序（order-card / ol-sum / fab）
 *   数值来自 miniprogram/pages/order/order-list/order-list.wxss（rpx ÷ 2 = px）
 * ========================================================================== */
body.mobile-mode .card { background: #fff; border-radius: 12px; border: none; box-shadow: 0 1px 2px rgba(16, 32, 64, .04), 0 6px 16px rgba(16, 32, 64, .05); }
body.mobile-mode .card__body--tight { padding: 10px 12px; }
body.mobile-mode .tabs { display: flex; gap: 6px; overflow-x: auto; padding-bottom: 2px; scrollbar-width: none; }
body.mobile-mode .tabs::-webkit-scrollbar { display: none; }
body.mobile-mode .tab { flex: none; padding: 5px 11px; border-radius: 999px; font-size: 12px; font-weight: 600; background: #f1f4f8; color: #33445a; border: none; }
body.mobile-mode .tab.active { background: #e8f1fd; color: #1e6fd0; }
body.mobile-mode .tab.active::after { display: none; }

/* 汇总条 */
body.mobile-mode .mc-sum { display: flex; background: #fff; border-radius: 12px; padding: 12px 0; margin: 10px 0; box-shadow: 0 1px 2px rgba(16, 32, 64, .04), 0 5px 14px rgba(16, 32, 64, .05); }
body.mobile-mode .mc-sum__i { flex: 1; text-align: center; }
body.mobile-mode .mc-sum__i + .mc-sum__i { border-left: 1px solid #eef2f7; }
body.mobile-mode .mc-sum__i b { display: block; font-size: 16px; font-weight: 800; color: #1f2d3d; font-variant-numeric: tabular-nums; }
body.mobile-mode .mc-sum__i b.p { color: #1e6fd0; }
body.mobile-mode .mc-sum__i b.w { color: #d98324; }
body.mobile-mode .mc-sum__i span { display: block; font-size: 10.5px; color: #8b98a5; margin-top: 1px; }

/* 订单卡 */
body.mobile-mode .mc-list { display: flex; flex-direction: column; gap: 9px; }
body.mobile-mode .mc-card {
  position: relative; background: #fff; border-radius: 11px; padding: 13px 14px;
  box-shadow: 0 1px 2px rgba(16, 32, 64, .03), 0 5px 14px rgba(16, 32, 64, .05);
  border: 1px solid transparent;
}
body.mobile-mode .mc-card:active { border-color: #cfe0f5; background: #fafcff; }
body.mobile-mode .mc-card__top { display: flex; align-items: center; gap: 7px; }
body.mobile-mode .mc-card__name { flex: 1; min-width: 0; font-size: 15px; font-weight: 700; color: #1f2d3d; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
body.mobile-mode .mc-card__badge { flex: none; font-size: 10.5px; font-weight: 700; padding: 2px 9px; border-radius: 999px; }
body.mobile-mode .mc-card__sel { position: absolute; top: 12px; right: 12px; display: flex; }
body.mobile-mode .mc-card__sel input { width: 16px; height: 16px; }
body.mobile-mode .mc-card__sel ~ .mc-card__top .mc-card__badge { margin-right: 22px; }
body.mobile-mode .mc-card__meta { margin-top: 5px; font-size: 11.5px; color: #8b98a5; display: flex; align-items: center; gap: 4px; flex-wrap: wrap; }
body.mobile-mode .mc-card__client { color: #5c6b7a; font-weight: 600; }
body.mobile-mode .mc-card__meta i { color: #c8d2dd; font-style: normal; }
body.mobile-mode .mc-card__ret { margin-top: 5px; font-size: 10.5px; color: #d98324; }
body.mobile-mode .mc-card__bottom { margin-top: 9px; padding-top: 9px; border-top: 1px dashed #eef2f7; display: flex; align-items: center; justify-content: space-between; gap: 6px; }
body.mobile-mode .mc-card__emp { display: flex; align-items: center; gap: 5px; min-width: 0; }
body.mobile-mode .mc-ava { width: 20px; height: 20px; border-radius: 50%; object-fit: cover; border: 1px solid #e4e9f0; }
body.mobile-mode .mc-ava--ph { display: grid; place-items: center; background: #f1f4f8; color: #5c6b7a; font-size: 10px; }
body.mobile-mode .mc-card__etag { font-size: 10.5px; font-weight: 700; color: #1e6fd0; background: #e8f1fd; padding: 1px 6px; border-radius: 4px; }
body.mobile-mode .mc-card__src { font-size: 10.5px; color: #8b98a5; }
body.mobile-mode .mc-card__amt { font-size: 16px; font-weight: 800; color: #1e6fd0; font-variant-numeric: tabular-nums; }
body.mobile-mode .mc-card__acts { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 9px; padding-top: 9px; border-top: 1px dashed #eef2f7; }
body.mobile-mode .mc-btn { flex: 1; text-align: center; padding: 7px 4px; font-size: 12.5px; font-weight: 600; color: #1e6fd0; background: #f2f7fd; border-radius: 8px; cursor: pointer; }
body.mobile-mode .mc-btn--danger { color: #d9534f; background: #fdf2f2; }
body.mobile-mode .mc-empty { padding: 56px 0; text-align: center; color: #8b98a5; }
body.mobile-mode .mc-empty__ico { font-size: 34px; opacity: .5; margin-bottom: 8px; }
body.mobile-mode .mc-fab {
  position: fixed; right: 16px; bottom: calc(74px + env(safe-area-inset-bottom));
  width: 50px; height: 50px; border-radius: 50%; display: grid; place-items: center;
  background: linear-gradient(135deg, #409eff, #2b83e8); color: #fff; font-size: 26px; font-weight: 300;
  box-shadow: 0 6px 16px rgba(64, 158, 255, .42); z-index: 60;
}
body.mobile-mode .mc-fab:active { transform: scale(.94); }
body.mobile-mode .pager { display: flex; justify-content: center; gap: 6px; padding: 12px 0 4px; }

/* ==========================================================================
 * 手机端 · 账单核对 1:1 还原小程序（bill-item）
 * ========================================================================== */
body.mobile-mode .bcard {
  position: relative; display: flex; gap: 9px; background: #fff; border-radius: 11px;
  padding: 13px 14px; border: 1px solid transparent;
  box-shadow: 0 1px 2px rgba(16, 32, 64, .03), 0 5px 14px rgba(16, 32, 64, .05);
}
body.mobile-mode .bcard.is-sel { border-color: #409eff; background: #f7fbff; }
body.mobile-mode .bcard__check {
  flex: none; width: 19px; height: 19px; border-radius: 50%; border: 1.5px solid #cfd8e3;
  display: grid; place-items: center; font-size: 11px; color: #fff; margin-top: 2px;
}
body.mobile-mode .bcard__check.is-on { background: #409eff; border-color: #409eff; }
body.mobile-mode .bcard__main { flex: 1; min-width: 0; }
body.mobile-mode .bcard__top { display: flex; align-items: center; gap: 7px; }
body.mobile-mode .bcard__name { flex: 1; min-width: 0; font-size: 15px; font-weight: 700; color: #1f2d3d; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
body.mobile-mode .bcard__badge { flex: none; font-size: 10.5px; font-weight: 700; padding: 2px 9px; border-radius: 999px; }
body.mobile-mode .bcard__sub { margin-top: 5px; font-size: 11.5px; color: #8b98a5; }
body.mobile-mode .bcard__ret { margin-top: 6px; padding: 7px 9px; border-radius: 8px; background: #fdf2f2; color: #c0392b; font-size: 11.5px; line-height: 1.7; }
body.mobile-mode .bcard__bottom { margin-top: 9px; padding-top: 9px; border-top: 1px dashed #eef2f7; display: flex; align-items: center; justify-content: space-between; gap: 6px; }
body.mobile-mode .bcard__hint { font-size: 11px; color: #8b98a5; }
body.mobile-mode .bcard__amt { font-size: 16px; font-weight: 800; color: #1e6fd0; font-variant-numeric: tabular-nums; }
body.mobile-mode .bcard__acts { display: flex; gap: 6px; margin-top: 9px; }

/* ==========================================================================
 * 手机端全局清理：去网页残留（退出按钮/面包屑），工具栏收敛
 * ========================================================================== */
body.mobile-mode .topbar { padding: 10px 14px; }
body.mobile-mode .topbar__title { font-size: 17px; }
body.mobile-mode .topbar__crumb { display: none; }
/* 退出按钮：手机端放到左上角页面名称旁边（不再藏起来） */
body.mobile-mode .topbar > div:first-child { order: 1; min-width: 0; }
body.mobile-mode #quickLogout {
  display: inline-flex; order: 2; flex: 0 0 auto; margin-left: 4px;
  padding: 5px 12px; font-size: 12.5px; white-space: nowrap;
}
body.mobile-mode .topbar__sp { order: 3; }
body.mobile-mode #topActions { order: 4; }
body.mobile-mode #topActions .btn { height: 34px; font-size: 13px; padding: 0 12px; }
/* 订单/账单筛选区：日期与导出默认收进「更多筛选」，展开才占位 */
body.mobile-mode .m-filter-more { display: none; }
body.mobile-mode .m-filter-open .m-filter-more { display: block; }
body.mobile-mode .m-filter-toggle {
  display: flex !important; align-items: center; justify-content: center; gap: 5px;
  margin-top: 8px; padding: 8px 0; border-radius: 8px;
  background: #f1f4f8; color: #5c6b7a; font-size: 13px; font-weight: 600; cursor: pointer;
}
body.mobile-mode .m-filter-toggle .caret { transition: transform .18s; font-size: 11px; }
body.mobile-mode .m-filter-open .m-filter-toggle .caret { transform: rotate(180deg); }

/* 「更多筛选」开关桌面端隐藏；手机端隐藏顶栏「+ 新建订单」（右下角悬浮＋代替） */
.m-filter-toggle { display: none; }
body.mobile-mode .toolbar > #add { display: none; }

/* ==========================================================================
 * 首页英雄卡：左侧企业信息（文字）+ 右侧 logo 图（完整展示不裁切）
 * ========================================================================== */
.hero-m {
  position: relative; display: flex; align-items: stretch; gap: 6px;
  border-radius: 14px; overflow: hidden;
  background: linear-gradient(135deg, #16375f 0%, #2f7ee0 54%, #4fa2f2 100%);
  box-shadow: 0 10px 30px rgba(15, 40, 70, .16);
}
.hero-m__side {
  flex: 1 1 auto; min-width: 0; color: #fff;
  padding: 16px 6px 15px 18px; display: flex; flex-direction: column; justify-content: center;
}
.hero-m__hi { font-size: 24px; font-weight: 600; color: #fff; }
.hero-m__sub { font-size: 16px; color: rgba(201, 224, 248, .92); margin-top: 4px; }
.hero-m__meta { font-size: 13px; color: rgba(186, 213, 240, .8); margin-top: 12px; }
/* 右侧 logo 区：圆角相框 + cover 铺满（照片不留白边，logo 自动适配）；
   相框再加高加宽（260px / 42%），蓝色卡整体随之加高（需求 2026-10-31 第二次） */
.hero-m__logo { flex: 0 0 42%; max-width: 480px; display: flex; align-items: center; justify-content: flex-end; padding: 16px 18px 16px 4px; }
.hero-m__plate {
  width: 100%; min-height: 96px; height: 260px;
  display: grid; place-items: center;
  padding: 0; border-radius: 12px; overflow: hidden;
  background: rgba(255, 255, 255, .14);
  border: 1px solid rgba(255, 255, 255, .25);
  box-shadow: 0 6px 18px rgba(8, 26, 50, .18);
}
/* 品牌「首页 Logo 白色底板」关闭时：透明无阴影无边框（高优先级，避免被基础规则覆盖） */
.hero-m__plate.hero-m__plate--bare { background: transparent !important; border: none !important; box-shadow: none !important; }
.hero-m__img { display: block; width: 100%; height: 100%; max-height: none; object-fit: cover; object-position: center; }
body.mobile-mode .hero-m__side { padding: 12px 4px 11px 14px; }
body.mobile-mode .hero-m__ava { display: none !important; }   /* 手机端隐藏左侧小头像：右侧已有完整 logo，给文字让宽 */
body.mobile-mode .hero-m__side .home-comp { font-size: 15px; margin-bottom: 10px; padding-bottom: 9px; letter-spacing: .5px; }
body.mobile-mode .hero-m__hi { font-size: 19px; line-height: 1.4; }
body.mobile-mode .hero-m__sub { font-size: 14px; }
body.mobile-mode .hero-m__meta { font-size: 11.5px; margin-top: 8px; }
body.mobile-mode .hero-m__slogan { font-size: 12px !important; padding: 2px 9px !important; }
body.mobile-mode .hero-m__sub2 { font-size: 11.5px !important; }
body.mobile-mode .hero-m__logo { flex-basis: 40%; padding: 10px 12px 10px 0; }
body.mobile-mode .hero-m__plate { min-height: 0; height: 190px; }
body.mobile-mode .hero-m__plate--bare { background: transparent; border: none; box-shadow: none; }

/* 我的页：企业形象图限高裁切；三个操作按钮允许换行不截断 */
body.mobile-mode .mine-bg { max-height: 110px; object-fit: cover; }
body.mobile-mode .mine-btns { flex-wrap: wrap; }
body.mobile-mode .mine-btns .btn { flex: 1 1 40%; min-width: 150px; }

/* 平台侧工作台：宽表折卡（企业收入与服务期限 / 每笔收入明细） */
body.mobile-mode .pcard { border: 1px solid var(--c-line); border-radius: 10px; padding: 10px 12px; margin-bottom: 10px; background: #fff; }
body.mobile-mode .pcard__top { display: flex; align-items: flex-start; justify-content: space-between; gap: 8px; margin-bottom: 6px; }
body.mobile-mode .pcard__name { font-weight: 600; font-size: 14.5px; line-height: 1.45; word-break: break-all; }
body.mobile-mode .pcard__row { display: flex; justify-content: space-between; gap: 10px; font-size: 13px; line-height: 1.6; padding: 2px 0; }
body.mobile-mode .pcard__row .k { color: #8b98a5; flex: none; }
body.mobile-mode .pcard__row .v { text-align: right; min-width: 0; word-break: break-all; }
body.mobile-mode .pcard__acts { display: flex; gap: 8px; justify-content: flex-end; margin-top: 6px; }

/* 卡片头：标题整行、操作按钮条换到下一行横向滚动，避免按钮文字竖排压字 */
body.mobile-mode .card__head { flex-wrap: wrap; row-gap: 6px; }
body.mobile-mode .card__head .row { flex-wrap: nowrap; overflow-x: auto; max-width: 100%; -webkit-overflow-scrolling: touch; }
body.mobile-mode .card__head .linkbtn, body.mobile-mode .card__head .card__sub { white-space: nowrap; }

/* ==========================================================================
 * 手机端 · 智能客服：先看会话列表，点进会话再聊天（同微信两段式）
 * ========================================================================== */
.chat__back { display: none; }
body.mobile-mode .chat {
  display: block;
  height: calc(100vh - var(--topbar-h) - 96px);
  min-height: 420px;
  border-radius: 14px;
}
body.mobile-mode .chat__list { display: block !important; border-right: none; height: 100%; }
body.mobile-mode .chat__panel { display: none; height: 100%; }
body.mobile-mode .chat--open .chat__list { display: none !important; }
body.mobile-mode .chat--open .chat__panel { display: flex; }
body.mobile-mode .chat__head {
  display: flex; align-items: center; gap: 4px;
  padding: 8px 12px; font-size: 15px; font-weight: 600;
}
body.mobile-mode .chat__head #chatHead { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
body.mobile-mode .chat__back {
  display: inline-flex; align-items: center; justify-content: center;
  width: 34px; height: 34px; flex: 0 0 auto; margin-left: -8px;
  border: none; background: none; padding: 0;
  font-size: 24px; line-height: 1; color: var(--c-primary-700, #1e6fd0); cursor: pointer;
}
body.mobile-mode .chat__input { padding: 8px 10px; gap: 6px; }
body.mobile-mode .chat__input .textarea { flex: 1 1 auto; min-width: 0; min-height: 38px; max-height: 90px; font-size: 15px; }
body.mobile-mode .chat__input .btn { flex: 0 0 auto; height: 38px; padding: 0 11px; font-size: 17px; }
body.mobile-mode .chat__input #send { padding: 0 14px; font-size: 14px; letter-spacing: 1px; }

/* ==========================================================================
 * 手写签名全屏板（手机端签字优化）
 * ========================================================================== */
.padsheet {
  position: fixed; inset: 0; z-index: 500;
  background: #fff; display: flex; flex-direction: column;
}
.padsheet__head {
  display: flex; align-items: center; gap: 10px; padding: 12px 14px;
  border-bottom: 1px solid var(--c-line); font-weight: 600;
}
.padsheet__head .ps-sub { font-size: 12.5px; font-weight: 400; color: var(--c-text-3); }
.padsheet__head .ps-x { margin-left: auto; }
.padsheet__body { flex: 1; position: relative; min-height: 0; background: #fff; }
.padsheet__body canvas { display: block; width: 100%; height: 100%; touch-action: none; cursor: crosshair; }
.padsheet__tip {
  position: absolute; inset: 0; display: grid; place-items: center;
  color: #c3ccd7; font-size: 15px; pointer-events: none;
  text-align: center; line-height: 2;
}
.padsheet__foot {
  display: flex; gap: 10px;
  padding: 12px 14px calc(12px + env(safe-area-inset-bottom, 0px));
  border-top: 1px solid var(--c-line);
}
.padsheet__foot .btn { flex: 1; height: 46px; font-size: 16px; }

/* 「去签名」快捷按钮：仅手机端显示 */
#toSign { display: none; }
body.mobile-mode #toSign { display: inline-flex; }

/* ==========================================================================
 * 结算单预览 + 企业印章盖章（账单页「打印结算单」）
 * ========================================================================== */
.stmtbox { position: fixed; inset: 0; z-index: 520; background: #eef2f7; display: flex; flex-direction: column; }
.stmtbox__bar {
  display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
  padding: 10px 14px; background: #fff; border-bottom: 1px solid var(--c-line);
}
.stmtbox__hint { font-size: 12px; color: var(--c-text-3); }
/* 导出前筛选条 */
.stmtbox__filters { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; padding: 8px 14px; background: #fff; border-bottom: 1px solid var(--c-line); }
.stmtbox__filters label { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; color: var(--c-text-2); }
.stmtbox__filters select, .stmtbox__filters input { height: 30px; min-width: 108px; padding: 0 8px; font-size: 12px; border: 1px solid var(--c-line); border-radius: 8px; background: #fff; color: var(--c-text); }
.stmtbox__filters input { min-width: 150px; }
.stmtbox__fltinfo { font-size: 12px; color: var(--c-primary); font-weight: 600; margin-left: auto; }
/* 账单核对 × 订单管理 同步提示条 */
.bill-sync { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 14px; padding: 8px 2px 2px; font-size: 12.5px; color: var(--c-text-2); }
.bill-sync:empty { display: none; }
.bill-sync__i b { color: var(--c-text, #17325a); font-size: 13px; }
.bill-sync__i.is-warn { color: #b45309; }
.bill-sync__i.is-warn b { color: #b45309; }
.bill-sync .linkbtn { font-size: 12.5px; }
body.mobile-mode .bill-sync { font-size: 12px; gap: 4px 10px; }

.stmtbox__filters input[type="date"] { min-width: 132px; }
.stmtbox__num { min-width: 78px !important; width: 78px; }
.stmtbox__tilde { font-size: 12px; color: var(--c-text-2); }
.stmtbox__tpls { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; padding: 7px 14px; background: #f7fafd; border-bottom: 1px solid var(--c-line); }
.stmtbox__tpls label { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; color: var(--c-text-2); }
.stmtbox__tpls select { height: 30px; min-width: 148px; padding: 0 8px; font-size: 12px; border: 1px solid var(--c-line); border-radius: 8px; background: #fff; color: var(--c-text); }
body.mobile-mode .stmtbox__tpls { padding: 6px 10px; gap: 6px 8px; }
body.mobile-mode .stmtbox__tpls .card__sub { display: none; }
body.mobile-mode .stmtbox__tpls select { min-width: 120px; height: 28px; font-size: 11.5px; }
body.mobile-mode .stmtbox__filters { gap: 6px 8px; padding: 7px 10px; }
body.mobile-mode .stmtbox__filters select, body.mobile-mode .stmtbox__filters input { height: 28px; min-width: 92px; font-size: 11.5px; }
body.mobile-mode .stmtbox__filters input { min-width: 110px; }
body.mobile-mode .stmtbox__fltinfo { width: 100%; margin-left: 0; font-size: 11.5px; }
.stmtbox__sel {
  height: 30px; padding: 0 6px; border: 1px solid var(--c-line); border-radius: 8px;
  background: #fff; color: var(--c-text); font-size: 12.5px; font-family: inherit; cursor: pointer;
}
.stmtbox__body {
  flex: 1; min-height: 0; overflow: auto; padding: 16px;
  display: flex; justify-content: center; align-items: flex-start;
}
.stmtbox__stage { background: #fff; box-shadow: 0 8px 28px rgba(31, 74, 124, .16); }
.stmtbox__foot {
  display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
  padding: 8px 14px calc(8px + env(safe-area-inset-bottom, 0px));
  background: #fff; border-top: 1px solid var(--c-line);
  font-size: 12.5px; color: var(--c-text-2);
}
.stmtbox__foot .card__sub { font-size: 12px; }
.sealsheet {
  position: absolute; left: 0; right: 0; bottom: 0; display: none;
  max-height: 56vh; overflow: auto; padding: 10px 14px 14px;
  background: #fff; border-top: 1px solid var(--c-line);
  box-shadow: 0 -8px 24px rgba(31, 74, 124, .12);
}
.sealsheet.show { display: block; }
.sealsheet__head { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-bottom: 10px; }
.sealsheet__list { display: flex; gap: 10px; flex-wrap: wrap; }
.seal-chip {
  position: relative; width: 100px; padding: 8px; cursor: pointer;
  border: 1px solid var(--c-line); border-radius: 10px; background: #fafcff;
  text-align: center; transition: .15s;
}
.seal-chip:hover { border-color: #409eff; background: #f2f8ff; transform: translateY(-1px); }
.seal-chip img { display: block; width: 100%; height: 68px; object-fit: contain; }
.seal-chip__no { height: 68px; display: grid; place-items: center; font-size: 11px; color: #c3ccd7; }
.seal-chip__n {
  margin-top: 5px; font-size: 12px; color: var(--c-text-2);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.seal-chip__x {
  position: absolute; right: -6px; top: -6px; width: 20px; height: 20px;
  line-height: 18px; text-align: center; border-radius: 50%;
  background: #fff; border: 1px solid var(--c-line); color: #c0392b; font-size: 12px;
  box-shadow: 0 2px 6px rgba(0, 0, 0, .08);
}
/* 印章卡片上的删除按钮：常显、可点，手机上也能点到 */
.seal-chip__ops { margin-top: 6px; display: flex; justify-content: center; }
.seal-chip__del {
  border: 1px solid #f0c4be; background: #fff6f5; color: #c0392b;
  font-size: 11.5px; line-height: 1; padding: 5px 9px; border-radius: 6px; cursor: pointer;
  font-family: inherit;
}
.seal-chip__del:hover { background: #fdecea; border-color: #e0917f; }
body.mobile-mode .stmtbox__bar { gap: 6px; padding: 8px 10px; }
body.mobile-mode .stmtbox__bar b { width: 100%; font-size: 13px; }
body.mobile-mode .stmtbox__hint { display: none; }
body.mobile-mode .stmtbox__sel { height: 28px; font-size: 11.5px; padding: 0 4px; }
body.mobile-mode .stmtbox__body { padding: 8px; }
body.mobile-mode .seal-chip { width: 92px; }

/* 结算单抬头表单 */
.headform { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px 12px; }
.headform label { display: block; font-size: 12px; color: var(--c-text-2); }
.headform .input { width: 100%; margin-top: 4px; }
body.mobile-mode .headform { grid-template-columns: 1fr; }

/* 手机端聊天输入栏：图标按钮更紧凑，输入框更宽 */
body.mobile-mode .chat__input .btn { padding: 0 9px; font-size: 15px; height: 36px; }
body.mobile-mode .chat__input #emojiBtn, body.mobile-mode .chat__input #voiceBtn, body.mobile-mode .chat__input #attach { padding: 0 9px; }

/* ==========================================================================
 * 智能客服 · 语音按钮与录音状态（点击区域加大 + 明确反馈）
 * ========================================================================== */
.chat__ico { flex: 0 0 auto; min-width: 40px; height: 40px; padding: 0 6px; font-size: 18px; line-height: 1; }
.chat__ico--voice.is-rec {
  background: #fdecec !important; color: #dc2626;
  border: 1px solid #f7c5c5 !important;
  animation: recPulse 1s ease-in-out infinite;
}
@keyframes recPulse { 0%, 100% { box-shadow: 0 0 0 0 rgba(220, 38, 38, .34); } 50% { box-shadow: 0 0 0 6px rgba(220, 38, 38, 0); } }
.chat-rec {
  display: none; align-items: center; gap: 8px;
  position: absolute; left: 10px; right: 10px; bottom: 62px; z-index: 5;
  padding: 8px 12px; border-radius: 12px;
  background: #fff; border: 1px solid #f3d1d1;
  box-shadow: 0 8px 22px rgba(16, 32, 64, .14);
}
.chat-rec__dot { width: 9px; height: 9px; border-radius: 50%; background: #dc2626; animation: recPulse 1.2s infinite; flex: 0 0 auto; }
.chat-rec__txt { flex: 1 1 auto; min-width: 0; font-size: 13px; color: #5c6b7a; }
.chat-rec__cancel { color: #8b98a5; font-size: 13px; text-decoration: none; flex: 0 0 auto; }
.chat-rec__cancel:hover { color: #dc2626; }

body.mobile-mode .chat__ico { min-width: 44px; height: 44px; font-size: 20px; }
body.mobile-mode .chat-rec { bottom: 60px; left: 8px; right: 8px; padding: 8px 10px; }
body.mobile-mode .chat-rec__txt { font-size: 12.5px; }

/* 语音气泡：时间不换行、内容不被裁切 */
.bubble__meta { white-space: nowrap; }
body.mobile-mode .baudio { min-width: 112px; }
body.mobile-mode .baudio > span { white-space: nowrap; }

/* ==========================================================================
 * 通知 · 待办中心 / 帮助中心（手机端与电脑端共用）
 * ========================================================================== */
.topbar__bell { position: relative; padding: 0 10px; font-size: 15px; line-height: 1; }
.bell-dot {
  display: none; position: absolute; top: -6px; right: -6px;
  min-width: 17px; height: 17px; padding: 0 4px; border-radius: 999px;
  background: #e5484d; color: #fff; font-size: 11px; line-height: 17px; text-align: center; font-weight: 600;
}
.bell-dot.show { display: inline-block; }
body.mobile-mode .topbar__bell { width: 36px; height: 36px; padding: 0; display: inline-flex; align-items: center; justify-content: center; }

.todo-sum { font-size: 13px; color: #5c6b7a; margin-bottom: 10px; }
.todo-list { display: flex; flex-direction: column; gap: 10px; }
.todo-item {
  display: flex; align-items: center; gap: 12px; padding: 14px;
  border: 1px solid #e3ebf5; border-radius: 12px; background: #fff; cursor: pointer; transition: all .15s;
}
.todo-item:hover { border-color: #b7d3f5; box-shadow: 0 4px 14px rgba(16, 32, 64, .06); }
.todo-item__ico {
  width: 38px; height: 38px; border-radius: 11px; flex: 0 0 auto;
  display: grid; place-items: center; font-size: 17px; background: #eaf3ff; color: #1f6fd0;
}
.todo-item--warn .todo-item__ico { background: #fef3e2; color: #b45309; }
.todo-item--danger .todo-item__ico { background: #fdecec; color: #dc2626; }
.todo-item__main { flex: 1 1 auto; min-width: 0; }
.todo-item__title { font-size: 14.5px; font-weight: 600; color: #1f2d3d; display: flex; align-items: center; gap: 8px; }
.todo-item__num { background: #e5484d; color: #fff; border-radius: 999px; font-size: 11.5px; padding: 1px 7px; font-weight: 600; }
.todo-item__desc { font-size: 12.5px; color: #8b98a5; margin-top: 3px; line-height: 1.5; }
.todo-item__arrow { color: #c3ccd7; font-size: 20px; flex: 0 0 auto; }
body.mobile-mode .todo-item { padding: 12px; gap: 10px; }
body.mobile-mode .todo-item__title { font-size: 14px; }

/* 新手引导 */
.ob { border: 1px solid #dceafd; background: #f5f9ff; border-radius: 12px; padding: 14px; }
.ob__head { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.ob__title { font-size: 14.5px; font-weight: 600; color: #1f4a7c; }
.ob__pct { font-size: 13px; color: #1f6fd0; font-weight: 600; }
.ob__bar { height: 7px; border-radius: 999px; background: #dfeaf8; margin-top: 10px; overflow: hidden; }
.ob__bar > span { display: block; height: 100%; border-radius: 999px; background: #409eff; transition: width .3s; }
.ob__next { margin-top: 10px; font-size: 12.5px; color: #5c6b7a; line-height: 1.6; }
.ob-steps { margin-top: 14px; display: flex; flex-direction: column; gap: 8px; }
.ob-step { display: flex; align-items: center; gap: 12px; padding: 12px 14px; border: 1px solid #e9eff7; border-radius: 11px; background: #fff; }
.ob-step.is-done { background: #fbfefb; border-color: #e4f0e6; }
.ob-step__no { width: 26px; height: 26px; border-radius: 50%; display: grid; place-items: center; background: #eaf3ff; color: #1f6fd0; font-size: 12.5px; font-weight: 600; flex: 0 0 auto; }
.ob-step.is-done .ob-step__no { background: #e8f6ec; color: #1f9254; }
.ob-step__main { flex: 1 1 auto; min-width: 0; }
.ob-step__title { font-size: 14px; font-weight: 600; color: #1f2d3d; }
.ob-step__desc { font-size: 12.5px; color: #8b98a5; margin-top: 2px; line-height: 1.5; }
body.mobile-mode .ob { padding: 12px; }
body.mobile-mode .ob-step { flex-wrap: wrap; padding: 11px 12px; }
body.mobile-mode .ob-step__main { flex: 1 1 calc(100% - 40px); }
body.mobile-mode .ob-step .btn { width: 100%; margin-top: 8px; }

/* 常见问题 */
.faq-group { margin-bottom: 18px; }
.faq-group__title { font-size: 13px; font-weight: 600; color: #1f6fd0; margin-bottom: 8px; padding-left: 8px; border-left: 3px solid #409eff; }
.faq { border: 1px solid #e9eff7; border-radius: 10px; margin-bottom: 8px; background: #fff; }
.faq__q { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 12px 14px; cursor: pointer; font-size: 13.5px; color: #1f2d3d; }
.faq__ico { color: #8b98a5; font-size: 15px; flex: 0 0 auto; transition: transform .15s; }
.faq.is-open .faq__ico { transform: rotate(45deg); }
.faq__a { padding: 11px 14px 13px; font-size: 13px; color: #5c6b7a; line-height: 1.75; border-top: 1px dashed #eef3f9; }

/* 更新日志 */
.log-item { padding: 12px 0; border-bottom: 1px dashed #eef3f9; }
.log-item:last-child { border-bottom: none; }
.log-item__head { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; font-size: 14px; color: #1f2d3d; }
.log-item__list { margin: 8px 0 0 18px; padding: 0; font-size: 12.8px; color: #5c6b7a; line-height: 1.85; }
.log-item__list li { list-style: disc; }
