/* 组件层。
   颜色一律引用 tokens.css 的变量，不写死色值。
   间距写 4px 刻度的字面值（4/8/12/16/24/32/48），不出现刻度外数值。
   例外（不受 4px 刻度约束，按设计稿取值）：所有 border-radius 与描边宽度，
   如 .seg 的 10px/7px、.btn-block 的 11px、.stat 的 999px 胶囊、各处的 1px 描边。 */

/* ---------- 按钮 ---------- */
.btn{
  border-radius:var(--r1); border:1px solid transparent;
  padding:8px 16px; font-size:var(--t3); color:var(--fg-2); background:var(--surface);
}
.btn-primary{background:var(--accent);border-color:var(--accent);color:var(--surface);font-weight:550}
.btn-primary:hover{background:var(--accent-hover)}
.btn-ghost{background:transparent;border-color:var(--line)}
.btn-ghost:hover{border-color:var(--accent);color:var(--accent)}
.btn:disabled{opacity:.45;cursor:not-allowed}
.btn.is-loading{opacity:.6;pointer-events:none}
/* .btn-block：撑满父宽的大号按钮（弹窗主操作）。首屏原来那个独立的 .btn-lg
   「上传文件」按钮已删（与上传框内入口重复），.btn-lg 随之无引用，一并移除。 */
.btn-block{padding:12px;font-size:var(--t4);font-weight:600;border-radius:11px;width:100%}

/* ---------- 表单 ---------- */
.field{margin-bottom:var(--s3)}
/* 紧贴下一行的字段（个人中心的「当前密码」）：少留 4px。原为内联 margin-bottom。 */
.fieldTight{margin-bottom:var(--s2)}
.lbl{display:block;font-size:var(--t2);font-weight:550;color:var(--fg-2);margin-bottom:8px}
.rowin{display:flex;gap:var(--s2)}
.rowin .inp,.rowin input{flex:1}
/* 验证码行：输入框吃掉剩余宽度，「获取验证码」保持内容宽度且不折行。
   原来是内联 white-space:nowrap（登录、重置密码两处）。 */
.codeRow .btn{flex:none;white-space:nowrap}
.inp.is-err{border-color:var(--err)}
.inp:disabled{background:var(--sunken);cursor:not-allowed}

/* 分段控件：取代旧的胶囊 tab */
.seg{
  display:flex; background:var(--sunken); border:1px solid var(--line);
  border-radius:10px; padding:4px; margin-bottom:var(--s4);
}
.seg button{
  flex:1; border:none; background:none; font-size:var(--t2); color:var(--muted);
  padding:8px 12px; border-radius:7px; font-weight:500;
}
.seg button.on{background:var(--surface);color:var(--fg);font-weight:600;box-shadow:var(--shadow-1)}

/* ---------- 容器 ---------- */
.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--r2);padding:16px}
.mask{
  position:fixed; inset:0; z-index:20; background:var(--mask);
  display:flex; align-items:center; justify-content:center; padding:var(--s5);
  overscroll-behavior:contain;
}
/* 弹窗自身可滚动：手机横屏（高约 375px）时登录 / 反馈弹窗比视口高，
   不给 max-height 的话上下两端都会被裁掉、而且没处滚。
   dvh 跟随移动浏览器收起的地址栏；不支持的浏览器先吃上面那条 vh 兜底。 */
.modal{
  background:var(--surface); border-radius:var(--r3); padding:var(--s5);
  width:min(420px,100%); box-shadow:var(--shadow-3);
  max-height:calc(100vh - 2 * var(--s5));
  max-height:calc(100dvh - 2 * var(--s5));
  overflow-y:auto; overscroll-behavior:contain;
}
.modal-wide{width:min(520px,100%);max-height:88vh;max-height:88dvh;overflow:auto}
.modal h3{margin:0 0 4px;font-size:var(--t5);font-weight:650}
.modal .sub{color:var(--muted);font-size:var(--t2);margin:0 0 16px}
/* 说明文字里的强调数字（「赠送 3 积分」）统一走强调色，
   原来是一处内联 <b style="color:var(--accent)">，弹窗里不该再有内联样式。 */
.modal .sub b{color:var(--accent)}
/* 分隔线只加在「后一节」上：正向选择器，避免 :first-of-type 按标签名匹配
   （弹窗里 .sect 前面还有 .acct 之类的 div，:first-of-type 根本落不到 .sect 上）。 */
.sect + .sect{border-top:1px solid var(--line);padding-top:var(--s4);margin-top:var(--s4)}
/* 两个 .sect 的小标题下留白统一为 8px（原来第二个靠内联 margin-bottom:12px 撑开，
   一个 4px 一个 12px 本就不一致）。 */
.sect h4{margin:0 0 var(--s2);font-size:var(--t3);font-weight:650}
/* 小标题下的整句说明（个人中心「设置登录密码」）：原为内联 margin。 */
.sectHint{margin:0 0 var(--s3)}

/* ---------- 状态标签 ---------- */
/* 状态胶囊不折行：后台窄屏下「管理员」「待处理」曾被挤成两行 */
.stat{font-size:var(--t1);padding:4px 8px;border-radius:999px;border:1px solid var(--line);
  color:var(--muted);white-space:nowrap}
.stat-new{color:var(--warn);border-color:var(--warn-line);background:var(--warn-weak)}
.stat-doing{color:var(--accent);border-color:var(--accent-line);background:var(--accent-weak)}
.stat-done{color:var(--ok);border-color:var(--ok-line);background:var(--ok-weak)}
.stat-failed{color:var(--err);border-color:var(--err-line);background:var(--err-weak)}

/* ---------- 行内提示 ---------- */
.msg{font-size:var(--t2);min-height:16px;margin-top:var(--s2);color:var(--muted)}
.msg-err{color:var(--err)}
.msg-ok{color:var(--ok)}

/* ---------- 表格 ---------- */
table{width:100%;border-collapse:collapse;font-size:var(--t3)}
th{text-align:left;color:var(--muted);font-weight:500;font-size:var(--t1);
  padding:0 var(--s2) 8px;border-bottom:1px solid var(--line)}
td{padding:12px var(--s2);border-bottom:1px solid var(--line);color:var(--fg-2)}
tr:last-child td{border-bottom:none}
td.num{font-variant-numeric:tabular-nums}
