/* ============================================================================
   TrovPick 管理后台（业务参数）—— 独立样式表
   ----------------------------------------------------------------------------
   与推广系统（/promoter/）完全独立：本文件不引用推广系统的任何 CSS，
   令牌值取自设计系统 ui/shared.css，但在此处就地定义，避免跨系统耦合。
   ============================================================================ */

:root{
  --brand-purple:#5848FF;
  --brand-purple-600:#6B5CFF;
  --brand-purple-700:#4736E0;
  --brand-purple-050:#EEEBFF;
  --brand-orange:#FF7A1A;
  --success:#16A36A;
  --success-050:#E6F7EF;
  --warning:#F5A623;
  --warning-050:#FEF4E3;
  --error:#E5484D;
  --error-050:#FDECEC;
  --info:#3B82F6;
  --info-050:#EAF2FE;

  --bg:#F6F6FB;
  --surface:#FFFFFF;
  --surface-2:#F1F1F7;
  --surface-3:#E9E9F2;
  --text:#1A1A26;
  --text-2:#5B5B6B;
  --text-3:#9494A6;
  --border:#ECECF3;
  --border-strong:#DCDCE6;

  --r-sm:8px; --r-md:12px; --r-lg:18px; --r-full:999px;
  --e-1:0 1px 2px rgba(20,18,46,.06), 0 1px 3px rgba(20,18,46,.04);
  --e-2:0 2px 8px rgba(20,18,46,.08), 0 4px 16px rgba(20,18,46,.06);
  --e-brand:0 8px 24px rgba(88,72,255,.28);

  --font-ui:"Inter","Noto Sans SC","Noto Sans Khmer",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,system-ui,sans-serif;
  --font-num:"Inter",ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  --sidebar-w:236px; --topbar-h:60px;
}

