:root {
  /* 与 v3.0 豆包风格保持一致（避免旧靛蓝残留造成视觉割裂） */
  --primary: #4D6BFE;
  --primary-light: #EEF1FF;
  --primary-dark: #3B5BF0;
  --danger: #F25056;
  --danger-bg: #FEF1F1;
  --warn: #E8830C;
  --warn-bg: #FFF6E9;
  --ok: #00B96B;
  --ok-bg: #E9F9F1;
  --gray: #7A8195;
  --border: #EDEEF3;
  --bg: #F7F8FA;
  --card: #ffffff;
  --text: #1A1D26;
  --radius: 16px;
  --shadow: 0 2px 8px rgba(26, 29, 38, .03), 0 10px 28px rgba(26, 29, 38, .05);
  --doubao-gray-input: #F2F3F7;
  /* 间距体系：8px 基准 */
  --sp-1: 4px;  --sp-2: 8px;  --sp-3: 12px;
  --sp-4: 16px; --sp-5: 20px; --sp-6: 24px; --sp-8: 32px;
}
* { box-sizing: border-box; margin: 0; padding: 0; }
body {
  font-family: -apple-system, BlinkMacSystemFont, "PingFang SC", "Microsoft YaHei", "Helvetica Neue", sans-serif;
  background: var(--bg); color: var(--text); min-height: 100vh;
}
a { color: var(--primary); text-decoration: none; }

