/* style.css — 艾米营销管理系统 */
* { margin: 0; padding: 0; box-sizing: border-box; }
:root {
  --primary: #2563eb;
  --primary-dark: #1d4ed8;
  --bg: #f1f5f9;
  --card: #ffffff;
  --border: #e2e8f0;
  --text: #1e293b;
  --muted: #64748b;
  --danger: #dc2626;
  --success: #16a34a;
  --warning: #d97706;
}
body { font-family: -apple-system, "PingFang SC", "Microsoft YaHei", sans-serif; background: var(--bg); color: var(--text); font-size: 14px;
  -webkit-text-size-adjust: 100%;   /* 横竖屏切换时 iOS 不擅自放大字号 */ }

/* 登录页
   min-height 用 dvh 兜底：手机浏览器地址栏收放、横屏时 100vh 会算成"大视口"，
   内容比可视区高时登录卡会被顶出屏幕；overflow-y 让矮屏（横屏手机）能滚动到全部内容 */
.login-wrap { position: relative; min-height: 100vh; min-height: 100dvh; display: flex; justify-content: center; background: linear-gradient(135deg, #1e3a8a 0%, #2563eb 100%); overflow-y: auto; }
/* 用 margin:auto 居中，而不是 align-items:center——后者在内容超高时会把顶部裁掉且滚不到 */
.login-box { margin: auto; background: #fff; border-radius: 12px; padding: 40px; width: 380px; box-shadow: 0 20px 50px rgba(0,0,0,.25); }
.login-box h1 { font-size: 22px; text-align: center; margin-bottom: 6px; }
.login-box .sub { text-align: center; color: var(--muted); margin-bottom: 24px; font-size: 13px; }
/* 登录图形验证码（2026-10-05）：输入框 + 可点击刷新的验证码图 */
.captcha-row { display: flex; gap: 8px; align-items: stretch; }

/* ICP 备案悬挂（2026-10-13）：登录类页面贴 login-wrap 底部居中；主布局贴内容区底部。
   登录页 footer 用 absolute 相对 login-wrap：内容不足一屏时贴视口底，超高时在内容末尾，均不遮挡登录卡 */
.login-wrap .icp-line { position: absolute; bottom: 12px; left: 0; right: 0; text-align: center; font-size: 12px; color: rgba(255,255,255,.72); }
.login-wrap .icp-line a { color: rgba(255,255,255,.72); text-decoration: none; }
.login-wrap .icp-line a:hover { color: #fff; text-decoration: underline; }
.main .icp-line { text-align: center; padding: 0 24px 12px; font-size: 12px; color: var(--muted); }
.main .icp-line a { color: var(--muted); text-decoration: none; }
.main .icp-line a:hover { color: var(--primary); text-decoration: underline; }
.captcha-row input { flex: 1; min-width: 0; }
.captcha-img { width: 132px; height: 44px; flex: none; border: 1px solid var(--border); border-radius: 7px; cursor: pointer; background: #f8fafc; display: block; }

/* 布局 */
.layout { display: flex; min-height: 100vh; min-height: 100dvh; }
.sidebar { width: 210px; background: #0f172a; color: #cbd5e1; flex-shrink: 0; display: flex; flex-direction: column; }
.sidebar .logo { padding: 20px 18px; font-size: 16px; font-weight: 600; color: #fff; border-bottom: 1px solid #1e293b; }
.sidebar .logo small { display: block; font-size: 11px; color: #64748b; font-weight: 400; margin-top: 2px; }
.sidebar nav { flex: 1; padding: 10px 0; overflow-y: auto; }
.sidebar nav a { display: flex; align-items: center; gap: 10px; padding: 11px 18px; color: #cbd5e1; text-decoration: none; font-size: 14px; border-left: 3px solid transparent; }
.sidebar nav a:hover { background: #1e293b; color: #fff; }
.sidebar nav a.active { background: #1e293b; color: #fff; border-left-color: var(--primary); }
.sidebar .userbox { padding: 14px 18px; border-top: 1px solid #1e293b; font-size: 13px; }
.sidebar .userbox .role-tag { color: #94a3b8; font-size: 12px; }

.main { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.topbar { background: var(--card); border-bottom: 1px solid var(--border); padding: 0 24px; height: 52px; display: flex; align-items: center; justify-content: space-between; }
.topbar .crumb { font-weight: 600; font-size: 15px; }
.topbar .right { display: flex; align-items: center; gap: 16px; }
.bell { position: relative; cursor: pointer; font-size: 17px; }
.bell .badge { position: absolute; top: -7px; right: -9px; background: var(--danger); color: #fff; font-size: 10px; border-radius: 9px; padding: 1px 5px; min-width: 16px; text-align: center; }
.content { padding: 20px 24px; flex: 1; }

/* 组件 */
.card { background: var(--card); border: 1px solid var(--border); border-radius: 10px; padding: 18px; margin-bottom: 16px; }
.card h3 { font-size: 15px; margin-bottom: 12px; }
.toolbar { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; margin-bottom: 14px; }
.toolbar .spacer { flex: 1; }

input, select, textarea {
  border: 1px solid var(--border); border-radius: 7px; padding: 8px 10px; font-size: 13px;
  font-family: inherit; background: #fff; color: var(--text); outline: none;
}
input:focus, select:focus, textarea:focus { border-color: var(--primary); }
textarea { resize: vertical; min-height: 70px; }
.form-row textarea.full { min-height: 160px; line-height: 1.6; font-size: 13px; }
.form-row textarea.full + .hint { display: block; }

.btn { border: none; border-radius: 7px; padding: 8px 14px; font-size: 13px; cursor: pointer; background: #e2e8f0; color: var(--text); }
.btn:hover { filter: brightness(.96); }
.btn.primary { background: var(--primary); color: #fff; }
.btn.primary:hover { background: var(--primary-dark); }
.btn.danger { background: #fee2e2; color: var(--danger); }
.btn.ghost { background: transparent; border: 1px solid var(--border); }
.btn.sm { padding: 4px 9px; font-size: 12px; }

table.tbl { width: 100%; border-collapse: collapse; }
.tbl th { text-align: left; font-size: 12px; color: var(--muted); font-weight: 500; padding: 9px 10px; border-bottom: 1px solid var(--border); white-space: nowrap; }
.tbl td { padding: 10px; border-bottom: 1px solid #f1f5f9; font-size: 13px; }
.tbl tr:hover td { background: #f8fafc; }
.tbl .actions { white-space: nowrap; }
.tbl .actions .btn { margin-right: 5px; }
/* 表头排序 */
.tbl th.sortable { cursor: pointer; user-select: none; }
.tbl th.sortable:hover { color: var(--primary); }
.tbl th.sortable.active { color: var(--primary); font-weight: 600; }
.tbl th .sort-ico { font-size: 10px; opacity: .5; margin-left: 2px; }
.tbl th.sortable.active .sort-ico { opacity: 1; }
.tbl-scroll { overflow-x: auto; }
/* 列宽拖拽 */
.tbl.resizable th { position: relative; padding-right: 14px; }
.tbl .col-grip { position: absolute; top: 0; right: -5px; width: 11px; height: 100%; cursor: col-resize; z-index: 2; }
.tbl .col-grip::after { content: ''; position: absolute; top: 25%; left: 5px; width: 1px; height: 50%; background: var(--border); }
.tbl .col-grip:hover::after { background: var(--primary); width: 2px; }
/* 拖拽过列宽（或已记忆列宽）后按固定宽度渲染，超出部分省略；最后一列（操作）保持完整可见 */
.tbl.fixed-cols th { overflow: hidden; text-overflow: ellipsis; }
.tbl.fixed-cols td { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tbl.fixed-cols td:last-child { overflow: visible; }
body.col-resizing { cursor: col-resize; user-select: none; }

.tag { display: inline-block; padding: 2px 9px; border-radius: 20px; font-size: 12px; }
.tag.green { background: #dcfce7; color: #15803d; }
.tag.red { background: #fee2e2; color: #b91c1c; }
.tag.orange { background: #ffedd5; color: #c2410c; }
.tag.blue { background: #dbeafe; color: #1d4ed8; }
.tag.gray { background: #f1f5f9; color: #475569; }
.tag.yellow { background: #fef9c3; color: #a16207; }

.stat-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 14px; margin-bottom: 16px; }
.stat { background: var(--card); border: 1px solid var(--border); border-radius: 10px; padding: 16px 18px; }
.stat .num { font-size: 26px; font-weight: 700; }
.stat .lbl { color: var(--muted); font-size: 12px; margin-top: 3px; }

.grid-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
@media (max-width: 900px) { .grid-2 { grid-template-columns: 1fr; } }

/* 弹窗 */
.modal-mask { position: fixed; inset: 0; background: rgba(15,23,42,.45); display: flex; align-items: flex-start; justify-content: center; padding: 50px 20px; z-index: 100; overflow-y: auto; }
.modal { background: #fff; border-radius: 12px; width: 560px; max-width: 100%; padding: 22px; }
.modal h3 { margin-bottom: 16px; font-size: 16px; }
.form-row { display: flex; gap: 12px; margin-bottom: 12px; }
.form-row > div { flex: 1; }
.form-row label { display: block; font-size: 12px; color: var(--muted); margin-bottom: 4px; }
.form-row input, .form-row select, .form-row textarea { width: 100%; }
.modal .foot { display: flex; justify-content: flex-end; gap: 10px; margin-top: 16px; }

.pager { display: flex; align-items: center; gap: 10px; justify-content: flex-end; margin-top: 12px; font-size: 13px; color: var(--muted); }
.pager .psize { display: flex; align-items: center; gap: 5px; margin-right: auto; }
.pager .psize select { padding: 4px 6px; font-size: 12px; }

.toast { position: fixed; top: 18px; left: 50%; transform: translateX(-50%); background: #0f172a; color: #fff; padding: 10px 18px; border-radius: 8px; font-size: 13px; z-index: 200; box-shadow: 0 8px 24px rgba(0,0,0,.25); }
.toast.err { background: var(--danger); }

.tabs { display: flex; gap: 4px; border-bottom: 1px solid var(--border); margin-bottom: 16px; flex-wrap: wrap; }
.tabs a { padding: 9px 14px; text-decoration: none; color: var(--muted); font-size: 13px; border-bottom: 2px solid transparent; cursor: pointer; }
.tabs a.active { color: var(--primary); border-bottom-color: var(--primary); font-weight: 600; }

.empty { text-align: center; color: var(--muted); padding: 30px 0; font-size: 13px; }
.muted { color: var(--muted); font-size: 12px; }
.mb0 { margin-bottom: 0; }
.progress-bar { background: #e2e8f0; border-radius: 6px; height: 8px; overflow: hidden; }
.progress-bar i { display: block; height: 100%; background: var(--primary); }
.notif-panel { position: absolute; top: 46px; right: 20px; width: 340px; max-height: 420px; overflow-y: auto; background: #fff; border: 1px solid var(--border); border-radius: 10px; box-shadow: 0 12px 32px rgba(0,0,0,.15); z-index: 90; }
.notif-item { padding: 11px 14px; border-bottom: 1px solid #f1f5f9; font-size: 13px; cursor: default; }
.notif-item.unread { background: #eff6ff; }
.notif-item .t { font-weight: 600; margin-bottom: 2px; }
.notif-item .d { color: var(--muted); font-size: 12px; }

/* 联查链接：可点击但不显示下划线（悬停变主题色提示可点） */
.lnk { color: inherit; text-decoration: none; cursor: pointer; }
.lnk:hover { color: var(--primary); }
/* 仪表盘 · 到期提醒合计 */
.exp-total { margin-top: 11px; padding-top: 9px; border-top: 1px dashed var(--border); font-size: 12px; color: var(--muted); }
.exp-total b { color: var(--text); }
.exp-total b.amt { color: var(--primary); font-size: 14px; }

/* 合同列表 · 金额合计（各金额字段分别合计） */
.ct-totals { margin-top: 12px; background: #f8fafc; padding: 12px 16px; display: flex; flex-direction: column; gap: 9px; }
.ct-tot-row { display: flex; gap: 22px; flex-wrap: wrap; align-items: baseline; }
.ct-tot-h { font-size: 12px; color: var(--muted); background: #e8eef7; padding: 2px 9px; border-radius: 10px; }
.ct-tot { font-size: 13px; color: var(--muted); }
.ct-tot b { font-size: 14px; color: var(--text); margin-left: 3px; }

/* 合同报表分析 */
.rp-chip { display: inline-block; padding: 5px 12px; border: 1px solid var(--border); border-radius: 8px; font-size: 12px; color: var(--muted); cursor: pointer; white-space: nowrap; }
.rp-chip.on { background: var(--primary); color: #fff; border-color: var(--primary); }
.rp-cards { display: grid; grid-template-columns: repeat(5, 1fr); gap: 10px; margin-top: 4px; }
@media (max-width: 1100px) { .rp-cards { grid-template-columns: repeat(2, 1fr); } }
.rp-mc { background: #f8fafc; border-radius: 8px; padding: 10px 12px; }
.rp-mc .l { font-size: 12px; color: var(--muted); }
.rp-mc .v { font-size: 19px; font-weight: 600; margin-top: 2px; }
.rp-mc .s { font-size: 11px; color: #94a3b8; margin-top: 2px; }
.rp-row { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-top: 14px; }
@media (max-width: 900px) { .rp-row { grid-template-columns: 1fr; } }
.rp-grid3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; margin-top: 14px; }
@media (max-width: 900px) { .rp-grid3 { grid-template-columns: 1fr; } }
.rp-pn { border: 1px solid var(--border); border-radius: 10px; padding: 12px 14px; }
.rp-pn h4 { margin: 0 0 10px; font-size: 13px; color: var(--text); font-weight: 600; }
.rp-bar { display: flex; align-items: center; gap: 8px; font-size: 12px; margin-bottom: 7px; }
.rp-bar .rp-n { width: 64px; color: var(--muted); flex: none; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; text-align: right; }
.rp-bar .rp-tr { flex: 1; background: #eef2f7; border-radius: 4px; height: 14px; overflow: hidden; }
.rp-bar .rp-tr i { display: block; height: 100%; border-radius: 4px; }
.rp-bar .rp-m { width: 128px; text-align: right; color: var(--muted); flex: none; }
.rp-st { display: flex; gap: 8px; flex-wrap: wrap; }
.rp-stg { flex: 1; min-width: 72px; text-align: center; background: #f8fafc; border-radius: 8px; padding: 8px 4px; }
.rp-stg .a { font-size: 16px; font-weight: 600; }
.rp-stg .b { font-size: 11px; color: var(--muted); margin-top: 1px; }
.rp-stg.warn .a { color: var(--danger); }

/* 可搜索下拉 combo */
.combo { position: relative; display: inline-block; min-width: 160px; }
.combo input[type="text"] { width: 100%; }
.combo-list { display: none; position: absolute; top: calc(100% + 3px); left: 0; right: 0; z-index: 120; background: #fff; border: 1px solid var(--border); border-radius: 8px; max-height: 220px; overflow-y: auto; box-shadow: 0 8px 20px rgba(15,23,42,.12); }
.combo-item { padding: 8px 10px; font-size: 13px; cursor: pointer; line-height: 1.4; }
.combo-item:hover { background: #eff6ff; }
.combo-item.empty { color: var(--muted); cursor: default; }
.combo-item.empty:hover { background: none; }
.form-row .combo { display: block; width: 100%; }

/* 工单图片预览 + 大图查看 */
.tk-img { width: 132px; }
.tk-img img { width: 132px; height: 100px; object-fit: cover; border-radius: 8px; border: 1px solid var(--border); cursor: zoom-in; background: #f1f5f9; display: block; }
.tk-img .tk-img-name { font-size: 11px; color: var(--muted); margin-top: 3px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.lb-mask { position: fixed; inset: 0; z-index: 999; background: rgba(15,23,42,.82); display: flex; flex-direction: column; align-items: center; justify-content: center; cursor: zoom-out; }
.lb-mask img { max-width: 92vw; max-height: 84vh; border-radius: 6px; box-shadow: 0 12px 40px rgba(0,0,0,.4); background: #fff; }
.lb-bar { margin-top: 12px; display: flex; gap: 16px; align-items: center; }
.lb-bar a, .lb-bar .lb-n { color: #fff; font-size: 13px; text-decoration: none; }
.lb-bar a:hover { text-decoration: underline; }

/* 全局搜索（顶栏） */
.gsearch { position: relative; }
.gsearch input { width: 210px; height: 32px; padding: 0 10px; border: 1px solid var(--border); border-radius: 8px; font-size: 13px; background: #fff; }
.gsearch input:focus { outline: none; border-color: var(--primary); box-shadow: 0 0 0 2px rgba(37,99,235,.12); }
.gs-drop { display: none; position: absolute; top: calc(100% + 4px); right: 0; width: 330px; background: #fff; border: 1px solid var(--border); border-radius: 10px; box-shadow: 0 10px 28px rgba(15,23,42,.14); max-height: 380px; overflow-y: auto; z-index: 130; }
.gs-group { padding: 7px 12px 2px; font-size: 11px; color: var(--muted); }
.gs-item { padding: 7px 12px; cursor: pointer; font-size: 13px; color: var(--text); line-height: 1.4; }
.gs-item:hover { background: #eff6ff; }
.gs-item .sub { color: var(--muted); font-size: 11px; margin-left: 6px; }
/* 搜索结果条目（2026-10-11 搜索页：知识库 + 历史工单解决方案） */
.sr-item { padding: 10px 0; border-bottom: 1px solid var(--border); }
.sr-item:last-child { border-bottom: none; }
.sr-item a { color: var(--primary); text-decoration: none; }
.sr-item a:hover { text-decoration: underline; }
.gs-empty { padding: 14px; text-align: center; color: var(--muted); font-size: 12px; }

/* ============================================================
   移动端 / 平板适配（2026-10-01）
   断点策略（按"可用宽度"分层，不按设备名）：
     > 1200px  桌面            —— 现状不变
     861~1200  横屏平板/小笔记本 —— 侧栏保留，栅格自动收列
     769~860   大屏手机/小平板  —— 侧栏保留，触控尺寸与字号适配
     ≤ 768     手机/竖屏小平板  —— 侧栏收进抽屉
     ≤ 640     手机            —— 卡片式表格 + 表单竖排 + 顶栏精简
   ============================================================ */

/* 抽屉相关元素：桌面端一律不出现 */
.nav-toggle { display: none; }
.nav-mask { display: none; }

/* ---- 知识库（2026-10-11）---- */
.kb-body { line-height: 1.9; font-size: 14px; }
.kb-body p { margin: 0 0 10px; }
.kb-img { max-width: 100%; display: block; margin: 12px 0; border: 1px solid #e5e7eb; border-radius: 6px; }

@media (max-width: 860px) {
  /* --- 内容区 --- */
  .content { padding: 14px 14px calc(18px + env(safe-area-inset-bottom)); }
  .card { padding: 14px; border-radius: 10px; }
  /* 登录页：手机上沾满宽度，不再固定 380px */
  .login-wrap { padding: 20px 16px; }
  .login-box { width: 100%; max-width: 380px; padding: 30px 22px; }

  /* --- iOS 关键项：输入控件字号 < 16px 时，聚焦会自动放大整页 --- */
  input, select, textarea { font-size: 16px; }
  .btn { padding: 10px 14px; min-height: 40px; }
  .btn.sm { padding: 8px 11px; min-height: 38px; font-size: 13px; }
  .tabs a { padding: 12px 14px; }
  .toolbar { gap: 8px; }
  .toolbar input, .toolbar select { min-height: 40px; }
  .pager { flex-wrap: wrap; gap: 8px; }
  .stat-grid { grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 10px; }
  .rp-cards { grid-template-columns: repeat(2, 1fr); }
  .chip-row, .rp-chips { overflow-x: auto; }

  /* --- 弹窗/通知面板：改成贴合屏幕 --- */
  .modal-mask { padding: 14px; }
  .modal { width: 100%; padding: 18px; }
  .notif-panel { position: fixed; top: 56px; left: 10px; right: 10px; width: auto; max-height: 72vh; }
  .modal .foot .btn { flex: 1; }        /* 按钮铺开，手指好点 */
  .modal .foot { gap: 8px; }
}

/* 抽屉侧栏适用条件（窄屏竖屏 + 手机横屏）——侧栏收进抽屉，顶栏加汉堡按钮
   ① ≤768px：手机 + iPad mini 竖屏。选 768 而不是更大值：iPad(820/1024) 横竖屏
      都能容下 210px 侧栏，保留桌面式体验更顺手。
   ② 手机横屏：宽度可能到 800~930px（已越过 768 断点），但高度只有 360~430px，
      再挂一条 210px 常驻侧栏会把内容挤成窄条。故按"矮 + 窄"补一条。
      为什么不用 pointer:coarse 判断触摸设备：本机 Chrome 实测该媒体特性不生效
      （Emulation 下恒为 fine），没法验证的条件不如不用；改用宽度上限。
      1000px 宽度上限的意义：桌面窗口拉成 1200x480 仍保留常驻侧栏，
      只有"≤1000 宽且 ≤520 高"这种手机/小平板横屏形态才转抽屉。 */
@media (max-width: 768px), ((orientation: landscape) and (max-height: 520px) and (max-width: 1000px)) {
  .layout { display: block; }
  .sidebar {
    position: fixed; top: 0; bottom: 0; left: 0; z-index: 210;
    width: 252px; max-width: 84vw;
    transform: translateX(-100%); transition: transform .22s ease;
    box-shadow: 3px 0 22px rgba(15,23,42,.35);
    overflow-y: auto;
  }
  .sidebar.open { transform: translateX(0); }
  .sidebar nav a { padding: 14px 18px; font-size: 15px; }   /* 触控目标更高 */
  .nav-mask {
    display: block; position: fixed; inset: 0; z-index: 205;
    background: rgba(15,23,42,.45); opacity: 0; pointer-events: none; transition: opacity .2s;
  }
  .nav-mask.show { opacity: 1; pointer-events: auto; }
  .nav-toggle {
    display: inline-flex; align-items: center; justify-content: center;
    width: 38px; height: 38px; flex: none; font-size: 17px; line-height: 1;
    background: #fff; border: 1px solid var(--border); border-radius: 9px; cursor: pointer; color: var(--text);
  }

  /* 顶栏：内容挤，收紧间距、标题可省略号 */
  .topbar { padding: 0 12px; gap: 10px; }
  .topbar .crumb { flex: 1; min-width: 0; font-size: 14px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .topbar .right { flex: none; gap: 12px; }
  .bell { font-size: 19px; padding: 4px 2px; }
  .gsearch input { width: 150px; }
}

@media (max-width: 640px) {
  /* 表单在手机上竖排，避免两列挤压 */
  .form-row { flex-direction: column; gap: 10px; }
  .form-row.half-row { flex-direction: column; }

  .gsearch input { width: 118px; }
  .quicks { display: none; }            /* 顶栏"快速登记工单"让位给标题与搜索 */
  .gs-drop { position: fixed; top: 56px; left: 10px; right: 10px; width: auto; }
  .content { padding: 12px 12px calc(16px + env(safe-area-inset-bottom)); }
  .card { padding: 12px; }
  .tbl th, .tbl td { padding: 9px 8px; }

  /* --- 卡片式表格（opts.card 的表格在手机端不再左右拖）--- */
  .tbl.tbl-card { min-width: 0; }
  .tbl.tbl-card thead { display: none; }
  .tbl.tbl-card tbody tr {
    display: block; border: 1px solid var(--border); border-radius: 10px;
    padding: 4px 12px; margin-bottom: 10px; background: #fff;
  }
  .tbl.tbl-card tbody tr:hover td { background: none; }
  .tbl.tbl-card tbody td {
    display: flex; align-items: baseline; justify-content: space-between; gap: 12px;
    border: none; padding: 8px 0; font-size: 14px; text-align: right;
    border-bottom: 1px dashed #f1f5f9;
  }
  .tbl.tbl-card tbody tr td:last-child { border-bottom: none; }
  .tbl.tbl-card tbody td::before {
    content: attr(data-label); flex: 0 0 36%; text-align: left;
    color: var(--muted); font-size: 12px; line-height: 1.5;
  }
  .tbl.tbl-card tbody td:not([data-label])::before { content: none; }
  .tbl.tbl-card tbody td:not([data-label]) { justify-content: flex-end; }
}

@media (max-width: 400px) {
  .gsearch input { width: 96px; }
  .login-box { padding: 26px 18px; }
}

/* 手机横屏（矮屏）：纵向可用高度只有 360~430px，逐项压缩高度与留白，
   保证"顶栏 + 内容"不会一屏塞不下、弹窗不被键盘顶掉。
   放在文件末尾：靠源序覆盖上面同优先级的规则。 */
@media (orientation: landscape) and (max-height: 520px) {
  .topbar { height: 46px; }
  .notif-panel { top: 50px; max-height: 84vh; }
  .content { padding-top: 10px; padding-bottom: calc(12px + env(safe-area-inset-bottom)); }
  .card { padding: 12px; margin-bottom: 12px; }
  .modal-mask { padding: 8px; }
  .modal { padding: 14px 16px; }
  .lb-mask img { max-height: 88vh; }

  /* 登录页：横屏矮屏最容易把"登录卡"顶出屏幕，压缩内边距 */
  .login-wrap { padding: 14px 16px; }
  .login-box { padding: 20px 22px; }

  /* 抽屉侧栏：靠 nav 自身滚动，删掉 LOGO 副标题、收紧行高，能多露出几个菜单 */
  .sidebar .logo { padding: 12px 18px; }
  .sidebar .logo small { display: none; }
  .sidebar nav a { padding: 11px 18px; }
  .sidebar .userbox { padding: 10px 18px; }
}