*{box-sizing:border-box;margin:0;padding:0;}
html,body{height:100%;}
body{
  font-family:var(--font-ui);
  background:var(--bg);
  color:var(--text);
  font-size:14px;
  line-height:1.5;
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3,h4{line-height:1.25;font-weight:700;}
button{font-family:inherit;}
.hidden{display:none !important;}
.muted{color:var(--text-2);}
.muted-3{color:var(--text-3);font-size:12px;}
.num{font-family:var(--font-num);font-variant-numeric:tabular-nums;}
.mono{font-family:var(--font-num);font-size:12px;}

/* ---- 登录页 ---- */
.login-gate{
  position:fixed;inset:0;z-index:9999;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;
  background:linear-gradient(135deg,#1b1340,#2a1f5e);color:#fff;padding:20px;overflow:auto;
}
.lg-card{width:400px;max-width:94vw;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);border-radius:16px;padding:28px 26px;backdrop-filter:blur(6px);}
.lg-brand{display:flex;align-items:center;gap:10px;}
.lg-mark{width:34px;height:34px;border-radius:10px;background:var(--brand-purple);display:flex;align-items:center;justify-content:center;font-weight:800;font-size:17px;}
.lg-title{font-size:20px;font-weight:700;margin:14px 0 2px;}
.lg-sub{font-size:13px;opacity:.75;margin-bottom:6px;}
.lg-label{font-size:11px;opacity:.7;margin:14px 0 6px;text-transform:uppercase;letter-spacing:.05em;display:block;}
.lg-input{width:100%;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.16);border-radius:10px;color:#fff;padding:10px 12px;font-size:14px;outline:none;}
.lg-input::placeholder{color:rgba(255,255,255,.4);}
.lg-input:focus{border-color:var(--brand-purple-600);}
/* 「眨眼 / 闭眼」密码可见性开关：按钮压在输入框右侧，输入框留出右侧内边距防止文字钻到图标下。 */
.lg-pass-wrap{position:relative;display:block;}
.lg-pass-wrap .lg-input{padding-right:42px;}
.lg-pass-toggle{
  position:absolute;top:50%;right:6px;transform:translateY(-50%);
  display:inline-flex;align-items:center;justify-content:center;
  width:32px;height:32px;padding:0;border:0;border-radius:8px;
  background:transparent;color:rgba(255,255,255,.62);cursor:pointer;line-height:0;
}
.lg-pass-toggle:hover{color:#fff;background:rgba(255,255,255,.10);}
.lg-pass-toggle:focus-visible{outline:2px solid var(--brand-purple-600);outline-offset:2px;}
/* 默认（闭眼状态 = 密码不可见）：显示「睁眼」图标提示"点击可看"；可见时反过来。 */
.lg-pass-toggle .lg-eye{display:none;}
.lg-pass-wrap:not(.is-visible) .lg-pass-toggle .lg-eye-open{display:block;}
.lg-pass-wrap.is-visible .lg-pass-toggle .lg-eye-off{display:block;}
.lg-pass-wrap.is-visible .lg-pass-toggle{color:var(--brand-purple-400);}
.lg-btn{width:100%;margin-top:18px;background:var(--brand-purple);color:#fff;border:0;border-radius:10px;padding:11px;font-size:14px;font-weight:700;cursor:pointer;}
.lg-btn:disabled{opacity:.6;cursor:not-allowed;}
.lg-err{margin-top:12px;background:rgba(229,72,77,.16);border:1px solid rgba(229,72,77,.45);color:#ffb3b3;border-radius:10px;padding:9px 11px;font-size:13px;}
.lg-note{margin-top:16px;font-size:11px;opacity:.55;line-height:1.5;}

/* ---- 应用外壳 ---- */
.shell{display:flex;min-height:100vh;}
.sidebar{
  width:var(--sidebar-w);flex:none;background:var(--surface);border-right:1px solid var(--border);
  display:flex;flex-direction:column;position:sticky;top:0;height:100vh;
}
.brand{padding:16px 18px;display:flex;align-items:center;gap:10px;border-bottom:1px solid var(--border);}
.brand .b-mark{width:30px;height:30px;border-radius:9px;background:var(--brand-purple);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:15px;}
.brand .b-name{font-weight:800;font-size:15px;letter-spacing:.2px;}
.brand .b-sub{font-size:11px;color:var(--text-3);}
.nav{flex:1;overflow:auto;padding:10px 10px 20px;}
/* ---- 左侧导航：两级折叠树 ----
   一级 = .nav-group-head（分组标题按钮，可点击折叠 / 展开）；
   二级 = .nav-item（页面项，缩进 + 左侧竖线 + 图标）。
   层级区分：一级更小（11px）、更淡（--text-3）、全大写；二级更大（13.5px）、--text-2、
   带图标。颜色一律走设计令牌，不硬编码；折叠箭头用 CSS 边框三角画出（不引 emoji）。
   默认策略 = **全部展开**（渲染时不加 .collapsed）：改造前是「所有页面平铺可见」，
   默认展开保持同样的可发现性，避免一上来就隐藏 20+ 个入口、逼用户逐个点开找页面；
   折叠状态由用户点击控制，且**当前页所在分组会由 admin.js 自动展开**。 */
.nav-group{margin-top:4px;}
.nav-group-head{
  display:flex;align-items:center;gap:8px;width:100%;
  padding:9px 10px 7px;border:0;background:transparent;text-align:left;cursor:pointer;
  color:var(--text-3);font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;
  user-select:none;border-radius:var(--r-sm);
}
.nav-group-head:hover{color:var(--text-2);background:var(--surface-2);}
.nav-group-head:focus-visible{outline:2px solid var(--brand-purple-600);outline-offset:1px;}
.nav-group-head .ng-text{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
/* 折叠箭头：CSS 三角。展开时朝下，折叠时旋转 -90°（朝右）——不引任何 emoji 图标。 */
.nav-group-head .ng-caret{
  flex:none;width:0;height:0;
  border-top:4px solid currentColor;border-left:3.2px solid transparent;border-right:3.2px solid transparent;
  transition:transform .15s ease;
}
.nav-group.collapsed .ng-caret{transform:rotate(-90deg);}
.nav-group-body{
  display:flex;flex-direction:column;gap:1px;
  padding-left:8px;margin-left:6px;border-left:1px solid var(--border);
}
.nav-group.collapsed .nav-group-body{display:none;}
.nav-item{
  display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:10px;
  color:var(--text-2);cursor:pointer;font-size:13.5px;font-weight:600;user-select:none;
}
.nav-item:hover{background:var(--surface-2);color:var(--text);}
.nav-item.active{background:var(--brand-purple-050);color:var(--brand-purple-700);}
.nav-item .n-ico{width:18px;text-align:center;font-size:14px;}

.main{flex:1;min-width:0;display:flex;flex-direction:column;}
.topbar{
  height:var(--topbar-h);flex:none;background:var(--surface);border-bottom:1px solid var(--border);
  display:flex;align-items:center;gap:14px;padding:0 20px;position:sticky;top:0;z-index:20;
}
.topbar .tb-title{font-weight:800;font-size:16px;}
.topbar .tb-sub{font-size:12px;color:var(--text-3);}
.topbar .spacer{flex:1;}
.lang-seg{display:inline-flex;border:1px solid var(--border-strong);border-radius:var(--r-full);overflow:hidden;}
.lang-seg button{appearance:none;border:0;background:var(--surface);color:var(--text-2);font-size:12px;font-weight:700;padding:5px 12px;cursor:pointer;}
.lang-seg button.active{background:var(--brand-purple);color:#fff;}
.lang-seg button+button{border-left:1px solid var(--border);}
.account{display:flex;align-items:center;gap:9px;}
.account .a-avatar{width:30px;height:30px;border-radius:50%;background:var(--brand-purple-050);color:var(--brand-purple-700);display:flex;align-items:center;justify-content:center;font-weight:800;font-size:13px;text-transform:uppercase;}
.account .a-name{font-size:13px;font-weight:700;line-height:1.15;}
/* 内容区宽度（2026-10-18 老板：「内页的宽度调大分辨率，可以自适应」）
   ----------------------------------------------------------------------------
   原来写死 `max-width:1180px` —— 1920 的屏幕上右侧空出 700 多像素，
   而表格（交易管理这类十来列）却在 1180 里横向滚动。**空间浪费在右边、拥挤发生在表里**。
   现在上限提到 1680 并居中：
     · 1920 屏：1920 − 侧栏 200 − 左右 padding 44 ≈ **1676** ⇒ 基本铺满；
     · 1080 屏：按可用宽度自适应，不受上限影响；
     · 2K/4K 屏：停在 1680 并居中 —— 再宽的话一行字要横着扫两米，反而难读。 */
.content{padding:22px;max-width:1680px;width:100%;margin:0 auto;}
.page{display:none;}
.page.active{display:block;}

/* ---- 卡片 / 区块 ---- */
.section-title{font-size:19px;font-weight:800;margin-bottom:4px;}
.section-sub{font-size:13px;color:var(--text-2);margin-bottom:16px;}
.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg);box-shadow:var(--e-1);margin-bottom:18px;overflow:hidden;}
.card-head{padding:14px 16px;border-bottom:1px solid var(--border);display:flex;align-items:center;gap:10px;}
.card-head .ch-title{font-size:14.5px;font-weight:700;}
.card-head .ch-sub{font-size:12px;color:var(--text-3);}
.card-head .spacer{flex:1;}
.card-body{padding:16px;}
.card-actions{padding:12px 16px;border-top:1px solid var(--border);display:flex;align-items:center;gap:10px;flex-wrap:wrap;background:var(--surface-2);}
.card-actions .spacer{flex:1;}

/* ---- 表格 ---- */
.table{width:100%;border-collapse:collapse;font-size:13px;}
.table th{ text-align:left;font-size:11px;font-weight:700;color:var(--text-3);text-transform:uppercase;letter-spacing:.04em;padding:10px 12px;border-bottom:1px solid var(--border);white-space:nowrap;}
.table td{padding:9px 12px;border-bottom:1px solid var(--border);vertical-align:middle;}
.table tr:last-child td{border-bottom:0;}
.table td.tier-name{font-weight:800;}
.table .sub-row{font-size:11px;color:var(--text-3);}

/* ---- 表单 ---- */
.field{display:flex;flex-direction:column;gap:5px;margin-bottom:12px;}
.field label{font-size:12px;font-weight:700;color:var(--text-2);}
.input{
  width:100%;border:1px solid var(--border-strong);border-radius:var(--r-sm);background:var(--surface);
  padding:7px 10px;font-size:13px;color:var(--text);outline:none;font-family:inherit;
}
.input:focus{border-color:var(--brand-purple-600);box-shadow:0 0 0 3px var(--brand-purple-050);}
.input.num{font-family:var(--font-num);text-align:right;}
.input:disabled,.input.ro{background:var(--surface-2);color:var(--text-2);}
.input.tiny{width:74px;padding:5px 7px;}
.input.chk{width:auto;}
select.input{appearance:none;}

/* ============================================================================
   🔴 2026-10-15 —— 补上**新一批页面在用、但从来没被定义过**的类。
   ----------------------------------------------------------------------------
   背景（实测，不是猜）：控制台 22 个页面里，
     · 14 个老页面用 `class="input"` / `class="table"`  ⇒ 有样式；
     · **8 个新页面**用 `class="inp"` / `class="tbl"`   ⇒ **CSS 里根本没这两个类**；
   外加 `ct-row` / `btn-row` / `hint` / 独立 `sub-row` 也全无定义。
   后果：这 8 个页面的**输入框、表格、表单行、按钮行全是浏览器默认样式**
   （标签和控件挤成一行、表格没有边框与内边距、提示文字是 16px 正文大小）。
   受影响的 8 页：catalog / catalog-copy / entitlement-prices / exposure-params /
   membership / order-windows / popup-ads / splash-ad。

   ⚠️ 修法是**只加不删**：以下选择器此前一条都不存在 ⇒ 对那 14 个老页面
   **零影响**（不会覆盖任何既有规则）。刻意不去改那 8 个页面的 markup：
   改一个 CSS 文件比改 60 处 class 字符串小得多，也不会惊动既有单测。

   ⚠️ `ct-row` 用**纵向**（label 在上、控件在下）而不是横向：
     · 与 `.field`（本仓既有表单行）视觉一致；
     · 一行里的子元素数量不固定（label + 控件 + 按钮行 + 说明行）⇒
       横向 flex/grid 的自动排布会把"上传按钮行"错位到标签那一列。
   ============================================================================ */
.inp{
  width:100%;border:1px solid var(--border-strong);border-radius:var(--r-sm);background:var(--surface);
  padding:7px 10px;font-size:13px;color:var(--text);outline:none;font-family:inherit;
}
.inp:focus{border-color:var(--brand-purple-600);box-shadow:0 0 0 3px var(--brand-purple-050);}
.inp:disabled{background:var(--surface-2);color:var(--text-2);}
select.inp{appearance:none;}

.tbl{width:100%;border-collapse:collapse;font-size:13px;}
.tbl th{text-align:left;font-size:11px;font-weight:700;color:var(--text-3);text-transform:uppercase;letter-spacing:.04em;padding:10px 12px;border-bottom:1px solid var(--border);white-space:nowrap;}
.tbl td{padding:9px 12px;border-bottom:1px solid var(--border);vertical-align:middle;}
.tbl tr:last-child td{border-bottom:0;}

/* 表单行：与 `.field` 同构（纵向）。
   ⚠️ `align-items:flex-start` 不能省：默认的 `stretch` 会把**没有显式宽度**的子元素
   （复选框 / 按钮行 / 说明行）拉成通栏 —— 复选框会被撑成一个巨大的方块。
   `.inp` 自带 `width:100%`，不受这个值影响。 */
.ct-row{display:flex;flex-direction:column;align-items:flex-start;gap:5px;padding:11px 16px;border-bottom:1px solid var(--border);}
.ct-row:last-child{border-bottom:0;}
.ct-row > label{font-size:12px;font-weight:700;color:var(--text-2);}
.ct-row > .inp{width:100%;}

.btn-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap;}

/* 提示行。⚠️ `.table .sub-row`（见上）特异度更高，表格内不受影响。 */
.hint{font-size:12.5px;line-height:1.55;color:var(--text-2);margin:6px 0;}
.sub-row{font-size:11.5px;line-height:1.5;color:var(--text-3);}
.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:14px;}
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;}
.row-between{display:flex;align-items:center;justify-content:space-between;gap:10px;}

/* ---- 按钮 ---- */
/* 按钮（2026-10-18 重调默认观感）
   ----------------------------------------------------------------------------
   老板：「按钮的默认效果要改，现在看着跟没有实现一样」。
   诊断：原来 `.btn` 是「白底 + #DCDCE6 边框 + 无阴影 + 无按压反馈」——
   #DCDCE6 在白卡片上几乎看不见边界，加上 `font-weight:700` 却没任何立体感，
   整颗按钮看起来像"一段加粗文字"，自然像没做完。
   改法（只动观感，不动尺寸/语义）：
     · 边框加深一档（能看见"这里有个可点的块"）+ 一层 1px 阴影；
     · 补 `:active` 按压（下沉 1px + 去阴影）与 `:focus-visible` 键盘焦点环；
     · disabled 降到 .45 且去掉阴影（与"可点"明确区分）；
     · 主按钮加品牌色投影，危险按钮加淡红投影 —— 三种按钮一眼能分出层级。 */
.btn{
  display:inline-flex;align-items:center;gap:6px;
  border:1px solid #C8CEDD;background:var(--surface);
  color:var(--text);border-radius:var(--r-sm);padding:7px 13px;font-size:13px;font-weight:700;cursor:pointer;
  box-shadow:var(--e-1);
  transition:background .12s ease,border-color .12s ease,box-shadow .12s ease,transform .06s ease;
}
.btn:hover{background:#F4F6FB;border-color:#AEB6CA;}
.btn:active{transform:translateY(1px);box-shadow:none;background:#EDF0F8;}
.btn:focus-visible{outline:2px solid var(--brand-purple);outline-offset:2px;}
.btn:disabled{opacity:.45;cursor:not-allowed;box-shadow:none;transform:none;}
.btn-primary{background:var(--brand-purple);border-color:var(--brand-purple);color:#fff;
  box-shadow:0 2px 6px rgba(88,72,255,.24);}
.btn-primary:hover{background:var(--brand-purple-700);box-shadow:0 3px 10px rgba(88,72,255,.30);}
.btn-primary:active{transform:translateY(1px);box-shadow:none;}
.btn-danger{background:var(--surface);border-color:var(--error);color:var(--error);
  box-shadow:0 1px 2px rgba(226,75,74,.14);}
.btn-danger:hover{background:var(--error-050);border-color:var(--error);}
.btn-danger:active{transform:translateY(1px);box-shadow:none;}
.btn-sm{padding:5px 10px;font-size:12px;}
.btn-ghost{border-color:transparent;background:transparent;color:var(--text-2);box-shadow:none;}
.btn-ghost:hover{background:var(--surface-2);color:var(--text);}

/* ---- 分段控件 ---- */
.segmented{display:inline-flex;border:1px solid var(--border-strong);border-radius:var(--r-sm);overflow:hidden;}
.segmented button{border:0;background:var(--surface);color:var(--text-2);font-size:12.5px;font-weight:700;padding:7px 13px;cursor:pointer;}
.segmented button.active{background:var(--brand-purple);color:#fff;}
.segmented button+button{border-left:1px solid var(--border-strong);}

/* ---- 徽标 ---- */
.badge{display:inline-flex;align-items:center;gap:4px;font-size:11px;font-weight:700;padding:2px 8px;border-radius:var(--r-full);border:1px solid var(--border-strong);color:var(--text-2);background:var(--surface-2);}
.badge.b-ok{background:var(--success-050);color:#0f7a4f;border-color:#bfe8d5;}
.badge.b-warn{background:var(--warning-050);color:#a5660a;border-color:#f6dcaa;}
.badge.b-info{background:var(--info-050);color:#1e5fbf;border-color:#c3dafb;}
.badge.b-muted{background:var(--surface-2);color:var(--text-3);}
.badge.b-danger{background:var(--error-050);color:#b3282c;border-color:#f6c4c5;}
.role-badge{display:inline-block;font-size:11px;font-weight:700;padding:2px 8px;border-radius:var(--r-full);background:var(--brand-purple-050);color:var(--brand-purple-700);border:1px solid #d9d2ff;}
.dirty-dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--warning);margin-right:5px;}

/* ---- 提示条 ---- */
.alert{display:flex;gap:10px;align-items:flex-start;border-radius:var(--r-md);padding:11px 13px;font-size:13px;border:1px solid;margin-bottom:14px;}
.alert .a-ico{flex:none;font-size:15px;line-height:1.2;}
.alert-info{background:var(--info-050);border-color:#c3dafb;color:#1e5fbf;}
.alert-warn{background:var(--warning-050);border-color:#f6dcaa;color:#8a5606;}
.alert-error{background:var(--error-050);border-color:#f6c4c5;color:#b3282c;}
.alert-ok{background:var(--success-050);border-color:#bfe8d5;color:#0f7a4f;}

/* ---- 价格同步红线（醒目，不可忽略） ---- */
.price-warn{
  background:#FFF4F4;border:2px solid var(--error);border-radius:var(--r-md);padding:12px 14px;
  margin-bottom:14px;display:flex;gap:11px;align-items:flex-start;
}
.price-warn .pw-ico{flex:none;width:26px;height:26px;border-radius:50%;background:var(--error);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:15px;}
.price-warn .pw-body{font-size:13px;color:#8f1c20;line-height:1.5;}
.price-warn .pw-body b{color:#7a1418;}
.price-warn .pw-head{font-weight:800;font-size:13.5px;margin-bottom:2px;color:#7a1418;}

/* ---- 空态 / 加载 / 骨架 ---- */
.empty{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;padding:42px 18px;color:var(--text-3);text-align:center;}
.empty .e-ico{font-size:30px;opacity:.5;}
.empty .e-title{font-weight:700;color:var(--text-2);font-size:14px;}
.empty .e-sub{font-size:12.5px;}
.spinner{width:18px;height:18px;border:2px solid var(--border-strong);border-top-color:var(--brand-purple);border-radius:50%;animation:spin .7s linear infinite;display:inline-block;vertical-align:middle;}
@keyframes spin{to{transform:rotate(360deg);}}
.skeleton{height:12px;border-radius:6px;background:linear-gradient(90deg,var(--surface-2),var(--surface-3),var(--surface-2));background-size:200% 100%;animation:sk 1.2s ease-in-out infinite;}
@keyframes sk{0%{background-position:200% 0;}100%{background-position:-200% 0;}}
.loading-row{display:flex;align-items:center;gap:10px;padding:26px;color:var(--text-2);justify-content:center;}

/* ---- toast ---- */
.toast-box{position:fixed;left:50%;bottom:26px;transform:translateX(-50%);background:#2b2540;color:#fff;padding:10px 16px;border-radius:10px;font-size:13px;box-shadow:0 8px 24px rgba(0,0,0,.25);z-index:10000;opacity:0;transition:opacity .2s;pointer-events:none;max-width:80vw;text-align:center;}
.toast-box.show{opacity:1;}
.toast-box.err{background:var(--error);}

.offline-bar{background:var(--warning-050);color:#8a5606;border-bottom:1px solid #f6dcaa;padding:7px 16px;font-size:12.5px;text-align:center;font-weight:600;}

/* ---- 管理端上游未配置横幅（审计 F-10）----
   在流内放在登录卡上方（登录页是纵向 flex 列，会自然把卡片往下推），因此**不会**盖住
   右上角的语言切换。默认 .hidden（display:none!important），由 admin.js 揭开。 */
.cfg-banner{width:560px;max-width:94vw;display:flex;align-items:flex-start;gap:10px;
  background:var(--error-050);color:#8f1d21;border:1px solid #f6c4c5;border-radius:var(--r-lg);
  padding:12px 15px;font-size:12.5px;line-height:1.55;box-shadow:0 4px 16px rgba(20,18,46,.12);}
.cfg-banner .cfg-ico{flex:none;color:var(--error);margin-top:1px;}
.cfg-banner .cfg-txt{min-width:0;}
.cfg-banner .cfg-title{font-weight:800;}
.cfg-banner .cfg-body{color:#a33337;}

.chk-list{display:flex;flex-wrap:wrap;gap:8px 14px;}
.chk-item{display:inline-flex;align-items:center;gap:6px;font-size:13px;color:var(--text);}
.chk-item input{width:15px;height:15px;accent-color:var(--brand-purple);}
.path-hint{font-size:11px;color:var(--text-3);font-family:var(--font-num);}
.key-pill{font-family:var(--font-num);font-size:11.5px;background:var(--surface-2);border:1px solid var(--border);border-radius:6px;padding:2px 7px;color:var(--text-2);}
textarea.input{min-height:120px;resize:vertical;font-family:var(--font-num);font-size:12px;text-align:left;}
.mt-2{margin-top:8px;}
.mt-3{margin-top:12px;}
.mt-4{margin-top:18px;}
.nowrap{white-space:nowrap;}
.text-right{text-align:right;}

/* ---- 登录页：语言切换 / 忘记密码 ---- */
.lg-lang{position:absolute;top:16px;right:16px;display:inline-flex;border:1px solid rgba(255,255,255,.28);border-radius:var(--r-full);overflow:hidden;}
.lg-lang button{appearance:none;border:0;background:transparent;color:rgba(255,255,255,.75);font-size:12px;font-weight:700;padding:5px 12px;cursor:pointer;}
.lg-lang button.active{background:var(--brand-purple);color:#fff;}
.lg-lang button+button{border-left:1px solid rgba(255,255,255,.22);}
.lg-forgot{display:block;width:100%;margin-top:12px;background:transparent;border:0;color:rgba(255,255,255,.82);font-size:12.5px;font-weight:600;text-decoration:underline;cursor:pointer;padding:2px;}
.lg-forgot:hover{color:#fff;}
.lg-forgot-card{width:560px;max-height:88vh;overflow:auto;}
.lg-step{margin-top:16px;}
.lg-step-title{font-size:13.5px;font-weight:800;margin-bottom:5px;}
.lg-step-body{font-size:12.5px;line-height:1.6;opacity:.82;margin:0 0 6px;}
.lg-cmd-label{font-size:11px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;opacity:.6;margin:10px 0 4px;}
.lg-code{margin:0 0 6px;padding:9px 11px;border-radius:10px;background:rgba(0,0,0,.35);border:1px solid rgba(255,255,255,.16);color:#e7e2ff;font-family:var(--font-num);font-size:12px;line-height:1.5;white-space:pre-wrap;word-break:break-all;overflow:auto;}

/* ---- 模态框 ---- */
.modal-mask{position:fixed;inset:0;z-index:10001;background:rgba(20,18,46,.42);display:flex;align-items:center;justify-content:center;padding:20px;}
/* 弹窗尺寸（2026-10-18 老板口径）
   ----------------------------------------------------------------------------
   原状：`width:440px; max-height:90vh; overflow:auto` —— 三个问题：
     ① 固定 440 太窄，商品详情这类字段多的内容被挤成一条竖线；
     ② 90vh 超过老板要的 80% 上限；
     ③ `overflow:auto` 加在**整体**上，标题栏和按钮会跟着内容一起滚走。
   现在：宽度自适应（min 380 / max 720），高度上限 **80vh**，
   结构改成 **head/body/foot 三段 + 只有 body 滚**（头尾恒在）。
   超过 80% 的内容由 `admin.js` 自动切成全屏页（`.is-full`），见那里的说明。 */
.modal{width:auto;min-width:380px;max-width:min(720px,92vw);max-height:80vh;
  display:flex;flex-direction:column;overflow:hidden;
  background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg);box-shadow:var(--e-2);}
.modal-head{padding:15px 18px;border-bottom:1px solid var(--border);font-size:15px;font-weight:800;
  flex:0 0 auto;display:flex;align-items:center;justify-content:space-between;gap:10px;}
.modal-body{padding:16px 18px;overflow:auto;flex:1 1 auto;min-height:0;}
.modal-foot{padding:13px 18px;border-top:1px solid var(--border);display:flex;align-items:center;gap:10px;justify-content:flex-end;background:var(--surface-2);flex:0 0 auto;}

/* 内容超过屏幕 80% 时自动切换的「整页视图」——视觉上等同打开了一个新页面：
   铺满视口、无遮罩感、内容居中限宽（否则宽屏上一行字拉两米长）。 */
.modal.is-full{width:100vw;max-width:none;height:100vh;max-height:none;border-radius:0;border:0;}
.modal.is-full .modal-body{max-width:900px;margin:0 auto;width:100%;}
.modal.is-full .modal-head,.modal.is-full .modal-foot{padding-left:max(18px,calc((100vw - 900px)/2));padding-right:max(18px,calc((100vw - 900px)/2));}

/* ---- 表单小件 ---- */
.char-count{font-size:11px;color:var(--text-3);text-align:right;font-variant-numeric:tabular-nums;}
.char-count.over{color:var(--error);font-weight:700;}
.ro-lock{display:flex;align-items:center;gap:8px;}
.ro-lock .ro-ico{flex:none;font-size:13px;opacity:.7;}

/* ---- 首页专区管理（admin-page-home-zones.js）---- */
.hz-hint{font-size:12.5px;line-height:1.5;color:#a5660a;background:var(--warning-050);border:1px solid #f6dcaa;border-radius:var(--r-md);padding:10px 12px;margin-bottom:4px;}
.hz-thumb{display:inline-flex;align-items:center;justify-content:center;width:84px;height:48px;border-radius:var(--r-sm);border:1px solid var(--border);background:var(--surface-2);object-fit:cover;}
.hz-thumb-empty{font-size:11px;color:var(--text-3);}
.hz-zone-name{font-weight:700;}
.hz-switch{display:inline-flex;align-items:center;gap:8px;cursor:pointer;}
.hz-switch input{cursor:pointer;}
.hz-actions{display:flex;gap:6px;flex-wrap:wrap;}

/* ============================ 广告管理页（admin-page-ads.js） ============================ */
.ads-tabs{display:flex;gap:6px;margin:14px 0;}
.ads-tab{padding:7px 14px;border-radius:var(--r-full);border:1px solid var(--border);background:var(--surface);color:var(--text-2);font-size:13px;font-weight:600;cursor:pointer;}
.ads-tab:hover{background:var(--surface-2);color:var(--text);}
.ads-tab.active{background:var(--brand-purple);border-color:var(--brand-purple);color:#fff;}
.ads-note{font-size:12.5px;line-height:1.5;color:#1e5fbf;background:var(--info-050);border:1px solid #c3dafb;border-radius:var(--r-md);padding:10px 12px;margin-bottom:12px;}
.ads-errors{font-size:12.5px;line-height:1.5;color:#b3282c;background:var(--error-050);border:1px solid #f6c4c5;border-radius:var(--r-md);padding:10px 12px;margin-bottom:12px;}
.ads-errors .ae-title{font-weight:700;margin-bottom:4px;}
.ads-errors ul{margin:0;padding-left:18px;}
.ads-presets{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:12px;}
.ads-filters{display:flex;gap:12px;flex-wrap:wrap;align-items:flex-end;}
.ads-field{display:flex;flex-direction:column;gap:4px;}
.ads-lbl{font-size:11px;font-weight:700;color:var(--text-3);text-transform:uppercase;letter-spacing:.04em;}
.ads-freq{display:flex;gap:6px;flex-wrap:wrap;}
.ads-kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px;margin-bottom:12px;}
.ads-kpi{background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg);box-shadow:var(--e-1);padding:14px 16px;}
.ads-kpi .ak-label{font-size:12px;font-weight:700;color:var(--text-2);}
.ads-kpi .ak-value{font-size:26px;font-weight:800;margin:6px 0 2px;}
.ads-kpi .ak-sub{font-size:11px;color:var(--text-3);line-height:1.4;}
.ads-startline{font-size:12.5px;color:var(--text-2);background:var(--surface-2);border:1px solid var(--border);border-radius:var(--r-md);padding:8px 12px;margin-bottom:14px;}
.ads-chart{display:flex;flex-direction:column;gap:6px;}
.ads-chart .ac-row{display:grid;grid-template-columns:96px 1fr 56px;align-items:center;gap:10px;font-size:12px;}
.ads-chart .ac-day{color:var(--text-3);}
.ads-chart .ac-bar{display:block;height:12px;background:var(--surface-2);border-radius:var(--r-full);overflow:hidden;}
.ads-chart .ac-fill{display:block;height:100%;background:var(--brand-purple);border-radius:var(--r-full);min-width:2px;}
.ads-chart .ac-val{text-align:right;font-weight:700;}
.ads-honest{font-size:12.5px;line-height:1.55;color:var(--text-2);background:var(--warning-050);border:1px solid #f6dcaa;border-radius:var(--r-md);padding:12px 14px;margin-bottom:14px;}
.ads-honest .ah-title{font-weight:800;color:#a5660a;margin-bottom:4px;}
.ads-honest .ah-sub{font-weight:700;margin:8px 0 2px;}
.ads-honest .ah-list{margin:0;padding-left:18px;}

/* ==================== 应用商店商品页（admin-page-asc-products.js） ==================== */
.asc-rules{font-size:12.5px;line-height:1.55;color:var(--text-2);background:var(--warning-050);border:1px solid #f6dcaa;border-radius:var(--r-md);padding:12px 14px;margin:12px 0;}
.asc-rules .ar-title{font-weight:800;color:#a5660a;margin-bottom:4px;}
.asc-rules .ar-list{margin:0;padding-left:18px;}
.asc-banner{font-size:12.5px;line-height:1.55;color:#b3282c;background:var(--error-050);border:1px solid #f6c4c5;border-radius:var(--r-md);padding:12px 14px;margin-bottom:14px;}
.asc-banner .ab-title{font-weight:800;margin-bottom:4px;}
.asc-banner .ab-sub{margin-top:6px;color:var(--text-2);}
.asc-note{font-size:12.5px;line-height:1.5;color:#1e5fbf;background:var(--info-050);border:1px solid #c3dafb;border-radius:var(--r-md);padding:10px 12px;margin-bottom:12px;}
.asc-errors{font-size:12.5px;line-height:1.5;color:#b3282c;background:var(--error-050);border:1px solid #f6c4c5;border-radius:var(--r-md);padding:10px 12px;margin:8px 0;}
.asc-errors .ae-title{font-weight:700;margin-bottom:4px;}
.asc-errors ul{margin:0;padding-left:18px;}
.asc-prod-name{font-weight:700;}
.asc-locale-list{font-size:12.5px;line-height:1.5;}
.asc-price{font-variant-numeric:tabular-nums;}
.asc-actions{display:flex;gap:6px;flex-wrap:wrap;}
.asc-danger{color:var(--error);font-weight:600;}
.asc-panel-row>td{background:var(--surface-2);}
.asc-panel{border:1px solid var(--border);border-radius:var(--r-md);padding:12px 14px;background:var(--surface);}
.asc-panel-warn{border-color:#f6dcaa;background:var(--warning-050);}
.asc-panel .ap-title{font-weight:800;margin-bottom:8px;}
.asc-consequence{font-size:12.5px;line-height:1.55;color:var(--text-2);margin-bottom:10px;}
.asc-fields{display:flex;gap:12px;flex-wrap:wrap;}
.asc-field{display:flex;flex-direction:column;gap:4px;margin-bottom:8px;}
.asc-field-wide{flex:1 1 260px;}
.asc-lbl{font-size:11px;font-weight:700;color:var(--text-3);text-transform:uppercase;letter-spacing:.04em;}
.asc-panel-actions{display:flex;gap:8px;justify-content:flex-end;margin-top:10px;}
.asc-result{margin:8px 0;font-size:12.5px;line-height:1.5;}
.asc-slot-card{border-style:dashed;}

/* ==================== 商品列表页（admin-page-listings.js） ==================== */
.ls-filters{display:flex;flex-wrap:wrap;gap:12px;align-items:flex-end;}
.ls-field{display:flex;flex-direction:column;gap:4px;}
.ls-lbl{font-size:11px;font-weight:700;color:var(--text-3);text-transform:uppercase;letter-spacing:.04em;}
.ls-filters .input{min-width:150px;}
.ls-thumb{width:44px;height:44px;border-radius:var(--r-sm);object-fit:cover;border:1px solid var(--border);display:inline-block;}
.ls-thumb-empty{display:inline-flex;align-items:center;justify-content:center;color:var(--text-3);background:var(--surface-2);}
.ls-title{font-weight:700;}
.ls-warn{font-size:11px;color:#a5660a;}
.ls-row-active>td{background:var(--info-050);}
.ls-images{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:12px;}
.ls-image{width:96px;height:96px;border-radius:var(--r-md);object-fit:cover;border:1px solid var(--border);}
/* 交易详情 · 订单 v2 B4 —— 配送证据 / 退款凭证：运营要**靠这张图裁决**，
   96px 缩略图不够看。用 contain 而不是 cover：凭证被裁掉一半等于把金额裁掉了。 */
.ls-image-evidence{width:220px;height:auto;max-height:300px;object-fit:contain;background:var(--surface-3);}
.ls-dgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:10px 18px;margin-bottom:12px;}
.ls-dfield{display:flex;flex-direction:column;gap:2px;min-width:0;}
.ls-dk{font-size:11px;font-weight:700;color:var(--text-3);text-transform:uppercase;letter-spacing:.04em;}
.ls-dv{font-size:13px;word-break:break-word;}
.ls-desc{font-size:13px;line-height:1.55;color:var(--text-2);background:var(--surface-2);border-radius:var(--r-md);padding:10px 12px;margin-bottom:12px;white-space:pre-wrap;}
.ls-actionbar{margin:6px 0 14px;}
.ls-actform{border:1px solid var(--border);border-radius:var(--r-md);padding:12px 14px;background:var(--surface-2);}
.ls-acttitle{font-weight:800;margin-bottom:6px;}
.ls-confirm{font-size:12.5px;line-height:1.55;color:var(--text-2);margin-bottom:10px;}
.ls-actform .ls-field{margin-bottom:8px;}
.ls-actform textarea.input{width:100%;}
.ls-actbtns{display:flex;gap:8px;justify-content:flex-end;margin-top:10px;}
/* 左对齐版：用于「某人名下的一组动作」（如运营介入台里每个当事人的打标/封号）——
   右对齐会把按钮甩到整行最右边，看起来像是属于下面那个当事人的动作。 */
.ls-actbtns-start{justify-content:flex-start;}
.ls-timeline{border-top:1px solid var(--border);padding-top:12px;}

/* ==================== 分类商品列表页（admin-page-listing-categories.js） ==================== */
.lc-toolbar{display:flex;flex-wrap:wrap;gap:12px;align-items:flex-end;}
.lc-field{display:flex;flex-direction:column;gap:4px;}
.lc-lbl{font-size:11px;font-weight:700;color:var(--text-3);text-transform:uppercase;letter-spacing:.04em;}
.lc-tree .lc-l1{font-weight:700;}
.lc-tree .lc-l2{color:var(--text-2);}
.lc-row-active>td{background:var(--info-050);}
.lc-crumbs{display:inline-flex;align-items:center;gap:6px;flex-wrap:wrap;font-size:12px;color:var(--text-2);}
.lc-crumb{font-weight:700;}
.lc-crumb-root{color:var(--text-3);font-weight:600;}
.lc-crumb-sep{color:var(--text-3);}

/* ==================== 待办通知中心（admin-page-todos.js） ==================== */
/* 顶栏铃铛：登录后常驻；0 待办时只隐藏角标（按钮仍在，作为入口）。 */
.tb-todos{position:relative;display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;margin-right:4px;border-radius:50%;border:1px solid var(--border-strong);background:var(--surface);color:var(--text-2);font-size:16px;cursor:pointer;line-height:1;}
.tb-todos:hover{background:var(--surface-2);color:var(--text);}
.tb-todos.has{color:#b3282c;border-color:#f6c4c5;background:var(--error-050);}
.tb-todos .tb-count{position:absolute;top:-5px;right:-5px;min-width:16px;height:16px;padding:0 4px;border-radius:var(--r-full);background:var(--error);color:#fff;font-size:10px;font-weight:800;display:flex;align-items:center;justify-content:center;line-height:1;}
.tb-todos .tb-count[hidden]{display:none;}
/* 分类卡片（每类：名称 / 计数 / 紧急度徽章 / 前往 / 最久等待）。 */
.td-kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px;margin-bottom:16px;}
.td-kpi{background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg);box-shadow:var(--e-1);padding:14px 16px;display:flex;flex-direction:column;gap:6px;}
.td-kpi.td-kpi-empty{opacity:.72;}
.td-kpi .td-k-label{font-size:12px;font-weight:700;color:var(--text-2);}
.td-kpi .td-k-value{font-size:28px;font-weight:800;line-height:1;}
.td-kpi.td-kpi-empty .td-k-value{color:var(--text-3);}
.td-kpi .td-k-foot{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:2px;}
.td-kpi .td-k-age{font-size:11px;color:var(--text-3);}
.td-note{font-size:12.5px;line-height:1.5;color:#1e5fbf;background:var(--info-050);border:1px solid #c3dafb;border-radius:var(--r-md);padding:10px 12px;margin-bottom:12px;}
.td-label{font-weight:600;}
.td-when{font-size:11px;color:var(--text-3);}
.table td.td-act{text-align:right;white-space:nowrap;}

/* ==================== 全站导出条（admin-export.js） ==================== */
/* 注入在页面首个元素之前：一行「导出按钮 + 口径说明 + 状态」。 */
.tp-export-bar{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin:0 0 12px;}
.tp-export-note{color:var(--text-3);font-size:12px;}
.tp-export-status{color:var(--success);font-size:12px;font-weight:600;}
.tp-export-status:empty{display:none;}

/* ==================== 批量审核（admin-batch.js） ==================== */
/* 选择列（表头复选框 + 每行复选框）：窄列、不换行。 */
.tp-batch-th{width:36px;}
.tp-batch-td{width:36px;text-align:center;}
/* 批量操作条：插在主列表卡片之前。 */
.tp-batch-bar{margin:0 0 12px;}
.tp-batch-panel{background:var(--surface);border:1px solid var(--border-strong);border-radius:var(--r-md);box-shadow:var(--e-1);padding:10px 12px;}
.tp-batch-head{display:flex;flex-wrap:wrap;align-items:center;gap:8px;}
.tp-batch-count{font-weight:700;color:var(--text);font-size:13px;margin-right:4px;}
.tp-batch-running{color:var(--info);font-weight:600;font-size:12.5px;margin-right:4px;}
/* 确认面板 */
.tp-batch-ctitle{font-weight:800;margin-bottom:6px;color:var(--text);}
.tp-batch-cbody{font-size:12.5px;line-height:1.55;color:var(--text-2);margin-bottom:8px;}
.tp-batch-warn{font-size:12.5px;font-weight:600;color:var(--error);background:var(--error-050);border:1px solid var(--error);border-radius:var(--r-sm);padding:8px 10px;margin-bottom:10px;}
.tp-batch-field{margin-bottom:8px;}
.tp-batch-field .input{width:100%;}
.tp-batch-err{font-size:12.5px;color:var(--error);margin-bottom:8px;}
.tp-batch-err[hidden]{display:none;}
.tp-batch-cbtns{display:flex;gap:8px;justify-content:flex-end;margin-top:10px;}
/* 结果面板 */
.tp-batch-result{border-left:3px solid var(--success);padding-left:10px;}
.tp-batch-result.is-bad{border-left-color:var(--warning);}
.tp-batch-summary{font-weight:700;color:var(--text);margin-bottom:8px;}
.tp-batch-result.is-bad .tp-batch-summary{color:var(--warning);}
.tp-batch-fails{margin-bottom:10px;}
.tp-batch-flabel{font-size:11px;font-weight:700;color:var(--text-3);text-transform:uppercase;letter-spacing:.04em;margin-bottom:4px;}
.tp-batch-fails ul{margin:0;padding-left:18px;}
.tp-batch-fails li{font-size:12.5px;line-height:1.6;color:var(--text-2);}
.tp-batch-rbtns{display:flex;gap:8px;justify-content:flex-end;margin-top:10px;}


/* ============================================================================
   数据看板（admin-page-dashboard.js）+ 供需缺口（admin-page-supply-gap.js）
   ----------------------------------------------------------------------------
   颜色一律走 CSS 变量（本仓红线：除 #fff / #000 外不硬编码颜色）。
   ============================================================================ */
.db-table td.db-num,.db-table th.db-num{text-align:right;}
.db-num{font-family:var(--font-num);font-variant-numeric:tabular-nums;}
.db-k-label{display:flex;align-items:center;gap:7px;font-weight:600;}
.db-k-ico{display:inline-flex;color:var(--text-3);}
.db-hint{font-size:11.5px;color:var(--text-3);line-height:1.5;}
.db-note{font-size:11.5px;color:var(--text-3);line-height:1.5;margin-top:10px;}
.db-two{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:18px;margin-bottom:18px;}
.db-two .card{margin-bottom:0;height:100%;}
.db-big{display:flex;align-items:baseline;gap:10px;margin:4px 0 8px;}
.db-b-ico{display:inline-flex;color:var(--brand-purple);}
.db-b-num{font-family:var(--font-num);font-variant-numeric:tabular-nums;font-size:26px;font-weight:800;}
.db-promo-row{display:flex;align-items:center;justify-content:space-between;padding:7px 0;border-bottom:1px solid var(--border);font-size:13px;}
.db-promo-row:last-of-type{border-bottom:0;}
.db-backlog{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px;}
.db-backlog-cell{background:var(--surface-2);border:1px solid var(--border);border-radius:var(--r-md);padding:12px 14px;}
.db-backlog-empty{opacity:.72;}
.db-backlog-foot{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:8px;}
.db-banner{padding:16px;border-radius:var(--r-lg);}
.db-banner-t{font-weight:800;margin-bottom:4px;}
.db-banner-ok{background:var(--success-050);}
.db-banner-warn{background:var(--warning-050);}
.db-notes{margin:0;padding-left:18px;}
.db-notes li{font-size:12px;line-height:1.6;color:var(--text-2);margin:4px 0;}
.sg-legend{display:flex;flex-direction:column;gap:8px;}
.sg-legend-row{display:flex;align-items:center;gap:10px;}

/* ──────────────────────────────────────────────────────────────────────────
   响应式补丁（2026-10-14）——**纯追加**，不改上面任何既有规则 ⇒ 宽屏零回归。
   由来：本文件此前**没有任何 @media**。窄屏（≤1100px）下顶栏的语言切换 /
   角色徽章 / 用户名 / 修改密码 / 退出登录会互相挤压，中文被压成**竖排**，
   内容首行还会被顶栏盖住。
   实测证据：_qa/_shots/_admin_page_dashboard.png（764px 视口，按钮竖排）
   对照 _qa/_shots_wide/_admin_page_dashboard.png（1600px 视口，一行排开正常）。
   验收判据：1600px 与 764px 两个视口下，顶栏都不竖排、不重叠。
   ────────────────────────────────────────────────────────────────────────── */

/* 任何宽度下都不允许把顶栏里的中文压成竖排 */
.topbar button, .topbar .a-name, .topbar .btn { white-space: nowrap; }

@media (max-width: 1280px) {
  .topbar { gap: 10px; padding: 0 14px; }
  .topbar .tb-sub { display: none; }      /* 副标题优先让位 */
  .account { gap: 6px; }
}

@media (max-width: 1080px) {
  .topbar { gap: 8px; padding: 0 10px; }
  .lang-seg button { padding: 5px 8px; }
  .topbar .btn-sm, .account .btn { padding: 5px 8px; font-size: 12px; }
  .account .a-avatar { display: none; }
}

@media (max-width: 900px) {
  :root { --sidebar-w: 176px; }           /* 侧栏收窄，把宽度让给内容 */
  .topbar { gap: 6px; padding: 0 8px; }
  .lang-seg button { padding: 4px 6px; font-size: 11px; }
  .account .a-name { max-width: 88px; overflow: hidden; text-overflow: ellipsis; }
}

/* ============================================================================
   🔴 2026-10-15（第二批）—— 商品分类与模板页（admin-page-catalog.js）的 3 个
   **从未被定义过**的类。同样是**只加不删**：以下选择器此前一条都不存在。
   ----------------------------------------------------------------------------
   由来：上一批（见上面 .inp/.tbl/.ct-row 那段）补了 8 个新页面共用的输入框/
   表格/表单行；随后门闸 test/admin-css-class-coverage.test.js 仍列出 8 个残留类，
   逐个核对后**只有这 3 个是真缺陷**，另 5 个是「标记类」（样式由同族类或父级提供，
   无样式反而是对的）—— 逐条理由写在该测试的 MARKER_CLASSES 里，不在这里重复。

   证据不是猜的：同一份**真实 render 出的 DOM** 套两份 CSS 出的对比图，
     _qa/_console_mock_out/catalog_before_after.png
   数据也取自**生产**（16 个一级 / 115 个二级 / 8 个分类的真实字段模板），
   快照 _qa/_tools/_catalog_snapshot.json，脚本 _qa/_tools/console_catalog_mock.js。

   ⚠️ 一个贯穿全篇的前提：本文件第 43 行有全局重置
     `*{box-sizing:border-box;margin:0;padding:0;}`
   ⇒ `<ul>` 浏览器默认的 40px 缩进**已经被清掉**了，但 `list-style:disc` **还在**。
     这一点决定了下面 ct-tree 的写法（不是"把缩进改小"，而是"缩进根本没生效"）。
   ============================================================================ */

/* ── ct-grid：左「分类树」卡 ＋ 右「节点编辑器 / 字段模板 / 保存」两栏 ──────────────
   未定义时是普通 block ⇒ 两块**上下堆叠**。而分类树在生产真实数据下是
   16 个一级 + 115 个二级 = **131 行**，于是右侧整栏被推到页面**最底部** ——
   要滚过整棵树才看得到编辑器（实测改前整页高 ~4.6k px，见对比图左）。

   ⚠️ 右栏必须写 `minmax(0,1fr)` 而**不是** `1fr`：右栏里有 6 列的**可编辑表格**
   （`.tbl`，每个单元格里还有输入框），`1fr` 的 min-content 会被表格顶开 ⇒
   整个 grid 撑破 `.content`（max-width 1180px）⇒ 页面出现整页横向滚动。
   `minmax(0,…)` 把最小宽度压到 0，超出部分由表格自己消化。
   `align-items:start` 让左卡**不跟着**右栏被拉高（默认 `stretch` 会拉出一大片空白）。 */
.ct-grid{display:grid;grid-template-columns:minmax(240px,320px) minmax(0,1fr);gap:16px;align-items:start;}
/* 窄屏退回单栏 —— 与既有断点（1080/1100）取齐，避免两栏都挤到读不了。 */
@media (max-width:1080px){.ct-grid{grid-template-columns:minmax(0,1fr);}}

/* ── ct-tree：分类树（`<ul class="ct-tree">` 里再嵌一层 `<ul>`）──────────────────
   命中全局重置后的真实表现：
     ① 一级与二级**都在同一缩进上**（40px 缩进被重置清掉）⇒ 看不出谁是子类；
     ② `list-style:disc` 仍在，圆点按 outside 定位落在内容盒之外，又被
        `.card{overflow:hidden}` 裁掉 ⇒ 行首出现**残缺、不可控**的标记。
   这里显式给：无标记 + 逐层缩进 + 一条竖导线把层级画出来。 */
.ct-tree,.ct-tree ul{list-style:none;}
.ct-tree>li{padding:2px 0;}
.ct-tree ul{margin:1px 0 5px;padding-left:12px;border-left:2px solid var(--border);}
.ct-tree li{line-height:1.75;}

/* 一级行（`<div class="mono ct-fam">`）：一个「选中」按钮 + 「键名 / 图标 / 子类数」
   三个元信息 <span>。未定义时靠 inline 流自己排：文字一长就换行、且和按钮对不齐。
   改成弹性行 —— 按钮在左，元信息成组跟在后面，窄屏自动换行。 */
.ct-tree .ct-fam{display:flex;align-items:center;gap:6px;flex-wrap:wrap;}
.ct-tree .ct-fam>.sub-row{white-space:nowrap;}

/* ── 卡片正文的左右内边距（本页特有，非全站改动）────────────────────────────────
   本页把 `.hint` / `<ul class="ct-tree">` / `.btn-row` **直接挂在 `.card` 下**，
   而 `.card` 自身**没有内边距**（内边距只长在 `.card-head` / `.card-body` 上）。
   ⇒ 正文与卡片边框齐平、比卡头标题还靠左 16px（改前图里能直接看到）。
   ⚠️ 刻意**不动全局 `.card`**：其它 26 个页面大量依赖它"无内边距"的特性，
   动了就是全站回归。这里只按选择器逐个补本页需要的三个。 */
.ct-grid .card>.hint,
.ct-grid .card>.ct-tree,
.ct-grid .card>.btn-row{padding-left:16px;padding-right:16px;}
.ct-grid .card>.hint{margin:12px 0 0;}
.ct-grid .card>.ct-tree{margin:6px 0 14px;}
/* 保存在卡片里的备注输入框（`.inp` 是 `width:100%`）：
   ⚠️ 不能给它加 padding —— `width:100%` + `border-box` 下输入框的**边框**仍会贴到
   卡片边缘，只有文字被推进去，看着像坏了。所以用左右外边距 + 扣掉宽度的写法。 */
.ct-grid .card>.inp{margin:0 16px;width:calc(100% - 32px);}

/* ============================================================
   页面骨架（2026-10-18 交互改造）
   ------------------------------------------------------------
   老板 2026-10-17：「所有点击按钮展开的页面都应该是弹出窗口，而不是在
   页面底部展开」「需要让小白能够非常容易理解和非常容易就知晓怎么操作」。
   这里只补三样**新**东西，其余全部复用既有类（section-title / card / table…）：
     · .steps/.step  —— 页面顶部的三步提示（让小白知道这页要走几步）
     · .qhelp       —— 标题旁的「?」，点开解释这页在干什么
     · .cf-*        —— 危险动作确认弹窗里的输入确认词那一块
   ============================================================ */

.steps{display:flex;flex-wrap:wrap;gap:8px;margin:10px 0 14px;}
.step{display:inline-flex;align-items:center;gap:7px;background:#EEEDFE;color:#3C3489;
  border-radius:var(--r-full);padding:5px 12px;font-size:12.5px;line-height:1.4;}
.step i{font-style:normal;width:16px;height:16px;border-radius:50%;background:#534AB7;color:#fff;
  font-size:11px;display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;}

.qhelp{display:inline-flex;width:17px;height:17px;border-radius:50%;border:1px solid var(--border-strong);
  color:var(--text-3);font-size:11px;align-items:center;justify-content:center;vertical-align:2px;
  cursor:pointer;background:none;padding:0;margin-left:6px;}
.qhelp:hover{border-color:var(--brand-purple);color:var(--brand-purple);}

.cf-box{border:1px solid var(--border-strong);border-radius:var(--r-md);padding:12px 14px;background:var(--surface-2);}
.cf-word{font-family:ui-monospace,Consolas,monospace;font-weight:700;color:#b3282c;}
.cf-hint{margin-top:6px;}

/* 首页「常用操作」四宫格（2026-10-18 任务台化） */
.db-quick{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px;}
.db-quick-btn{border:1px solid #C8CEDD;background:var(--surface);border-radius:var(--r-md);
  padding:12px 14px;font-size:13.5px;font-weight:700;color:var(--text);cursor:pointer;text-align:left;
  box-shadow:var(--e-1);transition:border-color .12s ease,box-shadow .12s ease,transform .06s ease,color .12s ease;}
.db-quick-btn:hover{border-color:var(--brand-purple);color:var(--brand-purple);box-shadow:0 3px 10px rgba(88,72,255,.16);}
.db-quick-btn:active{transform:translateY(1px);box-shadow:none;}

/* 侧边栏菜单搜索（2026-10-18 老板：「增加一个菜单搜索功能」） */
.nav-search{padding:0 12px 10px;}
.nav-search input{width:100%;box-sizing:border-box;border:1px solid #C8CEDD;background:var(--surface);
  border-radius:var(--r-sm);padding:7px 10px;font-size:12.5px;color:var(--text);box-shadow:var(--e-1);}
.nav-search input::placeholder{color:var(--text-3);}
.nav-search input:focus{outline:2px solid var(--brand-purple);outline-offset:1px;border-color:var(--brand-purple);}
.nav-empty{padding:6px 14px 10px;font-size:12px;color:var(--text-3);}

/* 交易管理 · 快速状态 tab（2026-10-18 老板要求） */
.tx-quickbar{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:14px;}
.tx-quick{border:1px solid #C8CEDD;background:#fff;border-radius:999px;padding:6px 15px;
  font-size:12.5px;font-weight:700;color:var(--text-2);cursor:pointer;box-shadow:var(--e-1);
  transition:background .12s ease,border-color .12s ease,color .12s ease;}
.tx-quick:hover{border-color:#AEB6CA;background:#F4F6FB;}
.tx-quick.on{background:var(--brand-purple);border-color:var(--brand-purple);color:#fff;
  box-shadow:0 2px 6px rgba(88,72,255,.24);}

/* 弹窗广告 · 素材缩略预览（2026-10-18 老板要求「可以预览」） */
.pa-preview{margin-top:8px;width:180px;border:1px solid var(--border-strong);border-radius:10px;
  overflow:hidden;background:var(--surface-2);}
.pa-preview img{display:block;width:100%;height:auto;}
.pa-preview-empty{display:flex;align-items:center;justify-content:center;min-height:84px;
  border-style:dashed;color:var(--text-3);font-size:11.5px;padding:8px;text-align:center;}

/* 通用「快速筛选 tab」（2026-10-18）：交易管理 / 头像复核 / 后续各列表页共用。
   与 `.tx-quick` 同一套视觉，但语义通用 —— 新页面加 tab 直接复用这两个类。 */
.filter-tabs{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:14px;}
.filter-tab{border:1px solid #C8CEDD;background:#fff;border-radius:999px;padding:6px 15px;
  font-size:12.5px;font-weight:700;color:var(--text-2);cursor:pointer;box-shadow:var(--e-1);
  transition:background .12s ease,border-color .12s ease,color .12s ease;}
.filter-tab:hover{border-color:#AEB6CA;background:#F4F6FB;}
.filter-tab.on{background:var(--brand-purple);border-color:var(--brand-purple);color:#fff;
  box-shadow:0 2px 6px rgba(88,72,255,.24);}

/* 会员档位编辑弹窗的**分段**（2026-10-18 会员页改「只读表 + 编辑弹窗」）。
   一个档位有 4 组字段（价格 / 逐周期价 / 各渠道配额 / 权益与能力项），
   不分段就是一整片输入框 —— 小白分不清哪几个数字是一组、哪个属于哪个渠道。
   段间用一条细线分隔，段标题用 12px 粗体（比 `.ch-title` 弱、比 `.sub-row` 强）。 */
.mm-sec{padding:14px 0;border-top:1px solid var(--border);}
.mm-sec:first-child{padding-top:0;border-top:0;}
.mm-sec-t{font-size:12px;font-weight:800;color:var(--text-2);letter-spacing:.02em;margin-bottom:10px;}
.mm-sec .field:last-child{margin-bottom:0;}
.mm-sec .tbl th{padding-top:2px;padding-bottom:6px;}

/* 弹窗广告 · 列表里的素材缩略（2026-10-18 卡片改成"摘要 + 弹窗"后加的）。
   96×54 ≈ 16:9，够看出是不是那张图，又不把列表行撑高；
   没有素材时显示一行灰字（`.sub-row`），不要留一个空白方块让人以为加载失败。 */
.pa-thumb{width:96px;height:54px;flex:0 0 auto;border:1px solid var(--border-strong);
  border-radius:8px;overflow:hidden;background:var(--surface-2);
  display:flex;align-items:center;justify-content:center;text-align:center;padding:2px;}
.pa-thumb img{display:block;width:100%;height:100%;object-fit:cover;}

/* 开屏广告 · 「自家素材 / Google AdMob」两个来源的分组框（2026-10-19）。
   改前两块字段首尾相接排在同一张卡里，中间没有任何分隔 —— 运营分不清
   哪几个输入框属于自家素材、哪几个属于 AdMob（审计 #3「混在一张表单」）。
   这里只做"看得见的分组"，不改任何字段语义：标题 + 徽标 + 细边框。 */
.sa-group{border:1px solid var(--border);border-radius:var(--r-md);
  padding:12px 14px;margin:12px 0;background:var(--surface);}
.sa-group-head{display:flex;align-items:center;gap:8px;margin-bottom:6px;}
.sa-group-title{font-size:12.5px;font-weight:800;color:var(--text-2);}
.sa-group .ct-row:last-child{margin-bottom:0;}