.topbar { background: #fff; border-bottom: 1px solid var(--border); position: sticky; top: 0; z-index: 50; }
.topbar-inner { max-width: 1200px; margin: 0 auto; padding: 12px 20px; display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.brand { display: flex; align-items: center; gap: 10px; cursor: pointer; }
.brand-logo { font-size: 26px; }
.brand-name { font-size: 17px; font-weight: 700; }
.brand-sub { font-size: 12px; color: var(--gray); border-left: 1px solid var(--border); padding-left: 10px; }

.container { max-width: 1200px; margin: 0 auto; padding: 24px 20px 60px; }
.card { background: var(--card); border-radius: var(--radius); box-shadow: var(--shadow); padding: 20px; }
h2.section-title { font-size: 16px; margin-bottom: 14px; display: flex; align-items: center; gap: 8px; }
h2.section-title .hint { font-size: 12px; color: var(--gray); font-weight: 400; }

.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 6px;
  border: none; border-radius: 8px; padding: 9px 18px; font-size: 14px; cursor: pointer;
  background: var(--primary); color: #fff; transition: .15s; font-family: inherit;
}
.btn:hover { background: var(--primary-dark); }
.btn:disabled { opacity: .5; cursor: not-allowed; }
.btn.ghost { background: #fff; color: var(--text); border: 1px solid var(--border); }
.btn.ghost:hover { border-color: var(--primary); color: var(--primary); background: #fff; }
.btn.danger { background: var(--danger); }
.btn.danger:hover { background: #b91c1c; }
.btn.sm { padding: 6px 12px; font-size: 13px; border-radius: 6px; }

input, textarea, select {
  width: 100%; border: 1px solid var(--border); border-radius: 8px; padding: 10px 12px;
  font-size: 14px; font-family: inherit; background: #fff; color: var(--text); outline: none;
}
input:focus, textarea:focus { border-color: var(--primary); box-shadow: 0 0 0 3px rgba(77, 107, 254, .14); }
label.field-label { display: block; font-size: 13px; color: var(--gray); margin: 12px 0 6px; }
label.field-label .req { color: var(--danger); }

.badge { display: inline-flex; align-items: center; gap: 4px; font-size: 12px; padding: 2px 10px; border-radius: 999px; white-space: nowrap; }
.badge.gray { background: #f3f4f6; color: var(--gray); }
.badge.indigo { background: var(--primary-light); color: var(--primary-dark); }
.badge.red { background: var(--danger-bg); color: var(--danger); font-weight: 600; }
.badge.amber { background: var(--warn-bg); color: var(--warn); font-weight: 600; }
.badge.green { background: var(--ok-bg); color: var(--ok); font-weight: 600; }
.badge.blue { background: #eff6ff; color: #1d4ed8; }

/* 登录页 */
.auth-wrap { display: flex; gap: 24px; align-items: stretch; flex-wrap: wrap; margin-top: 30px; }
.auth-hero { flex: 1.2; min-width: 300px; display: flex; flex-direction: column; justify-content: center; }
.auth-hero h1 { font-size: 30px; line-height: 1.4; margin-bottom: 14px; }
.auth-hero h1 em { color: var(--primary); font-style: normal; }
.auth-hero p { color: var(--gray); font-size: 14px; line-height: 1.8; }
.auth-steps { margin-top: 22px; display: flex; flex-direction: column; gap: 10px; }
.auth-step { display: flex; gap: 10px; align-items: center; font-size: 14px; }
.auth-step .num { width: 24px; height: 24px; border-radius: 50%; background: var(--primary-light); color: var(--primary); font-size: 13px; font-weight: 700; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.auth-card { flex: 1; min-width: 320px; align-self: center; }
.auth-tabs { display: flex; gap: 0; margin-bottom: 18px; background: #f3f4f6; border-radius: 8px; padding: 3px; }
.auth-tabs button { flex: 1; border: none; background: transparent; padding: 8px; border-radius: 6px; font-size: 14px; cursor: pointer; color: var(--gray); font-family: inherit; }
.auth-tabs button.active { background: #fff; color: var(--text); font-weight: 600; box-shadow: 0 1px 2px rgba(0,0,0,.08); }

/* 提交需求 */
.hero-form textarea { min-height: 92px; resize: vertical; }
.form-row { display: flex; gap: 12px; flex-wrap: wrap; }
.form-row > div { flex: 1; min-width: 160px; }
.example-chips { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 10px; }
.example-chips button { border: 1px solid var(--border); background: #fff; border-radius: 999px; padding: 5px 12px; font-size: 12px; color: var(--gray); cursor: pointer; font-family: inherit; }
.example-chips button:hover { border-color: var(--primary); color: var(--primary); }
/* 结构化字段提示语：点击写入输入框，已写入的呈选中态 */
.example-chips button.on { border-color: var(--primary); background: var(--primary); color: #fff; }
.example-chips button.on:hover { color: #fff; }
.chip-hint { font-size: 11.5px; color: var(--gray); align-self: center; }
.sla-note { margin-top: 10px; font-size: 12.5px; color: var(--gray); }
.sla-note b { color: var(--primary); }
.sla-ok { color: var(--gray); }
.sla-over { color: #c0392b; font-weight: 600; }

/* 识别结果 */
.recog-card { border: 1px solid var(--primary); background: linear-gradient(135deg, #eef2ff 0%, #ffffff 60%); }
.recog-head { display: flex; align-items: center; gap: 8px; margin-bottom: 12px; font-weight: 700; }
.recog-head .spark { font-size: 18px; }
.recog-grid { display: flex; flex-wrap: wrap; gap: 18px; margin-bottom: 10px; }
.recog-item .k { font-size: 12px; color: var(--gray); margin-bottom: 4px; }
.recog-item .v { font-size: 15px; font-weight: 700; }
.recog-reason { font-size: 12px; color: var(--gray); margin-top: 8px; }
.tag-cloud { display: flex; flex-wrap: wrap; gap: 6px; }
.push-note { margin-top: 12px; font-size: 13px; color: var(--ok); background: var(--ok-bg); border-radius: 8px; padding: 8px 12px; }

/* 列表 */
.req-list { display: flex; flex-direction: column; gap: 12px; }
.req-item { border: 1px solid var(--border); border-radius: var(--radius); padding: 16px; background: #fff; }
.req-item.urgent { border-color: #fecaca; background: linear-gradient(135deg, #fff5f5 0%, #fff 50%); }
.req-top { display: flex; justify-content: space-between; align-items: flex-start; gap: 10px; flex-wrap: wrap; }
.req-title { font-size: 15px; font-weight: 700; margin: 6px 0; line-height: 1.5; }
.req-meta { font-size: 12px; color: var(--gray); display: flex; flex-wrap: wrap; gap: 12px; margin: 6px 0; }
.req-tags { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.req-actions { display: flex; gap: 8px; margin-top: 12px; flex-wrap: wrap; }

/* 进度条 */
.progress { display: flex; align-items: center; margin-top: 12px; }
.p-step { display: flex; align-items: center; gap: 6px; font-size: 12px; color: var(--gray); }
.p-dot { width: 22px; height: 22px; border-radius: 50%; background: #f3f4f6; color: var(--gray); display: flex; align-items: center; justify-content: center; font-size: 11px; }
.p-step.done .p-dot { background: var(--primary); color: #fff; }
.p-step.done { color: var(--primary); font-weight: 600; }
.p-line { flex: 1; height: 2px; background: var(--border); margin: 0 8px; min-width: 30px; }
.p-line.done { background: var(--primary); }

/* 交付信息 */
.delivery-box { margin-top: 12px; background: var(--ok-bg); border: 1px solid #a7f3d0; border-radius: 8px; padding: 12px; font-size: 13px; line-height: 1.8; }

/* 工作台 */
.stats-row { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: 12px; margin-bottom: 18px; }
.stat-card { background: #fff; border-radius: var(--radius); box-shadow: var(--shadow); padding: 16px; }
.stat-card .num { font-size: 26px; font-weight: 800; }
.stat-card .lbl { font-size: 13px; color: var(--gray); margin-top: 2px; }
.stat-card.red .num { color: var(--danger); }
.stat-card.amber .num { color: var(--warn); }
.stat-card.green .num { color: var(--ok); }
.stat-card.indigo .num { color: var(--primary); }

.filter-tabs { display: flex; gap: 8px; margin-bottom: 14px; flex-wrap: wrap; }
.filter-tabs button { border: 1px solid var(--border); background: #fff; border-radius: 999px; padding: 6px 16px; font-size: 13px; cursor: pointer; color: var(--gray); font-family: inherit; }
.filter-tabs button.active { background: var(--primary); color: #fff; border-color: var(--primary); }

/* 工作台工具栏：筛选标签 + 关键词搜索 */
.toolbar-row { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; margin-bottom: 14px; }
.toolbar-row .filter-tabs { margin-bottom: 0; }
.tab-cnt {
  display: inline-block; min-width: 20px; padding: 0 6px; margin-left: 6px; border-radius: 999px;
  background: #eef0f7; color: var(--gray); font-size: 11px; line-height: 17px; text-align: center;
}
.filter-tabs button.active .tab-cnt { background: rgba(255,255,255,.25); color: #fff; }
.search-box {
  display: flex; align-items: center; gap: 6px; flex: 1; max-width: 300px; min-width: 200px;
  border: 1px solid var(--border); border-radius: 999px; background: #fff; padding: 6px 14px; font-size: 14px;
}
.search-box:focus-within { border-color: var(--primary); box-shadow: 0 0 0 3px var(--primary-light); }
/* ⚠️ padding 必须显式归零：全局 `input { padding: 10px 12px }` 会漏进来，把搜索外框
   从 42px 撑到 55px（2026-09-12 实测 390px：外框 55px、按钮 42px，两者对不齐）。 */
.search-box input { border: none; outline: none; flex: 1; font-size: 13px; font-family: inherit; background: transparent; padding: 0; min-height: 0; }

.new-alert {
  display: none; align-items: center; gap: 10px; margin-bottom: 14px;
  background: var(--danger-bg); border: 1px solid #fecaca; color: var(--danger);
  padding: 10px 14px; border-radius: 10px; font-size: 13px; font-weight: 600;
  animation: pulse 1.2s ease-in-out infinite;
}
.new-alert.show { display: flex; }
@keyframes pulse { 0%,100% { box-shadow: 0 0 0 0 rgba(220,38,38,.15);} 50% { box-shadow: 0 0 0 6px rgba(220,38,38,0);} }

.empty { text-align: center; color: var(--gray); font-size: 13px; padding: 30px 0; }

/* 微信推送模拟 */
.wx-box { background: #1f2937; color: #e5e7eb; border-radius: 10px; padding: 12px 14px; font-size: 12px; line-height: 1.7; margin-bottom: 10px; font-family: inherit; }
.wx-box .wx-title { color: #fff; font-weight: 700; }
.wx-box .wx-desc { color: #d1d5db; white-space: pre-line; margin-top: 4px; }
.wx-box .wx-meta { color: #9ca3af; margin-top: 6px; font-size: 11px; }

/* 弹窗 */
.modal-mask { position: fixed; inset: 0; background: rgba(17,24,39,.45); display: flex; align-items: center; justify-content: center; z-index: 100; padding: 20px; }
.modal { background: #fff; border-radius: 14px; padding: 24px; width: 100%; max-width: 480px; max-height: 85vh; overflow-y: auto; }
.modal h3 { font-size: 17px; margin-bottom: 16px; }
.modal .modal-actions { display: flex; justify-content: flex-end; gap: 10px; margin-top: 18px; }

/* Toast */
#toast-root { position: fixed; top: 70px; right: 20px; z-index: 200; display: flex; flex-direction: column; gap: 8px; }
.toast { background: #111827; color: #fff; font-size: 13px; padding: 10px 16px; border-radius: 10px; box-shadow: 0 8px 24px rgba(0,0,0,.25); animation: slideIn .25s ease; max-width: 320px; }
.toast.ok { background: var(--ok); }
.toast.err { background: var(--danger); }
@keyframes slideIn { from { transform: translateX(30px); opacity: 0; } to { transform: none; opacity: 1; } }

.mt { margin-top: 20px; }
.avatar { width: 30px; height: 30px; border-radius: 50%; background: var(--primary-light); color: var(--primary); font-size: 13px; font-weight: 700; display: inline-flex; align-items: center; justify-content: center; }
.topbar-user { display: flex; align-items: center; gap: 10px; font-size: 14px; }
@media (max-width: 640px) { .brand-sub { display: none; } }

/* 管理后台 — 窄屏：侧边栏变顶部横向导航
   ⚠️ 2026-09-12 修正说明：此处原本还写着 .admin-layout / .admin-side / .side-brand /
   .side-nav 的窄屏规则，但它们出现的位置在本文件更下方（第 215 行起）的同名基础规则
   「之前」，同优先级后写者胜 → 这些窄屏规则全部失效（死代码），导致 641–860px 区间：
     .admin-layout 变 column（生效） + .admin-side 仍是 width:208px / flex-direction:column（未覆盖）
   = 侧栏塌成一张 208px 窄卡浮在正文上方、页头搜索框被挤到第二行并垂直错位。
   现统一收进文件末尾的「v6.0 响应式修复」区块（位置晚于基础规则，确保生效）。 */
@media (max-width: 860px) {
  .side-foot { display: none; }
  .chart-grid { grid-template-columns: 1fr; }
}

/* 微信登录按钮 */
.btn.wx { background: #07c160; }
.btn.wx:hover { background: #06ad56; }

/* 管理后台 — 控制台布局 */
.admin-layout { display: flex; gap: 20px; align-items: flex-start; }
.admin-side {
  width: 208px; flex-shrink: 0; position: sticky; top: 76px;
  background: var(--card); border-radius: var(--radius); box-shadow: var(--shadow);
  padding: 16px 12px; display: flex; flex-direction: column; gap: 14px;
}
.side-brand { display: flex; align-items: center; gap: 10px; padding: 2px 8px 10px; border-bottom: 1px solid var(--border); }
.side-logo { width: 36px; height: 36px; border-radius: 10px; background: var(--primary-light); display: flex; align-items: center; justify-content: center; font-size: 18px; }
.side-brand b { font-size: 14px; display: block; }
.side-brand span { font-size: 11px; color: var(--gray); display: block; }
.side-nav { display: flex; flex-direction: column; gap: 4px; }
.side-nav .nav-item {
  display: flex; align-items: center; gap: 10px; border: none; background: transparent;
  padding: 10px 12px; border-radius: 8px; font-size: 14px; color: var(--text);
  cursor: pointer; font-family: inherit; text-align: left; transition: .15s;
}
.side-nav .nav-item:hover { background: #f5f6ff; color: var(--primary); }
.side-nav .nav-item.active { background: var(--primary); color: #fff; font-weight: 600; }
.ni-icon { font-size: 16px; width: 20px; text-align: center; }
.side-foot { font-size: 11px; color: var(--gray); text-align: center; padding-top: 10px; border-top: 1px solid var(--border); line-height: 1.6; }

.admin-main { flex: 1; min-width: 0; }

/* —— 切页签不闪：内容区保留最小高度，加载态不再从「一行」弹到「整屏」 —— */
#admin-body, #org-body, #task-list, #wx-outbox { min-height: 240px; }
/* 切换中保留旧内容并轻微淡化（不再清空成「加载中…」，避免白屏闪一下 + 高度塌陷） */
.is-loading { opacity: .45; pointer-events: none; transition: opacity .12s ease; }
.side-nav .nav-item { will-change: background-color, color; }
.admin-page-head { display: flex; justify-content: space-between; align-items: center; gap: 14px; flex-wrap: wrap; margin-bottom: 16px; }
.admin-page-head h2 { font-size: 20px; }
.admin-page-head p { font-size: 13px; color: var(--gray); margin-top: 4px; }
.page-head-actions { display: flex; gap: 10px; }
/* —— 页面标题行右侧：搜索框 + 操作按钮（搜索框统一放这里，不再进卡片）—— */
.aph-right { display: flex; align-items: center; justify-content: flex-end; gap: 10px; flex-wrap: wrap; flex: 1; min-width: 0; }
/* PC 端：输入框与「搜索」按钮固定同一行，且整块**贴页头右边界**。
   ⚠️ 2026-09-12（两轮修正，别退回去）：
     ① 原来这里是 `flex-wrap: wrap`，页头标题把右侧区挤到约 285px 时，
        「搜索」按钮（≈44px）会被折到第二行（龙哥 PC 截图实测）→ 改 nowrap；
     ② 只改 nowrap 还不够：`.page-search` 用 `flex: 1 1 auto` 占满 .aph-right 的剩余宽度后，
        内部默认 `justify-content: flex-start`，搜索框会贴到**标题后面**、右侧留一大片空白
        （第二张截图：红框里搜索框紧跟「任务看板」，没跟卡片右边缘对齐）→ 补 flex-end。
     最终：search-box 吃剩余宽度（上限 340px）、按钮按内容宽固定，整组右对齐到页头右边界。
     窄屏 / 触屏不受影响 —— §v6.4 的 `@media (max-width:900px)` 用
     `flex: 0 0 100%` 覆盖这里；那里输入框本身 flex-grow 占满，flex-end 无副作用。 */
.page-search {
  display: flex; align-items: center; justify-content: flex-end;
  gap: 8px; flex-wrap: nowrap; flex: 1 1 auto; min-width: 0;
}
.page-search .search-box { flex: 1 1 auto; min-width: 170px; max-width: 340px; }
.page-search .btn { flex: 0 0 auto; white-space: nowrap; }
/* ⚠️ 2026-09-12：此处原有的 @media (max-width:860px) 是死代码——
   .aph-right 基础规则写了 `flex: 1`（flex-basis:0%），flexbox 中 flex-basis 优先级高于
   width，所以这里的 `width:100%` 永远不生效。窄屏页头规则已统一收进文件末尾的
   「v6.1 移动端版式修复」区块（用显式 flex-basis 强制整行）。别再往这里加 width 规则。 */

/* 管理后台 — 统计卡片（带图标） */
.a-stat-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 12px; }
.a-stat { display: flex; align-items: center; gap: 12px; background: var(--card); border-radius: var(--radius); box-shadow: var(--shadow); padding: 14px 16px; }
.a-stat-icon { width: 42px; height: 42px; border-radius: 12px; display: flex; align-items: center; justify-content: center; font-size: 20px; flex-shrink: 0; background: #f3f4f6; }
.a-stat.indigo .a-stat-icon { background: var(--primary-light); }
.a-stat.blue .a-stat-icon { background: #eff6ff; }
.a-stat.red .a-stat-icon { background: var(--danger-bg); }
.a-stat.amber .a-stat-icon { background: var(--warn-bg); }
.a-stat.green .a-stat-icon { background: var(--ok-bg); }
.a-stat-num { font-size: 24px; font-weight: 800; line-height: 1.1; }
.a-stat.indigo .a-stat-num { color: var(--primary); }
.a-stat.red .a-stat-num { color: var(--danger); }
.a-stat.amber .a-stat-num { color: var(--warn); }
.a-stat.green .a-stat-num { color: var(--ok); }
.a-stat-lbl { font-size: 13px; margin-top: 2px; }
.a-stat-sub { font-size: 11px; color: var(--gray); margin-top: 2px; }

/* 管理后台 — 面板 */
.panel { background: var(--card); border-radius: var(--radius); box-shadow: var(--shadow); padding: 18px 20px; }
.panel-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; margin-bottom: 14px; flex-wrap: wrap; }
.panel-title { font-size: 15px; }
.panel-desc { font-size: 12px; color: var(--gray); margin-top: 3px; }
.panel-extra { display: flex; gap: 8px; }

/* 紧急度分布色块 */
.urgency-row { display: flex; gap: 14px; flex-wrap: wrap; }
.urgency-chip { display: flex; align-items: baseline; gap: 8px; border-radius: 10px; padding: 10px 18px; }
.urgency-chip b { font-size: 22px; font-weight: 800; }
.urgency-chip span { font-size: 13px; opacity: .85; }
.urgency-chip.red { background: var(--danger-bg); color: var(--danger); }
.urgency-chip.amber { background: var(--warn-bg); color: var(--warn); }
.urgency-chip.gray { background: #f3f4f6; color: var(--gray); }

/* 机构详情头部 */
.org-head { display: flex; align-items: center; gap: 14px; background: linear-gradient(135deg, var(--primary-light), #fff); border: 1px solid var(--border); border-radius: var(--radius); padding: 16px 18px; margin-bottom: 14px; }
.org-head .org-logo { width: 46px; height: 46px; border-radius: 12px; background: #fff; box-shadow: var(--shadow); display: flex; align-items: center; justify-content: center; font-size: 24px; }
.org-head h3 { font-size: 17px; }
.org-head p { font-size: 12px; color: var(--gray); margin-top: 4px; display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }

/* 表格容器 */
.table-wrap { overflow-x: auto; border: 1px solid var(--border); border-radius: 10px; }
.table-wrap .table th { border-top: none; }
.table-wrap .table td:last-child, .table-wrap .table th:last-child { border-right: none; }

/* 管理后台 - KPI 与图表 */
.kpi-row { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 12px; margin-top: 14px; }
.kpi { background: #f9fafb; border: 1px solid var(--border); border-radius: 10px; padding: 14px; text-align: center; }
.kpi-v { font-size: 22px; font-weight: 800; color: var(--primary); }
.kpi-v small { font-size: 12px; color: var(--gray); font-weight: 400; }
.kpi-k { font-size: 12px; color: var(--gray); margin-top: 4px; }
.chart-title { font-size: 14px; margin-bottom: 10px; }
.chart-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 28px; }
@media (max-width: 800px) { .chart-grid { grid-template-columns: 1fr; } }
.bar-row { display: flex; align-items: center; gap: 10px; margin: 8px 0; font-size: 13px; }
.bar-label { width: 130px; text-align: right; color: var(--gray); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; flex-shrink: 0; }
.bar-track { flex: 1; height: 16px; background: #f3f4f6; border-radius: 8px; overflow: hidden; }
.bar-fill { height: 100%; background: linear-gradient(90deg, var(--primary), #818cf8); border-radius: 8px; }
.bar-num { width: 34px; font-weight: 700; }
.trend { display: flex; align-items: flex-end; gap: 14px; padding: 10px 4px 0; }
.trend-col { display: flex; flex-direction: column; align-items: center; gap: 4px; }
.trend-bar { width: 28px; background: linear-gradient(180deg, #818cf8, var(--primary)); border-radius: 6px 6px 2px 2px; }
.trend-num { font-size: 12px; font-weight: 700; }
.trend-date { font-size: 11px; color: var(--gray); }

/* 表格 */
.table { width: 100%; border-collapse: collapse; font-size: 13px; }
.table th, .table td { padding: 10px 8px; border-bottom: 1px solid var(--border); text-align: left; white-space: nowrap; }
.table th { color: var(--gray); font-weight: 600; background: #f9fafb; }
.table tr:hover td { background: #fafbff; }


/* ── v1.4 多文件交付 ── */
.file-pick {
  display: block; text-align: center; padding: 18px 12px; border: 2px dashed var(--border);
  border-radius: 10px; color: var(--primary); font-size: 14px; font-weight: 600; cursor: pointer;
  background: var(--primary-light); transition: border-color .15s;
}
.file-pick:hover { border-color: var(--primary); }
.file-list { margin-top: 8px; }
.file-item {
  display: flex; align-items: center; gap: 8px; padding: 7px 10px; background: #fff;
  border: 1px solid var(--border); border-radius: 8px; font-size: 13px; margin-bottom: 6px;
}
.file-item .fi-name { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.fi-size { font-size: 12px; color: var(--gray); white-space: nowrap; }
.fi-del {
  border: none; background: #fee2e2; color: var(--danger); width: 22px; height: 22px;
  border-radius: 6px; cursor: pointer; font-size: 12px; line-height: 1; flex-shrink: 0;
}
.fi-del:hover { background: #fecaca; }
.file-total { font-size: 12px; color: var(--gray); text-align: right; margin-top: 2px; }
.mode-opt {
  display: flex; align-items: flex-start; gap: 8px; padding: 9px 12px; border: 1px solid var(--border);
  border-radius: 10px; margin-bottom: 8px; cursor: pointer; font-size: 13px; background: #fff;
}
.mode-opt:hover { border-color: var(--primary); }
.mode-opt input[type=radio] { margin-top: 3px; accent-color: var(--primary); }
.mode-opt small { display: block; color: var(--gray); font-size: 12px; margin-top: 2px; }
.delivery-box .dl-head { font-weight: 700; margin-bottom: 6px; display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.dl-file { padding: 4px 0; display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.dl-meta { margin-top: 6px; padding-top: 6px; border-top: 1px dashed #a7f3d0; color: var(--gray); font-size: 12px; line-height: 1.9; }

/* ══════════ v1.5 个人端 / 服务人员端重设计 ══════════ */

/* —— 个人端：欢迎横幅 —— */
.user-hero {
  display: flex; justify-content: space-between; align-items: center; gap: 16px; flex-wrap: wrap;
  background: linear-gradient(120deg, #5B7BFF 0%, #4D6BFE 55%, #3B5BF0 100%); color: #fff;
  border-radius: 18px; padding: 22px 26px; margin-bottom: 16px;
  box-shadow: 0 12px 30px rgba(77, 107, 254, .26);
}
.user-hero h1 { font-size: 22px; margin-bottom: 6px; }
.user-hero p { font-size: 13px; opacity: .92; line-height: 1.7; }
.uh-right { display: flex; flex-direction: column; gap: 8px; align-items: flex-end; }
.uh-org { background: rgba(255,255,255,.18); border: 1px solid rgba(255,255,255,.38); padding: 5px 14px; border-radius: 999px; font-size: 13px; font-weight: 600; }
.uh-chip { font-size: 12px; opacity: .9; background: rgba(255,255,255,.12); padding: 4px 12px; border-radius: 999px; }

/* —— 个人端：页签导航 —— */
.u-tabs { display: flex; gap: 8px; margin-bottom: 16px; background: #eceef6; padding: 4px; border-radius: 12px; width: fit-content; }
.u-tabs button {
  border: none; background: transparent; padding: 9px 20px; border-radius: 9px; font-size: 14px;
  cursor: pointer; color: var(--gray); font-family: inherit; display: inline-flex; align-items: center; gap: 6px; transition: .15s;
}
.u-tabs button.active { background: #fff; color: var(--primary); font-weight: 700; box-shadow: 0 1px 4px rgba(17,24,39,.1); }
.u-tabs .tab-cnt { background: #e0e3f0; color: var(--gray); }
.u-tabs button.active .tab-cnt { background: var(--primary-light); color: var(--primary); }

/* —— 个人端：双栏布局 —— */
.user-grid { display: grid; grid-template-columns: 1fr 300px; gap: 16px; align-items: start; }
@media (max-width: 900px) { .user-grid { grid-template-columns: 1fr; } }
.form-card { padding: 24px; }
.form-card .big-label { font-size: 15px; font-weight: 700; margin-bottom: 10px; display: flex; align-items: center; gap: 8px; }
.form-card textarea#rq-title { min-height: 110px; font-size: 15px; padding: 14px; border-radius: 10px; }

.user-side { display: flex; flex-direction: column; gap: 14px; }
.side-tip-card { background: var(--card); border-radius: var(--radius); box-shadow: var(--shadow); padding: 18px; }
.side-tip-card h4 { font-size: 14px; margin-bottom: 12px; display: flex; align-items: center; gap: 6px; }

/* 迷你流程步骤 */
.flow-mini { display: flex; flex-direction: column; }
.fm-step { display: flex; gap: 10px; align-items: flex-start; position: relative; padding-bottom: 16px; }
.fm-step:last-child { padding-bottom: 0; }
.fm-step::before { content: ''; position: absolute; left: 11px; top: 26px; bottom: 4px; width: 2px; background: var(--border); }
.fm-step:last-child::before { display: none; }
.fm-dot {
  width: 24px; height: 24px; border-radius: 50%; background: var(--primary-light); color: var(--primary);
  font-size: 12px; font-weight: 700; display: flex; align-items: center; justify-content: center; flex-shrink: 0; z-index: 1;
}
.fm-step b { display: block; font-size: 13px; }
.fm-step small { color: var(--gray); font-size: 12px; line-height: 1.5; display: block; margin-top: 2px; }

.tip-list { list-style: none; display: flex; flex-direction: column; gap: 10px; }
.tip-list li { font-size: 12.5px; color: var(--gray); line-height: 1.7; display: flex; gap: 8px; }
.tip-list li::before { content: '💡'; flex-shrink: 0; }

/* —— 识别结果（v2）—— */
.recog-card2 { border: 1px solid #c7d2fe; background: linear-gradient(135deg, #eef2ff 0%, #fff 65%); border-radius: 12px; padding: 16px 18px; margin-top: 16px; }
.recog-head2 { display: flex; align-items: center; gap: 8px; font-weight: 700; font-size: 14px; margin-bottom: 12px; }
.recog-grid2 { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 10px; }
.recog-cell { background: #fff; border: 1px solid var(--border); border-radius: 10px; padding: 10px 12px; }
.recog-cell .k { font-size: 11px; color: var(--gray); margin-bottom: 3px; }
.recog-cell .v { font-size: 14px; font-weight: 700; }
.recog-card2 .recog-reason { font-size: 12px; color: var(--gray); margin-top: 10px; }
.recog-card2 .push-note { margin-top: 10px; }

/* —— 用户需求卡（v2）：主体 + 右侧竖向进度轨 —— */
.rcard { display: flex; border: 1px solid var(--border); border-radius: 14px; background: #fff; overflow: hidden; transition: box-shadow .15s; }
.rcard:hover { box-shadow: var(--shadow); }
.rcard.is-urgent { border-color: #fecaca; }
.rcard-main { flex: 1; padding: 16px 18px; min-width: 0; }
.rcard-side { width: 108px; border-left: 1px dashed var(--border); background: #fafbff; padding: 18px 14px; display: flex; align-items: center; flex-shrink: 0; }
@media (max-width: 640px) { .rcard { flex-direction: column-reverse; } .rcard-side { width: 100%; border-left: none; border-top: 1px dashed var(--border); padding: 12px 18px; } .steps-v { flex-direction: row; gap: 18px; } }
.rcard-head { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.rcard-no { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 12px; color: var(--gray); background: #f3f4f6; padding: 2px 8px; border-radius: 6px; }
.rcard-time { margin-left: auto; font-size: 12px; color: var(--gray); }
.rcard-title { font-size: 15px; font-weight: 700; margin: 8px 0 4px; line-height: 1.55; }
.rcard-desc { font-size: 13px; color: var(--gray); }
.rcard-info { display: flex; flex-wrap: wrap; gap: 12px; font-size: 12.5px; color: var(--gray); margin: 8px 0 2px; }
.rcard-tags { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }

.steps-v { display: flex; flex-direction: column; gap: 14px; width: 100%; }
.sv { display: flex; align-items: center; gap: 8px; font-size: 12px; color: var(--gray); }
.sv i { width: 18px; height: 18px; border-radius: 50%; background: #e5e7eb; display: inline-flex; align-items: center; justify-content: center; font-style: normal; font-size: 10px; color: transparent; flex-shrink: 0; }
.sv.on { color: var(--ok); font-weight: 600; }
.sv.on i { background: var(--ok); color: #fff; }
.sv.on i::after { content: '✓'; }

/* —— 交付物（v2）：文件行 + 下载按钮 —— */
.delivery-box2 { margin-top: 12px; border-top: 1px dashed var(--border); padding-top: 12px; }
/* 服务端任务卡内的交付成果：底部「处理人」行已自带虚线分隔，此处不再重复画线 */
.delivery-box2.in-task { margin-top: 10px; border-top: none; padding-top: 0; }
.dl-banner { display: flex; align-items: center; gap: 8px; font-size: 13px; font-weight: 700; color: var(--ok); margin-bottom: 8px; flex-wrap: wrap; }
.dl-files { display: flex; flex-direction: column; gap: 8px; }
.dl-file2 { display: flex; align-items: center; gap: 10px; background: var(--ok-bg); border: 1px solid #a7f3d0; border-radius: 10px; padding: 8px 12px; font-size: 13px; }
.dl-file2 .fname { flex: 1; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dl-file2 .fsize { font-size: 12px; color: var(--gray); white-space: nowrap; }
.btn-dl {
  border: none; background: var(--ok); color: #fff; border-radius: 8px; padding: 6px 14px;
  font-size: 12.5px; cursor: pointer; font-family: inherit; white-space: nowrap; transition: .15s;
}
.btn-dl:hover { background: #047857; }
.dl-note { font-size: 12px; color: var(--gray); margin-top: 8px; line-height: 1.7; }

/* —— 服务人员端：侧栏迷你统计 —— */
.side-stat { display: flex; flex-direction: column; gap: 9px; padding: 4px 10px; border-top: 1px solid var(--border); }
.ss-row { display: flex; justify-content: space-between; align-items: center; font-size: 13px; color: var(--gray); }
.ss-row b { font-size: 15px; font-weight: 800; }
.ss-row b.red { color: var(--danger); } .ss-row b.amber { color: var(--warn); }
.ss-row b.green { color: var(--ok); } .ss-row b.blue { color: #1d4ed8; }

/* —— 任务卡（v2）：左侧状态色条 —— */
.task-list { display: flex; flex-direction: column; gap: 12px; }
.tcard { border: 1px solid var(--border); border-radius: 14px; background: #fff; padding: 16px 18px 14px 20px; position: relative; overflow: hidden; transition: box-shadow .15s; }
.tcard:hover { box-shadow: var(--shadow); }
.tcard::before { content: ''; position: absolute; left: 0; top: 0; bottom: 0; width: 4px; background: var(--border); }
.tcard.st-pending::before { background: #f59e0b; }
.tcard.st-processing::before { background: #3b82f6; }
.tcard.st-completed::before { background: #10b981; }
.tcard.is-urgent { background: linear-gradient(135deg, #fff7f7 0%, #fff 45%); }
.tcard.is-urgent::before { background: var(--danger); }
.tc-top { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; }
.tc-title { font-size: 15px; font-weight: 700; line-height: 1.55; display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.tc-time { font-size: 12px; color: var(--gray); white-space: nowrap; }
.tc-desc { font-size: 13px; color: var(--gray); margin-top: 4px; }
.tc-info { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 10px; }
.tc-user { display: flex; align-items: center; gap: 10px; font-size: 12.5px; color: var(--gray); margin-top: 10px; flex-wrap: wrap; }
.avatar.sm { width: 24px; height: 24px; font-size: 11px; }
.tc-tags { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
/* .tc-foot（任务卡脚注行）已于 v6.8 取消：待处理卡片左半边「处理人」恒为空，
   整行只剩一条虚线 + 48px 空白。操作行改为 .tc-last（见文件末尾 v6.8 区块）。 */
.tc-actions { display: flex; gap: 8px; margin-left: auto; }
.btn.accept { background: var(--ok); padding: 8px 22px; font-weight: 600; }
.btn.accept:hover { background: #047857; }
.badge.done { background: var(--ok-bg); color: var(--ok); font-weight: 600; }

/* —— 空状态（v2）—— */
.empty2 { text-align: center; padding: 38px 0; color: var(--gray); font-size: 13px; }
.empty2 .e-icon { font-size: 34px; display: block; margin-bottom: 8px; opacity: .55; }

/* 统计卡横向排列容器 */
.a-stat-row { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 12px; width: 100%; }

/* ══════════ 手机端 H5 适配（窄屏 或 触屏设备，微信/手机浏览器） ══════════
   2026-09-12：条件从「≤640px」扩展到「触屏设备 ≤900px」。
   原因：部分手机浏览器/内核（鸿蒙 Mate 70 Pro 实测）上报的布局视口宽达 ~700px，
   使这些手机规则完全不生效，反而落进 641–860px 的桌面/平板样式里，页面观感错乱。
   触屏断点用 (hover:none) and (pointer:coarse) 判定，桌面鼠标环境不受影响。 */
@media (max-width: 640px), (hover: none) and (pointer: coarse) and (max-width: 900px) {
  html { -webkit-text-size-adjust: 100%; }
  body { -webkit-tap-highlight-color: transparent; font-size: 14px; }

  /* —— 顶栏：隐藏昵称文字与机构徽标，仅留头像+角色+退出 —— */
  .topbar-inner { padding: 10px 14px; gap: 8px; }
  .brand { gap: 7px; min-width: 0; }
  .brand-logo { font-size: 21px; }
  .brand-name { font-size: 15px; white-space: nowrap; }
  .topbar-user { gap: 6px; font-size: 13px; min-width: 0; }
  .topbar-user > span:nth-of-type(2) { display: none; }          /* 昵称文字 */
  .topbar-user .badge { display: none; }                          /* 角色/机构徽标 */

  /* —— 页面容器与卡片内边距 —— */
  .container { padding: 14px 12px 90px; }
  .card, .panel, .form-card { padding: 16px 14px; border-radius: 10px; }
  h2.section-title { font-size: 15px; }

  /* —— iOS 聚焦防缩放：输入控件 ≥16px —— */
  input, textarea, select { font-size: 16px; }
  .search-box input { font-size: 15px; }

  /* —— 按钮/触摸目标加大 —— */
  .btn { min-height: 42px; padding: 10px 18px; }
  .btn.sm { min-height: 34px; padding: 7px 12px; }
  .btn-dl { min-height: 36px; }
  .fi-del { width: 28px; height: 28px; font-size: 13px; }
  .example-chips button { padding: 8px 14px; font-size: 12.5px; }

  /* —— 登录页：表单卡置顶，宣传区缩排 —— */
  .auth-wrap { flex-direction: column; margin-top: 14px; gap: 16px; }
  .auth-card { order: -1; min-width: 0; }
  .auth-hero { min-width: 0; }
  .auth-hero h1 { font-size: 20px; }
  .auth-hero p { font-size: 13px; }
  .auth-step { font-size: 13px; }

  /* —— 个人端欢迎横幅 —— */
  .user-hero { padding: 16px 18px; border-radius: 14px; }
  .user-hero h1 { font-size: 18px; }
  .user-hero p { font-size: 12.5px; }
  .uh-right { align-items: flex-start; }
  .uh-org { font-size: 12px; padding: 4px 10px; }

  /* —— 页签导航：撑满整行，可横向滚动 —— */
  .u-tabs { width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }
  .u-tabs button { flex: 1; justify-content: center; padding: 9px 10px; font-size: 13px; white-space: nowrap; }

  /* —— 统计卡：固定两列 —— */
  .stats-row, .a-stat-grid, .a-stat-row, .kpi-row { grid-template-columns: repeat(2, 1fr); gap: 10px; }
  .stat-card .num { font-size: 21px; }
  .a-stat-num { font-size: 19px; }
  .a-stat { padding: 12px; gap: 10px; }
  .a-stat-icon { width: 36px; height: 36px; font-size: 17px; border-radius: 10px; }

  /* —— 工具栏与筛选：搜索框整行，chips 横滑 —— */
  .toolbar-row { flex-direction: column; align-items: stretch; gap: 10px; }
  .search-box { max-width: 100%; min-width: 0; width: 100%; }
  .filter-tabs { flex-wrap: nowrap; overflow-x: auto; -webkit-overflow-scrolling: touch; padding-bottom: 4px; }
  .filter-tabs button { flex-shrink: 0; padding: 7px 14px; }

  /* —— 管理后台 / 服务人员端侧栏（860px 已转横排，手机再压缩） —— */
  .admin-side { padding: 10px; gap: 8px; }
  .side-nav { gap: 2px; -webkit-overflow-scrolling: touch; }
  .side-nav .nav-item { padding: 8px 10px; font-size: 13px; }
  .side-stat { padding: 2px 6px; gap: 7px; }
  .ss-row { font-size: 12px; }
  .ss-row b { font-size: 14px; }
  .admin-page-head h2 { font-size: 17px; }
  .page-head-actions { width: 100%; }
  .page-head-actions .btn { flex: 1; }

  /* —— 任务卡 / 需求卡 —— */
  .tcard { padding: 14px 14px 12px 18px; }
  .tc-title { font-size: 14.5px; }
  /* 操作按钮：手机独占一行、整宽、44px 触达高度。
     v6.8 起操作行由 .tc-foot 上移到 .tc-last，这两个 .tc-actions 规则继续生效。 */
  .tc-actions { margin-left: 0; width: 100%; }
  .tc-actions .btn { flex: 1; min-height: 44px; }
  .rcard-main { padding: 14px; }
  .rcard-side { padding: 10px 14px; }

  /* —— 弹窗：近全屏，操作按钮加大 —— */
  .modal-mask { padding: 12px; align-items: flex-end; }
  .modal { padding: 18px 16px; max-height: 88vh; border-radius: 14px 14px 10px 10px; }
  .modal .modal-actions { flex-wrap: wrap; }
  .modal .modal-actions .btn { flex: 1; min-height: 44px; }

  /* —— Toast 居中提示 —— */
  #toast-root { left: 14px; right: 14px; top: 62px; align-items: center; }
  .toast { max-width: 100%; font-size: 13px; padding: 11px 16px; text-align: center; }

  /* —— 图表与表格 —— */
  .urgency-chip { padding: 8px 12px; }
  .urgency-chip b { font-size: 17px; }
  .trend { gap: 8px; }
  .trend-bar { width: 22px; }
  .trend-date { font-size: 10px; }
  .table-wrap { -webkit-overflow-scrolling: touch; }
  .bar-label { width: 92px; font-size: 12px; }

  /* —— 交付物 / 微信推送卡片 —— */
  .dl-file2 { flex-wrap: wrap; }
  .dl-file2 .fname { flex-basis: 100%; white-space: normal; word-break: break-all; }
  .wx-box { font-size: 11.5px; padding: 10px 12px; }

  /* —— 空状态 —— */
  .empty2 { padding: 28px 0; }
}

/* 超窄屏（≤400px）：品牌名进一步缩小，统计卡数字缩排 */
@media (max-width: 400px) {
  .brand-name { font-size: 14px; }
  .brand-logo { font-size: 19px; }
  .stats-row, .a-stat-grid, .a-stat-row, .kpi-row { gap: 8px; }
  .stat-card .num { font-size: 19px; }
  .user-hero h1 { font-size: 17px; }
}

/* ═══════════ v1.6 极简版式（PC + H5，末尾覆盖生效）═══════════ */
/* 登录页：居中单卡 */
.auth-wrap { display: flex; justify-content: center; margin-top: 7vh; }
.auth-card { width: 390px; max-width: 100%; padding: 30px 28px 24px; }
.auth-brand { display: flex; align-items: center; justify-content: center; gap: 8px; font-size: 17px; font-weight: 700; color: var(--ink); margin-bottom: 14px; }
.auth-brand span { font-size: 22px; }
.auth-card input { margin-bottom: 12px; }
.auth-card select { margin-bottom: 12px; }

/* 个人端：一行问候 + 单列居中表单 */
.user-top { display: flex; align-items: center; gap: 12px; margin-bottom: 14px; }
.user-top h1 { font-size: 20px; }
.form-card { max-width: 640px; margin: 0 auto; }
.form-card textarea#rq-title { max-width: 100%; }
.form-card .form-row { margin-top: 4px; }
.form-card .form-row input { flex: 1 1 150px; }

/* 页面/面板描述行全部隐藏 */
.admin-page-head p, .panel-desc { display: none; }

/* 侧栏迷你统计已移除 */
.side-stat { display: none; }

/* 移动端同步 */
@media (max-width: 640px) {
  .auth-wrap { margin-top: 28px; }
  .auth-card { padding: 22px 18px; }
  .user-top h1 { font-size: 17px; }
  .form-card .form-row input { flex-basis: 100%; }
}

/* ═══════════ v1.7 H5 全尺寸自适应（任意屏宽不溢出、不断层）═══════════ */

/* —— 全局兜底：任何元素不撑破视口 —— */
html, body { max-width: 100%; overflow-x: hidden; overflow-x: clip; }
img, svg, video { max-width: 100%; height: auto; }
.tc-top { flex-wrap: wrap; }                      /* 任务卡头：长标题+时间不再溢出 */
.tc-time { max-width: 100%; overflow: hidden; text-overflow: ellipsis; }

/* —— 平板 / 手机横屏区间（641–900px）：此前无任何适配 —— */
@media (min-width: 641px) and (max-width: 900px) {
  .container { padding: 18px 16px 60px; }
  .topbar-inner { padding: 10px 16px; }
  /* iOS 聚焦防缩放：该区间输入框同样需要 ≥16px */
  input, textarea, select { font-size: 16px; }
  .search-box input { font-size: 15px; }
  /* 统计卡统一两列，避免拉伸过宽 */
  .stats-row, .a-stat-grid, .a-stat-row, .kpi-row { grid-template-columns: repeat(2, 1fr); }
  /* 双栏/图表收为单列 */
  .user-grid { grid-template-columns: 1fr; }
  .chart-grid { grid-template-columns: 1fr; }
  .form-card { max-width: 100%; }
  .a-stat-num { font-size: 20px; }
  .recog-grid2 { grid-template-columns: repeat(2, 1fr); }
}

/* —— 手机断点（≤640px）补充：进度条防溢出 + 弹窗 dvh —— */
@media (max-width: 640px) {
  .progress { flex-wrap: nowrap; min-width: 0; }
  .p-step { font-size: 11px; gap: 4px; min-width: 0; }
  .p-dot { width: 18px; height: 18px; font-size: 10px; flex-shrink: 0; }
  .p-line { min-width: 12px; margin: 0 4px; }
  .urgency-row { gap: 8px; }
  .urgency-chip { flex: 1 1 46%; padding: 8px 10px; }
  .recog-grid2 { grid-template-columns: repeat(2, 1fr); }
  /* iOS Safari：vh 随地址栏跳动，改用 dvh（不支持时回退 88vh） */
  .modal { max-height: 88dvh; }
  .modal-mask { overflow-y: auto; }
  .org-head { flex-wrap: wrap; }
}

/* —— 超窄屏（≤360px）：单列统计、更紧凑 —— */
@media (max-width: 360px) {
  .brand-name { font-size: 13px; }
  .brand-logo { font-size: 18px; }
  .recog-grid2 { grid-template-columns: 1fr; }
  .urgency-chip { flex-basis: 100%; }
  .stat-card .num { font-size: 18px; }
}

/* —— 手机横屏（矮屏）：压缩垂直留白，弹窗近全高 —— */
@media (max-width: 920px) and (orientation: landscape) {
  .auth-wrap { margin-top: 10px; }
  .auth-card { padding: 18px 20px; }
  .modal { max-height: 94dvh; }
  .modal-mask { padding: 10px 16px; }
  .container { padding-top: 12px; }
}

/* ═══════════ v1.7.1 个人端统计卡等宽对齐（修复宽窄不一）═══════════ */
/* 根因：.a-stat-row 用 auto-fit+minmax(170px,1fr)，grid 轨道默认按内容最小宽度分配，
   长标签（累计需求/已交付）把首尾两张撑宽、中间两张被压瘪。改为固定 4 列等宽。 */
.a-stat-row { grid-template-columns: repeat(4, 1fr); }
.a-stat { min-width: 0; }
.a-stat-num, .a-stat-lbl { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
/* 图标与文字垂直拉伸居中对齐，避免各行高低参差 */
.a-stat { flex-direction: row; }
.a-stat-icon { flex-shrink: 0; }

/* 平板 / 手机横屏（641–900px）：4 列放不下时降为 2 列，保持等宽 */
@media (min-width: 641px) and (max-width: 900px) {
  .a-stat-row { grid-template-columns: repeat(2, 1fr); }
}

/* 手机竖屏（≤640px）：保持 2 列等宽（此前已设，此处复述保证后续覆盖不掉） */
@media (max-width: 640px) {
  .a-stat-row { grid-template-columns: repeat(2, 1fr); }
}

/* 超窄屏（≤360px）：2 列仍显挤时降为 1 列 */
@media (max-width: 360px) {
  .a-stat-row { grid-template-columns: 1fr; }
}

/* ═══════════ v1.9 个人中心 + 注册表单（姓名必填 / 二级机构）═══════════ */
.profile-meta {
  display: flex; flex-wrap: wrap; gap: 8px;
  margin: 10px 0 16px; padding: 12px 14px;
  background: var(--bg-soft, #f6f7fb); border-radius: 10px;
}
.profile-actions { display: flex; gap: 10px; margin-top: 18px; }
.profile-actions .btn { flex: 1; }
.topbar-user .badge.gray { max-width: 46vw; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
@media (max-width: 640px) {
  .topbar-user { flex-wrap: wrap; row-gap: 8px; }
  .topbar-user .badge.gray { max-width: 60vw; }
  .profile-meta { padding: 10px; gap: 6px; }
}

/* ═══════════ v2.0 H5 底部导航栏：各模块排成一排在底部切换 ═══════════ */
.bottom-nav { display: none; }

/* 2026-09-12：条件同步扩展为「窄屏 或 触屏 ≤900px」，理由见「手机端 H5 适配」段注释 */
@media (max-width: 640px), (hover: none) and (pointer: coarse) and (max-width: 900px) {
  /* 固定底栏：图标 + 文字一排均分 */
  .bottom-nav {
    display: flex;
    position: fixed; left: 0; right: 0; bottom: 0; z-index: 60;
    background: #fff;
    border-top: 1px solid #e8eaf1;
    box-shadow: 0 -4px 18px rgba(17,24,39,.07);
    padding: 5px 6px calc(5px + env(safe-area-inset-bottom, 0px));
  }
  .bn-item {
    position: relative;
    flex: 1; min-width: 0;
    display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px;
    background: none; border: none; cursor: pointer;
    padding: 5px 2px; border-radius: 12px;
    font-size: 11px; color: var(--gray); line-height: 1.2;
    -webkit-tap-highlight-color: transparent;
  }
  .bn-icon { font-size: 20px; line-height: 1; width: 22px; height: 22px; display: flex; align-items: center; justify-content: center; }
  .bn-icon svg { width: 22px; height: 22px; display: block; }
  .bn-lbl { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; }
  .bn-item { color: #8A93A6; }
  .bn-item.active { color: var(--primary); font-weight: 700; }
  /* 我的需求角标 */
  .bn-cnt {
    position: absolute; top: 0; right: calc(50% - 24px);
    background: var(--danger, #ef4444); color: #fff;
    font-size: 10px; min-width: 16px; height: 16px; line-height: 16px;
    border-radius: 8px; padding: 0 4px; font-weight: 600;
  }
  /* 底栏接管模块切换后，隐藏顶部/侧边的重复切换 UI */
  .u-tabs { display: none; }
  .admin-side { display: none; }
  .admin-layout { flex-direction: column; gap: 0; }
  /* 预留底栏高度，避免内容被遮挡（含 iOS 手势条安全区） */
  body { padding-bottom: calc(70px + env(safe-area-inset-bottom, 0px)); }
}

/* ═══════════ v2.1 底部导航追加「个人中心」最右侧 + 多项紧凑模式 ═══════════ */
@media (max-width: 640px), (hover: none) and (pointer: coarse) and (max-width: 900px) {
  .bn-item.bn-profile-sep { border-left: 1px solid #eef0f5; border-radius: 0; }
  /* 6 项（管理端）时缩小图标与字号，保证一排完整显示 */
  .bn-compact .bn-icon { font-size: 17px; }
  .bn-compact .bn-icon svg { width: 19px; height: 19px; }
  .bn-compact .bn-item { font-size: 10px; padding: 4px 1px; gap: 2px; }
  .bn-compact .bn-lbl { letter-spacing: -0.2px; }
  .bn-compact .bn-cnt { right: calc(50% - 20px); }
}

/* ═══════════ v2.2 H5 隐藏顶栏「个人中心」按钮（底栏最右已有入口） ═══════════ */
@media (max-width: 640px), (hover: none) and (pointer: coarse) and (max-width: 900px) {
  .tb-profile { display: none; }
}

/* ═══════════════════════════════════════════════════════════════
   v3.0 豆包（Doubao）风格全站重设计
   豆包蓝 #4D6BFE · 纯白页面 + 浅灰分区 · 大圆角 · 胶囊按钮 ·
   灰底无边框输入框 · 聊天式发送框 · 轻投影弱边框
   ═══════════════════════════════════════════════════════════════ */

/* —— 1. 设计变量全面切换 —— */
:root {
  --primary: #4D6BFE;
  --primary-light: #EEF1FF;
  --primary-dark: #3B5BF0;
  --danger: #F25056;
  --danger-bg: #FEF1F1;
  --warn: #E8830C;
  --warn-bg: #FFF6E9;
  --ok: #00B96B;
  --ok-bg: #E9F9F1;
  --gray: #7A8195;
  --border: #EDEEF3;
  --bg: #F7F8FA;
  --card: #ffffff;
  --text: #1A1D26;
  --radius: 16px;
  --shadow: 0 2px 8px rgba(26, 29, 38, .03), 0 10px 28px rgba(26, 29, 38, .05);
  --doubao-gray-input: #F2F3F7;
}

body {
  background: var(--bg);
  -webkit-font-smoothing: antialiased;
  color: var(--text);
}

/* —— 2. 顶栏：极简白底 + 品牌圆形徽标 —— */
.topbar { background: rgba(255,255,255,.92); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); border-bottom: 1px solid #F0F1F5; }
.brand-logo {
  width: 34px; height: 34px; border-radius: 50%;
  background: linear-gradient(135deg, #5B7BFF 0%, #4D6BFE 60%, #3B5BF0 100%);
  color: #fff; font-size: 17px;
  display: inline-flex; align-items: center; justify-content: center;
  box-shadow: 0 4px 10px rgba(77, 107, 254, .28);
}
.brand-name { font-size: 17px; font-weight: 700; letter-spacing: .2px; }

/* —— 3. 按钮：胶囊形 · 豆包蓝 —— */
.btn { border-radius: 999px; padding: 10px 22px; font-weight: 600; letter-spacing: .2px; box-shadow: 0 4px 12px rgba(77, 107, 254, .22); }
.btn:hover { background: #3D5AF0; }
.btn.ghost { background: var(--doubao-gray-input); color: var(--text); border: none; box-shadow: none; }
.btn.ghost:hover { background: #E8EAF1; color: var(--text); }
.btn.danger { box-shadow: 0 4px 12px rgba(242, 80, 86, .22); }
.btn.sm { border-radius: 999px; padding: 6px 14px; }

/* —— 4. 输入框：灰底无边框，聚焦白底蓝环（豆包式） —— */
input, textarea, select {
  background: var(--doubao-gray-input);
  border: 1.5px solid transparent;
  border-radius: 12px;
  transition: background .15s, border-color .15s, box-shadow .15s;
}
input:focus, textarea:focus, select:focus {
  background: #fff; border-color: var(--primary);
  box-shadow: 0 0 0 3px rgba(77, 107, 254, .14);
}
input::placeholder, textarea::placeholder { color: #A6ADBF; }

/* —— 5. 卡片：大圆角 · 轻边框 · 柔和投影 —— */
.card { border-radius: var(--radius); border: 1px solid #F0F1F5; padding: 22px; }
h2.section-title { font-size: 17px; font-weight: 700; }

/* —— 6. 登录页：大圆 Logo + 名称居中 —— */
.auth-card { width: 400px; max-width: 100%; padding: 34px 30px 26px; border-radius: 20px; }
.auth-brand { flex-direction: column; gap: 12px; margin-bottom: 22px; display: flex; align-items: center; justify-content: center; }
.auth-logo {
  width: 64px; height: 64px; border-radius: 50%; font-size: 30px;
  background: linear-gradient(135deg, #5B7BFF 0%, #4D6BFE 60%, #3B5BF0 100%);
  color: #fff; display: inline-flex; align-items: center; justify-content: center;
  box-shadow: 0 8px 22px rgba(77, 107, 254, .32);
}
.auth-name { font-size: 20px; font-weight: 700; letter-spacing: .3px; color: var(--text); }
.auth-tabs { background: var(--doubao-gray-input); border-radius: 999px; padding: 4px; }
.auth-tabs button { border-radius: 999px; padding: 9px; font-weight: 500; }
.auth-tabs button.active { font-weight: 700; color: var(--text); }
.auth-card > .btn { padding: 12px; font-size: 15px; }

/* —— 7. C 端提交：豆包聊天式输入框 + 圆形发送按钮 —— */
.form-card { max-width: 680px; margin: 0 auto; padding: 22px; }
.chat-box { position: relative; }
.chat-box textarea#rq-title {
  min-height: 128px; font-size: 16px; line-height: 1.7;
  padding: 18px 76px 18px 18px; border-radius: 18px;
  background: var(--doubao-gray-input); border: 1.5px solid var(--border); resize: none;
}
.chat-box textarea#rq-title:focus { background: #fff; border-color: var(--primary); }
.send-btn {
  position: absolute; right: 14px; bottom: 14px;
  width: 46px; height: 46px; border-radius: 50%;
  background: linear-gradient(135deg, #5B7BFF 0%, #4D6BFE 100%);
  color: #fff; font-size: 17px; border: none; cursor: pointer;
  display: inline-flex; align-items: center; justify-content: center;
  box-shadow: 0 6px 14px rgba(77, 107, 254, .35);
  transition: transform .12s, box-shadow .12s;
}
.send-btn:hover { transform: scale(1.06); }
.send-btn:active { transform: scale(.96); }
.user-top h1 { font-size: 21px; font-weight: 700; }
.avatar {
  background: linear-gradient(135deg, #5B7BFF 0%, #4D6BFE 100%);
  color: #fff; font-weight: 700;
}

/* —— 8. 页签：胶囊分段控件 —— */
.u-tabs { background: var(--doubao-gray-input); border-radius: 999px; padding: 4px; }
.u-tabs button { border-radius: 999px; font-weight: 500; }
.u-tabs button.active { color: var(--primary); font-weight: 700; }
.u-tabs .tab-cnt { background: #E1E4EE; }
.filter-tabs button { background: var(--doubao-gray-input); border: none; border-radius: 999px; color: #5C6375; font-weight: 500; }
.filter-tabs button.active { background: var(--primary); color: #fff; }
.example-chips button { background: var(--doubao-gray-input); border: none; border-radius: 999px; padding: 7px 14px; color: #5C6375; }
.example-chips button:hover { background: var(--primary-light); color: var(--primary); }

/* —— 9. 列表卡 / 任务卡：轻边框大圆角 —— */
.req-item, .task-card { border: 1px solid #F0F1F5; border-radius: 14px; }
.req-item.urgent { border-color: #FBD9DA; background: linear-gradient(135deg, #FFF6F6 0%, #fff 55%); }
.req-title { font-size: 15px; line-height: 1.6; }

/* —— 10. 统计卡 / 识别结果：浅色块无重边框 —— */
.a-stat { background: var(--doubao-gray-input); border: none; border-radius: 14px; }
.recog-card2 { background: linear-gradient(135deg, #EEF1FF 0%, #fff 70%); border: 1px solid #E3E8FF; border-radius: 14px; }
.p-step.done .p-dot, .p-line.done { background: var(--primary); }
.p-step.done { color: var(--primary); }

/* —— 11. 弹窗 / Toast —— */
.modal { border-radius: 20px; }
.toast { border-radius: 999px; background: #1F2329; }

/* —— 12. 管理端侧栏导航：胶囊项 —— */
.admin-side { border-radius: 14px; border: 1px solid #F0F1F5; }
.admin-side .nav-item, .admin-side button { border-radius: 999px; }

/* —— 13. H5 底部导航：豆包式（圆角顶边 + 蓝色高亮） —— */
@media (max-width: 640px), (hover: none) and (pointer: coarse) and (max-width: 900px) {
  .bottom-nav {
    background: rgba(255,255,255,.96);
    backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px);
    border-top: none;
    border-radius: 18px 18px 0 0;
    box-shadow: 0 -6px 24px rgba(26, 29, 38, .08);
  }
  .bn-item.active { color: var(--primary); }
  .bn-item.active .bn-icon { transform: scale(1.08); transition: transform .12s; }
  .chat-box textarea#rq-title { font-size: 16px; padding: 16px 68px 16px 16px; min-height: 118px; }
  .send-btn { width: 42px; height: 42px; right: 12px; bottom: 12px; }
  .card { border-radius: 14px; padding: 16px; }
  .auth-card { border-radius: 18px; }
}

/* ═══════════════════════════════════════════════════════════════
   v5.0 全站视觉精修（PC + H5 统一到当前审美）
   细腻过渡 · 悬浮反馈 · 轻盈空状态 · 滚动条 · 层级与留白
   ═══════════════════════════════════════════════════════════════ */

/* —— 1. 基础：点击无高亮 / 选中色 / 细腻滚动条 —— */
* { -webkit-tap-highlight-color: transparent; }
::selection { background: rgba(77, 107, 254, .16); color: var(--text); }
/* 切页签时整页「左右晃」的根因：各页签内容高度不同 → 垂直滚动条出现/消失 →
   视口宽度随之变化一个滚动条宽（Windows 经典滚动条约 10px）→ 整页（含左侧栏）水平平移。
   让滚动条槽位常驻即可根治：overflow-y:scroll 是兜底，scrollbar-gutter:stable 是标准写法，
   两者共存不会叠加宽度（已有滚动条时 gutter 不再额外占位）。 */
html { scroll-behavior: smooth; overflow-y: scroll; scrollbar-gutter: stable; }
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: #D8DBE4; border-radius: 999px; border: 3px solid var(--bg); }
::-webkit-scrollbar-thumb:hover { background: #BFC4D2; }

/* —— 2. 卡片 / 列表项：悬浮微抬升 —— */
.card, .req-item, .task-card, .stat-card, .rcard, .a-stat {
  transition: box-shadow .18s ease, transform .18s ease, border-color .18s ease;
}
.card:hover, .task-card:hover, .stat-card:hover {
  box-shadow: 0 4px 14px rgba(26, 29, 38, .05), 0 16px 36px rgba(26, 29, 38, .07);
}
.req-item:hover {
  border-color: #DDE1F5;
  box-shadow: 0 3px 10px rgba(26, 29, 38, .05);
  transform: translateY(-1px);
}

/* —— 3. 按钮：按下缩放 + 键盘可达焦点环 —— */
.btn, .send-btn, .bn-item, .u-tabs button, .auth-tabs button { user-select: none; -webkit-user-select: none; }
.btn:active { transform: scale(.97); }
.btn:focus-visible { outline: none; box-shadow: 0 0 0 3px rgba(77, 107, 254, .28); }
.btn.ghost:active { transform: scale(.97); background: #E4E7EF; }
.bn-item:active { transform: scale(.94); }
.bn-item { transition: color .15s, transform .12s; }

/* —— 4. 文字层级：标题更挺、辅助更轻 —— */
h1, h2, h3 { letter-spacing: .2px; }
.brand-sub { color: #9AA0B4; }
.req-meta, .task-meta { font-size: 12px; color: #9AA0B4; }
.field-label, label.field-label { font-size: 12.5px; color: #8B92A6; font-weight: 500; }

/* —— 5. 空状态：更轻盈、有呼吸感 —— */
.empty { padding: 44px 20px; color: #9AA0B4; font-size: 13px; }
.empty2 { padding: 48px 20px; color: #9AA0B4; font-size: 13px; }
.empty2 .e-icon {
  font-size: 44px; margin-bottom: 14px; opacity: .92;
  display: block; filter: saturate(.92);
}

/* —— 6. 弹窗：遮罩虚化 + 弹性入场 —— */
.modal-mask {
  background: rgba(20, 23, 32, .42);
  backdrop-filter: blur(3px); -webkit-backdrop-filter: blur(3px);
  animation: v5FadeIn .18s ease;
}
.modal {
  border-radius: 20px;
  box-shadow: 0 24px 60px rgba(20, 23, 32, .22);
  animation: v5ModalIn .24s cubic-bezier(.2, .8, .3, 1);
  max-height: 88vh; overflow-y: auto;
}
@keyframes v5FadeIn { from { opacity: 0; } to { opacity: 1; } }
@keyframes v5ModalIn { from { opacity: 0; transform: translateY(14px) scale(.98); } to { opacity: 1; transform: none; } }

/* —— 7. Toast：胶囊 + 柔和投影 —— */
.toast { font-weight: 500; box-shadow: 0 10px 30px rgba(20, 23, 32, .26); }

/* —— 8. 徽章 / 标签：更柔和 —— */
.badge { font-weight: 500; letter-spacing: .2px; }
.tag-pill, .tag { border-radius: 999px; }

/* —— 9. 进度条：圆润节点 —— */
.p-dot { font-size: 11px; font-weight: 600; }
.p-line { border-radius: 999px; }

/* —— 10. 移动端：留白收紧 + 安全区 —— */
@media (max-width: 640px), (hover: none) and (pointer: coarse) and (max-width: 900px) {
  .container { padding: 16px 14px 96px; }
  .topbar-inner { padding: 10px 14px; }
  .card { padding: 16px; }
  .req-item { padding: 14px; }
  .empty { padding: 36px 16px; }
  .empty2 { padding: 36px 16px; }
  .bottom-nav { padding-bottom: env(safe-area-inset-bottom); }
}

/* ═══════════════════════════════════════════════════════════════
   v5.1 PC 登录页重设计：左品牌展示 + 右登录卡片
   ═══════════════════════════════════════════════════════════════ */
.auth-wrap {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 64px;
  max-width: 1060px;
  margin: 5vh auto 0;
  padding: 0 20px;
}

/* —— 左：品牌展示区 —— */
.auth-hero { flex: 1 1 auto; min-width: 0; }
.hero-badge {
  display: inline-flex; align-items: center;
  background: var(--primary-light); color: var(--primary);
  font-size: 12.5px; font-weight: 600; letter-spacing: .2px;
  padding: 6px 14px; border-radius: 999px; margin-bottom: 22px;
}
.auth-hero h1 {
  font-size: 40px; line-height: 1.35; font-weight: 700;
  letter-spacing: .3px; margin-bottom: 18px; color: var(--text);
}
.auth-hero h1 em { color: var(--primary); font-style: normal; }
.auth-hero p { color: var(--gray); font-size: 14.5px; line-height: 1.95; max-width: 470px; }
.auth-steps { margin-top: 30px; display: flex; flex-direction: column; gap: 14px; }
.auth-step { display: flex; align-items: center; gap: 12px; font-size: 14px; color: #4A5164; }
.auth-step .num {
  width: 26px; height: 26px; border-radius: 50%;
  background: var(--primary-light); color: var(--primary);
  font-size: 13px; font-weight: 700;
  display: flex; align-items: center; justify-content: center; flex-shrink: 0;
}

/* —— 右：登录卡片 —— */
.auth-card {
  flex: 0 0 420px; width: 420px; max-width: 100%;
  padding: 34px 34px 28px; border-radius: 22px;
  align-self: center;
}
.auth-brand {
  display: flex; flex-direction: column; align-items: center;
  gap: 10px; margin-bottom: 22px;
}
.auth-slogan { font-size: 13px; color: var(--gray); }

.auth-form { display: flex; flex-direction: column; gap: 12px; margin-bottom: 18px; }
.auth-form .form-cell { display: flex; flex-direction: column; }
.auth-form label.field-label { margin: 0 0 6px; }
.auth-form input, .auth-form select { width: 100%; }

.btn-block { display: flex; width: 100%; margin-top: 0; }
.btn.wx { background: #07C160; box-shadow: 0 4px 12px rgba(7, 193, 96, .22); }
.btn.wx:hover { background: #06AD56; }

/* 登录卡片底部「登录 + 微信登录」并排一行（2026-09-13 龙哥要求）：
   两个按钮等宽对分，与上方输入框同宽；窄屏（≤359px）容器放不下时自动折成上下两行。
   ⚠️ 子项写 flex:1 1 0 + min-width:0，别只写 width —— 宽度会被 flex-basis 吃掉（v6.x 踩过）。 */
/* 弹窗淡出（取代瞬间消失）：切换页面/关闭时旧弹窗先淡出再移除，
   否则「完善资料 → 进入平台」会出现弹窗与页面元素叠一下的闪动。 */
.modal-out { opacity: 0; transition: opacity .18s ease; pointer-events: none; }

.auth-btns { display: flex; flex-wrap: wrap; gap: 10px; }
.auth-btns .btn { flex: 1 1 0; min-width: 132px; padding: 12px 14px; font-size: 15px; }
.auth-btns .btn.wx svg { width: 18px; height: 18px; flex: 0 0 auto; }

/* 免密出路一行（2026-09-13）：把「忘记密码」的答案直接摆在密码框下方。
   本平台 43 个 C 端账号里 42 个来自微信、仅 1 个绑了手机号 ——
   多数用户从未设过密码，引导他们走微信登录比做短信找回更有效。
   ⚠️ 触屏上「微信一键登录」是行内文字链，不是按钮（避免与上方大按钮抢视觉）。
   ⚠️ 320/360px 窄屏实测会折成两行（「获取帮助」被挤到下一行）→
      窄屏下缩字号 + 收紧 gap，保证两个链接始终同一行（探针 w=320/360 断言）。 */
.auth-alt {
  display: flex; flex-wrap: wrap; align-items: center;
  gap: 6px; margin-top: 14px;
  font-size: 12.5px; color: var(--gray);
  line-height: 1.7;
}
.auth-alt-sep { color: var(--border); }
.link-btn {
  padding: 0; border: 0; background: none;
  color: var(--primary); font-size: 12.5px; font-family: inherit;
  cursor: pointer; text-decoration: underline; text-underline-offset: 2px;
}
.link-btn:hover { opacity: .78; }
/* 窄屏（≤360px）：整行压到 11.5px + gap 4px，实测可从两行收回一行 */
@media (max-width: 360px) {
  .auth-alt, .link-btn, .auth-alt-sep { font-size: 11.5px; }
  .auth-alt { gap: 4px; }
  .auth-alt .auth-alt-sep { display: none; }   /* 窄屏去掉「·」再省一点宽度 */
}
/* 触屏行内链最小可点区域 44px（iOS 人机界面指南），用 padding 撑开而不改变视觉位置 */
@media (hover: none) and (pointer: coarse) {
  .link-btn { padding: 10px 2px; }
}

/* 「忘记密码怎么办」弹窗内的编号说明列表 */
.forgot-list { margin: 12px 0 4px; padding-left: 20px; font-size: 13.5px; color: var(--gray); line-height: 1.85; }
.forgot-list li { margin-bottom: 10px; }
.forgot-list b { color: var(--text); }
.modal-desc { margin: 4px 0 0; font-size: 13.5px; color: var(--gray); line-height: 1.75; }

.auth-divider {
  display: flex; align-items: center; gap: 12px;
  margin: 16px 0; color: #A6ADBF; font-size: 12px;
}
.auth-divider::before, .auth-divider::after {
  content: ''; flex: 1; height: 1px; background: var(--border);
}


/* —— 响应式：窄屏收起品牌区 —— */
@media (max-width: 1000px) {
  .auth-hero { display: none; }
  .auth-wrap { gap: 0; margin-top: 6vh; }
}
@media (max-width: 640px) {
  .auth-wrap { margin-top: 3vh; padding: 0 14px; }
  .auth-card { flex: 1 1 auto; width: 100%; padding: 28px 20px 22px; border-radius: 20px; }
  .auth-logo { width: 56px; height: 56px; font-size: 26px; }
  .auth-name { font-size: 19px; }
  .auth-form { gap: 10px; }
}
/* 超窄屏（≤359px，如 iPhone SE / 折叠屏外屏）：两个按钮各 132px 放不下 → 折成上下两行 */
@media (max-width: 359px) {
  .auth-btns .btn { flex: 1 1 100%; min-width: 0; }
}

/* ═══════════════════════════════════════════════════════════════
   v5.4 个人中心：由弹窗改为整页视图
   ═══════════════════════════════════════════════════════════════ */
.profile-page { display: flex; flex-direction: column; gap: 16px; }
.pf-back {
  align-self: flex-start; margin: 0 0 2px;
  border-radius: 999px; padding: 6px 14px; font-size: 13px;
}
.profile-hero {
  display: flex; align-items: center; gap: 18px;
  padding: 22px 24px; border-radius: 18px;
  background: linear-gradient(120deg, #5B7BFF 0%, #4D6BFE 55%, #3B5BF0 100%);
  color: #fff; box-shadow: 0 10px 26px rgba(77, 107, 254, .22);
}
.pf-avatar {
  width: 58px; height: 58px; border-radius: 50%; flex-shrink: 0;
  background: rgba(255, 255, 255, .22);
  border: 2px solid rgba(255, 255, 255, .55);
  display: flex; align-items: center; justify-content: center;
  font-size: 24px; font-weight: 700;
}
.pf-hero-main { min-width: 0; }
.pf-name {
  display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
  font-size: 20px; font-weight: 700; letter-spacing: .3px;
}
.pf-name .badge {
  background: rgba(255, 255, 255, .22); color: #fff;
  font-size: 12px; font-weight: 600; padding: 3px 10px;
}
.pf-sub { margin-top: 6px; font-size: 13px; color: rgba(255, 255, 255, .88); }
.pf-card-title { margin: 0 0 16px; font-size: 15px; font-weight: 700; }
.pf-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px 18px; }
.pf-grid .form-cell { display: flex; flex-direction: column; min-width: 0; }
.pf-card .profile-actions { margin-top: 18px; display: flex; gap: 10px; }
.pf-hint { font-size: 13px; color: var(--gray); margin: 0; }
.pf-logout { color: var(--danger); border-color: #F3C9C9; }
.pf-logout:hover { background: var(--danger-bg); border-color: var(--danger); }

@media (max-width: 640px) {
  .profile-hero { padding: 18px 16px; gap: 14px; border-radius: 16px; }
  .pf-avatar { width: 48px; height: 48px; font-size: 20px; }
  .pf-name { font-size: 18px; }
  .pf-grid { grid-template-columns: 1fr; gap: 12px; }
  .pf-card .profile-actions { flex-direction: column; }
  .pf-card .profile-actions .btn { width: 100%; justify-content: center; }
}

/* ═══════════════════════════════════════════════════════════════
   v5.5 品牌 Logo 替换（刊元印章 logo.png）
   ═══════════════════════════════════════════════════════════════ */
/* logo.png 已裁掉四周留白（56x90，宽高比 0.622）。
   这里只定高度、宽度交给图片自身比例自适应 —— 若写死 width==height 的方框，
   contain 会把印章再缩掉约 40%，这正是之前「logo 显小」的根因。
   裁切后印章填满画布，36px 高即比原先的可见高度（约 21px）大七成以上。 */
img.brand-logo {
  height: 36px; width: auto; border-radius: 0;
  background: transparent; box-shadow: none;
  object-fit: contain; display: inline-block; flex-shrink: 0;
}
img.auth-logo {
  width: 76px; height: 76px; border-radius: 18px;
  background: #fff; border: 1px solid #F0F1F5;
  box-shadow: 0 8px 22px rgba(17, 24, 39, .08);
  object-fit: contain; padding: 5px; box-sizing: border-box;
}
@media (max-width: 640px) {
  img.brand-logo { height: 30px; width: auto; }
  img.auth-logo { width: 64px; height: 64px; border-radius: 15px; }
}

/* —— 14. C 端对话式澄清：消息流 + 快捷选项 + 确认卡 —— */
.chat-stream { display: flex; flex-direction: column; gap: 14px; margin-bottom: 16px; }
.chat-stream:empty { display: none; }
.chat-row { display: flex; align-items: flex-start; gap: 8px; }
.chat-row.me { justify-content: flex-end; }
.bubble {
  max-width: 80%; padding: 11px 14px; border-radius: 14px;
  font-size: 14.5px; line-height: 1.7; white-space: pre-wrap; word-break: break-word;
}
.chat-row.me .bubble { background: linear-gradient(135deg, #5B7BFF 0%, #4D6BFE 100%); color: #fff; border-bottom-right-radius: 4px; }
/* bot 气泡用白底+边框，与下方灰色输入框区分，避免同色视觉融合 */
.chat-row.bot .bubble { background: #fff; border: 1px solid var(--border); box-shadow: 0 1px 4px rgba(26,29,38,.05); border-bottom-left-radius: 4px; }
.chat-row.bot .chip-btn { background: var(--doubao-gray-input); }
.bot-av {
  flex: 0 0 30px; width: 30px; height: 30px; border-radius: 50%;
  background: linear-gradient(135deg, #5B7BFF 0%, #4D6BFE 100%);
  color: #fff; font-size: 12px; font-weight: 700;
  display: flex; align-items: center; justify-content: center;
}
.typing { display: inline-flex; gap: 4px; align-items: center; }
.typing i { width: 6px; height: 6px; border-radius: 50%; background: #A9B0C3; animation: typingBounce 1.2s infinite; }
.typing i:nth-child(2) { animation-delay: .18s; }
.typing i:nth-child(3) { animation-delay: .36s; }
@keyframes typingBounce {
  0%, 60%, 100% { opacity: .35; transform: translateY(0); }
  30% { opacity: 1; transform: translateY(-3px); }
}
.chip-group { margin-top: 12px; }
.chip-group:first-child { margin-top: 10px; }
.chip-label { display: block; font-size: 12px; color: var(--gray); margin-bottom: 7px; }
.chip-btn {
  background: #fff; border: 1px solid var(--border); border-radius: 999px;
  padding: 6px 13px; font-size: 13px; color: #5C6375; cursor: pointer;
  margin: 0 6px 6px 0; font-family: inherit;
}
.chip-btn:hover:not(:disabled) { border-color: var(--primary); color: var(--primary); }
.chip-btn.picked { background: var(--primary-light); border-color: var(--primary); color: var(--primary); font-weight: 600; }
.chip-btn:disabled { opacity: .55; cursor: default; }
.confirm-card {
  margin-top: 10px; border: 1px solid #E3E8FF; border-radius: 14px;
  background: linear-gradient(135deg, #EEF1FF 0%, #fff 70%); padding: 12px;
}
/* 确认卡是模板字符串拼出的 HTML，放进 pre-wrap 气泡时源码换行/缩进会变成可见空行，恢复正常排版 */
.confirm-card, .confirm-card * { white-space: normal; }
.cf-head { font-size: 13px; font-weight: 700; color: var(--primary); margin-bottom: 8px; }
.cf-field { display: block; }
.cf-field span { display: block; font-size: 12px; color: var(--gray); margin-bottom: 5px; }
.cf-field textarea {
  width: 100%; border: 1px solid var(--border); border-radius: 10px; background: #fff;
  padding: 9px 11px; font-size: 14px; line-height: 1.6; font-family: inherit; resize: vertical;
}
.cf-field textarea:focus { outline: none; border-color: var(--primary); }
.cf-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(104px, 1fr)); gap: 8px; margin-top: 8px; }
.cf-cell { background: #fff; border: 1px solid var(--border); border-radius: 10px; padding: 7px 10px; }
.cf-cell .k { font-size: 11px; color: var(--gray); }
.cf-cell .v { font-size: 13px; font-weight: 600; margin-top: 2px; }
.cf-actions { display: flex; gap: 10px; margin-top: 10px; flex-wrap: nowrap; }
.cf-actions .btn { flex: 1; min-width: 0; padding: 10px 12px; white-space: nowrap; }
.chat-escape { display: flex; gap: 14px; margin-top: 12px; }
.chat-escape button {
  background: none; border: none; padding: 0; font-family: inherit;
  font-size: 12.5px; color: var(--gray); cursor: pointer;
}
.chat-escape button:hover:not(:disabled) { color: var(--primary); }
.chat-escape button:disabled { opacity: .5; cursor: default; }

@media (max-width: 640px) {
  .bubble { max-width: 86%; }
  .cf-grid { grid-template-columns: repeat(2, 1fr); }
}

/* ═══════════ 机构信息维护 / 密码重置（v1.8）═══════════ */
/* 表格行内操作组：一行排开，不再竖着堆成三行（原 flex-wrap:wrap 在窄单元格里会被挤成多行） */
.row-actions { display: flex; align-items: center; gap: 6px; flex-wrap: nowrap; }
.row-actions .btn { white-space: nowrap; }
/* 行内操作按钮：比 .sm 再小一档，扁平无投影（表格里不需要发光） */
.btn.xs { padding: 4px 10px; font-size: 12px; border-radius: 999px; gap: 4px; box-shadow: none; }
.btn.xs:focus-visible { box-shadow: 0 0 0 3px rgba(77, 107, 254, .28); }
/* 按钮内图标：统一内联 SVG，尺寸写死 10px —— emoji 会随字号放大且无法真正缩小，
   10px 的实心线条图标在 12px 文字旁刚好“退到字下面”而不抢视线 */
.btn .ico { display: inline-flex; align-items: center; justify-content: center; font-style: normal; font-size: 12px; line-height: 1; }
.btn .ico svg { display: block; width: 10px; height: 10px; }
@media (max-width: 640px) {
  .row-actions .btn { padding: 5px 9px; }
}
/* 机构详情头部：左侧信息自适应，右侧维护按钮靠右 */
.org-head-main { min-width: 0; }
.org-head-actions { margin-left: auto; display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }

/* 弹窗内辅助说明与分组分隔 */
.modal-hint { font-size: 12px; color: var(--gray); line-height: 1.75; margin: 4px 0 2px; }
/* 弹窗底部：把「重置登录密码」这类次要破坏性操作推到左侧，与右侧的取消/保存分开 */
.modal-actions .pull-left { margin-right: auto; }
.modal-sep {
  margin: 18px 0 0; padding-top: 14px;
  border-top: 1px dashed var(--border);
  font-size: 13px; font-weight: 600;
}

/* 重置密码结果卡：新密码一次性展示 */
.pwd-result { background: #F2F3F7; border-radius: 14px; padding: 10px 14px; }
.pwd-result .pr-row { display: flex; align-items: center; gap: 10px; font-size: 13px; padding: 5px 0; }
.pwd-result .pr-row > span { width: 58px; flex-shrink: 0; color: var(--gray); }
.pwd-result .pr-row b { word-break: break-all; }
.pwd-result .pr-row code {
  font-size: 16px; font-weight: 700; letter-spacing: 1.5px; color: var(--primary);
  background: #fff; border-radius: 8px; padding: 4px 12px;
}

/* ═══════════ v1.9 视觉统一 / 头像 / 列表重排 ═══════════ */
/* —— 1. 内联 SVG 图标兜底：<svg> 无尺寸时浏览器按 300×150 渲染，会直接撑爆按钮 —— */
.btn > svg, .badge > svg, .nav-item > span > svg { width: 15px; height: 15px; }
.e-icon svg { width: 40px; height: 40px; }
/* 搜索框里的放大镜：它既是 flex 直接子元素、又没有尺寸约束，漏掉这条会把输入框挤没
   （线上故障：任务看板/微信推送/需求任务/用户管理的搜索框只剩一个巨大放大镜）。
   用 `flex: none` 防止被 flex 压缩，`color` 让 currentColor 描边跟上灰色。
   NAV_ICONS 的 svg 现在都自带 width/height="16" 兜底，这里再收紧到 15px。 */
.search-box > svg { width: 15px; height: 15px; flex: none; color: var(--gray); }

/* —— 2. 各端左侧菜单栏 / 侧栏 logo / 顶栏个人中心：统一线性 SVG —— */
.side-logo { color: var(--primary); background: var(--primary-light); }
.side-logo svg { width: 19px; height: 19px; }
.nav-item { gap: 10px; }
.ni-icon { display: inline-flex; align-items: center; justify-content: center; width: 20px; }
.ni-icon svg { width: 17px; height: 17px; }
.tb-profile svg { width: 14px; height: 14px; }

/* —— 3. 头像：图片版（顶栏 / 任务卡 / 用户表 / 个人中心共用） —— */
.avatar { overflow: hidden; }
.avatar img { width: 100%; height: 100%; object-fit: cover; border-radius: 50%; display: block; }
.avatar.lg { width: 58px; height: 58px; font-size: 22px; }

/* —— 4. 数据看板：一行三个统计块，左右对齐 —— */
.a-stat-grid { grid-template-columns: repeat(3, 1fr); }
.a-stat-icon svg { width: 20px; height: 20px; }
.a-stat.violet .a-stat-icon { background: #F1EEFF; }
.a-stat.violet .a-stat-num { color: #6B46FF; }
@media (max-width: 1000px) { .a-stat-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 560px) { .a-stat-grid { grid-template-columns: 1fr; } }

/* —— 5. 用户管理表格：合并列 + 紧凑排版，一行放得下不横向拖拽 —— */
.ux-table { font-size: 12.5px; }
.ux-table th, .ux-table td { padding: 9px 8px; }
.ux-table .badge { font-size: 11px; padding: 1px 8px; }
.cell-user { display: flex; align-items: center; gap: 8px; }
.cu-main { min-width: 0; }
.cu-name { display: flex; align-items: center; gap: 6px; font-weight: 600; }
.cu-sub { font-size: 11.5px; color: var(--gray); margin-top: 2px; }
.num-pair { font-size: 12px; color: var(--gray); }
.num-pair b { font-size: 13px; color: var(--text); }
.muted { color: var(--gray); }
.org-pick { min-width: 120px; max-width: 150px; padding: 5px 8px; font-size: 12.5px; }

/* —— 6. 列表工具栏（搜索 / 筛选 / 排序） —— */
.list-toolbar { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin: 0 0 14px; }
/* 搜索框已上移到页面标题行，这里只剩「页签 + 筛选下拉 + 匹配计数」 */
.list-toolbar .filter-tabs { margin-bottom: 0; }
.list-toolbar select { width: auto; padding: 8px 10px; font-size: 12.5px; }
.list-toolbar .lt-hint { margin-left: auto; }
.lt-hint { font-size: 12px; color: var(--gray); }

/* —— 7. 个人中心：可编辑头像 + 微信绑定 + 未绑提示 —— */
.pf-avatar-btn {
  position: relative; padding: 0; cursor: pointer; overflow: visible;
  border: 2px solid rgba(255, 255, 255, .55); background: rgba(255, 255, 255, .22);
}
.pf-avatar-btn img { width: 100%; height: 100%; border-radius: 50%; object-fit: cover; display: block; }
.pf-avatar-edit {
  position: absolute; right: -4px; bottom: -4px; width: 22px; height: 22px; border-radius: 50%;
  background: #fff; color: var(--primary); display: flex; align-items: center; justify-content: center;
  box-shadow: 0 2px 8px rgba(0, 0, 0, .18);
}
.pf-avatar-edit svg { width: 12px; height: 12px; }
.pf-sub2 { margin-top: 4px; font-size: 12px; color: rgba(255, 255, 255, .78); }
.cp-avatar { display: flex; align-items: center; gap: 14px; margin: 8px 0 2px; }
.cp-avatar .avatar.lg { background: var(--primary-light); color: var(--primary); }
.cp-avatar-side { min-width: 0; }
.cp-avatar-side .modal-hint { margin: 6px 0 0; }
.wx-tip {
  display: flex; align-items: center; gap: 12px; margin-bottom: 14px; padding: 12px 16px;
  border-radius: 14px; background: #F0FBF3; border: 1px solid #CDEFD6;
}
.wx-tip-icon {
  width: 34px; height: 34px; border-radius: 10px; flex-shrink: 0;
  background: #07C160; color: #fff; display: flex; align-items: center; justify-content: center;
}
.wx-tip-icon svg { width: 18px; height: 18px; }
.wx-tip-main { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.wx-tip-main b { font-size: 13.5px; }
.wx-tip-main span { font-size: 12.5px; color: #2F6B46; }

/* —— 8. 需求输入框：默认单行，随内容自动长高（上限后框内滚动） —— */
.chat-box textarea#rq-title { resize: none; overflow-y: hidden; line-height: 1.6; }

/* —— v1.9 补充：用户表再收一档，保证 1100px 视口下一行放得下 —— */
.ux-table { font-size: 12px; }
.ux-table th, .ux-table td { padding: 8px 6px; }
.ux-table .org-pick { min-width: 104px; max-width: 132px; padding: 4px 6px; font-size: 12px; }
.ux-table .row-actions { gap: 5px; }
.cu-name { max-width: 190px; overflow: hidden; }
.cu-name > b, .cu-name { white-space: nowrap; text-overflow: ellipsis; }

/* ═══════════════════════════════════════════════════════════════════════════
   v6.1 移动端版式修复 —— Android / iOS / HarmonyOS(鸿蒙) 三端统一
   日期：2026-09-12
   ── 现象（手机端截图 + CDP 390px 无头渲染双重实测）──
     · 页头「任务看板」与搜索框挤在同一行，搜索框只剩 195px、x 从 93 起；
     · 「搜索」按钮被压到约 44px 宽，中文逐字换行成竖排胶囊，与「重置」「刷新」
       三行零散堆叠；
     · 卡片内状态页签（待处理/处理中/已完成/全部）横向溢出，第 4 个被裁掉。
   ── 根因 ──
     .aph-right 基础规则是 `flex: 1`（等价 flex-basis:0%）。在 flexbox 里
     flex-basis 的优先级高于 width，因此第 252 行的窄屏块和上一版 v6.0 里补的
     `width:100%` 全部被静默忽略（死代码）——窄屏只改了 width、没改 flex-basis，
     所以规则看起来「写了却没生效」。
   ── 修法 ──
     1) 窄屏一律改用显式 `flex: 0 0 100%` 强制整行，不再依赖 width；
     2) 页头重排为三行：标题 → 搜索框整行 → 「搜索 / 重置 / 刷新」等分一行。
        用 `display:contents` 把 .page-search、.page-head-actions 的盒子摊平到
        .aph-right 上，使三组按钮落在同一行；万一内核不支持 contents，退化成
        「按钮各自占一行」——仍然整齐，不会错位（安全兜底）；
     3) 状态页签在窄屏允许换行（原来强制 nowrap + 横滑，第 4 个被裁掉像 Bug）；
     4) 三端共性：
        · iOS  —— 输入控件字号必须 ≥16px，否则聚焦时整页被自动放大；刘海/手势条
                  用 env(safe-area-inset-*) 留白；已用 dvh 规避地址栏跳动。
        · 安卓 —— touch-action:manipulation 去掉双击缩放的 300ms 延迟。
        · 鸿蒙 —— ArkWeb 与 Chromium 的布局计算路径存在已知差异，本区块不引入任何
                  新式 CSS，只用 flex / env() / calc()，且凡 flex 项一律显式写
                  flex-basis 而非 width。鸿蒙 Mate 70 Pro 实测上报约 700px 布局
                  视口，故触屏断点额外叠加 (hover:none) and (pointer:coarse)。
   ═══════════════════════════════════════════════════════════════════════════ */

/* ───────── ① ≤900px：页头三行式 + 卡片工具栏整行 ───────── */
@media (max-width: 900px) {
  /* —— 页头：标题独占一行，右侧区整行另起 —— */
  .admin-page-head { align-items: flex-start; gap: 10px; }
  .admin-page-head h2 { width: 100%; }
  .aph-right {
    flex: 0 0 100%; width: auto; min-width: 0;
    justify-content: flex-start; flex-wrap: wrap; gap: 8px;
  }

  /* —— 摊平两层盒子：搜索框与三组按钮成为 .aph-right 的直接子项，落在同一套换行里 —— */
  .aph-right > .page-search,
  .aph-right > .page-head-actions { display: contents; }
  .page-search { min-width: 0; flex-wrap: wrap; gap: 8px; }
  .page-head-actions { min-width: 0; }

  /* —— 搜索框：独占一整行，不再与按钮抢宽度 —— */
  .aph-right .search-box { flex: 1 1 100%; width: auto; min-width: 0; max-width: none; }

  /* —— 按钮：同一行等分，中文不换行，高度对齐 —— */
  .aph-right .btn {
    flex: 1 1 0; min-width: 0;
    min-height: 42px;
    white-space: nowrap;
  }

  /* —— 页签 / 筛选 chips：一律换行显示 ——
     原来在触屏下强制 `flex-wrap:nowrap` + 横向滚动，390px 手机上前 3 个占满一行、
     第 4 个被切在屏幕外且没有任何「还能滑」的提示，看起来就是破版。
     改为换行后 4 个 chips 分 2 行全部可见。另外「我的需求」页的 .filter-tabs
     不在 .list-toolbar 里，所以这条不能只写 .list-toolbar 前缀。 */
  .filter-tabs { flex-wrap: wrap; overflow: visible; padding-bottom: 0; }
  .filter-tabs button { flex: 0 1 auto; }
  .list-toolbar { gap: 8px; }
  .list-toolbar .filter-tabs { flex: 1 1 100%; }
  .list-toolbar select { flex: 1 1 130px; min-width: 0; }
  .list-toolbar .lt-hint { margin-left: auto; }
}

/* ───────── ② ≤860px：侧栏改「顶部横向导航条」 ───────── */
@media (max-width: 860px) {
  /* align-items:stretch 是关键：布局转 column 后若仍是 flex-start（基础值），
     .admin-main 会退化成「按内容收缩」，在 820–900px 视口右侧留出大片空白
     （实测 main 只有 772px 而可用宽度 876px）。 */
  .admin-layout { flex-direction: column; gap: 0; align-items: stretch; }
  .admin-side {
    position: static; top: auto;
    width: 100%; flex-shrink: 1;              /* 显式写死，别再用 width 之外的隐式行为 */
    flex-direction: row; align-items: center; flex-wrap: wrap;
    gap: 8px; padding: 10px 12px;
  }
  .side-brand { border-bottom: none; padding: 0 10px 0 0; }
  .side-brand b { font-size: 13.5px; }
  .side-nav {
    flex-direction: row; flex-wrap: nowrap; width: 100%; gap: 4px;
    overflow-x: auto; -webkit-overflow-scrolling: touch;
  }
  .side-nav .nav-item { white-space: nowrap; padding: 8px 12px; font-size: 13px; }
  .side-foot { display: none; }
}

/* ───────── ③ 触屏手机（含鸿蒙上报 ~700px 视口）：底栏接管，侧栏彻底隐藏 ───────── */
@media (hover: none) and (pointer: coarse) and (max-width: 900px) {
  .admin-side { display: none; }
  .admin-layout { flex-direction: column; gap: 0; align-items: stretch; }
}

/* ═══ v6.2 三端共性细节（iOS 防缩放 / 刘海安全区 / 安卓去双击缩放）═══════ */

/* —— iOS Safari：输入控件字号 <16px 会在聚焦瞬间把整页放大 ——
   规则本体已统一收到文末 v6.5 区块 ④（只对 html.is-ios 生效）：
   安卓 / 鸿蒙同样命中 (hover:none)(pointer:coarse)，但它们压根没有聚焦缩放，
   被一起抬到 16px 的后果是工具栏「排序 / 紧急度」下拉明显偏大（2026-09-12 龙哥反馈）。 */
@media (hover: none) and (pointer: coarse) {
  /* —— 安卓 / 鸿蒙：去掉双击缩放延迟与误缩放 —— */
  button, .btn, a, .nav-item, select, .u-tabs button,
  .filter-tabs button, .bn-item, .side-nav .nav-item { touch-action: manipulation; }

  /* —— 长串（需求号 / 交付文件名 / 归属机构）不撑破卡片 —— */
  .tc-title, .req-title, .panel-title,
  .dl-file2 .fname, .cu-name, .cu-sub { overflow-wrap: break-word; word-break: break-word; }
}

/* —— 安全区（iOS 刘海 / 全面屏手势条）：仅触屏生效，桌面回归基础内边距 —— */
@media (max-width: 900px) and (hover: none) and (pointer: coarse) {
  .topbar-inner {
    padding-left: max(14px, env(safe-area-inset-left, 0px));
    padding-right: max(14px, env(safe-area-inset-right, 0px));
  }
  .container {
    padding-left: max(12px, env(safe-area-inset-left, 0px));
    padding-right: max(12px, env(safe-area-inset-right, 0px));
    padding-bottom: calc(90px + env(safe-area-inset-bottom, 0px));
  }
  .bottom-nav {
    padding-left: max(6px, env(safe-area-inset-left, 0px));
    padding-right: max(6px, env(safe-area-inset-right, 0px));
  }
}

/* ═══════════════════════════════════════════════════════════════════════════
   v6.3 手机上把宽表格变成「一条记录一张卡片」
   日期：2026-09-12
   ── 问题（390px 实测）──
     用户管理表 5 列共 708px、机构管理表 9 列共 778px，而手机可用宽度只有 366px。
     虽然 .table-wrap 是 overflow-x:auto 能横滑，但「操作」列（维护信息 / 重置密码 /
     设为服务人员）整个被推到屏幕外且没有任何提示，功能等于不可达。
   ── 做法 ──
     纯 CSS 把 thead 隐藏、每行 <tr> 变成一张卡、每个 <td> 变成「左标签 + 右值」一行。
     标签取自 <td data-th="...">（app.js 里三处 <table> 已补齐该属性）。
     首列作为卡片标题（不加标签），操作列按钮铺满整行方便点按。
     生效范围＝≤640px（任何设备）**或** 触屏 ≤900px：
       鸿蒙 Mate 70 Pro 的浏览器实测上报约 700px 布局视口，只写 640px 会漏掉它；
       触屏上限取 900px 是因为 900px 宽时机构表(782px)已能完整放进内容区，
       820px 以下仍会被挤出屏幕。桌面鼠标环境保持原表格（横滑即可，符合桌面习惯）。
     把这一段整体删掉即可完全回退。
   ═══════════════════════════════════════════════════════════════════════════ */
@media (max-width: 640px),
       (hover: none) and (pointer: coarse) and (max-width: 900px) {
  .table-wrap { overflow: visible; border: none; border-radius: 0; }
  .table-wrap .table { display: block; width: 100%; }
  .table-wrap .table thead { display: none; }
  .table-wrap .table tbody { display: block; }

  .table-wrap .table tr {
    display: block;
    background: #fff;
    border: 1px solid var(--border);
    border-radius: 12px;
    box-shadow: var(--shadow);
    margin-bottom: 10px;
    padding: 2px 0 6px;
  }
  .table-wrap .table tr:hover td { background: transparent; }

  .table-wrap .table td {
    display: flex; align-items: center; justify-content: space-between; gap: 12px;
    width: auto;
    border: none;
    padding: 7px 12px;
    white-space: normal;
    text-align: right;
    overflow-wrap: break-word; word-break: break-word;
  }
  .table-wrap .table td::before {
    content: attr(data-th);
    flex: 0 0 auto;
    color: var(--gray);
    font-size: 12px;
    font-weight: 500;
    text-align: left;
  }

  /* 首列 = 卡片标题：不显示标签、左对齐、与字段之间加一条虚线 */
  .table-wrap .table td:first-child {
    display: block; text-align: left;
    padding: 10px 12px 8px;
    border-bottom: 1px dashed var(--border);
    margin-bottom: 4px;
  }
  .table-wrap .table td:first-child::before { content: none; }

  /* 操作列：隐藏标签，按钮等分铺满 */
  .table-wrap .table td:last-child { padding-top: 4px; }
  .table-wrap .table td:last-child::before { content: none; }
  .table-wrap .table td .row-actions { flex-wrap: wrap; width: 100%; }
  .table-wrap .table td .row-actions .btn { flex: 1 1 auto; justify-content: center; min-height: 38px; }

  /* 归属机构下拉不再被压成窄条 */
  .table-wrap .table .org-pick { min-width: 0; max-width: 62%; }

  /* 卡片列表底部留出与底栏的距离 */
  .table-wrap { margin-bottom: 6px; }
}

/* ═══════════════════════════════════════════════════════════════════════════
   v6.4 页头「搜索一行式」+ 下拉刷新（2026-09-12）
   ── 需求（龙哥手机端截图）──
     · 搜索框与「搜索」要排在同一行；
     · 取消「重置」和「刷新」两个按钮，改成「下拉整个页面即刷新数据」。
   ── 做法 ──
     ① 输入框 + 搜索按钮收进一行：.page-search 自己变成整行 flex 容器
        （撤销 v6.1 里为排「搜索 / 重置 / 刷新」三个按钮而写的 display:contents 摊平），
        输入框 flex:1 吃满剩余宽度、按钮按内容宽固定 —— 任何宽度都不会折行；
     ② 输入框内新增「清空 ×」(.sb-clear)，用 :placeholder-shown 控制显隐（有内容才出现），
        取代原来单独占一行的「重置」按钮；
     ③ 下拉刷新指示器 #ptr-indicator：贴顶的小胶囊，拖拽时跟手下降、松手转圈；
        手势逻辑在 app.js 的 initPullRefresh() / refreshCurrentView()。
   ═══════════════════════════════════════════════════════════════════════════ */

/* ① 搜索框 + 搜索按钮同一行（仅窄屏 / 触屏；桌面本来就够宽） */
@media (max-width: 900px) {
  .aph-right > .page-search {
    display: flex;                 /* 覆盖 v6.1 的 display:contents：不再需要摊平到 .aph-right */
    flex: 0 0 100%; width: auto; min-width: 0;
    flex-wrap: nowrap; gap: 8px;
  }
  /* 输入框吃满剩余宽度；按钮按内容宽度固定，两者同高 */
  .aph-right .page-search .search-box { flex: 1 1 auto; width: auto; min-width: 0; max-width: none; min-height: 42px; }
  .aph-right .page-search .btn { flex: 0 0 auto; min-width: 0; white-space: nowrap; }
}

/* ② 搜索框内的「清空 ×」：不重建 DOM，输入即时生效 */
.search-box .sb-clear {
  flex: none; display: flex; align-items: center; justify-content: center;
  width: 20px; height: 20px; min-height: 0; padding: 0; border: none; border-radius: 50%;
  background: #e7eaf3; color: #6b7280; cursor: pointer;
  -webkit-tap-highlight-color: transparent; touch-action: manipulation;
}
.search-box .sb-clear:hover { background: #d8ddea; color: var(--text); }
.search-box .sb-clear svg { width: 12px; height: 12px; pointer-events: none; }
/* 输入框为空（placeholder 可见）时隐藏 ×；内核不支持 :placeholder-shown 时退化为常显，不影响功能 */
.search-box input:placeholder-shown ~ .sb-clear { display: none; }

/* ③ 下拉刷新指示器：贴顶居中，默认收在视口外（位移由 JS 直接写 transform） */
.ptr-wrap {
  position: fixed; top: 0; left: 0; right: 0; z-index: 90;   /* 高于 topbar(50)、低于弹窗(100) */
  display: flex; justify-content: center;
  pointer-events: none;
  transform: translateY(-52px);
  transition: transform .25s ease;
  will-change: transform;
}
.ptr-wrap.pulling { transition: none; }                      /* 拖拽中跟手，不加过渡 */
.ptr-wrap .ptr-pill {
  display: flex; align-items: center; gap: 6px;
  height: 34px; padding: 0 16px;
  background: #fff; border-radius: 0 0 14px 14px;
  box-shadow: 0 3px 12px rgba(17,24,39,.16);
  color: var(--primary); font-size: 12.5px; font-weight: 600; white-space: nowrap;
}
.ptr-wrap .ptr-pill svg { width: 15px; height: 15px; flex: none; }
.ptr-wrap.busy .ptr-pill svg { animation: ptr-spin .8s linear infinite; }
@keyframes ptr-spin { to { transform: rotate(360deg); } }

/* 关掉浏览器自带的整页下拉刷新，把顶部下拉手势让给我们自己的指示器
   （安卓 Chrome / 微信内核支持；iOS Safari 不支持该属性，会自动回落到橡皮筋+我们的指示器） */
@media (hover: none) and (pointer: coarse) {
  html, body { overscroll-behavior-y: contain; }
}

/* ═══════════════════════════════════════════════════════════════════════════
   v6.5（2026-09-12）手机端筛选行重排 + 工具栏下拉字号回归 + 搜索框去虚框
   现象（龙哥 390px 安卓截图）：
     ① 待处理 / 处理中 / 已完成 / 全部 四个状态页签挤成两行，第二行孤零零一个「全部」；
     ② 「排序：紧急优先 / 紧急度：全部」两个下拉在安卓上明显偏大、和页签不是一套字号；
     ③ 点搜索框时输入框内会冒出一圈虚框。
   根因：
     ③ 全局 `input:focus { box-shadow: … }` 漏进了 `.search-box input`
        （该规则只写了 outline:none，没清 box-shadow）；
     ② v6.2 的 `@media (hover:none)(pointer:coarse) { input,select… { font-size:16px } }`
        本意只给 iOS 防聚焦缩放，但安卓 / 鸿蒙同样命中 → 被一起抬到 16px；
     ① `.list-toolbar .filter-tabs` 是 flex:1 1 100% + flex-wrap:wrap，4 个 chips 按内容宽换行。
   修法：4 项状态页签在真手机上等宽铺满一行；排序/紧急度两列等宽、统一 36px 高、字号与页签对齐；
        16px 只留给 iOS（html.is-ios）；输入框聚焦不再画内层光圈。
   回退：整段删掉 + 去掉 app.js 里 tabs-fit / is-ios 两处标记即可。
   注意：`tabs-fit` 只标在 **4 项**的页签上；用户管理的角色页签有 5 项
        （全部/个人用户/机构用户/服务专员/平台管理员），等宽一行会裁字，维持换行。
   ═══════════════════════════════════════════════════════════════════════════ */

/* ① 搜索框：聚焦时不再出现「内层虚框」，外框也不再叠 3px 光圈（那圈在手机上同样像虚框） */
.search-box input:focus,
.search-box input:focus-visible {
  outline: none; box-shadow: none; border: none; background: transparent;
}
.search-box input { -webkit-tap-highlight-color: transparent; }
.search-box:focus-within { box-shadow: none; }

/* ② 4 项状态页签：不再换行、不被裁，一律一行 */
@media (max-width: 900px) {
  .filter-tabs.tabs-fit { flex-wrap: nowrap; overflow: visible; gap: 6px; }
  .filter-tabs.tabs-fit button { flex: 0 0 auto; white-space: nowrap; }
  .list-toolbar .filter-tabs.tabs-fit { flex: 1 1 100%; width: 100%; margin-bottom: 0; }
}

/* ③ 真手机（含鸿蒙上报的 ~700px 视口）：页签等宽铺满一行 + 下拉两列等宽 */
@media (max-width: 640px), (hover: none) and (pointer: coarse) and (max-width: 900px) {
  .filter-tabs.tabs-fit { gap: 5px; }

  /* 等宽平分必须用 flex-basis（flex: 1 1 0）：写 width 会被 flex-basis 吃掉 —— 项目老坑 */
  .filter-tabs.tabs-fit button {
    flex: 1 1 0; min-width: 0;
    display: inline-flex; align-items: center; justify-content: center; gap: 4px;
    height: 34px; padding: 0 5px;
    font-size: 12.5px;
  }
  /* 计数徽标收窄，保证「待处理 65」在 360px 屏也放得下 */
  .filter-tabs.tabs-fit .tab-cnt {
    margin-left: 0; min-width: 0; padding: 0 4px;
    font-size: 10px; line-height: 16px;
  }

  /* 排序 / 紧急度：两列等宽、同高，字号与页签一套（安卓此前被误抬到 16px） */
  .list-toolbar select {
    flex: 1 1 calc(50% - 4px); min-width: 0;
    height: 36px; padding: 0 10px; font-size: 13px;
  }
  /* 匹配计数：独占一行靠右，不再跟两个下拉挤在同一行 */
  .list-toolbar .lt-hint { flex: 1 1 100%; margin-left: 0; text-align: right; font-size: 11.5px; }
}

/* ④ iOS 的 16px 防聚焦缩放：放最后 + 用 html.is-ios 提高特异性，压过上面的 13px */
@media (hover: none) and (pointer: coarse) {
  html.is-ios input, html.is-ios textarea, html.is-ios select,
  html.is-ios .search-box input,
  html.is-ios .list-toolbar select,
  html.is-ios .org-pick { font-size: 16px; }
}

/* ═══════════════════════════════════════════════════════════════════════════
   v6.7（2026-09-12）搜索框光标（caret）显示优化
   现象（龙哥截图）：点进搜索框后，光标是一根近黑（#1A1D26）的短竖条，
     正压在灰色占位文字「搜索需求号 / …」的第一个字上不停闪 —— 「显示不友好」。
   实测（Edge + CDP，1080px，tools/verify-caret.cjs）：
     输入框字号 13px，光标只有 1 × 7.5 CSS px；颜色 = 文字色 #1A1D26，
     比占位文字（#A6ADBF）深好几个档，闪起来就是占位文字上一团跳动的黑点。
   修法：
     ① 光标改用品牌蓝（与聚焦后的蓝色描边同色），不再是一根纯黑硬条；
     ② 空框（占位文字可见）时不画光标：占位文字本身就是「此处可输入」的提示，
       闪动的黑条压在它上面才是「不友好」的来源；
       一旦开始打字，:placeholder-shown 立即失效，蓝色光标第一帧就回来。
   回退：删掉下面两条规则即可（②去掉就恢复「空框也显示光标」）。
   注意：这是搜索框专用；登录表单等其它 input 仍是默认光标，未受影响。
   ═══════════════════════════════════════════════════════════════════════════ */
.search-box input { caret-color: var(--primary); }
.search-box input:placeholder-shown { caret-color: transparent; }

/* ═══════════════════════════════════════════════════════════════════════════
   v6.8（2026-09-12）任务看板：工具栏下拉靠右 + 接单按钮上移、去掉空脚注行
   现象（龙哥 1080px 截图，红框 / 蓝框）：
     ① 「排序：紧急优先 / 紧急度：全部」两个下拉紧跟在状态页签后面靠左，右侧空出一大片，
        与页头搜索行「整组靠右」的写法不一致（红框）；
     ② 待处理卡片底部有一条 48px 的空白行，要求把「接单处理」上移到标签行、靠右对齐（蓝框）。
   根因：① 两个 select 是 .list-toolbar 的直接子元素，整套里只有 .lt-hint 带 margin-left:auto；
        ② 操作按钮放在独立的 .tc-foot 脚注行，而左半边「处理人」在待处理状态下恒为空
           （卡片高度实测 230px，其中脚注行占 48px）。
   修法：① 两个下拉 + 匹配计数包进 .lt-right（margin-left:auto）→ 右边界贴齐卡片内容右边界，
           也就与页头搜索行右对齐；
        ② 末行改为 .tc-last = 标签 | 处理人 | 操作(margin-left:auto)，删除 .tc-foot。
           实测卡片高度 230px → 190px，看板 200 张卡合计省约 8000px。
   回退：删掉下面 .lt-right / .tc-last / .tc-staff 这几条规则，并把 app.js 里
        taskFilterHtml 的两处调用从 `<div class="lt-right">…</div>` 改回直接铺开即可。
   注意：① 必须用 `.list-toolbar .lt-right .lt-hint` 压掉 `.list-toolbar .lt-hint` 的
          margin-left:auto（0,3,0 > 0,2,0），否则计数被推到最右、两个下拉又被留在左边；
        ② 窄屏（≤900px / 触屏）.lt-right 要 flex:1 1 100% 独占一行，
          否则两个下拉会和页签挤在同一行被压扁；
        ③ 手机端操作按钮仍由 519 行那段（≤640px / 触屏）的 .tc-actions 规则
          变成整宽独占一行，本区块不再重复声明。
   ═══════════════════════════════════════════════════════════════════════════ */

/* ① 工具栏：排序 / 紧急度 靠右（右边界 = 卡片内容右边界 = 页头搜索行右边界） */
.list-toolbar .lt-right {
  display: flex; align-items: center; gap: 8px;
  margin-left: auto; min-width: 0;
}
.list-toolbar .lt-right .lt-hint { margin-left: 0; }

/* ② 任务卡末行：标签 → 处理人 → 操作（靠右）；不再有独立脚注行 */
.tc-last { display: flex; align-items: center; gap: 10px; margin-top: 10px; flex-wrap: wrap; }
.tc-last > .tc-tags { flex: 1 1 auto; min-width: 0; margin-top: 0; }
.tc-staff { font-size: 12px; color: var(--gray); white-space: nowrap; }

/* ③ 交付成果块：原来靠 .tc-foot 的虚线把自己和按钮行分开，脚注行取消后改为自带顶部分隔线 */
.delivery-box2.in-task { margin-top: 12px; padding-top: 12px; border-top: 1px dashed var(--border); }

/* 窄屏 / 触屏：下拉组独占一行（与页签同宽），排布与 v6.5 的手机版式一致 */
@media (max-width: 900px) {
  .list-toolbar .lt-right { flex: 1 1 100%; flex-wrap: wrap; margin-left: 0; }
}

/* ── v7.0（2026-09-13）需求列表分页条：取代 v6.9 的「加载更多」──
   背景同上（455 张卡 → 1.27 万 DOM 节点、body 17.6 万 px，手机端卡顿）。
   改为真分页：默认每页 10 条，可选 10/20/30/40/50，底部「首页 上一页 第 X/Y 页 下一页 末页」。
   ⚠️ 分页条是 flex + wrap：手机上一排放不下时自然换行，别给固定宽度（见 v6.0 的 flex-basis 教训）。 */
.pager { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 10px 14px; padding: 16px 0 6px; }
.pager-meta { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 6px 14px; }
.pager-size { display: flex; align-items: center; gap: 6px; font-size: 12.5px; color: var(--gray); white-space: nowrap; flex: 0 0 auto; }
.pager-size-sel { height: 30px; padding: 0 6px; font-size: 12.5px; border: 1px solid var(--border); border-radius: 8px; background: #fff; color: var(--text); }
.pager-nav { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 6px; }
.pager-info { padding: 0 4px; font-size: 12.5px; color: var(--text); white-space: nowrap; }
.pager-total { font-size: 12.5px; color: var(--gray); white-space: nowrap; flex: 0 0 auto; }
.pager-btn[disabled] { opacity: 0.45; cursor: not-allowed; }
/* 窄屏 / 触屏：转成两行 —— ① 每页 N 条 + 共 N 条  ② 翻页按钮。
   ⚠️ 390px 下单行容纳不下，「每页」会被 flex 压成竖排（「每」在上「页」在下），所以必须分行。
   字号保持 12.5（iOS 的 16px 规则在文件末尾单独处理，不整段套触屏查询）。 */
@media (max-width: 900px), (hover: none) and (pointer: coarse) {
  .pager { flex-direction: column; gap: 10px; }
}
/* 触屏：翻页按钮加大到 38px 高，符合手指点击区（与 v6.0 的触屏规范一致） */
@media (hover: none) and (pointer: coarse) {
  .pager-btn { min-height: 38px; padding: 0 12px; }
  .pager-size-sel { height: 34px; font-size: 13px; }
}

