/* ==========================================================================
   矿农网 · 移动端 H5 工人端 · 页面样式
   ========================================================================== */

/* ---------- 手机外壳 ---------- */
.phone-inner {
  display: flex;
  flex-direction: column;
  height: 100%;
  background: var(--bg);
  overflow: hidden;
  position: relative;
  font-size: var(--t-base);
}

.app-body {
  flex: 1;
  overflow-y: auto;
  overflow-x: hidden;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
}
.app-body::-webkit-scrollbar { display: none; }

.screen { display: flex; flex-direction: column; min-height: 100%; }
.screen > .app-body { flex: 1; }
.page-body { padding: 0 14px 26px; }

/* 2026-10-14 用户反馈「内容顶得太死，往下挪到合适位置」：
   有导航条的页（.page-body 是 .navbar 的后续兄弟），内容区统一下沉 12px 呼吸。
   ⚠️ 只命中“真有 navbar”的页 —— 首页 / 找活 / 需求 / 我的 用的是自绘头部，
      .page-body 不是 navbar 的兄弟，天然不受影响，四段式节奏不动。
   通栏 hero 页要豁免（内容必须与导航条连成一块）：
   · 岗位详情：下方 .screen-detail .page-body { padding-top: 0 }（2057 行，更晚生效）
   · 企业主页：见下一行 */
.navbar ~ .page-body { padding-top: 12px; }
.screen-co > .page-body { padding-top: 0; }

/* 底部 TabBar 存在时给内容留白 */
.screen-home > .page-body,
.screen-profile > .page-body { padding-bottom: 20px; }

/* ==========================================================================
   状态栏
   ========================================================================== */
.statusbar {
  flex: none;
  height: 44px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 22px 0 26px;
  font-size: 14px;
  font-weight: 700;
  letter-spacing: .3px;
  position: relative;
  z-index: 30;
}
.statusbar .sb-time { font-family: var(--font-num); }
.statusbar .sb-right { display: flex; align-items: center; gap: 5px; }
.statusbar .sb-sig { display: flex; align-items: flex-end; gap: 2px; }
.statusbar .sb-sig i {
  width: 3px; background: currentColor; border-radius: 1px; display: block;
}
.statusbar .sb-sig i:nth-child(1) { height: 5px; }
.statusbar .sb-sig i:nth-child(2) { height: 7px; }
.statusbar .sb-sig i:nth-child(3) { height: 9px; }
.statusbar .sb-sig i:nth-child(4) { height: 11px; }
.statusbar .sb-wifi {
  width: 15px; height: 15px; fill: none; stroke: currentColor;
  stroke-width: 1.9; stroke-linecap: round;
}
.statusbar .sb-bat {
  width: 23px; height: 12px; border: 1.4px solid currentColor; border-radius: 3px;
  padding: 1.4px; display: block; position: relative; opacity: .9;
}
.statusbar .sb-bat::after {
  content: ""; position: absolute; right: -3px; top: 3.4px;
  width: 1.6px; height: 4.4px; background: currentColor; border-radius: 0 1px 1px 0;
}
.statusbar .sb-bat i { display: block; height: 100%; width: 76%; background: currentColor; border-radius: 1.4px; }

.sb-light { background: #fff; color: var(--ink-900); border-bottom: 1px solid var(--line); }
.sb-deep  { background: var(--blue-900); color: #fff; }
.sb-dark  { background: var(--blue-700); color: #fff; }
.sb-brand { background: var(--blue-800); color: #fff; }

/* ==========================================================================
   顶部导航条
   ========================================================================== */
.navbar {
  flex: none;
  min-height: 52px;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 0 12px;
  background: #fff;
  border-bottom: 1px solid var(--line);
  position: sticky;
  top: 0;
  z-index: var(--z-sticky);
}
.navbar.dark {
  background: var(--blue-700);
  border-bottom: 0;
  color: #fff;
}
.navbar.flat { background: transparent; border-bottom: 0; }
.nb-btn {
  width: 40px; height: 40px;
  display: grid; place-items: center;
  border-radius: var(--r-md);
  color: inherit;
  flex: none;
}
.nb-btn:active { background: rgba(255, 255, 255, .16); }
.navbar:not(.dark) .nb-btn:active { background: var(--blue-50); }
.nb-ph { pointer-events: none; }
.nb-title {
  flex: 1;
  text-align: center;
  font-size: var(--t-md);
  font-weight: 800;
  letter-spacing: .3px;
  /* ⚠️ 行高必须显式锁死：继承 body 的 1.5 时，标题+副标题块最高可到 ~46px，
     贴着 52px 导航条下沿——真机大字号/浏览器最小字号一抬就被裁半截
     （2026-10-11 用户截图：引导墙副标题「认证通过后即可发布」字底被切）。 */
  line-height: 1.25;
}
.nb-title small {
  /* 2026-10-14 用户拍板「子页面导航条还是宽」：副标题不再单独占一行 ——
     改为**跟在标题后面同一行**的小字注（inline），让 .navbar.has-sub 回到全站标准 52px。
     ⚠️ 注释 129 行那条「折行撑高 67px」的历史问题由此从根上消失：
        同行显示天然不产生第二行，has-sub 也不需要加高了。 */
  display: inline-block;
  font-size: var(--t-xs);
  font-weight: 500;
  opacity: .75;
  margin-left: 6px;
  line-height: 1.25;
  /* 单行截断保留：副标题过长宁可省略号也不撑宽中间列。
     ⚠️ 必须是 inline-block：display:inline 时 max-width / overflow / text-overflow
        三个属性全部失效（CSS 规范只对块容器生效）——真数据里长企业名 / 长用户名
        会原样溢出导航条。inline-block 才让下面这三条真正生效。 */
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 60%;
  vertical-align: middle;
}
/* 带副标题的导航条：副标题已改同行（2026-10-14），不再需要加高 ——
   与普通 .navbar 完全一致（52px / padding 0），子页与首页顶部同高。 */
.navbar.has-sub {
  min-height: 52px;
  padding-top: 0;
  padding-bottom: 0;
}
.nb-right { display: flex; align-items: center; gap: 4px; min-width: 40px; justify-content: flex-end; }

/* ==========================================================================
   底部 TabBar（5 个固定 Tab：招工 / 找活 / 需求 / 消息 / 我的）
   ========================================================================== */
.tabbar {
  flex: none;
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  height: calc(60px + env(safe-area-inset-bottom, 0px));
  padding-bottom: env(safe-area-inset-bottom, 0px);
  background: rgba(255, 255, 255, .97);
  backdrop-filter: blur(12px);
  border-top: 1px solid var(--line);
  z-index: var(--z-tab);
}
.tab {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 3px;
  color: var(--ink-400);
  position: relative;
  transition: color .15s;
}
.tab .ic { width: 23px; height: 23px; }
.tab-tx { font-size: var(--t-xs); font-weight: 600; letter-spacing: .2px; }
.tab.on { color: var(--blue-700); }
.tab.on .tab-tx { font-weight: 800; }
.tab.on::before {
  content: "";
  position: absolute;
  top: 0; left: 50%;
  transform: translateX(-50%);
  width: 26px; height: 3px;
  border-radius: 0 0 3px 3px;
  background: var(--blue-700);
}
.tab-ic { position: relative; display: grid; place-items: center; }
.tab-dot {
  position: absolute;
  top: -5px; right: -8px;
  min-width: 17px; height: 17px;
  padding: 0 4px;
  border-radius: var(--r-pill);
  background: var(--danger);
  color: #fff;
  font-size: 11px;
  font-weight: 700;
  font-style: normal;
  display: grid;
  place-items: center;
  border: 1.6px solid #fff;
}


/* ==========================================================================
   首页 · 布局重构 v2（深色 Hero / 金刚区 / 工种宫格 / 推荐流）
   —— 结构对齐「参考稿」的首页分区；配色与圆角全部复用既有令牌，零新增色值
   层级：Hero → 证书提醒条 → 金刚区 → 热门工种宫格 → 为你推荐
   ========================================================================== */
.home-hero {
  position: relative;
  overflow: hidden;
  padding: 4px 14px 16px;
  color: #fff;
  background: linear-gradient(168deg, var(--blue-800) 0%, var(--blue-700) 58%, #123E86 100%);
}
/* 工业斜纹 + 网格，比旧版更密一点，撑住大标题 */
.home-hero::after {
  content: "";
  position: absolute;
  inset: 0;
  background-image:
    repeating-linear-gradient(-55deg, rgba(255, 255, 255, .04) 0 1px, transparent 1px 9px),
    repeating-linear-gradient(35deg, rgba(255, 255, 255, .025) 0 1px, transparent 1px 15px);
  pointer-events: none;
}
.home-hero > * { position: relative; z-index: 1; }

/* ---- 顶行：定位 + 身份切换 ---- */
.hh-top {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 4px 0 10px;
}
.hh-loc {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  height: 30px;
  font-size: var(--t-sm);
  font-weight: 700;
  color: #fff;
  letter-spacing: .3px;
}
.hh-loc .ic { width: 15px; height: 15px; color: var(--gold-300); }
.hh-loc .ic:last-child { width: 13px; height: 13px; opacity: .62; }
/* ---- 身份切换：求职 / 招工（双视角分段控件）---- */
.hh-role-sw {
  margin-left: auto;
  display: inline-flex;
  align-items: center;
  gap: 2px;
  height: 32px;
  padding: 2px;
  border-radius: var(--r-pill);
  border: 1px solid rgba(255, 255, 255, .28);
  background: rgba(10, 26, 58, .42);
  flex: none;
}
.hrs-btn {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  height: 26px;
  padding: 0 12px;
  border-radius: var(--r-pill);
  font-size: var(--t-xs);
  font-weight: 700;
  color: rgba(255, 255, 255, .8);
  letter-spacing: .5px;
}
.hrs-btn .ic { width: 13px; height: 13px; }
.hrs-btn.on {
  background: #fff;
  color: var(--blue-900);
  font-weight: 800;
}

/* ---- 简历投递卡 ---- */
.card-apply .pay-table { margin-bottom: 10px; }
.ap-done {
  display: flex;
  align-items: center;
  gap: 7px;
  padding: 11px 12px;
  border-radius: var(--r-lg);
  background: var(--success-50, #EAF7F0);
  border: 1px solid rgba(23, 138, 76, .22);
  font-size: var(--t-sm);
  font-weight: 700;
  color: var(--success);
  text-align: left;
}
.ap-done .ic { width: 17px; height: 17px; flex: none; }
.ap-link {
  display: block;
  width: 100%;
  margin-top: 9px;
  padding: 10px 0 0;
  border-top: 1px dashed var(--line);
  text-align: center;
  font-size: var(--t-sm);
  font-weight: 700;
  color: var(--blue-600);
}
.ap-link .ic { width: 14px; height: 14px; vertical-align: -2px; }
.ap-note {
  margin-top: 9px;
  font-size: var(--t-xs);
  line-height: 1.7;
  color: var(--t3);
  text-align: left;
}

/* ---- 主标题 ---- */
.hh-title {
  font-size: var(--t-3xl);
  font-weight: 900;
  letter-spacing: 1.6px;
  line-height: 1.14;
}
.hh-sub {
  margin-top: 6px;
  font-size: var(--t-sm);
  color: rgba(255, 255, 255, .74);
  letter-spacing: .3px;
}

/* ---- 搜索框 ---- */
.hh-search {
  display: flex;
  align-items: center;
  gap: 9px;
  width: 100%;
  height: 50px;
  margin-top: 14px;
  padding: 0 6px 0 15px;
  border-radius: var(--r-lg);
  background: #fff;
  box-shadow: 0 8px 20px rgba(6, 22, 49, .24);
}
.hh-search .ic { color: var(--ink-400); }
.hh-ph {
  flex: 1;
  text-align: left;
  font-size: var(--t-base);
  color: var(--ink-400);
}
.hh-go {
  flex: none;
  height: 38px;
  padding: 0 20px;
  border-radius: var(--r-md);
  background: var(--gold-500);
  color: #4A3406;
  font-size: var(--t-base);
  font-weight: 800;
  display: grid;
  place-items: center;
}

/* ---- 行业切换卡 ---- */
.hh-inds {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 9px;
  margin-top: 14px;
}
.hh-ind {
  position: relative;
  height: 70px;
  border-radius: var(--r-xl);
  background: rgba(255, 255, 255, .10);
  border: 1px solid rgba(255, 255, 255, .17);
  color: #fff;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 6px;
  transition: background-color .16s, border-color .16s, transform .1s;
}
.hh-ind:active { transform: scale(.98); }
.hh-ind .ic { width: 24px; height: 24px; color: rgba(255, 255, 255, .84); }
.hh-ind b { font-size: var(--t-md); font-weight: 800; letter-spacing: .6px; }
.hh-ind.on {
  background: #fff;
  border-color: #fff;
  box-shadow: 0 6px 18px rgba(6, 22, 49, .3);
}
.hh-ind.on .ic { color: var(--gold-600); }
.hh-ind.on b { color: var(--blue-700); }
.hh-ind.on::after {
  content: "";
  position: absolute;
  top: 10px;
  right: 10px;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--gold-500);
}

/* ---- 数据条 ---- */
.hh-stats {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  margin-top: 12px;
  padding: 11px 2px;
  border-radius: var(--r-xl);
  background: rgba(255, 255, 255, .09);
  border: 1px solid rgba(255, 255, 255, .14);
}
.hh-stat {
  position: relative;
  text-align: center;
}
.hh-stat + .hh-stat::before {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  width: 1px;
  height: 22px;
  transform: translateY(-50%);
  background: rgba(255, 255, 255, .16);
}
.hh-stat b {
  display: block;
  font-family: var(--font-num);
  font-variant-numeric: tabular-nums;
  font-size: var(--t-lg);
  font-weight: 800;
  color: var(--gold-300);
  letter-spacing: -.3px;
}
.hh-stat small {
  display: block;
  margin-top: 3px;
  font-size: 11px;
  color: rgba(255, 255, 255, .66);
}

/* ==========================================================================
   首页 · 证书提醒条（证书硬门槛是本平台核心差异，固定占位）
   ========================================================================== */
.hh-tip {
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%;
  margin-top: 12px;
  padding: 11px 13px;
  border-radius: var(--r-xl);
  background: linear-gradient(96deg, var(--gold-100), #fff 78%);
  border: 1px solid var(--gold-200);
  text-align: left;
}
.hh-tip-i {
  width: 34px;
  height: 34px;
  border-radius: 50%;
  background: var(--gold-500);
  color: #fff;
  display: grid;
  place-items: center;
  flex: none;
}
.hh-tip-i .ic { width: 19px; height: 19px; }
.hh-tip-m { flex: 1; min-width: 0; }
.hh-tip-m b {
  display: block;
  font-size: var(--t-sm);
  font-weight: 800;
  color: var(--gold-700);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.hh-tip-m small {
  display: block;
  margin-top: 2px;
  font-size: 11.5px;
  color: var(--ink-500);
}
.hh-tip > .ic { width: 16px; height: 16px; color: var(--gold-600); flex: none; }

/* ==========================================================================
   首页 · 金刚区（8 个真实入口）
   ========================================================================== */
.qk-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  margin-top: 12px;
  padding: 14px 4px;
  border-radius: var(--r-2xl);
  background: var(--surface);
  border: 1px solid var(--line);
  box-shadow: var(--sh-1);
}
.qk-cell {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  padding: 5px 2px;
  border-radius: var(--r-lg);
}
.qk-cell:active { background: var(--blue-50); }
.qk-ic {
  width: 46px;
  height: 46px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  color: #fff;
  /* 金刚区图标：渐变底加一层投影，白底页面里才立得住 */
  box-shadow: 0 4px 10px rgba(16, 24, 40, .18);
}
.qk-ic .ic { width: 23px; height: 23px; }
.qk-cell b {
  font-size: var(--t-xs);
  font-weight: 700;
  color: var(--ink-800);
  white-space: nowrap;
}
/* 图标底色一律由既有色板两阶渐变生成 */
.qk-gold  { background: linear-gradient(140deg, var(--gold-400), var(--gold-600)); }
.qk-navy  { background: linear-gradient(140deg, var(--blue-700), var(--blue-950)); }
.qk-brand { background: linear-gradient(140deg, var(--blue-500), var(--blue-700)); }
.qk-ok    { background: linear-gradient(140deg, var(--success), var(--success-600)); }
.qk-warn  { background: linear-gradient(140deg, var(--warn), #A96200); }
.qk-blue  { background: linear-gradient(140deg, var(--blue-400), var(--blue-600)); }
.qk-red   { background: linear-gradient(140deg, var(--danger), var(--danger-600)); }

/* ==========================================================================
   首页 · 热门工种宫格（4 × 2）· G1「现网精修」（2026-10-10 拍板）
   --------------------------------------------------------------------------
   白卡 + 浅灰细环描边，图标舱浅蓝底深蓝图标，名次徽标实底金/银/铜钉在卡角；
   末格固定为「更多工种」（进去是岗位列表页的工种三级联动）。
   ⚠️ 只改本段 .cg-* 规则，宫格结构（cg-grid / cg-cell / cg-ic / cg-rank / cg-more）
      与 mobile.ui.js 的 craftGrid 一一对应，其它段零波及。
   ========================================================================== */
.cg-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 9px;
}
.cg-cell {
  /* 名次徽标绝对定位于卡角，父级需建立定位上下文 */
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;   /* 内容整体居中：一排里每格的字块落在同一视觉中线上 */
  gap: 6px;
  padding: 12px 3px 10px;
  border-radius: 12px;
  background: #fff;
  /* 细环描边 + 轻投影（设计稿同款，不用 border：border 会占宽让四格不齐） */
  box-shadow: inset 0 0 0 1px #EFF3F8, 0 1px 2px rgba(16, 28, 46, .05);
}
.cg-cell:active { background: #F7FAFD; }
/* 名次徽标：岗位数前三名（名次由 JS 按真实数据排序后带入）。
   设计稿同款：实底金/银/铜，**钉在卡片左上角**（不是浮在卡内），
   圆角只做左下与左上两处，跟着卡片自身的 12px 圆角走。 */
.cg-rank {
  position: absolute;
  top: 0;
  left: 0;
  height: 15px;
  padding: 0 5px;
  border-radius: 12px 0 8px 0;
  display: inline-flex;
  align-items: center;
  font-size: 8px;
  font-weight: 900;
  letter-spacing: .02em;
  color: #4A3400;
  background: linear-gradient(150deg, #E7C55F, #C9992B);
}
.cg-rank.silver {
  color: #3B4C63;
  background: linear-gradient(150deg, #E4EAF2, #C3CDDA);
}
.cg-rank.bronze {
  color: #4A3208;
  background: linear-gradient(150deg, #EFCFAE, #CF9A67);
}
/* 图标舱：浅蓝底 + 深蓝图标（设计稿同款）；三个行业保留差异 ——
   煤矿按设计稿走蓝，化工/电力用浅青/浅蓝底各配行业色，不靠大色块抢戏。 */
.cg-ic {
  width: 34px;
  height: 34px;
  border-radius: 11px;
  display: grid;
  place-items: center;
  background: #F2F7FD;
  color: #0F3A80;
}
.cg-ic .ic { width: 18px; height: 18px; }
.cg-chem { background: #EAF7F2; color: #0E7E66; }
.cg-power { background: #EAF2FF; color: #2E6FBF; }
/* 工种名（2026-10-10 调档）：设计稿给的是 11.5px，但那是**孤立画稿**里的值 ——
   放到整屏里比同屏最小的一档还小（推荐区行标题 13px、岗位卡标题 18px、正文基准 16px），
   四列并排看就是"比别人小一号"，用户反馈不美观。改 13px 与推荐区行标题同档，
   在 4 列窄格里仍是一行放得下（最长 5 字 ≈ 65px < 可用宽 ≈ 76px）。
   nowrap + 省略号兜底：后台字典里若出现长工种名，宁可截断也不让它换行撑高整排。 */
.cg-cell b {
  max-width: 100%;
  font-size: 13px;
  font-weight: 800;
  color: #101C2E;
  line-height: 1.2;
  text-align: center;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
/* 副标：招工视角是「找持证人才」，求职视角是岗位数（内含 em） */
.cg-cell small { font-size: 11px; font-weight: 400; color: #93A1B5; }
/* 岗位数：深金等宽粗体（与全站薪资数字同一套语言）；与 .jc-time 同为 11px 档 */
.cg-cell small em {
  font-style: normal;
  font-weight: 900;
  color: #AE7E1A;
  font-variant-numeric: tabular-nums;
}
.cg-heat {
  width: 72%;
  height: 3px;
  border-radius: 2px;
  background: #EEF2F8;
  overflow: hidden;
}
.cg-heat span {
  display: block;
  height: 100%;
  border-radius: 2px;
  background: linear-gradient(90deg, #E7C55F, #C9992B);
}
/* G1（2026-10-10 拍板）末格「更多工种」：
   浅底 + 浅蓝细环，读起来像"还有一页"，不抢前面 7 个真热门的名次感；
   图标用 grid（四宫格），暗示"还有好些格子"。不画热度条、不挂名次。 */
.cg-more {
  background: #F7FAFD;
  box-shadow: inset 0 0 0 1px #DCE6F2;
}
.cg-more:active { background: #EDF3FA; }
.cg-more .cg-ic { background: #EAF1FA; color: #5A6B82; }
.cg-more b { color: #4E6178; }
.cg-more small { color: #8A99AD; }

/* ==========================================================================
   首页 · 推荐流筛选条
   ========================================================================== */
.rf-bar {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: -2px 0 10px;
  padding: 2px 0 4px;
  overflow-x: auto;
  scrollbar-width: none;
}
.rf-bar::-webkit-scrollbar { display: none; }
.rf-chip {
  flex: none;
  display: inline-flex;
  align-items: center;
  gap: 3px;
  height: 34px;
  padding: 0 13px;
  border-radius: var(--r-pill);
  background: #fff;
  border: 1px solid var(--line);
  box-shadow: var(--sh-1);
  font-size: var(--t-sm);
  font-weight: 600;
  color: var(--ink-700);
  white-space: nowrap;
}
.rf-chip .ic { width: 13px; height: 13px; color: var(--ink-400); }
/* 选中态做成实心蓝胶囊：白底描边在灰白卡片里几乎看不出"已选" */
.rf-chip.on {
  border-color: transparent;
  background: linear-gradient(135deg, var(--blue-500), var(--blue-700));
  color: #fff;
  font-weight: 700;
  box-shadow: 0 3px 8px rgba(15, 58, 128, .28);
}
.rf-chip.on .ic { color: #fff; }
.rf-chip-ic { padding: 0 10px; }

/* ==========================================================================
   首页 · 品牌头部（旧版，保留供其它页面复用）
   ========================================================================== */
.brand-head {
  background:
    linear-gradient(168deg, var(--blue-800) 0%, var(--blue-700) 62%, #123E86 100%);
  padding: 2px 14px 16px;
  color: #fff;
  position: relative;
  overflow: hidden;
}
/* 极淡的工业斜纹，克制不喧宾 */
.brand-head::after {
  content: "";
  position: absolute;
  inset: 0;
  background-image: repeating-linear-gradient(
    -55deg, rgba(255, 255, 255, .035) 0 1px, transparent 1px 9px);
  pointer-events: none;
}
.brand-head > * { position: relative; z-index: 1; }

.bh-top {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 6px 0 14px;
}
.bh-logo {
  width: 38px; height: 38px;
  border-radius: var(--r-lg);
  background: var(--gold-500);
  color: #3E2C05;
  display: grid;
  place-items: center;
  flex: none;
  box-shadow: 0 3px 10px rgba(0, 0, 0, .18);
}
.bh-name {
  font-size: 21px;
  font-weight: 900;
  letter-spacing: 1.6px;
  line-height: 1.15;
}
.bh-name small {
  display: block;
  font-size: var(--t-xs);
  font-weight: 500;
  letter-spacing: .2px;
  color: rgba(255, 255, 255, .68);
  margin-top: 3px;
}
.bh-city {
  margin-left: auto;
  height: 32px;
  padding: 0 10px;
  border-radius: var(--r-pill);
  background: rgba(255, 255, 255, .14);
  color: #fff;
  font-size: var(--t-sm);
  font-weight: 600;
  display: inline-flex;
  align-items: center;
  gap: 3px;
  flex: none;
}
.bh-city .ic { width: 14px; height: 14px; }

.bh-hot {
  display: flex;
  align-items: center;
  gap: 7px;
  margin-top: 12px;
  overflow-x: auto;
  scrollbar-width: none;
}
.bh-hot::-webkit-scrollbar { display: none; }
.bh-hot-l {
  font-size: var(--t-xs);
  color: rgba(255, 255, 255, .62);
  flex: none;
  font-weight: 600;
}
.bh-word {
  height: 28px;
  padding: 0 11px;
  border-radius: var(--r-pill);
  background: rgba(255, 255, 255, .13);
  color: #fff;
  font-size: var(--t-sm);
  font-weight: 600;
  flex: none;
  white-space: nowrap;
}
.bh-word:active { background: rgba(255, 255, 255, .26); }

/* 搜索框 */
.search-box {
  width: 100%;
  height: 50px;
  border-radius: var(--r-lg);
  background: #fff;
  display: flex;
  align-items: center;
  gap: 9px;
  padding: 0 6px 0 15px;
  box-shadow: 0 6px 18px rgba(6, 22, 49, .18);
}
.search-box .ic { color: var(--ink-400); }
.sb-ph {
  flex: 1;
  text-align: left;
  font-size: var(--t-base);
  color: var(--ink-400);
}
.sb-btn {
  height: 38px;
  padding: 0 20px;
  border-radius: var(--r-md);
  background: var(--blue-700);
  color: #fff;
  font-size: var(--t-base);
  font-weight: 700;
  display: grid;
  place-items: center;
  flex: none;
}

/* ==========================================================================
   首页 · 信任条
   ========================================================================== */
.trust-bar {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  background: #fff;
  padding: 12px 6px;
  border-bottom: 1px solid var(--line);
}
.trust-cell {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 3px;
  position: relative;
}
.trust-cell + .trust-cell::before {
  content: "";
  position: absolute;
  left: 0; top: 16%;
  height: 68%; width: 1px;
  background: var(--line);
}
.trust-cell .ic { width: 19px; height: 19px; color: var(--blue-600); }
.trust-cell b {
  font-size: var(--t-xs);
  font-weight: 700;
  color: var(--ink-800);
  letter-spacing: -.1px;
}
.trust-cell small { font-size: 11px; color: var(--ink-400); }

/* ==========================================================================
   反诈提示条
   ========================================================================== */
.anti-fraud {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 12px;
  padding: 10px 11px;
  border-radius: var(--r-lg);
  background: var(--danger-100);
  border: 1px solid #F7CFCB;
}
.af-ic {
  width: 26px; height: 26px;
  border-radius: var(--r-sm);
  background: var(--danger);
  color: #fff;
  display: grid;
  place-items: center;
  flex: none;
}
.anti-fraud p {
  flex: 1;
  font-size: var(--t-sm);
  font-weight: 600;
  color: #8E1F18;
  line-height: 1.4;
}
.af-btn {
  height: 30px;
  padding: 0 12px;
  border-radius: var(--r-sm);
  background: var(--danger);
  color: #fff;
  font-size: var(--t-sm);
  font-weight: 700;
  flex: none;
}

/* ==========================================================================
   轮播 · 急招专场
   ========================================================================== */
.bn-wrap { position: relative; margin-top: 12px; }
.bn-track {
  display: flex;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  gap: 0;
  scrollbar-width: none;
}
.bn-track::-webkit-scrollbar { display: none; }

.bn-slide {
  flex: none;
  width: 100%;
  scroll-snap-align: start;
  border-radius: var(--r-xl);
  padding: 16px;
  display: flex;
  align-items: flex-start;
  gap: 10px;
  position: relative;
  overflow: hidden;
  min-height: 168px;
  color: #fff;
}
.bn-slide::after {
  content: "";
  position: absolute;
  inset: 0;
  background-image: repeating-linear-gradient(
    -55deg, rgba(255, 255, 255, .045) 0 1px, transparent 1px 10px);
  pointer-events: none;
}
.bn-blue { background: linear-gradient(132deg, var(--blue-800), var(--blue-600)); }
.bn-teal { background: linear-gradient(132deg, #0B4F49, #0E8A7C); }
.bn-navy { background: linear-gradient(132deg, #0A2347, #1B4F9E); }

.bn-left { flex: 1; min-width: 0; position: relative; z-index: 1; }
.bn-art {
  position: absolute;
  right: -14px; bottom: -14px;
  width: 96px; height: 96px;
  border-radius: 50%;
  background: rgba(255, 255, 255, .08);
  display: grid;
  place-items: center;
  color: rgba(255, 255, 255, .22);
  z-index: 0;
}
.bn-kicker {
  display: inline-flex;
  align-items: center;
  height: 23px;
  padding: 0 9px;
  border-radius: var(--r-xs);
  background: var(--gold-500);
  color: #3E2C05;
  font-size: var(--t-xs);
  font-weight: 800;
  letter-spacing: .3px;
}
.bn-title {
  font-size: 20px;
  font-weight: 900;
  margin-top: 9px;
  letter-spacing: .4px;
}
.bn-pay {
  display: flex;
  align-items: baseline;
  gap: 5px;
  margin-top: 7px;
}
.bn-sub { font-size: var(--t-xs); color: rgba(255, 255, 255, .72); }
.bn-pay .salary { color: var(--gold-300); }
.bn-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 11px;
}
.bn-tags span {
  height: 24px;
  padding: 0 9px;
  border-radius: var(--r-xs);
  background: rgba(255, 255, 255, .15);
  font-size: var(--t-xs);
  font-weight: 600;
  display: inline-flex;
  align-items: center;
}
.bn-cta {
  margin-top: 13px;
  height: 34px;
  padding: 0 13px;
  border-radius: var(--r-md);
  background: #fff;
  color: var(--blue-800);
  font-size: var(--t-sm);
  font-weight: 800;
  display: inline-flex;
  align-items: center;
  gap: 3px;
}
.bn-dots {
  display: flex;
  justify-content: center;
  gap: 5px;
  margin-top: 9px;
}
.bn-dots i {
  width: 6px; height: 6px;
  border-radius: var(--r-pill);
  background: var(--ink-300);
  transition: width .25s, background-color .25s;
}
.bn-dots i.on { width: 18px; background: var(--blue-700); }

/* ==========================================================================
   公告条
   ========================================================================== */
.notice-bar {
  display: flex;
  align-items: center;
  gap: 8px;
  width: 100%;
  margin-top: 12px;
  padding: 11px 12px;
  border-radius: var(--r-lg);
  background: #fff;
  border: 1px solid var(--line);
  box-shadow: var(--sh-1);
}
.nbar-tag {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  height: 24px;
  padding: 0 8px;
  border-radius: var(--r-xs);
  background: var(--gold-100);
  color: var(--gold-700);
  font-size: var(--t-xs);
  font-weight: 800;
  flex: none;
}
.nbar-tx {
  flex: 1;
  text-align: left;
  font-size: var(--t-sm);
  color: var(--ink-700);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.nbar-more {
  display: inline-flex;
  align-items: center;
  gap: 1px;
  font-size: var(--t-xs);
  color: var(--ink-400);
  flex: none;
  font-weight: 600;
}

/* ---------- 首页公告卡（暖金底）：头部「官方公告」+ 两条可点公告 ---------- */
/* ---------- 首页官方公告卡：白底卡片 + 喇叭 logo + 两条可点公告 ---------- */
/* ---- S1 独立警示条（深蓝金盾）----
   2026-10-14 用户拍板：首页公告区按 reports/ui-review-20261004/notice-scroll-2.html
   的 S1 稿落码 —— 警示条**外置**在公告卡上方（44px，固定不动、永远看得见），
   下面白卡里滚动 2 条公告。安全提示独立成块，比收进卡内（S2）更醒目。
   金描边 + 深蓝渐变 = 平台级警示的固定语言（与「已认证」金标同源）。
   见 mobile.ui.js noticeBar。 */
.s1-alert {
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%;
  height: 44px;
  margin-top: 12px;
  padding: 0 12px;
  border: 0;
  border-radius: var(--r-xl);
  text-align: left;
  font-family: inherit;
  cursor: pointer;
  background: linear-gradient(160deg, #164896, var(--blue-700, #0F3A80));
  box-shadow: inset 0 0 0 1px rgba(201, 153, 43, .5),
              0 10px 22px -16px rgba(10, 42, 94, .7);
}
.s1-alert:active { opacity: .94; }
.s1-ic {
  flex: none;
  width: 26px;
  height: 26px;
  border-radius: 8px;
  display: grid;
  place-items: center;
  color: var(--gold-300);
  background: rgba(255, 255, 255, .08);
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .16);
}
.s1-ic .ic { width: 15px; height: 15px; }
.s1-tx {
  flex: 1;
  min-width: 0;
  display: flex;
  align-items: baseline;
  gap: 6px;
}
.s1-tx b {
  flex: none;
  font-size: 12.5px;
  font-weight: 900;
  color: var(--gold-300);
  letter-spacing: .3px;
}
.s1-tx small {
  font-size: 11px;
  color: rgba(240, 246, 255, .86);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.s1-go {
  flex: none;
  display: inline-flex;
  align-items: center;
  gap: 1px;
  font-size: 11px;
  font-weight: 800;
  color: var(--gold-300);
}
.s1-go .ic { width: 11px; height: 11px; color: rgba(237, 208, 131, .7); }

/* ---- 卡内固定警示行（S2「一张卡」）----
   ⛔ 2026-10-14 用户改为 S1（警示条外置），本段**当前无调用方**，保留作死代码：
      要退回 S2 只需把 noticeBar 里的 alertHtml 放回 nb-card 内部即可，不必重写样式。 */
.s2-alert {
  display: flex;
  align-items: center;
  gap: 9px;
  width: 100%;
  margin-top: 8px;
  padding: 9px 11px;
  border: 0;
  border-radius: 10px;
  text-align: left;
  font-family: inherit;
  cursor: pointer;
  background: #FDE9E7;
  box-shadow: inset 0 0 0 1px #F6CFCB;
}
.s2-alert:active { opacity: .9; }
.s2-ic {
  flex: none;
  width: 24px;
  height: 24px;
  border-radius: 8px;
  display: grid;
  place-items: center;
  color: #B8271F;
  background: rgba(255, 255, 255, .65);
}
.s2-ic .ic { width: 14px; height: 14px; }
.s2-tx { flex: 1; min-width: 0; }
.s2-tx b {
  display: block;
  font-size: 12px;
  font-weight: 800;
  color: #B8271F;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.s2-tx small {
  display: block;
  font-size: 10.5px;
  color: #B8271F;
  opacity: .75;
  margin-top: 2px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.s2-go { flex: none; }
.s2-go .ic { width: 13px; height: 13px; color: #D98D86; }
/* 「平台动态」分组小字：把固定警示行与下面滚动区在视觉上分成两层 */
.s2-cap {
  margin-top: 10px;
  font-size: 10.5px;
  font-weight: 800;
  color: var(--ink-300);
  letter-spacing: .4px;
}

.nb-card {
  margin-top: 12px;
  padding: 12px 14px;
  border-radius: var(--r-xl);
  background: #fff;
  border: 1px solid var(--line-2);
  box-shadow: var(--sh-1);
}
/* S1：上面紧跟那条深蓝警示条时收紧间距（12 → 9px），两块才像一组 */
.nb-card--after-alert { margin-top: 9px; }
.nb-top { display: flex; align-items: baseline; gap: 8px; }
.nb-ttl {
  font-size: var(--t-base);
  font-weight: 800;
  color: var(--ink-900);
  letter-spacing: -.2px;
}
.nb-cnt { flex: 1; min-width: 0; font-size: 11px; font-weight: 700; color: var(--ink-400); }
.nb-all {
  flex: none;
  display: inline-flex;
  align-items: center;
  gap: 2px;
  height: 26px;
  padding: 0 10px;
  border-radius: var(--r-pill);
  background: var(--bg);
  color: var(--ink-500);
  font-size: 11.5px;
  font-weight: 600;
}
.nb-all .ic { width: 12px; height: 12px; color: var(--ink-400); }

/* ---------- 公告滚动窗口（S2）：可视 2 行 × 40px = 80px，逐行上滚 ----------
   @keyframes nbRoll 的关键帧个数随公告条数变，由 noticeBar 按条数内联生成（见 mobile.ui.js），
   这里只放默认 4.5s（2 条）做兜底，真实时长由内联 style 覆盖。
   · `.s2-cap + .sc-win`：跟在「平台动态」小字下面时收紧（分组小字自己已带 10px 上边距）。
   · `.is-one`：只剩 1 条可滚时不滚、收成一行高 —— 把同一条复制两遍滚动反而像故障。 */
.sc-win { position: relative; height: 80px; overflow: hidden; margin-top: 6px; }
.s2-cap + .sc-win { margin-top: 2px; }
.sc-win.is-one { height: 40px; }
.sc-win.is-one::after { display: none; }
/* 底部渐隐，暗示"下面还有" */
.sc-win::after {
  content: '';
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 10px;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0), #fff);
  pointer-events: none;
}
.sc-track { animation: nbRoll 4.5s cubic-bezier(.45, 0, .25, 1) infinite; }
.sc-row {
  display: flex;
  align-items: center;
  gap: 9px;
  width: 100%;
  height: 40px;
  padding: 0 2px;
  border: 0;
  background: none;
  text-align: left;
  font-family: inherit;
  cursor: pointer;
}
.sc-row + .sc-row { border-top: 1px solid var(--line-2); }
.sc-row:active { opacity: .55; }
.sc-tag {
  flex: none;
  display: inline-flex;
  align-items: center;
  height: 19px;
  padding: 0 8px;
  border-radius: var(--r-pill);
  background: var(--blue-50);
  color: var(--blue-700);
  font-size: 10.5px;
  font-weight: 800;
}
.sc-tag.hot { background: var(--gold-100); color: var(--gold-700); box-shadow: inset 0 0 0 1px var(--gold-300); }
.sc-tx {
  flex: 1;
  min-width: 0;
  font-size: var(--t-sm);
  color: var(--ink-800);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.sc-go { flex: none; }
.sc-go .ic { width: 13px; height: 13px; color: var(--ink-300); }
/* 系统开了"减少动态效果"就停住，别让晕眩用户难受 */
@media (prefers-reduced-motion: reduce) { .sc-track { animation: none; } }

/* ==========================================================================
   三大行业入口
   ========================================================================== */
.ind-entry {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 9px;
}
.ie-cell {
  background: #fff;
  border: 1.5px solid var(--line);
  border-radius: var(--r-xl);
  padding: 14px 8px 12px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 3px;
  transition: border-color .16s, box-shadow .16s, transform .1s;
}
.ie-cell:active { transform: scale(.98); }
.ie-cell.on {
  border-color: var(--blue-700);
  box-shadow: 0 3px 12px rgba(15, 58, 128, .14);
  background: linear-gradient(180deg, var(--blue-50), #fff 62%);
}
.ie-ic {
  width: 46px; height: 46px;
  border-radius: var(--r-xl);
  display: grid;
  place-items: center;
  color: #fff;
  margin-bottom: 5px;
}
.ie-ic .ic { width: 25px; height: 25px; }
.ie-coal  { background: linear-gradient(140deg, #17509E, #0F3A80); }
.ie-chem  { background: linear-gradient(140deg, #12A08F, #0A6B60); }
.ie-power { background: linear-gradient(140deg, #2E7BD6, #123E86); }
.ie-cell b {
  font-size: var(--t-md);
  font-weight: 800;
  color: var(--ink-900);
}
.ie-cell small {
  font-size: var(--t-xs);
  color: var(--gold-700);
  font-weight: 700;
}
.ie-desc {
  font-size: 11px;
  color: var(--ink-400);
  margin-top: 2px;
}
.ie-cell.on .ie-desc { color: var(--blue-600); }

/* ==========================================================================
   热门工种横向滚动
   ========================================================================== */
.craft-scroll {
  display: flex;
  gap: 9px;
  overflow-x: auto;
  padding: 2px 0 6px;
  scrollbar-width: none;
  margin: 0 -14px;
  padding-left: 14px;
  padding-right: 14px;
}
.craft-scroll::-webkit-scrollbar { display: none; }
.craft {
  flex: none;
  width: 88px;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: var(--r-lg);
  padding: 12px 6px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  box-shadow: var(--sh-1);
}
.craft:active { background: var(--blue-50); }
.craft .ic { width: 22px; height: 22px; color: var(--blue-600); }
.craft b { font-size: var(--t-sm); font-weight: 700; color: var(--ink-900); }
.craft small { font-size: 11px; color: var(--ink-400); }

/* 搜索页的工种宫格 */
.craft-scroll.wrap-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  overflow: visible;
  margin: 0;
  padding: 0;
  gap: 9px;
}
.craft-scroll.wrap-grid .craft { width: auto; }

/* ==========================================================================
   岗位卡片
   ========================================================================== */
.job-card {
  display: block;
  width: 100%;
  position: relative;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: var(--r-xl);
  padding: 14px;
  margin-bottom: 10px;
  box-shadow: var(--sh-1);
  transition: box-shadow .16s, border-color .16s, transform .1s;
  overflow: hidden;
}
.job-card:active {
  transform: scale(.992);
  border-color: var(--blue-300);
  box-shadow: var(--sh-2);
}
.job-card .stamp { border-radius: 0 0 0 var(--r-md); }
.job-card .stamp:not(.stamp-danger) { border-radius: 0 0 0 0; }

.jc-head {
  display: flex;
  align-items: flex-start;
  gap: 10px;
}
.jc-name {
  flex: 1;
  min-width: 0;
  font-size: 18px;
  font-weight: 800;
  color: var(--ink-900);
  line-height: 1.35;
  letter-spacing: -.2px;
  padding-right: 4px;
  /* 标题前挂行业徽标后，标题行改为弹性行：徽标不被压缩、文字超长照样省略 */
  display: flex;
  align-items: center;
  gap: 6px;
}
.jc-name-tx { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* ---------- 岗位置顶角标（岗位标题前，2026-10-07）----------
   与 .ind-badge 占同一个兵位（.jc-name 是 flex + gap 6px），不被标题压缩也不被省略，
   标题过长时只会裁 jc-name-tx。金色系与该控件的品牌色一致，区别于红色的「急招」stamp。 */
.jc-top {
  flex: none;
  display: inline-flex;
  align-items: center;
  gap: 2px;
  height: 19px;
  padding: 0 5px 0 4px;
  border-radius: 6px;
  background: linear-gradient(140deg, #F0C355, #C9992B);
  color: #4A3406;
  font-size: 11px;
  font-weight: 800;
  line-height: 1;
  letter-spacing: 0;
}
.jc-top .ic { width: 11px; height: 11px; }

/* ---------- 行业徽标（岗位标题前的小色块图标） ---------- */
.ind-badge {
  flex: none;
  display: inline-flex;
  align-items: center;
  gap: 2px;
  height: 19px;
  padding: 0 5px 0 4px;
  border-radius: 6px;
  color: #fff;
}
.ind-badge .ic { width: 11px; height: 11px; }
.ind-badge i {
  font-style: normal;
  font-size: 11px;
  font-weight: 800;
  line-height: 1;
  letter-spacing: 0;
}
.ind-coal  { background: linear-gradient(140deg, #2A5FA8, var(--blue-950)); }
.ind-chem  { background: linear-gradient(140deg, #14A08C, #0B5A50); }
.ind-power { background: linear-gradient(140deg, #3B7BD8, #1B4F9E); }
/* 迷你卡（横向滑动）里压小一档 */
.job-mini .ind-badge { height: 17px; padding: 0 4px 0 3px; border-radius: 5px; gap: 1px; }
.job-mini .ind-badge .ic { width: 10px; height: 10px; }
.job-mini .ind-badge i { font-size: 10px; }
.jm-name { display: flex; align-items: center; gap: 5px; }
.jm-name > span { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.job-card .stamp ~ .jc-head .jc-name { padding-right: 52px; }
.jc-pay {
  flex: none;
  text-align: right;
  padding-top: 1px;
}
.jc-pay-sub {
  display: block;
  font-size: 11px;
  color: var(--ink-400);
  margin-top: 3px;
}

.jc-meta {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-top: 9px;
  font-size: var(--t-sm);
  color: var(--ink-600);
  flex-wrap: wrap;
}
.jc-m { display: inline-flex; align-items: center; gap: 3px; }
.jc-m .ic { color: var(--ink-400); }
.jc-dist { color: var(--blue-600); font-weight: 700; }
.jc-sep { width: 1px; height: 11px; background: var(--line); }

.jc-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  margin-top: 10px;
}

.jc-foot {
  display: flex;
  align-items: center;
  gap: 7px;
  margin-top: 12px;
  padding-top: 11px;
  border-top: 1px dashed var(--line);
}
.logo {
  width: 26px; height: 26px;
  border-radius: var(--r-sm);
  display: grid;
  place-items: center;
  font-size: 11px;
  font-weight: 800;
  color: #fff;
  flex: none;
  letter-spacing: -.3px;
}
.logo.t1 { background: linear-gradient(140deg, #2E68BC, #0F3A80); }
.logo.t2 { background: linear-gradient(140deg, #14A08F, #0A6B60); }
.logo.t3 { background: linear-gradient(140deg, #C9992B, #8A6414); }
.logo.t4 { background: linear-gradient(140deg, #6B7C93, #3A4A60); }
.logo.t5 { background: linear-gradient(140deg, #8A88EE, #4338B8); }

.jc-co {
  flex: 1;
  min-width: 0;
  font-size: var(--t-sm);
  color: var(--ink-600);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.jc-cert {
  display: inline-flex;
  align-items: center;
  gap: 2px;
  font-size: 11px;
  font-weight: 700;
  color: var(--success);
  flex: none;
}
.jc-time { font-size: 11px; color: var(--ink-400); flex: none; }

/* 迷你卡 */
.sim-scroll {
  display: flex;
  gap: 10px;
  overflow-x: auto;
  padding-bottom: 6px;
  margin: 0 -14px;
  padding-left: 14px;
  padding-right: 14px;
  scrollbar-width: none;
}
.sim-scroll::-webkit-scrollbar { display: none; }
.job-mini {
  flex: none;
  width: 196px;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: var(--r-xl);
  padding: 13px;
  text-align: left;
  box-shadow: var(--sh-1);
}
.jm-name {
  font-size: var(--t-base);
  font-weight: 800;
  color: var(--ink-900);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.jm-pay { margin-top: 6px; }
.jm-meta {
  display: flex;
  align-items: center;
  gap: 3px;
  font-size: var(--t-xs);
  color: var(--ink-500);
  margin-top: 7px;
}
.jm-tags { display: flex; gap: 4px; margin-top: 8px; flex-wrap: wrap; }
.jm-co {
  font-size: 11px;
  color: var(--ink-400);
  margin-top: 9px;
  padding-top: 9px;
  border-top: 1px dashed var(--line);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* ==========================================================================
   筛选栏 / 排序 / 筛选面板（2026-10-03 重做：横滑胶囊 + 底部抽屉）
   ========================================================================== */
/* ⚠️ 2026-10-04 方案三「连体分段轨道」：栏底回到白，四格并入灰色圆角轨道，
   选中 = 白色浮起滑块（iOS 分段控件工具感）。只换色，结构 / 交互 / 取数零改动。 */
.fb-wrap {
  flex: none;
  position: sticky;
  top: 0;
  z-index: var(--z-sticky);
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 10px 12px;
  background: #fff;
  border-bottom: 1px solid var(--line);
  box-shadow: 0 8px 18px -14px rgba(15, 58, 128, .35);
}
/* ⚠️ 2026-10-03 重做：原来是 `display:flex` + 胶囊 `flex:none`，宽度**完全由文字长短决定**
   ——「全部地区」「薪资不限」「经验不限」三个字数是 4 / 4 / 4，可「选择行业」是 4、「矿工种类」是 4，
   一旦某项文字变长（比如选中后变成「榆林市榆阳区」），整条栏立刻参差不齐、还会挤到横滑。
   招工 4 项 / 找活 3 项 / 需求 2 项，三个屏的项数还不一样，视觉上更是不齐。
   ✅ 改成**等宽网格**：一行几项就均分几份，各项同宽，选中后文字变长也不会把别人挤走。
      （项数本来就只有 2~4 个，均分后每一项都够宽，所以不再需要横滑。） */
.fb-scroll {
  flex: 1;
  min-width: 0;
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: 1fr;
  gap: 2px;
  overflow: hidden;
  padding: 3px;
  background: #EDF1F7;
  border-radius: 999px;
}
.fb-pill {
  /* 等宽网格下必须允许收缩，否则长文字会把列撑开、破坏"均匀" */
  min-width: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  height: 32px;
  padding: 0 8px;
  border-radius: 999px;
  background: transparent;
  border: 0;
  font-size: 13px;
  font-weight: 600;
  color: var(--ink-700);
  white-space: nowrap;
  transition: background .18s ease, color .18s ease, border-color .18s ease, box-shadow .18s ease;
}
/* 选中后文字可能变长（如「榆林市榆阳区」）：截断省略，绝不撑破等宽列 */
.fb-pill .fb-tx {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.fb-pill:active { transform: scale(.97); }
.fb-pill .ic { width: 13px; height: 13px; color: var(--ink-400); transition: transform .2s ease, color .18s ease; }
.fb-pill.on {
  /* 选中 = 白色浮起滑块：灰轨道里唯一亮块，iOS 分段控件的工具感 */
  background: #fff;
  border-color: transparent;
  color: var(--blue-700);
  font-weight: 800;
  box-shadow: 0 2px 8px -2px rgba(15, 58, 128, .28);
}
/* 方案三：白滑块即选中标记，不再挂「已选」小圆点 */
.fb-pill.on .ic { color: var(--blue-700); transform: rotate(180deg); }
.fb-clear {
  flex: none;
  display: inline-flex;
  align-items: center;
  gap: 4px;
  height: 34px;
  padding: 0 12px;
  border-radius: 999px;
  background: var(--gold-50);
  border: 1px solid var(--gold-200);
  color: var(--gold-700);
  font-size: 12px;
  font-weight: 800;
}
.fb-clear em {
  font-style: normal;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 16px;
  height: 16px;
  padding: 0 4px;
  border-radius: 8px;
  background: var(--gold-500);
  color: #fff;
  font-size: 11px;
}

/* ⚠️ 2026-10-03：`.sort-tabs / .sort-tab` 整组删除。
   岗位 / 找活 / 需求三页的底排排序标签（综合 · 薪资最高 · 经验最长 · 响应最多）已撤，
   排序维度收进筛选栏那四项 —— 样式跟着一起走，不留没人用的死 CSS。
   （data-sort 的事件处理留在 mobile.app.js，将来要再摆排序按钮可直接复用。） */

.list-sum {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 14px 2px 11px;
}
.ls-count { font-size: var(--t-sm); color: var(--ink-500); }
.ls-count b { color: var(--blue-700); font-weight: 800; font-size: var(--t-md); }
.list-end {
  text-align: center;
  font-size: var(--t-xs);
  color: var(--ink-400);
  padding: 18px 0 8px;
}

/* 空结果：完整岗位分类上线后工种有 375 个，很多组合在现实岗位上一条都匹配不到
   （原有的"匹配不到就回落全量"已去掉），必须有一屏人话说清"是怎么没的"并给条退路，
   否则列表区只剩一条孤零零的横线，看着像加载失败。 */
.ls-none {
  text-align: center;
  padding: 34px 16px 26px;
}
.ls-none-t { font-size: var(--t-md); color: var(--ink-700); font-weight: 700; }
.ls-none-s { font-size: var(--t-xs); color: var(--ink-400); margin-top: 6px; }
.ls-none-btn {
  margin-top: 14px;
  padding: 9px 18px;
  border: 1px solid var(--blue-200);
  border-radius: 999px;
  background: var(--blue-50);
  color: var(--blue-700);
  font-size: var(--t-sm);
  font-weight: 600;
  cursor: pointer;
}

/* 筛选面板：底部抽屉（原来 `top: 148px` 写死，招工 / 找活 / 需求三屏头图高度不同，
   那个 148px 只对得上其中一屏，另两屏面板悬在半空 —— 改成贴底，与页头无关） */
.fp-mask {
  position: fixed;
  inset: 0;
  background: rgba(6, 22, 49, .42);
  z-index: var(--z-mask);
  animation: fpFade .18s ease;
}
@keyframes fpFade { from { opacity: 0; } to { opacity: 1; } }
.fp-sheet {
  position: fixed;
  left: 0; right: 0; bottom: 0;
  z-index: calc(var(--z-mask) + 1);
  background: #fff;
  border-radius: 18px 18px 0 0;
  box-shadow: var(--sh-3);
  max-height: 74vh;
  display: flex;
  flex-direction: column;
  padding-bottom: env(safe-area-inset-bottom, 0px);
  animation: fpUp .22s cubic-bezier(.2, .8, .2, 1);
}
@keyframes fpUp {
  from { transform: translateY(20px); opacity: .6; }
  to   { transform: translateY(0); opacity: 1; }
}
/* 滚轮选择器（2026-10-03 改版：chip 网格 → iOS 风格滚轮）
   结构：头部三段（取消 | 标题 | 确定）+ 单列滚动吸附 + 中线高亮条 */
.pw-head {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  padding: 13px 16px 9px;
  border-bottom: 1px solid var(--line);
}
.pw-title, .pw-head .fp-title { font-size: 15px; font-weight: 800; color: var(--ink-900); }
.pw-cancel {
  justify-self: start;
  font-size: 14px; font-weight: 600;
  color: var(--ink-500);
}
.pw-ok {
  justify-self: end;
  font-size: 14px; font-weight: 800;
  color: var(--blue-700);
}
.pw-wheel { position: relative; padding: 6px 0 calc(10px + env(safe-area-inset-bottom, 0px)); }
/* 中线高亮条：压在滚动层下面（z-index 0），滚动内容（z-index 1）透出来 */
/* 中线带 · 方案 W1「药丸精修」（2026-10-06）：淡蓝药丸 + 1px 细边。
   ⚠️ 全局 * { box-sizing: border-box }，所以加 1px border 不会把 44px 撑成 46px
      （撑了就会与 scrollTop/44 的吸附换算错位，中线对不上取值）。 */
.pw-hl {
  position: absolute;
  left: 18px; right: 18px;
  /* 滚动区从 wheel 顶 6px 开始，滚动内容中心 = 6 + 66 + 22 = 94px（定死，不随 safe-area 漂） */
  top: 94px; height: 44px;
  transform: translateY(-50%);
  background: #EDF3FC;
  border: 1px solid #D8E5F8;
  border-radius: 10px;
  pointer-events: none;
}
/* 滚动层：4 行可视（176 = 4 × 44），上下各留 66px 让首尾项也能滚到中线；
   mask 做上下渐隐。⚠️ 44px 行高与 mobile.app.js 里的吸附换算必须一致。 */
.pw-scroll {
  position: relative; z-index: 1;
  height: 176px;
  padding: 66px 0;
  overflow-y: auto;
  scroll-snap-type: y mandatory;
  scrollbar-width: none;
  -webkit-mask-image: linear-gradient(180deg, transparent 0, #000 18%, #000 82%, transparent 100%);
  mask-image: linear-gradient(180deg, transparent 0, #000 18%, #000 82%, transparent 100%);
}
.pw-scroll::-webkit-scrollbar { display: none; }
.pw-item {
  height: 44px;
  display: flex;
  align-items: center;
  justify-content: center;
  scroll-snap-align: center;
  font-size: 15px;
  font-weight: 600;
  color: var(--ink-500);
  cursor: pointer;
}
.pw-item.on {
  font-size: 19px;
  font-weight: 800;
  color: var(--blue-700);
}

/* ==========================================================================
   三级联动选择（行业 → 分类 → 工种）—— 2026-10-04 改版：点击列表 → **三列滚轮**
   与单列滚轮（.pw-*）同一套布局语言：三列共用一条中线高亮（复用 .pw-hl），
   各列独立滚动吸附、中线上的项加粗变深，非中线项渐隐。
   （原来是三列点击列表、选中项整条填品牌色 —— 与 App 其他滚轮两套手感，且挤。）
   ========================================================================== */
.fc-wheel { position: relative; padding: 6px 0 calc(10px + env(safe-area-inset-bottom, 0px)); }
/* 中线高亮条与 .pw-wheel 完全同几何：6 + 66 + 22 = 94px（定死，不随 safe-area 漂） */
.fc-wheel .pw-hl { top: 94px; height: 44px; }
.fc-cols {
  display: flex;
  align-items: stretch;
  /* 三列可视 4 行（176 = 4 × 44），与单列滚轮一致 */
  height: 176px;
  overflow: hidden;
  position: relative;
  z-index: 1;
}
.fc-col {
  flex: 1;
  min-width: 0;
  overflow-y: auto;
  /* 上下各留 66px 让首尾项也能滚到中线；snap 到行中心 */
  padding: 66px 0;
  scroll-snap-type: y mandatory;
  scrollbar-width: none;
  border-right: 1px solid var(--line);
  -webkit-mask-image: linear-gradient(180deg, transparent 0, #000 18%, #000 82%, transparent 100%);
  mask-image: linear-gradient(180deg, transparent 0, #000 18%, #000 82%, transparent 100%);
}
.fc-col:last-child { border-right: 0; }
.fc-col::-webkit-scrollbar { display: none; }
.fc-item {
  height: 44px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 5px;
  font-size: 13px;
  font-weight: 600;
  color: var(--ink-400);
  cursor: pointer;
  text-align: center;
  line-height: 1.25;
  scroll-snap-align: center;
}
.fc-item.on {
  font-size: 15px;
  font-weight: 800;
  color: var(--blue-700);
}

/* ---- 列头 + 当前路径回显（方案 W1 精修的一部分，2026-10-06）----
   滚轮看不见"相邻列全貌、跨级改选要滚很久"是它的固有短板，
   列头说明每列是什么、路径回显把三级结果拼成一行 —— 两个都只是缓解，不解决。
   ⚠️ 路径由交互层按三列**中线**实时写（window.wheelPath），不参与 FC / FA 状态，
      也不进筛选值 —— 它只回答"现在轮子上停的是什么"。 */
.fc-path {
  padding: 0 16px 7px;
  text-align: center;
  font-size: 11px;
  color: var(--ink-400);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.fc-path b { color: var(--blue-700); font-weight: 800; }
.fc-labs { display: flex; padding: 0 6px 5px; }
.fc-labs span {
  flex: 1;
  text-align: center;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 1px;
  color: var(--ink-400);
}

/* ==========================================================================
   搜索页
   ========================================================================== */
.screen-search .page-body { padding-bottom: 22px; }
.search-head {
  flex: none;
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 12px 12px;
  background: #fff;
  border-bottom: 1px solid var(--line);
}
.sh-back { width: 36px; height: 36px; display: grid; place-items: center; color: var(--ink-700); flex: none; }
.sh-input {
  flex: 1;
  height: 42px;
  border-radius: var(--r-lg);
  background: var(--bg);
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 0 13px;
  font-size: var(--t-base);
  color: var(--ink-400);
}
.sh-input .ic { color: var(--ink-400); }
.sh-input input {
  flex: 1;
  min-width: 0;
  border: 0;
  outline: 0;
  background: none;
  font-size: var(--t-base);
  font-family: inherit;
  color: var(--ink-900);
}
.sh-input input::placeholder { color: var(--ink-400); }
.sh-input input::-webkit-search-cancel-button { display: none; }
.sh-clear {
  width: 22px; height: 22px;
  border-radius: 50%;
  background: var(--ink-300);
  color: #fff;
  display: none;
  place-items: center;
  flex: none;
}
.sh-clear .ic { width: 13px; height: 13px; stroke-width: 2.6; color: #fff; }
.sh-input.has-val .sh-clear { display: grid; }
.sh-do { font-size: var(--t-base); font-weight: 700; color: var(--blue-700); flex: none; padding: 0 4px; }

/* ⛔ 2026-10-04（2C）：原「范围三选一」分段轨道（.sscope*）已移除 ——
   找活 / 需求改成各自独立的结果页，不再是搜索页里的页签。 */

/* 搜索页默认态的类型入口：.kind-cell 原本是给深色 Hero 用的白玻璃卡（白字），
   直接搬到浅色搜索页会白底白字 —— 这里覆写成浅色卡。
   ⚠️ .kind-3 必须带 .kind-4 一起写：mobile.market.css 在 mobile.css 之后加载，
      单写 .kind-3（同权重）会被 .kind-4 的四列覆盖。 */
.kind-4.kind-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.screen-search .kind-cell {
  background: #fff;
  border-color: var(--line);
  color: var(--ink-900);
}
.screen-search .kind-cell .ic { color: var(--blue-700); }
.screen-search .kind-cell small { color: var(--ink-400); }

/* 无历史 */
.sh-none {
  font-size: var(--t-sm);
  color: var(--ink-400);
  padding: 2px 2px 6px;
}

/* 结果态 */
.sr-head {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 2px 2px 12px;
}
.sr-count { font-size: var(--t-base); color: var(--ink-700); }
.sr-count b { color: var(--blue-700); font-family: var(--font-num); font-size: var(--t-lg); font-weight: 800; }
.sr-head .chip { margin-left: auto; }
.sr-sug {
  display: flex;
  align-items: center;
  gap: 7px;
  overflow-x: auto;
  padding-bottom: 12px;
  scrollbar-width: none;
}
.sr-sug::-webkit-scrollbar { display: none; }
.sr-sug > .ic { color: var(--ink-400); flex: none; }
.sr-sug button {
  flex: none;
  height: 30px;
  padding: 0 12px;
  border-radius: var(--r-pill);
  background: #fff;
  border: 1px solid var(--line);
  font-size: var(--t-sm);
  font-weight: 600;
  color: var(--blue-700);
  white-space: nowrap;
}
.sr-sug button:active { background: var(--blue-50); border-color: var(--blue-200); }
.sr-filter {
  display: flex;
  align-items: center;
  gap: 7px;
  flex-wrap: wrap;
  padding-bottom: 12px;
}
.sr-fl { font-size: var(--t-sm); color: var(--ink-500); }

/* 空结果 */
.search-empty {
  padding: 44px 22px 30px;
  text-align: center;
}
.se-art {
  width: 78px; height: 78px;
  border-radius: 50%;
  background: var(--blue-50);
  color: var(--blue-400);
  display: grid;
  place-items: center;
  margin: 0 auto 18px;
}
.search-empty h3 { font-size: var(--t-md); font-weight: 800; color: var(--ink-900); }
.search-empty p {
  font-size: var(--t-base);
  color: var(--ink-500);
  line-height: 1.7;
  margin-top: 10px;
}
.se-acts {
  display: flex;
  gap: 10px;
  justify-content: center;
  margin-top: 20px;
}
.se-sug {
  margin-top: 26px;
  padding-top: 18px;
  border-top: 1px dashed var(--line);
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  justify-content: center;
}
.se-sug span { font-size: var(--t-sm); color: var(--ink-500); width: 100%; }
.se-sug button {
  height: 32px;
  padding: 0 13px;
  border-radius: var(--r-pill);
  background: #fff;
  border: 1px solid var(--line);
  font-size: var(--t-sm);
  font-weight: 600;
  color: var(--blue-700);
}
.se-sug button:active { background: var(--blue-50); }

.word-wrap { display: flex; flex-wrap: wrap; gap: 8px; }
.word {
  height: 36px;
  padding: 0 13px;
  border-radius: var(--r-md);
  background: #fff;
  border: 1px solid var(--line);
  font-size: var(--t-sm);
  color: var(--ink-700);
  font-weight: 600;
  display: inline-flex;
  align-items: center;
  gap: 4px;
}
.word:active { background: var(--blue-50); border-color: var(--blue-200); }
.word .ic { color: var(--ink-400); }

.hot-list {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: var(--r-xl);
  overflow: hidden;
}
.hot-item {
  display: flex;
  align-items: center;
  gap: 11px;
  width: 100%;
  padding: 13px 14px;
  font-size: var(--t-base);
  color: var(--ink-800);
  font-weight: 600;
}
.hot-item + .hot-item { border-top: 1px solid var(--line-2); }
.hi-rank {
  width: 22px;
  font-size: var(--t-sm);
  font-weight: 800;
  color: var(--ink-400);
  font-family: var(--font-num);
  text-align: center;
  flex: none;
}
.hi-rank.top { color: var(--danger); }
.hi-tx { flex: 1; text-align: left; }

/* ==========================================================================
   岗位详情
   ========================================================================== */
.screen-detail .page-body { padding-top: 0; }
.dt-head {
  position: relative;
  background: linear-gradient(168deg, var(--blue-800), var(--blue-700));
  color: #fff;
  border-radius: 0 0 var(--r-2xl) var(--r-2xl);
  padding: 18px 16px 20px;
  margin: 0 -14px 14px;
  overflow: hidden;
}
.dt-head::after {
  content: "";
  position: absolute;
  inset: 0;
  background-image: repeating-linear-gradient(
    -55deg, rgba(255, 255, 255, .04) 0 1px, transparent 1px 10px);
  pointer-events: none;
}
.dt-head > * { position: relative; z-index: 1; }
.dt-head .stamp { border-radius: 0 0 0 var(--r-lg); top: 0; right: 0; }
.dt-ind { background: rgba(255, 255, 255, .16); color: #fff; }
.dt-name {
  font-size: 23px;
  font-weight: 900;
  letter-spacing: .2px;
  margin-top: 12px;
  line-height: 1.3;
  padding-right: 10px;
}
.dt-pay {
  display: flex;
  align-items: baseline;
  gap: 8px;
  margin-top: 10px;
}
.dt-pay .salary { color: var(--gold-300); }
.dt-pay-sub {
  font-size: var(--t-sm);
  color: rgba(255, 255, 255, .7);
}
.dt-tags { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 12px; }
.dt-tags .chip { background: rgba(255, 255, 255, .16); color: #fff; }
.dt-tags .chip-success { background: rgba(23, 138, 76, .34); color: #C6F0D8; }
.dt-tags .chip-warn { background: rgba(217, 130, 0, .3); color: #FFDCA8; }
.dt-tags .chip-gold { background: rgba(222, 180, 79, .26); color: var(--gold-200); }

.dt-quick {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 4px;
  margin-top: 16px;
  padding-top: 14px;
  border-top: 1px solid rgba(255, 255, 255, .16);
}
.dq-cell { text-align: center; }
.dq-cell b {
  display: block;
  font-size: var(--t-base);
  font-weight: 800;
  color: #fff;
}
.dq-cell small {
  display: block;
  font-size: 11px;
  color: rgba(255, 255, 255, .6);
  margin-top: 3px;
}

/* 紧凑章节头 */
.sec-head.tight { padding: 0 0 11px; }
.card > .sec-head.tight:first-child { padding-top: 0; }

.prose-p {
  font-size: var(--t-base);
  color: var(--ink-700);
  line-height: 1.75;
}
.prose { display: flex; flex-direction: column; gap: 9px; }
.prose li {
  position: relative;
  padding-left: 17px;
  font-size: var(--t-base);
  color: var(--ink-700);
  line-height: 1.7;
}
.prose li::before {
  content: "";
  position: absolute;
  left: 2px; top: 10px;
  width: 6px; height: 6px;
  border-radius: 2px;
  background: var(--blue-300);
}
.prose-num { counter-reset: pn; }
.prose-num li { padding-left: 25px; }
.prose-num li::before {
  counter-increment: pn;
  content: counter(pn);
  left: 0; top: 4px;
  width: 17px; height: 17px;
  border-radius: var(--r-xs);
  background: var(--blue-100);
  color: var(--blue-700);
  font-size: 11px;
  font-weight: 800;
  display: grid;
  place-items: center;
  line-height: 1;
}

/* 证书要求 */
.dt-cert { border-left: 3px solid var(--danger); }
.dt-cert-list { display: flex; flex-wrap: wrap; gap: 7px; }
.cert-req {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  height: 32px;
  padding: 0 11px;
  border-radius: var(--r-md);
  background: var(--warn-100);
  border: 1px solid #F5D9A8;
  color: #8A5300;
  font-size: var(--t-sm);
  font-weight: 700;
}
.dt-cert-note {
  font-size: var(--t-sm);
  color: var(--ink-500);
  line-height: 1.6;
  margin-top: 11px;
}
.dt-cert-note button { color: var(--blue-700); font-weight: 700; font-size: var(--t-sm); }

/* 薪资表 */
.pay-table {
  border-radius: var(--r-lg);
  background: var(--gold-50);
  border: 1px solid var(--gold-200);
  padding: 4px 12px;
  margin-bottom: 13px;
}
.pt-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 9px 0;
  font-size: var(--t-sm);
}
.pt-row + .pt-row { border-top: 1px dashed var(--gold-200); }
.pt-row span { color: var(--ink-500); }
.pt-row b { color: var(--gold-700); font-weight: 800; }

/* 职业健康 */
.card-health {
  background: linear-gradient(150deg, #F3FBF6, #EAF7EF);
  border-color: #CBE9D8;
}
.card-health .sec-head h3 { color: var(--success-600); }
.card-health .sec-head .bar { background: var(--success); }
.health-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 9px;
}
.hg-cell {
  background: rgba(255, 255, 255, .78);
  border-radius: var(--r-lg);
  padding: 11px;
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.hg-cell .ic { width: 18px; height: 18px; color: var(--success); margin-bottom: 4px; }
.hg-cell b { font-size: var(--t-sm); font-weight: 800; color: #0F5C36; }
.hg-cell small { font-size: 11px; color: #4A8163; }

/* 企业信息 */
.co-head { display: flex; align-items: center; gap: 11px; }
.co-head .logo { width: 46px; height: 46px; border-radius: var(--r-lg); font-size: var(--t-base); }
.ch-main { flex: 1; min-width: 0; }
.ch-name {
  font-size: var(--t-md);
  font-weight: 800;
  color: var(--ink-900);
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
}
.ch-meta { font-size: var(--t-sm); color: var(--ink-500); margin-top: 5px; line-height: 1.5; }
.co-stats {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 4px;
  margin-top: 14px;
  padding: 12px 0;
  border-top: 1px dashed var(--line);
  border-bottom: 1px dashed var(--line);
}
.cs-cell { text-align: center; }
.cs-cell b {
  display: block;
  font-size: var(--t-lg);
  font-weight: 800;
  color: var(--blue-700);
  font-family: var(--font-num);
}
.cs-cell small { display: block; font-size: 11px; color: var(--ink-400); margin-top: 2px; }
.co-lic {
  display: flex;
  align-items: center;
  gap: 5px;
  font-size: var(--t-xs);
  color: var(--success-600);
  font-weight: 600;
  margin-top: 11px;
}

/* 联系方式 */
.card-contact { border: 1.5px solid var(--gold-200); background: #FFFDF7; }
.ct-lock { padding-top: 2px; }
.ctl-mask {
  font-size: 25px;
  font-weight: 800;
  color: var(--ink-300);
  letter-spacing: 2px;
  font-family: var(--font-num);
  text-align: center;
  padding: 12px 0 10px;
  background: repeating-linear-gradient(45deg, #fff, #fff 8px, #FAFBFD 8px, #FAFBFD 16px);
  border-radius: var(--r-lg);
  border: 1px dashed var(--line);
}
.ct-lock p {
  font-size: var(--t-sm);
  color: var(--ink-500);
  line-height: 1.6;
  margin-top: 10px;
  text-align: center;
}
.ctl-price {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 12px;
  padding: 11px 12px;
  border-radius: var(--r-lg);
  background: var(--gold-50);
}
.ctl-price span { font-size: var(--t-sm); color: var(--ink-600); }
.ctl-price .ctl-bal { margin-left: auto; color: var(--ink-400); font-size: var(--t-xs); }

.ct-open { display: flex; flex-direction: column; gap: 2px; }
.ct-row {
  display: flex;
  align-items: center;
  gap: 9px;
  padding: 12px 0;
  font-size: var(--t-base);
  color: var(--ink-800);
}
.ct-row + .ct-row { border-top: 1px dashed var(--line); }
.ct-row .ic { color: var(--blue-600); }
.ct-row b { font-weight: 800; letter-spacing: .5px; font-family: var(--font-num); }
.ct-row .chip { margin-left: auto; }

/* 地图占位 */
.dt-map {
  position: relative;
  height: 132px;
  border-radius: var(--r-lg);
  overflow: hidden;
  background: linear-gradient(150deg, #E8EFF8, #F4F8FC);
}
.dm-grid {
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(rgba(15, 58, 128, .07) 1px, transparent 1px),
    linear-gradient(90deg, rgba(15, 58, 128, .07) 1px, transparent 1px);
  background-size: 26px 26px;
}
.dm-grid::after {
  content: "";
  position: absolute;
  left: -10%; top: 58%;
  width: 130%; height: 9px;
  background: rgba(15, 58, 128, .1);
  transform: rotate(-7deg);
}
.dm-pin {
  position: absolute;
  left: 50%; top: 46%;
  transform: translate(-50%, -50%);
  width: 34px; height: 34px;
  border-radius: 50% 50% 50% 4px;
  background: var(--blue-700);
  color: #fff;
  display: grid;
  place-items: center;
  box-shadow: 0 6px 16px rgba(15, 58, 128, .34);
  rotate: -45deg;
}
.dm-pin .ic { rotate: 45deg; }
.dm-addr {
  position: absolute;
  left: 12px; bottom: 11px;
  font-size: var(--t-sm);
  font-weight: 700;
  color: var(--blue-800);
  background: rgba(255, 255, 255, .92);
  padding: 5px 10px;
  border-radius: var(--r-sm);
}
.dt-addr {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 12px;
  font-size: var(--t-sm);
  color: var(--ink-600);
}
.dt-addr .ic { color: var(--blue-600); flex: none; }
.dt-addr span { flex: 1; }

.dt-end {
  text-align: center;
  padding: 22px 0 6px;
  font-size: var(--t-xs);
  color: var(--ink-400);
  line-height: 1.7;
}
.dt-end button {
  color: var(--danger);
  font-weight: 700;
  font-size: var(--t-xs);
  display: inline-flex;
  align-items: center;
  gap: 3px;
  margin-top: 6px;
}

/* 底部操作条里的收藏态 */
.actionbar .ab-icon.on { color: var(--gold-600); }
.actionbar .ab-icon.on .ic { fill: var(--gold-500); stroke: var(--gold-600); }
.ic-wrap { display: grid; place-items: center; }

/* ==========================================================================
   解锁弹层
   ========================================================================== */
.sheet-mask {
  position: absolute;
  inset: 0;
  background: rgba(6, 22, 49, .46);
  z-index: var(--z-mask);
  animation: fadeIn .18s ease;
}
.sheet {
  position: absolute;
  left: 0; right: 0; bottom: 0;
  z-index: var(--z-modal);
  background: #fff;
  border-radius: var(--r-2xl) var(--r-2xl) 0 0;
  padding: 8px 16px calc(16px + env(safe-area-inset-bottom, 0px));
  box-shadow: 0 -10px 34px rgba(6, 22, 49, .22);
  animation: sheetUp .24s cubic-bezier(.2, .8, .3, 1);
}
.sheet-grab {
  width: 38px; height: 4px;
  border-radius: var(--r-pill);
  background: var(--line);
  margin: 0 auto 12px;
}
@keyframes sheetUp { from { transform: translateY(100%); } to { transform: translateY(0); } }
@keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } }

/* 「我的」页昵称后面的「改昵称」小按钮 */
.pf-name-edit {
  display: inline-flex; align-items: center; justify-content: center;
  margin-left: 4px; padding: 2px;
  color: var(--ink-400); background: none; border: 0; cursor: pointer;
}
.pf-name-edit .ic { width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-width: 1.8; }

/* 修改昵称弹层的输入框 */
.sn-input {
  width: 100%; height: 44px; margin: 6px 0 12px; padding: 0 12px;
  border: 1.5px solid var(--line-2); border-radius: var(--r-pill);
  font-size: var(--t-base); color: var(--ink-800); background: #fff; outline: none;
}
.sn-input:focus { border-color: var(--gold-500); }

/* 表单字段（label.fld）：小标签在上、输入框在下占满。
   ⚠️ 移动端此前一直**没有** .fld 样式，各弹层里靠浏览器默认 inline 排 ——
      标签和输入框挤成一行。实名认证页改为页面内直填后首次在「页面」上用，
      内联横排直接破版，这里补上通用定义（顺带修好邀约等弹层的字段排布）。 */
.fld { display: block; margin: 14px 0 0; }
.fld:first-child { margin-top: 0; }
.fld > span { display: block; margin-bottom: 6px; font-size: var(--t-xs); font-weight: 500; color: var(--ink-500); }
.fld > input,
.fld > textarea {
  display: block; width: 100%; padding: 0 12px;
  border: 1.5px solid var(--line-2); border-radius: var(--r-md);
  background: #fff; font-size: var(--t-base); color: var(--ink-800); outline: none;
}
.fld > input { height: 44px; font-weight: 600; }
.fld > textarea { padding: 10px 12px; font-family: inherit; line-height: 1.5; resize: none; }
.fld > input:focus,
.fld > textarea:focus { border-color: var(--gold-500); }
.fld > input::placeholder,
.fld > textarea::placeholder { font-weight: 400; color: var(--ink-400); letter-spacing: 0; }

.su-head {
  display: flex;
  align-items: center;
  gap: 11px;
  padding-bottom: 14px;
}
.su-ic {
  width: 44px; height: 44px;
  border-radius: var(--r-lg);
  background: var(--gold-100);
  color: var(--gold-700);
  display: grid;
  place-items: center;
  flex: none;
}
.su-head h3 { font-size: var(--t-lg); font-weight: 800; }
.su-head p { font-size: var(--t-sm); color: var(--ink-500); margin-top: 3px; }
.su-close {
  margin-left: auto;
  width: 32px; height: 32px;
  border-radius: var(--r-md);
  display: grid;
  place-items: center;
  color: var(--ink-400);
  flex: none;
}
.su-job {
  padding: 12px;
  border-radius: var(--r-lg);
  background: var(--bg);
}
.sj-name { font-size: var(--t-md); font-weight: 800; color: var(--ink-900); }
.sj-co { font-size: var(--t-sm); color: var(--ink-500); margin-top: 4px; }
.su-list { padding: 14px 2px 4px; display: flex; flex-direction: column; gap: 9px; }
.su-list li {
  display: flex;
  align-items: center;
  gap: 7px;
  font-size: var(--t-sm);
  color: var(--ink-700);
}
.su-list .ic { color: var(--success); }

/* --------------------------------------------------------------------------
   解锁三内容项（在线沟通 / 手机号码 / 邮箱，2026-10-15）
   一行一项：图标 + 名称/说明 + 右侧操作（未解锁=积分按钮，已解锁=号码/邮箱/去沟通，
   运营关掉=「暂未开放」）。.hl 是"从「沟通」被拦下来"时重点指出的那一项。
   -------------------------------------------------------------------------- */
.su-items {
  margin-top: 12px;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.su-item {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 11px 12px;
  border-radius: var(--r-lg);
  border: 1px solid var(--line-2);
  background: #fff;
}
.su-item.on { background: var(--success-50, #F1F8F2); border-color: var(--success-200, #CFE6D4); }
.su-item.hl { border-color: var(--gold-400, #E0B24A); box-shadow: 0 0 0 2px var(--gold-50); }
.su-i {
  width: 30px; height: 30px;
  border-radius: var(--r-md);
  display: grid;
  place-items: center;
  background: var(--blue-50);
  color: var(--blue-600);
  flex: none;
}
.su-item.on .su-i { background: var(--success-100, #E3F1E7); color: var(--success); }
.su-t { flex: 1; min-width: 0; }
.su-t b { display: block; font-size: var(--t-sm); font-weight: 800; color: var(--ink-900); }
.su-t small { display: block; font-size: var(--t-xs); color: var(--ink-500); margin-top: 2px; line-height: 1.45; }
.su-a { flex: none; max-width: 46%; text-align: right; }
.su-buy {
  height: 30px;
  padding: 0 12px;
  border-radius: 15px;
  font-size: var(--t-sm);
  font-weight: 800;
  color: var(--ink-900);
  background: var(--gold-100);
  border: 1px solid var(--gold-300);
}
.su-buy.on { background: var(--gold-400, #E0B24A); color: #fff; }
.su-go {
  height: 30px;
  padding: 0 12px;
  border-radius: 15px;
  font-size: var(--t-sm);
  font-weight: 800;
  color: #fff;
  background: var(--blue-600);
}
.su-val {
  font-size: var(--t-sm);
  font-weight: 800;
  color: var(--ink-900);
  word-break: break-all;
}
.su-tel { color: var(--blue-700); text-decoration: underline; }
.su-off { font-size: var(--t-xs); color: var(--ink-400); font-style: normal; }
/* 2026-10-15 整包口径：三行只显示状态（待解锁 / 已解锁 / 暂不支持），
   购买按钮收到弹层底部一颗 —— 这里补两个状态标。 */
.su-wait { font-size: var(--t-xs); color: var(--ink-400); font-style: normal; }
.su-ok { font-size: var(--t-xs); color: var(--success, #2E7D46); font-weight: 800; font-style: normal; }
.su-pay {
  display: flex;
  gap: 10px;
  margin-top: 12px;
}
.sp-cell {
  flex: 1;
  padding: 11px 12px;
  border-radius: var(--r-lg);
  background: var(--gold-50);
  border: 1px solid var(--gold-200);
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.sp-cell span { font-size: var(--t-sm); color: var(--ink-600); }
.sp-cell b { font-size: var(--t-md); font-weight: 800; color: var(--ink-900); }
.su-note {
  display: flex;
  align-items: flex-start;
  gap: 5px;
  font-size: var(--t-xs);
  color: var(--ink-500);
  line-height: 1.55;
  margin-top: 11px;
}
.su-note .ic { color: var(--success); flex: none; margin-top: 1px; }
.su-note-danger { color: var(--danger-600); }
.su-note-danger .ic { color: var(--danger); }
.su-actions { margin-top: 14px; }
.su-cancel {
  width: 100%;
  height: 44px;
  font-size: var(--t-base);
  color: var(--ink-500);
  font-weight: 600;
  margin-top: 4px;
}

/* ==========================================================================
   消息 / 会话
   ========================================================================== */
.tab-row {
  flex: none;
  display: flex;
  gap: 6px;
  padding: 10px 14px;
  background: #fff;
  border-bottom: 1px solid var(--line);
  overflow-x: auto;
  scrollbar-width: none;
  position: sticky;
  top: 0;
  z-index: var(--z-sticky);
}
.tab-row::-webkit-scrollbar { display: none; }
.tab-cell {
  height: 32px;
  padding: 0 13px;
  border-radius: var(--r-pill);
  background: var(--line-2);
  font-size: var(--t-sm);
  font-weight: 600;
  color: var(--ink-500);
  display: inline-flex;
  align-items: center;
  gap: 5px;
  flex: none;
}
.tab-cell em {
  font-style: normal;
  font-size: 11px;
  font-weight: 800;
  color: var(--ink-400);
  font-family: var(--font-num);
}
.tab-cell.on { background: var(--blue-700); color: #fff; }
.tab-cell.on em { color: rgba(255, 255, 255, .7); }

.card-invite {
  border-left: 3px solid var(--gold-500);
  margin-top: 14px;
}
.ci-head {
  display: flex;
  align-items: center;
  gap: 7px;
  padding-bottom: 11px;
  border-bottom: 1px dashed var(--line);
}
.ci-head .ic { color: var(--gold-600); }
.ci-head h3 { flex: 1; font-size: var(--t-md); font-weight: 800; color: var(--ink-900); }
.ci-body { padding: 12px 0 2px; }
.cib-job { font-size: var(--t-md); font-weight: 800; color: var(--blue-700); }
.cib-co { font-size: var(--t-sm); color: var(--ink-600); margin-top: 4px; }
.cib-rows {
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin-top: 11px;
}
.cib-rows div {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: var(--t-sm);
  color: var(--ink-700);
  font-weight: 600;
}
.cib-rows .ic { color: var(--ink-400); }
.ci-actions { display: flex; gap: 9px; margin-top: 14px; }

.msg-list {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: var(--r-xl);
  overflow: hidden;
}
.msg-item {
  display: flex;
  align-items: flex-start;
  gap: 11px;
  width: 100%;
  padding: 14px;
  text-align: left;
  position: relative;
}
.msg-item + .msg-item { border-top: 1px solid var(--line-2); }
.msg-item:active { background: var(--blue-50); }
.avatar {
  border-radius: 50%;
  display: grid;
  place-items: center;
  color: #fff;
  font-weight: 800;
  flex: none;
  letter-spacing: -.3px;
}
.avatar.a { background: linear-gradient(140deg, #2E68BC, #0F3A80); }
.avatar.b { background: linear-gradient(140deg, #14A08F, #0A6B60); }
.avatar.c { background: linear-gradient(140deg, #C9992B, #8A6414); }
.avatar.d { background: linear-gradient(140deg, #6B7C93, #3A4A60); }
.avatar.e { background: linear-gradient(140deg, #8A88EE, #4338B8); }
.avatar.f { background: linear-gradient(140deg, #D2603A, #9C3C18); }

.mi-main { flex: 1; min-width: 0; }
.mi-top { display: flex; align-items: baseline; gap: 6px; }
.mi-name {
  flex: 1;
  min-width: 0;
  font-size: var(--t-base);
  font-weight: 800;
  color: var(--ink-900);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.mi-time { font-size: 11px; color: var(--ink-400); flex: none; }
.mi-msg {
  font-size: var(--t-sm);
  color: var(--ink-600);
  line-height: 1.55;
  margin-top: 5px;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.mi-job {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-top: 8px;
  padding: 7px 10px;
  border-radius: var(--r-md);
  background: var(--blue-50);
  font-size: var(--t-sm);
  color: var(--ink-700);
}
.mi-job .ic { color: var(--blue-600); }
.mi-job span { flex: 1; font-weight: 600; }
.mi-tags { display: flex; gap: 5px; margin-top: 8px; flex-wrap: wrap; }
.mi-dot {
  position: absolute;
  right: 14px; top: 14px;
  min-width: 19px; height: 19px;
  padding: 0 5px;
  border-radius: var(--r-pill);
  background: var(--danger);
  color: #fff;
  font-size: 11px;
  font-weight: 800;
  display: grid;
  place-items: center;
  font-family: var(--font-num);
}
/* ⚠️ 未读红点是**绝对定位**钉在右上角的（`right:14px; top:14px`），
   而卡片标题行的最右端放的正是「时间」—— 不留位置的话，只要有一条未读，
   时间就被红点整个盖住（用户看到的是"这行没有时间"，其实是被压住了）。
   26px = 红点宽 19px + 6px 呼吸；只在有红点的行上生效（`mi-hdot`）。 */
.msg-item.mi-hdot .mi-top,
.mo-row.mi-hdot .mo-top { padding-right: 26px; }
.msg-foot {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  font-size: var(--t-xs);
  color: var(--ink-400);
  padding: 20px 0 6px;
}
.msg-foot .ic { color: var(--ink-300); }

/* ---- M3 官方号会话流（2026-10-05 落码）：消息页「官方 · 平台通知」区 ----
   在线客服 / 系统通知 / 平台公告以官方账号消息行的形式排在会话列表前面。 */
.mo-card {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: var(--r-xl);
  overflow: hidden;
}
.mo-row {
  display: flex;
  align-items: center;
  gap: 11px;
  width: 100%;
  padding: 12px 14px;
  text-align: left;
  position: relative;
}
.mo-row + .mo-row { border-top: 1px solid var(--line-2); }
.mo-row:active { background: var(--blue-50); }
.mo-av {
  width: 44px;
  height: 44px;
  border-radius: 12px;
  display: grid;
  place-items: center;
  color: #fff;
  flex: none;
  position: relative;
}
.mo-av .ic { width: 21px; height: 21px; }
.mo-av--gold { background: linear-gradient(135deg, #F3D488, #C9992B); color: #3A2A05; }
/* 官方 V 角标（仅在线客服行使用） */
.mo-v {
  position: absolute;
  right: -4px;
  bottom: -4px;
  width: 15px;
  height: 15px;
  border-radius: 50%;
  background: var(--gold-600);
  border: 2px solid #fff;
  color: #fff;
  font-size: 8px;
  font-weight: 900;
  font-style: normal;
  display: grid;
  place-items: center;
}
.mo-main { flex: 1; min-width: 0; }
.mo-top { display: flex; align-items: baseline; gap: 6px; }
.mo-top b {
  flex: 1;
  min-width: 0;
  font-size: var(--t-base);
  font-weight: 800;
  color: var(--ink-900);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
/* 类型徽标：更新(蓝) / 官方(金) / 热·提醒(红) */
.mo-k {
  flex: none;
  font-style: normal;
  font-size: 10px;
  font-weight: 800;
  border-radius: 4px;
  padding: 1.5px 6px;
}
.mo-k1 { color: var(--blue-600); background: var(--blue-50); }
.mo-k2 { color: var(--gold-700); background: var(--gold-100); }
.mo-k3 { color: var(--danger); background: #FDECEA; }
.mo-tm { flex: none; font-size: 11px; color: var(--ink-400); }
.mo-msg {
  display: block;
  margin-top: 4px;
  font-size: var(--t-sm);
  color: var(--ink-600);
  line-height: 1.5;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
/* 客服行右侧金钮（与设计稿 W1G 金一致） */
.mo-ent {
  display: flex;
  align-items: center;
  gap: 1px;
  flex: none;
  font-size: 11px;
  font-weight: 800;
  color: #3A2A05;
  background: linear-gradient(135deg, #F3D488, #C9992B);
  border-radius: 7px;
  padding: 6px 9px;
}
.mo-ent .ic { width: 12px; height: 12px; }

/* 会话 */
.screen-chat .app-body { background: var(--bg); }
/* ⛔ 聊天页原来是「内容多高就多高」：消息少时 screen 撑不满，输入框悬在半空，
   下面一大块空白。消息区吃掉剩余高度，快捷短语与输入条才真正贴底。
   滚动仍由外层 .app-body 负责，这里只是把高度撑开，不影响长会话滚动。 */
.chat-body { padding: 14px; }
.screen-chat > .chat-body { flex: 1 1 auto; padding-bottom: 18px; }
/* 没有消息时空态居中，别吊在安全提示条正下方 */
.screen-chat > .chat-body > .empty { margin: auto 0; }
.chat-tip {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  font-size: var(--t-xs);
  color: var(--ink-500);
  background: rgba(15, 58, 128, .06);
  padding: 7px 12px;
  border-radius: var(--r-pill);
  width: fit-content;
  margin: 0 auto 14px;
}
.chat-day {
  text-align: center;
  font-size: var(--t-xs);
  color: var(--ink-400);
  margin: 6px 0 14px;
}
.chat-row {
  display: flex;
  align-items: flex-start;
  gap: 9px;
  margin-bottom: 16px;
}
.chat-row.me { flex-direction: row-reverse; }
.cr-body { max-width: 76%; }
.bubble {
  padding: 11px 14px;
  border-radius: var(--r-xl);
  border-top-left-radius: var(--r-xs);
  background: #fff;
  font-size: var(--t-base);
  color: var(--ink-800);
  line-height: 1.6;
  box-shadow: var(--sh-1);
}
.chat-row.me .bubble {
  background: var(--blue-700);
  color: #fff;
  border-radius: var(--r-xl);
  border-top-right-radius: var(--r-xs);
}
.cr-time {
  font-size: 11px;
  color: var(--ink-400);
  margin-top: 5px;
  padding: 0 4px;
}
.chat-row.me .cr-time { text-align: right; }

.bubble-card {
  margin-top: 9px;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: var(--r-xl);
  padding: 13px;
  box-shadow: var(--sh-1);
}
.bc-head {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: var(--t-base);
  font-weight: 800;
  color: var(--gold-700);
  padding-bottom: 10px;
  border-bottom: 1px dashed var(--line);
}
.bc-row {
  display: flex;
  gap: 8px;
  padding: 7px 0;
  font-size: var(--t-sm);
}
.bc-row span { color: var(--ink-500); width: 54px; flex: none; }
.bc-row b { color: var(--ink-900); font-weight: 700; flex: 1; }
.bc-actions { display: flex; gap: 8px; margin-top: 11px; }
.bubble-loc {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  margin-top: 8px;
  padding: 8px 11px;
  border-radius: var(--r-md);
  background: var(--blue-50);
  font-size: var(--t-xs);
  color: var(--blue-700);
  font-weight: 600;
}
.chat-bar { gap: 6px; }
.chat-input {
  flex: 1;
  min-width: 0;
  height: 42px;
  border: 1.5px solid var(--line);
  border-radius: var(--r-lg);
  background: var(--bg);
  padding: 0 14px;
  font-family: inherit;
  font-size: var(--t-base);
  color: var(--ink-900);
  outline: 0;
  transition: border-color .15s, background-color .15s;
}
.chat-input::placeholder { color: var(--ink-400); }
.chat-input:focus { background: #fff; border-color: var(--blue-500); }

/* 快捷短语 */
.chat-quick {
  flex: none;
  display: flex;
  gap: 8px;
  overflow-x: auto;
  padding: 9px 14px;
  background: #fff;
  border-top: 1px solid var(--line-2);
  scrollbar-width: none;
}
.chat-quick::-webkit-scrollbar { display: none; }
.cq-chip {
  flex: none;
  height: 32px;
  padding: 0 13px;
  border-radius: var(--r-pill);
  background: var(--blue-50);
  border: 1px solid var(--blue-100);
  color: var(--blue-700);
  font-size: var(--t-sm);
  font-weight: 600;
  white-space: nowrap;
}
.cq-chip:active { background: var(--blue-100); }

/* 对方新消息的入场 */
.chat-row.reply .bubble { animation: bubIn .26s ease-out; }
@keyframes bubIn {
  from { opacity: 0; transform: translateY(6px); }
  to { opacity: 1; transform: none; }
}

/* 正在输入 */
.chat-typing {
  align-self: flex-start;
  margin: 6px 0 2px 48px;
  font-size: var(--t-xs);
  color: var(--ink-400);
}

/* ==========================================================================
   个人中心
   ========================================================================== */
.pf-head {
  background: linear-gradient(168deg, var(--blue-800), var(--blue-700));
  color: #fff;
  padding: 4px 16px 18px;
  position: relative;
  overflow: hidden;
}
.pf-head::after {
  content: "";
  position: absolute;
  inset: 0;
  background-image: repeating-linear-gradient(
    -55deg, rgba(255, 255, 255, .035) 0 1px, transparent 1px 10px);
  pointer-events: none;
}
.pf-head > * { position: relative; z-index: 1; }

.pf-top {
  display: flex;
  align-items: center;
  padding: 2px 0 16px;
}
.pf-title { font-size: var(--t-lg); font-weight: 800; letter-spacing: .5px; }
/* 顶栏右侧：工人端 2026-10-03 起只剩「企业」切换按钮（消息铃铛已移除 ——
   未读在底部「消息」Tab 上有红点，同一个数不挂两处）。
   ⚠️ `.pf-set` **不能删**：企业端「我的」页右上角还在用它（mobile.ent.js → entSet），
      两张屏共用这一张样式表，删了企业端那颗设置按钮就没皮了。
      只有 .pf-bell / .pf-dot 是真没人用了（消息入口只剩底部 Tab）才一并清掉。 */
.pf-top-act { margin-left: auto; display: inline-flex; align-items: center; gap: 8px; }
.pf-set {
  margin-left: 0;
  height: 32px;
  padding: 0 11px;
  border-radius: var(--r-pill);
  background: rgba(255, 255, 255, .14);
  color: #fff;
  font-size: var(--t-sm);
  font-weight: 600;
  display: inline-flex;
  align-items: center;
  gap: 4px;
}
.pf-user { display: flex; align-items: center; gap: 13px; }
/* ⚠️ 2026-10-03：`.pf-idbar*` 整组删除 —— 「我的」页头像底下那条身份栏
   （当前身份：求职者 + 切换按钮）已撤，样式不留。 */
/* 自选头像：有图铺满圆形，右下角挂一个相机角标表示「可更换」 */
.pf-av { position: relative; }
/* ⚠️ 2026-10-15：overflow 由 hidden 改成 visible —— 头像右上要骑一枚会员角标
   （.pf-av-vip），父级裁切会把角标切掉一半。圆形改由 img 自己 border-radius:50% 收口。 */
.pf-av.has-img { overflow: visible; padding: 0; }
.pf-av.has-img img { border-radius: 50%; }
.pf-av.has-img img { width: 100%; height: 100%; object-fit: cover; display: block; }
/* 通用头像框的自选头像（window.avatarImg）：与 .pf-av 同一口径 —— 有图铺满圆形。
   ⚠️ 缺这条规则时，img 会按原图尺寸撑破 .avatar 那个圆（或压成方的），
      「我的简历」页就会看到一个巨大的方图盖住整行。 */
.avatar.has-img { overflow: hidden; padding: 0; }
.avatar.has-img img { display: block; width: 100%; height: 100%; object-fit: cover; border-radius: 50%; }
/* 相机角标：毛玻璃圆（方案二 · 静谧光环）—— 半透白 + blur，融进深蓝头图不突兀 */
.pf-av > .ic, .pf-av > svg {
  position: absolute; right: -1px; bottom: -1px;
  width: 24px; height: 24px; padding: 5px;
  border-radius: 50%;
  background: rgba(255, 255, 255, .22);
  -webkit-backdrop-filter: blur(4px);
  backdrop-filter: blur(4px);
  border: 1.5px solid rgba(255, 255, 255, .65);
  color: #fff;
  box-shadow: 0 2px 6px rgba(0, 0, 0, .28);
  z-index: 2;
}

/* 证件照 / 证书图片选择位（实名弹层 · 证书弹层共用） */
.vf-pick, .vf-pick2 { display: flex; gap: 10px; margin-top: 12px; }
.vf-pick-b {
  flex: 1; min-height: 94px;
  border: 1px dashed #c9cfd8; border-radius: 10px;
  background: #f7f8fa; color: #8a93a0;
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px;
  font-size: 12px; overflow: hidden; padding: 0;
}
.vf-pick-b .ic, .vf-pick-b svg { width: 22px; height: 22px; }
.vf-pick-b.on { border-style: solid; border-color: #2f6fd0; padding: 0; }
.vf-pick-b img { width: 100%; height: 94px; object-fit: cover; display: block; }
/* 证书照片的必填说明：紧贴上传框下方，说清「为什么非传不可」。
   只标一个「必填」用户并不买账 —— 他要知道不传的后果是卡在核验上。 */
.vf-note { margin: 8px 2px 0; font-size: 11.5px; line-height: 1.5; color: #8a93a0; }

/* ---- 手机号短信验证弹层 ----
   号码做成卡片、验证码做成大字输入框、发码按钮带倒计时：
   原来是一个灰底提示条 + 一行小字按钮，看着像"随便填填"，不像在验身份。 */
.pv-phone {
  margin: 2px 0 14px; padding: 14px 12px;
  border-radius: 12px; text-align: center;
  background: linear-gradient(135deg, #2f6fd0, #4a86e8); color: #fff;
}
.pv-phone small { display: block; font-size: 12px; opacity: .85; }
.pv-phone b { display: block; margin-top: 4px; font-size: 21px; letter-spacing: 1px; }
.pv-row { display: flex; align-items: stretch; gap: 10px; }
.pv-otp {
  flex: 1; height: 46px; min-width: 0;
  font-size: 20px; font-weight: 700; letter-spacing: 8px; text-align: center;
  border: 1px solid #d5dae2; border-radius: 10px;
  background: #fff; color: #1b2330;
}
.pv-otp:focus { border-color: #2f6fd0; outline: none; }
.pv-otp::placeholder { font-weight: 400; letter-spacing: normal; font-size: 13px; color: #a7afbb; }
.pv-send {
  height: 46px; padding: 0 14px; white-space: nowrap;
  border: 1px solid #2f6fd0; border-radius: 10px;
  background: #eef4ff; color: #2f6fd0; font-size: 13px; font-weight: 600;
}
.pv-send:disabled { border-color: #d5dae2; background: #f2f4f7; color: #9aa3af; }
.pv-tip { margin-top: 10px; font-size: 12px; color: #8a93a0; text-align: center; }

/* ---- 身份证认证弹层：人像面 / 国徽面并排 ----
   两面各占一半、已传的铺满并挂"已上传"角标，缺哪一面一眼看得出来
   （后端要求两张，少一张提交会被拒 —— 界面必须让人自己先发现）。 */
.vf-shot { display: flex; gap: 10px; margin-top: 12px; }
.vf-shot-b {
  position: relative; flex: 1; overflow: hidden;
  min-height: 106px; border-radius: 12px;
  border: 1px dashed #c9cfd8; background: #f7f8fa; color: #8a93a0;
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px;
  font-size: 12px;
}
.vf-shot-b .ic, .vf-shot-b svg { width: 24px; height: 24px; }
.vf-shot-b.on { border: 1px solid #2f6fd0; background: #fff; }
.vf-shot-b img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.vf-shot-tag {
  position: absolute; left: 0; right: 0; bottom: 0; z-index: 1;
  padding: 3px 0; text-align: center; font-size: 11px;
  background: rgba(0, 0, 0, .5); color: #fff;
}
.vf-shot-ok {
  position: absolute; top: 6px; right: 6px; z-index: 1;
  width: 18px; height: 18px; border-radius: 50%;
  background: #22a06b; color: #fff; font-size: 11px;
  display: grid; place-items: center;
}
.vf-note {
  margin-top: 12px; padding: 10px 12px;
  border-radius: 10px; background: #f7f8fa; color: #79828f;
  font-size: 12px; line-height: 1.6;
}
/* ---- 头像框（方案二 · 静谧光环，2026-10-04）----
   双环白玻璃：::after 内环 2px 白渐变紧贴头像，::before 外环 1.5px 半透明光环（隔 4px）；
   底色叠左上高光渐变 + inset 顶部 1px 白线，首字有「雕塑感」。
   ⚠️ 企业端「我的」复用 .pf-av（.em-me-av 有 overflow:hidden）→ 外环在那边被裁掉，
      只剩内环，视觉仍成立；相机毛玻璃角标只挂在工人端（企业端头像里没有 .ic 子元素）。 */
.pf-av {
  width: 70px; height: 70px;
  border-radius: 50%;
  background:
    radial-gradient(120% 120% at 30% 20%, rgba(255, 255, 255, .16), rgba(255, 255, 255, 0) 55%),
    linear-gradient(160deg, var(--av-blue-2, #3A5F9E), var(--av-blue-1, #2E4E86));
  border: 0;                     /* 光环由 ::before / ::after 画，留着实色边框会把它压住 */
  display: grid;
  place-items: center;
  font-size: 27px;
  font-weight: 800;
  flex: none;
  padding: 0;
  cursor: pointer;
  /* 投影浮起 + 顶部 1px 白线模拟受光面 */
  box-shadow: 0 8px 20px -6px rgba(0, 0, 0, .55), inset 0 1px 0 rgba(255, 255, 255, .25);
  transition: transform .18s ease;
}
/* 外环：1.5px 半透明白渐变光环，与头像本体隔 4px（inset -6px - 内环 2px） */
.pf-av::before {
  content: ''; position: absolute; inset: -6px; border-radius: 50%; padding: 1.5px;
  background: linear-gradient(135deg, rgba(255, 255, 255, .55), rgba(255, 255, 255, .15));
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor;
  mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  mask-composite: exclude;
  pointer-events: none;
}
/* 内环：2px 白渐变，紧贴头像边缘；自选头像（img）时也压在照片上保持环感 */
.pf-av::after {
  content: ''; position: absolute; inset: 0; border-radius: 50%; padding: 2px;
  background: linear-gradient(160deg, rgba(255, 255, 255, .95), rgba(255, 255, 255, .35));
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor;
  mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  mask-composite: exclude;
  pointer-events: none;
}
/* 到岗状态点（方案二）：求职状态从文字行前置到头像左下 —— 点色按状态分档：
   随时到岗 / 离职找工作中 = 绿（可马上入职）、在职看看机会 = 金、近期不便 / 无状态不挂或灰 */
.pf-av-dot {
  position: absolute; left: 3px; bottom: 3px;
  width: 11px; height: 11px; border-radius: 50%;
  background: #9AA7B8;
  border: 2px solid rgba(255, 255, 255, .9);
  z-index: 3;
}
.pf-av-dot.ok { background: #2FBE7E; }
.pf-av-dot.mid { background: var(--gold-500); }
.pf-av:active { transform: scale(.96); }
.pf-info { flex: 1; min-width: 0; }
/* ---- 头像栏签到胶囊（2026-10-14：由正文签到卡上移）----
   竖排小胶囊坐在 .pf-user 右端（深蓝头图上）：
     未签 = 金底可点（data-checkin 委托在 mobile.app.js，与原卡同一入口）；
     已签 = 半透白只读，连签天数。字体色走深棕（金底上白字对比不够）。 */
.pf-ck {
  flex: none; align-self: center;
  display: flex; flex-direction: column; align-items: center; gap: 3px;
  padding: 9px 13px; border: 0; border-radius: 14px;
  background: linear-gradient(160deg, var(--gold-400), var(--gold-600));
  color: #3E2C05; font-family: inherit;
  box-shadow: 0 4px 12px rgba(201, 153, 43, .35), inset 0 1px 0 rgba(255, 255, 255, .45);
  cursor: pointer; -webkit-tap-highlight-color: transparent;
}
.pf-ck .ic, .pf-ck svg { width: 16px; height: 16px; }
.pf-ck span { font-size: 13px; font-weight: 900; line-height: 1; }
.pf-ck small { font-size: 10px; font-weight: 800; opacity: .8; line-height: 1; }
.pf-ck:active { transform: scale(.95); }
.pf-ck[disabled] { opacity: .55; }
/* 已签态：半透白、只读（div 不是 button，没有按压反馈） */
.pf-ck.is-done {
  background: rgba(255, 255, 255, .16);
  color: rgba(255, 255, 255, .92);
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .22);
  cursor: default;
}
.pf-ck.is-done small { color: var(--gold-300); opacity: 1; }
.pf-name {
  font-size: 21px;
  font-weight: 900;
  display: flex;
  align-items: center;
  gap: 7px;
}
.pf-name .chip-gold { background: rgba(222, 180, 79, .26); color: var(--gold-200); }
/* 实名徽章四态（2026-10-12 落码 M4）：页头是深蓝底，tokens 里那套浅底深字
   （chip-brand / chip-danger / chip-line）铺上去会糊成一片，按深底重配三档 */
.pf-name .chip-brand  { background: rgba(141, 179, 228, .24); color: #CFE0F7; }
.pf-name .chip-danger { background: rgba(217, 52, 43, .26);    color: #FFC9C5; }
.pf-name .chip-line   { background: rgba(255, 255, 255, .14);  color: rgba(255, 255, 255, .82); border: 0; }
/* 「已实名」徽章做成**按钮**（点开看实名信息）：button 的默认外观要清掉，
   配色仍由 .chip-gold 给（这条写在它后面，只覆盖自己声明的属性，不抢颜色） */
.pf-name .chip-btn {
  display: inline-flex; align-items: center; gap: 2px;
  margin: 0; padding: 2px 7px; border: 0; border-radius: 999px;
  font-size: 12px; font-weight: 700; font-family: inherit;
  cursor: pointer; -webkit-tap-highlight-color: transparent;
}
.pf-name .chip-btn:active { transform: scale(.96); }
.pf-name .chip-btn .ic { width: 13px; height: 13px; }

/* ---- 「我的」身份区（2026-10-12 落码 M4 设计稿：分段控件 / 积分条 / 身份卡+解锁环）----
   类名全部走 pf- 前缀：设计稿里的 .idsw / .idcard / .ring / .ptbar 太通用，
   直接搬进来早晚会撞（.ring 已被求职档案的环占了）。 */
.pf-idsw {
  display: flex; background: rgba(255, 255, 255, .16); border-radius: 999px;
  padding: 4px; margin-top: 13px;
}
.pf-idsw button {
  flex: 1; min-width: 0; border: 0; padding: 0; background: transparent;
  color: rgba(255, 255, 255, .78); font-family: inherit; border-radius: 999px;
  height: 40px; cursor: pointer;
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 1px;
}
.pf-idsw button span { font-size: 12.5px; font-weight: 800; line-height: 1.25; }
.pf-idsw button i { font-style: normal; font-size: 9px; font-weight: 700; opacity: .72; line-height: 1.25; }
.pf-idsw button.on {
  background: #fff; color: var(--blue-700);
  box-shadow: 0 2px 6px -2px rgba(0, 0, 0, .35);
}
.pf-ptbar {
  display: flex; align-items: center; gap: 9px; width: 100%; text-align: left;
  border: 0; font-family: inherit; cursor: pointer;
  border-radius: 12px; padding: 9px 11px; margin-bottom: 10px;
  background: linear-gradient(120deg, #FBF3E1 0%, #FFF9EC 100%);
  box-shadow: inset 0 0 0 1px #F2E4C4;
}
.pf-pti {
  width: 28px; height: 28px; border-radius: 9px; background: #F7E7C4; color: #8A6414;
  display: grid; place-items: center; flex: none;
}
.pf-ptm { flex: 1; min-width: 0; }
.pf-ptm b { font-size: 13px; font-weight: 800; color: #8A6414; display: block; }
.pf-ptm small { font-size: 10px; color: #A9873F; display: block; margin-top: 1px; }
.pf-ptgo {
  font-size: 11px; font-weight: 800; color: #8A6414; flex: none;
  display: inline-flex; align-items: center; gap: 2px;
}

.pf-idcard {
  display: flex; align-items: center; gap: 10px; background: #fff;
  border-radius: 12px; padding: 12px; margin-bottom: 9px;
  box-shadow: inset 0 0 0 1px #EFF3F8;
}
.pf-idcard.on {
  box-shadow: inset 0 0 0 1.5px var(--blue-700);
  background: linear-gradient(120deg, #F7FAFF, #fff);
}
.pf-idcard .ic2 {
  width: 38px; height: 38px; border-radius: 11px;
  display: grid; place-items: center; flex: none;
}
.pf-idcard .ic2.w { background: #EAF1FB; color: var(--blue-700); }
.pf-idcard .ic2.e { background: #FBF3E1; color: #8A6414; }
.pf-idcard .ic2.a { background: #EEF7F1; color: var(--success); }
.pf-idcard .im { flex: 1; min-width: 0; }
.pf-idcard .im b {
  font-size: 13px; font-weight: 800;
  display: flex; align-items: center; gap: 5px; flex-wrap: wrap;
}
.pf-idcard .im small { font-size: 10.5px; color: #8A94A6; display: block; margin-top: 3px; line-height: 1.5; }
.pf-ring { width: 44px; height: 44px; flex: none; position: relative; }
.pf-ring svg { display: block; transform: rotate(-90deg); }
.pf-ring .bgc { stroke: #EEF3F8; stroke-width: 4; fill: none; }
.pf-ring .fgc { stroke: var(--blue-700); stroke-width: 4; fill: none; stroke-linecap: round; }
.pf-ring.fr-e .fgc { stroke: var(--gold-500); }
.pf-ring.fr-a .fgc { stroke: var(--success); }
.pf-ring > span {
  position: absolute; inset: 0; display: grid; place-items: center;
  font-size: 10px; font-weight: 800; color: var(--blue-700); font-family: var(--font-num);
}
.pf-ring.fr-e > span { color: #8A6414; }
.pf-ring.fr-a > span { color: var(--success); }
.pf-idbtn {
  border: 0; font-family: inherit; cursor: pointer; flex: none; margin-left: 6px;
  height: 30px; padding: 0 11px; border-radius: 8px; font-size: 11.5px; font-weight: 800;
  display: inline-flex; align-items: center;
}
.pf-idbtn.pri { background: var(--blue-700); color: #fff; }
.pf-idbtn.line { background: #fff; color: var(--blue-700); box-shadow: inset 0 0 0 1px #CBD8EA; }
.pf-idbtn:active { transform: scale(.96); }

/* 会员徽章（设计稿那颗金底实色，如「年卡会员」）：与半透明的「已实名」区分层级 */
.pf-name .chip-vip {
  background: linear-gradient(135deg, #E8C064, #C99B2B);
  color: #3E2C05; font-weight: 800; border: 0;
  box-shadow: 0 2px 6px rgba(201, 153, 43, .35);
}
.pf-sub { font-size: var(--t-sm); color: rgba(255, 255, 255, .74); margin-top: 6px; }
.pf-loc {
  display: flex;
  align-items: center;
  gap: 3px;
  font-size: var(--t-xs);
  color: rgba(255, 255, 255, .6);
  margin-top: 6px;
}
/* ⚠️ `.pf-stats` / `.pf-stat` **不能删**：工人端「我的」页那排统计格
   （投递 / 收藏 / 未读 / 实名）2026-10-03 已整条撤掉，但**企业端**「我的」页还在用
   （在招岗位 / 收到投递 / 待面试 / 已录用 四项，见 mobile.ent.js）——
   两张屏共用这一张样式表，删了企业端那排就散了。
   ⚠️ 列数必须是 4：企业端是四项，写成 2 列会折成 2×2（这一条踩过一次）。 */
.pf-stats {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 6px;
  margin-top: 16px;
  padding-top: 14px;
  border-top: 1px solid rgba(255, 255, 255, .14);
}
/* 2026-10-04 设计稿：统计条去底色格子，只留大数字 + 小标签（纯文字四列） */
.pf-stat {
  text-align: center;
  background: none;
  border: 0;
  color: #fff;
  padding: 4px 2px;
  transition: transform .18s ease;
}
.pf-stat:active { transform: scale(.97); }
.pf-stat b {
  display: block;
  font-size: 24px;
  font-weight: 800;
  font-family: var(--font-num);
}
.pf-stat small {
  display: block;
  font-size: 12px;
  color: rgba(255, 255, 255, .62);
  margin-top: 3px;
}
.pf-body { padding-top: 14px; }

/* ==========================================================================
   「我的」页 · 方案 Y「斜切构图」（2026-10-05 落码，替代方案 X「白卡浮岛」）
   深蓝块 clip-path 斜切收尾，头像 / 姓名资料白字直接坐在深蓝上；
   白色四格卡上叠 34px 骑在斜边上，打破"深蓝矩形压头"的呆板。
   ⚠️ 只用 `.pf-head--slant` / `.pf-body--slant` 两个**工人端专属**修饰类，
      不改 `.pf-head` / `.pf-body` / `.pf-av` 的基础规则 —— 企业端「我的」页
      （mobile.ent.js 的 `.pf-head.em-me-head`）复用同一批类名，动基础规则会把它一起改掉。
   ========================================================================== */
.pf-head--slant {
  /* P1 落码基线（2026-10-14 用户拍板）：padding-bottom 52px = 斜切收边 34px + 内容呼吸 18px。
     ⛔ 不再用 clip-path 裁头：clip-path 会把头部矩形右下裁掉，但角标 / 骑边卡溢出的部分
        也随之被裁；P1 稿改用 ::after 画页面底色三角**盖**在下缘，头部本体保持完整矩形。
     2026-10-14 用户反馈「我的」页头部比别页宽：水平 padding 16px 与标准 .navbar 的 12px 差 4px，
     视觉上整块"撑"出去 —— 改到 12px 与 navbar 对齐，头像/资料位置不变。
     只动 --slant 变体、不动 .pf-head 基础规则（基础规则给企业端"我的"页复用 —— 注释见 3446 行）。 */
  padding: 14px 12px 52px;
  background: linear-gradient(150deg, #0F3A80, #1A4B9B);
  clip-path: none;
}
/* 底部斜切：34px 高的页面底色三角盖住右下（P1 口径），斜线从左下 → 右上。
   ⚠️ 底色必须与 .screen 的 --bg 同值（#F4F7FB），差一档就会在斜边上留下一道色差。 */
.pf-head--slant::after {
  inset: auto 0 0 0;
  height: 34px;
  background: var(--bg);
  background-image: none;
  clip-path: polygon(0 100%, 100% 0, 100% 100%);
}
.pf-head--slant .pf-top { padding: 2px 0 0; }
.pf-head--slant .pf-user { margin-top: 14px; gap: 14px; }
/* 头像：P1 口径 —— 深蓝上半透明白底 + 白字首字（64px），不再用白瓷渐变 */
.pf-head--slant .pf-av {
  width: 64px; height: 64px;
  font-size: 24px;
  color: #fff;
  background: rgba(255, 255, 255, .16);
  box-shadow: inset 0 0 0 2px rgba(255, 255, 255, .22);
}
/* 光环：P1 无光环描边，回到基础版的弱透明白 */
.pf-head--slant .pf-av::before {
  background: linear-gradient(135deg, rgba(255, 255, 255, .28), rgba(255, 255, 255, .05));
}
/* 相机角标：P1 是白底深蓝图标 */
.pf-head--slant .pf-av > .ic, .pf-head--slant .pf-av > svg {
  background: #fff;
  border-color: rgba(255, 255, 255, .9);
  color: #0F3A80;
}

/* page-body 不再另留顶部内边距：白卡自己上叠骑斜边 */
.pf-body--slant { padding-top: 0; }

/* ---- 骑斜边白卡：四格入口（我的投递 / 面试 / 简历 / 名片）----
   上叠 34px：右缘斜切收边 64px、白卡只抬 34px，四角都落在蓝上，
   斜边在白卡左右两侧露出一线，斜切构图才看得见。 */
.pf-ride {
  position: relative;
  z-index: 3;
  margin-top: -36px;              /* P1：白卡上叠 36px，压住 34px 斜切 */
  border-radius: 12px;
  background: #fff;
  overflow: hidden;
  box-shadow: inset 0 0 0 1px #EFF3F8, 0 6px 18px -12px rgba(15, 58, 128, .4);
}
.pf-ride .pf-stats {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0;
  margin: 0;
  padding: 0;
  border-top: 0;
}
.pf-ride .pf-stat { color: var(--blue-700); padding: 13px 4px 11px; }
.pf-ride .pf-stat b { font-size: 21px; }
.pf-ride .pf-stat small { color: var(--ink-400); font-size: 11px; }
.pf-ride .pf-stat + .pf-stat { box-shadow: inset 1px 0 0 #EFF3F8; }
/* 简历完善度一格用金色：这一格是"进度"不是"数量"，金 = 该去补（Y 案设计稿口径） */
.pf-ride .pf-stat.gold b { color: var(--gold-600); }

/* ==========================================================================
   「我的」页 · P1「落码基线」皮肤（2026-10-14 用户拍板：保留功能只换视觉）
   口径（对应 reports/ui-review-20261004/profile-10.html 的 P1）：
     · 区块之间靠 **1px 极浅描边** 划界（inset shadow），不用外投影 —— 页面扁平有边界；
     · 卡片圆角统一 12px、内边距 12px；
     · 四格白卡是**全页唯一带投影**的元素（它是骑在斜切上的主角）；
     · 证件预警条用平色金底，不用渐变 + 投影。
   ⚠️ 全部收在 `.screen-profile` 作用域内 —— 企业端「我的」（.pf-head.em-me-head）
      复用 .card / .sec-head / .pf-cell 这批基础类，直接改基础规则会连企业端一起改掉。
   ========================================================================== */
.screen-profile { --p1-ln: #EFF3F8; }

/* 卡片：撤外投影 → 改 1px 极浅描边；内边距 14 → 12（pad0 的卡自己管内边距，别碰） */
.screen-profile .card {
  border-color: transparent;
  border-radius: 12px;
  box-shadow: inset 0 0 0 1px var(--p1-ln);
}
.screen-profile .card:not(.pad0) { padding: 12px; }

/* 区块标题：竖条 15 → 14px，上下留白收紧到 P1 的 16 / 8（用户反馈两块宫格间距太松，再收一档） */
.screen-profile .sec-head { padding: 12px 2px 6px; }
.screen-profile .sec-head .bar { height: 14px; }
.screen-profile .sec-head h3 { font-size: 14.5px; }

/* 宫格：格距 8 → 6；格子改描边无投影，尺寸再收紧一档（用户反馈「我的服务 / 我的工具」占位置太大） */
.screen-profile .pf-grid { gap: 6px; margin-top: 0; }
.screen-profile .pf-cell {
  border-color: transparent;
  border-radius: 11px;
  padding: 9px 2px 8px;
  box-shadow: inset 0 0 0 1px var(--p1-ln);
}
.screen-profile .pf-cell:active { background: #F5F8FC; }
.screen-profile .pc-ic { background: #EAF1FB; border-radius: 10px; width: 32px; height: 32px; }
.screen-profile .pc-ic .ic { width: 17px; height: 17px; }
.screen-profile .pf-cell b { font-size: 12px; font-weight: 800; }
.screen-profile .pc-s { font-size: 10px; }

/* 求职档案卡：P1 是普通白卡，撤掉那根蓝色左边框 */
.screen-profile .resume-card { border-left: 0; }

/* 证件预警条：平色金底 + 极浅描边（P1 .calert），撤渐变与投影 */
.screen-profile .cert-alert {
  background: #FCF3DE;
  border-color: transparent;
  box-shadow: none;
  border-radius: 12px;
  padding: 10px 12px;
}
.screen-profile .cert-alert.is-over { background: #FDE9E7; }
.screen-profile .cert-alert .ca-ic { background: rgba(201, 153, 43, .18); }
.screen-profile .cert-alert.is-over .ca-ic { background: rgba(217, 52, 43, .12); }

/* 页面左右留白 14 → 12（P1 .pf-body：0 12px） */
.screen-profile .page-body { padding-left: 12px; padding-right: 12px; }

/* ---- 资产区 · 金主会员卡（2026-10-15 用户拍板 P5「金主会员卡」，接管 .asq-* 方块矩阵）----
   整块资产区是**一张卡**：会员当主角（顶部王冠 + 套餐名 + 剩余/到期 + 续费钮），
   底部白色横条承载积分余额与每日签到两个入口。
   ⚠️ 白条格子是 <div> 包 <button>（余额格里「充值」与「明细」两个落点并置，
      HTML 不允许 button 嵌 button）；`.mcard-hit` 撑满格子，`.mcard-dt` 绝对定位在右上角。
   ⛔ **未开通会员不给金**：整卡换深蓝（品牌色）—— 金色只表示"你是会员"，
      未开通的人看到一张金卡，会以为自己已经开通了。
   ⛔ 已签到不加彩，读数转绿（.mcard-hit.is-done）；金额/天数一个都不编。
   ⛔ 取不到 window.CHECKIN 时不渲染签到格，余额格自动铺满白条（.mcard-b 均分）。
   ---
   退役：.asq / .asq-a / .asq-al / .asq-dt / .asq-n / .asq-s / .asq-pay / .asq-b / .asq-c
        （P9 方块矩阵整组；要恢复旧版式去 git 历史取，此处不留死代码）。 */
.mcard {
  position: relative;
  overflow: hidden;
  margin-top: 12px;
  padding: 12px 13px;
  border-radius: var(--r-xl);
  color: #fff;
  background: linear-gradient(150deg, #E4C06A, #BB8A22 60%, #A87A1E);
  box-shadow: 0 14px 28px -20px rgba(168, 122, 30, .95);
}
.mcard.is-off {
  background: linear-gradient(150deg, #2A559C, #0F3A80 62%, #0A2A5F);
  box-shadow: 0 14px 28px -20px rgba(10, 42, 95, .95);
}
/* 右下光晕：金色卡上提亮、深蓝卡上做"未点亮"的观感 */
.mcard::after {
  content: '';
  position: absolute; right: -40px; bottom: -60px;
  width: 150px; height: 150px; border-radius: 50%;
  background: radial-gradient(circle, rgba(255, 255, 255, .28), rgba(255, 255, 255, 0) 68%);
  pointer-events: none;
}
.mcard-top { position: relative; z-index: 1; display: flex; align-items: center; gap: 9px; }
.mcard-crown {
  width: 34px; height: 34px; flex: none; border-radius: 50%;
  display: grid; place-items: center;
  background: rgba(255, 255, 255, .24);
  color: #fff;
}
.mcard-crown .ic, .mcard-crown svg { width: 18px; height: 18px; }
.mcard-info { flex: 1; min-width: 0; }
.mcard-info b { display: block; font-size: 15px; font-weight: 900; letter-spacing: .3px; }
.mcard-info small {
  display: block; margin-top: 2px;
  font-size: 10.5px; font-weight: 700; color: rgba(255, 255, 255, .88);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.mcard-ren {
  flex: none; height: 28px; padding: 0 13px;
  border: 0; border-radius: var(--r-pill);
  font: inherit; font-size: 11.5px; font-weight: 900;
  background: rgba(255, 255, 255, .94); color: #8A6A22; cursor: pointer;
}
.mcard.is-off .mcard-ren { color: var(--blue-700); }
.mcard-ren:active { transform: translateY(1px); }
/* 白色横条：两个入口 */
.mcard-bar {
  position: relative; z-index: 1;
  margin-top: 11px;
  display: flex; align-items: stretch;
  background: #fff;
  border-radius: var(--r-lg);
  overflow: hidden;
}
.mcard-b { flex: 1; min-width: 0; position: relative; display: flex; }
.mcard-hit {
  flex: 1; min-width: 0;
  display: flex; flex-direction: column; gap: 1px;
  padding: 9px 10px;
  border: 0; background: none; cursor: pointer;
  font: inherit; text-align: left;
}
.mcard-hit:active { background: var(--bg); }
.mcard-hit small { font-size: 10px; font-weight: 700; color: var(--ink-400); }
.mcard-hit b {
  font-size: 16px; font-weight: 900; line-height: 1.25;
  color: var(--blue-700);
  font-variant-numeric: tabular-nums;
}
.mcard-hit b.g { color: var(--gold-700); }
/* 签到单价为 0（运营关了签到）：读数转灰写「暂停」，别摆一个「＋0.00」 */
.mcard-hit b.is-off { color: var(--ink-400); font-size: 15px; }
.mcard-hit em {
  font-style: normal; font-size: 9.5px; font-weight: 700; color: var(--ink-400);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.mcard-hit.is-done b { color: var(--success); }
.mcard-sp { width: 1px; flex: none; background: var(--line-2); margin: 8px 0; }
/* 「明细」在余额格右上角（与「积分余额」标签同一行右侧）——
   它必须独立于充值区，别把整格做成一个按钮：那样明细就点不进去了 */
.mcard-dt {
  position: absolute; right: 7px; top: 8px;
  display: inline-flex; align-items: center; gap: 1px;
  padding: 0; border: 0; background: none;
  font: inherit; font-size: 9.5px; font-weight: 800; color: var(--ink-400);
  cursor: pointer;
}
.mcard-dt .ic, .mcard-dt svg { width: 11px; height: 11px; }

/* ---- 头像 · 会员角标（2026-10-15 用户要求：会员在头像框上标出月卡 / 季卡 / 年卡）----
   骑在头像右上角（到岗状态点在左下、相机角标在右下，互不打架）。
   三档用金属色区分：月卡金 / 季卡紫 / 年卡黑金（认不出卡种时用金色通用款）。
   ⚠️ 三档都带 1.5px 白描边 —— 页头是深蓝底，紫与黑金没有描边会糊进背景。
   ⚠️ 需要 .pf-av 不裁子元素：有自选头像时 .has-img 原本 overflow:hidden 会把角标切掉，
      已改成由 img 自己 border-radius:50% 收圆。 */
.pf-av-vip {
  position: absolute; right: -4px; top: -2px; z-index: 4;
  display: inline-flex; align-items: center; gap: 2px;
  height: 17px; padding: 0 6px 0 5px;
  border-radius: var(--r-pill);
  font-size: 9.5px; font-weight: 900; letter-spacing: .2px;
  color: #5A4310;
  background: linear-gradient(135deg, #F2D99B, #C9992B);
  box-shadow: 0 0 0 1.5px rgba(255, 255, 255, .92), 0 2px 6px -2px rgba(12, 22, 40, .5);
  white-space: nowrap;
}
.pf-av-vip .ic, .pf-av-vip svg { width: 10px; height: 10px; }
.pf-av-vip.is-quarter { color: #fff; background: linear-gradient(135deg, #B9A2F5, #6E4FD1); }
.pf-av-vip.is-year { color: #F7E3AE; background: linear-gradient(135deg, #4A3B22, #1E1710); }

/* ---- 每日签到弹层（2026-10-15）----
   入口：「我的」页金主会员卡白条的签到格（data-checkin-open）。
   内容 = 近 7 天格子墙 + 今日可得/已到账 + 签到钮，全部来自 GET /me/checkin
   （近 7 天 + streak/totalDays/amount/lastGained）。
   ⛔ 不画月度日历墙（接口只回 7 天，画满 30 格就是编 23 格）；不写里程碑奖励（无此配置项）。 */
.sheet-ck { background: #fff; }
.cks-head { display: flex; align-items: center; gap: 11px; padding: 2px 0 13px; }
.cks-seal {
  width: 42px; height: 42px; flex: none; border-radius: 50%;
  display: grid; place-items: center;
  background: linear-gradient(150deg, #F2D491, #C9992B);
  color: #7A5A12;
}
.cks-seal.done { background: linear-gradient(150deg, #CFF3DF, #2FBE7E); color: #fff; }
.cks-seal .ic, .cks-seal svg { width: 22px; height: 22px; }
.cks-ttl { flex: 1; min-width: 0; }
.cks-ttl h3 { font-size: 16px; font-weight: 900; color: var(--ink-900); }
.cks-ttl p { margin-top: 3px; font-size: 11.5px; color: var(--ink-500); }
.cks-ttl p b { font-family: var(--font-num); font-size: 13px; color: var(--gold-700); }
.cks-x {
  flex: none; width: 30px; height: 30px; border: 0; border-radius: 50%;
  display: grid; place-items: center;
  background: var(--line-2); color: var(--ink-500); cursor: pointer;
}
.cks-week { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 6px; }
.cks-d {
  display: flex; flex-direction: column; align-items: center; gap: 5px;
  padding: 8px 0 7px;
  border-radius: var(--r-md);
  background: var(--bg);
}
.cks-d small { font-size: 10px; font-weight: 700; color: var(--ink-400); }
.cks-d > span {
  width: 24px; height: 24px; border-radius: 50%;
  display: grid; place-items: center;
  background: #fff;
  box-shadow: inset 0 0 0 1.4px var(--line);
  color: transparent;
}
.cks-d.on { background: #FFF9EC; }
.cks-d.on small { color: var(--gold-700); }
.cks-d.on > span { background: linear-gradient(150deg, #F2D491, #C9992B); box-shadow: none; color: #fff; }
.cks-d.on > span .ic, .cks-d.on > span svg { width: 13px; height: 13px; }
/* 今天：没签也描一圈金，标出"就等这一下" */
.cks-d.is-today { box-shadow: inset 0 0 0 1.5px var(--gold-500); }
.cks-d.is-today small { color: var(--gold-700); }
.cks-empty { grid-column: 1 / -1; text-align: center; font-size: 12px; color: var(--ink-400); padding: 10px 0; }
.cks-legend { display: flex; gap: 14px; margin-top: 9px; font-size: 10.5px; color: var(--ink-500); }
.cks-legend span { display: inline-flex; align-items: center; gap: 4px; }
.cks-legend i {
  display: block; width: 9px; height: 9px; border-radius: 3px;
  background: #fff; box-shadow: inset 0 0 0 1.3px var(--line);
}
.cks-legend i.on { background: linear-gradient(150deg, #F2D491, #C9992B); box-shadow: none; }
.cks-legend i.to { background: #FFF9EC; box-shadow: inset 0 0 0 1.5px var(--gold-500); }
.cks-gain {
  margin-top: 13px; padding: 11px 13px;
  border-radius: var(--r-lg);
  display: flex; flex-direction: column; gap: 3px;
  background: #FFF9EC;
  box-shadow: inset 0 0 0 1px #F3E3BE;
}
.cks-gain span {
  font-size: 14.5px; font-weight: 900; color: #8A6A22;
  font-variant-numeric: tabular-nums;
}
.cks-gain small { font-size: 10.5px; color: #A08447; }
.cks-gain.is-done { background: #EFFAF3; box-shadow: inset 0 0 0 1px #CDEBD9; }
.cks-gain.is-done span { color: var(--success); }
.cks-gain.is-done small { color: #5A8A6E; }
.cks-go {
  width: 100%; height: 46px; margin-top: 13px;
  border: 0; border-radius: var(--r-pill);
  display: inline-flex; align-items: center; justify-content: center; gap: 6px;
  font: inherit; font-size: 15px; font-weight: 900; color: #4A3610;
  background: linear-gradient(135deg, var(--gold-300), var(--gold-500));
  cursor: pointer;
}
.cks-go:active { transform: translateY(1px); }
.cks-go[disabled] { opacity: .6; }
/* 已签 / 奖励暂停：按钮位改成一条只读的说明条，不留一个可点但没反应的按钮 */
.cks-done, .cks-off {
  margin-top: 13px; height: 46px;
  border-radius: var(--r-pill);
  display: flex; align-items: center; justify-content: center; gap: 6px;
  font-size: 14px; font-weight: 800;
  background: var(--line-2); color: var(--ink-500);
}
.cks-off { background: #FDF3F2; color: #B03A2E; }
.cks-done .ic, .cks-done svg, .cks-off .ic, .cks-off svg { width: 16px; height: 16px; }

/* 「我的」首屏待办条：未实名挡住了投递与解锁，必须显性提示 */
.pf-todo {
  width: 100%;
  display: flex;
  align-items: center;
  gap: 11px;
  padding: 13px 14px;
  border-radius: var(--r-lg);
  background: linear-gradient(120deg, #FFF8E8, #FFF1D6);
  border: 1px solid var(--gold-200);
  margin-bottom: 12px;
}
.pf-todo .pt-ic {
  width: 36px; height: 36px;
  flex: none;
  border-radius: var(--r-md);
  background: var(--gold-100);
  color: var(--gold-700);
  display: grid;
  place-items: center;
}
.pf-todo .pt-main { flex: 1; min-width: 0; text-align: left; }
.pf-todo .pt-main b { display: block; font-size: var(--t-sm); font-weight: 800; color: var(--ink-900); }
.pf-todo .pt-main small {
  display: block;
  font-size: 11px;
  color: var(--ink-500);
  margin-top: 3px;
}
.pf-todo .pt-btn {
  flex: none;
  display: inline-flex;
  align-items: center;
  gap: 2px;
  font-size: var(--t-xs);
  font-weight: 700;
  color: var(--gold-700);
}
.pf-todo .pt-btn .ic { width: 13px; height: 13px; }

/* ---- 实名认证状态条（2026-10-12 落码 M4 设计稿）----
   承接原先挤在待办卡里的「实名核验中」那一条：核验中的人最需要知道"提交成功了、
   正在审"，所以给它独立一条 + 三点进度；待办卡回归「简历 / 证书」。
   配色沿用既有语义：核验中蓝 / 未认证金 / 已驳回红。 */
.vf-bar {
  width: 100%;
  display: flex;
  align-items: center;
  gap: 11px;
  padding: 12px 14px;
  border-radius: var(--r-lg);
  margin-bottom: 12px;
  text-align: left;
}
.vf-bar .vf-ic {
  width: 36px; height: 36px;
  flex: none;
  border-radius: var(--r-md);
  display: grid;
  place-items: center;
}
.vf-bar .vf-main { flex: 1; min-width: 0; }
.vf-bar .vf-main b { display: block; font-size: var(--t-sm); font-weight: 800; color: var(--ink-900); }
.vf-bar .vf-main small { display: block; font-size: 11px; color: var(--ink-500); margin-top: 3px; }
.vf-bar .vf-btn {
  flex: none;
  display: inline-flex;
  align-items: center;
  gap: 2px;
  font-size: var(--t-xs);
  font-weight: 700;
}
.vf-bar .vf-btn .ic { width: 13px; height: 13px; }
.vf-bar.is-wait { background: linear-gradient(120deg, #F2F7FD, #E8F1FC); border: 1px solid var(--blue-200); }
.vf-bar.is-wait .vf-ic { background: var(--blue-100); color: var(--blue-700); }
.vf-bar.is-wait .vf-btn { color: var(--blue-700); }
.vf-bar.is-todo { background: linear-gradient(120deg, #FFF8E8, #FFF1D6); border: 1px solid var(--gold-200); }
.vf-bar.is-todo .vf-ic { background: var(--gold-100); color: var(--gold-700); }
.vf-bar.is-todo .vf-btn { color: var(--gold-700); }
.vf-bar.is-reject { background: linear-gradient(120deg, #FFF1F0, #FDE9E7); border: 1px solid #F6C9C5; }
.vf-bar.is-reject .vf-ic { background: var(--danger-100); color: var(--danger-600); }
.vf-bar.is-reject .vf-btn { color: var(--danger-600); }

/* 三点进度：只跟「核验中」那条一起出（已提交 → 核验中 → 完成） */
.vf-steps {
  display: flex;
  align-items: center;
  gap: 7px;
  margin: -6px 2px 12px;
  padding: 0 2px;
}
.vf-steps i { width: 8px; height: 8px; border-radius: 50%; background: var(--line); flex: none; }
.vf-steps i.done { background: var(--success); }
.vf-steps i.on { width: 20px; border-radius: 4px; background: var(--blue-600); }
.vf-steps small { font-size: 11px; color: var(--ink-400); margin-left: auto; }

/* 「我的」用户卡右侧的「编辑资料」入口 */
.pf-edit {
  flex: none;
  align-self: flex-start;
  height: 28px;
  padding: 0 10px;
  border-radius: var(--r-pill);
  background: rgba(255, 255, 255, .16);
  color: #fff;
  font-size: var(--t-xs);
  font-weight: 600;
  display: inline-flex;
  align-items: center;
  gap: 3px;
}
.pf-edit .ic { width: 13px; height: 13px; }

/* 编辑资料表单 */
.pf-field { margin-bottom: 12px; }
.pf-field:last-child { margin-bottom: 0; }
.pf-field label {
  display: block;
  font-size: var(--t-xs);
  font-weight: 700;
  color: var(--ink-500);
  margin-bottom: 5px;
}
.pf-field .sn-input { margin: 0; }
.pf-field .pf-tip { display: block; font-size: 11px; color: var(--ink-400); margin-top: 5px; }
.sn-area { height: 78px; padding: 10px 12px; resize: none; line-height: 1.6; }
.pf-field-row {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 12px 13px;
  border: 1px solid var(--line);
  border-radius: var(--r-lg);
  font-size: var(--t-sm);
  color: var(--ink-500);
}
.pf-field-row b { margin-left: auto; color: var(--ink-900); font-weight: 700; }
.pf-field-row .ic { width: 14px; height: 14px; color: var(--ink-300); }
.pf-chips { display: flex; flex-wrap: wrap; gap: 7px; margin: -4px 0 12px; }
.pf-chip {
  padding: 6px 11px;
  border-radius: var(--r-pill);
  border: 1px solid var(--line);
  background: #fff;
  font-size: var(--t-xs);
  color: var(--ink-600);
}
.pf-chip.on { border-color: var(--blue-600); background: var(--blue-50); color: var(--blue-800); font-weight: 700; }
.pf-note {
  display: flex;
  align-items: flex-start;
  gap: 6px;
  padding: 0 4px;
  font-size: var(--t-xs);
  color: var(--ink-400);
  line-height: 1.7;
}
.pf-note .ic { flex: none; width: 14px; height: 14px; margin-top: 2px; }

/* ---- 简历编辑：性别分段 / 从业经历 / 技能标签（基本信息可改后新增的控件） ---- */
.pf-seg { display: flex; gap: 8px; margin: 6px 0 0; }
.pf-seg-b {
  flex: 1; height: 38px; border-radius: var(--r-pill);
  border: 1.5px solid var(--line-2); background: #fff;
  font-size: var(--t-base); font-weight: 600; color: var(--ink-800); outline: none;
}
.pf-seg-b.on {
  border-color: var(--gold-500); background: #fff8ec; color: #8a5a12; font-weight: 700;
}
.pf-field-row .sn-narrow { width: 96px; margin: 0; }
.pf-exp {
  border: 1px solid var(--line-2); border-radius: 10px; padding: 10px 10px 4px; margin-bottom: 10px;
}
.pf-exp-hd {
  display: flex; align-items: center; justify-content: space-between;
  margin-bottom: 4px; font-size: var(--t-xs);
}
.pf-exp-hd b { font-size: 12px; color: var(--ink-800); }
.pf-exp-del {
  display: inline-flex; align-items: center; gap: 3px;
  font-size: 12px; color: var(--ink-400);
}
.pf-exp-del .ic { width: 13px; height: 13px; }
.pf-exp .pf-field-row { margin-bottom: 6px; }
.pf-exp .sn-input { height: 40px; }
.pf-add {
  display: flex; align-items: center; justify-content: center; gap: 5px;
  width: 100%; height: 40px; margin-top: 2px;
  border: 1px dashed var(--line-2); border-radius: var(--r-pill);
  background: #fff; font-size: var(--t-base); font-weight: 700; color: var(--blue-600);
}
.pf-add .ic { width: 14px; height: 14px; }
.pf-skill-box { display: flex; flex-wrap: wrap; gap: 7px; margin: 4px 0 8px; min-height: 22px; }
.pf-skill {
  display: inline-flex; align-items: center; gap: 4px;
  padding: 5px 8px 5px 11px; border-radius: var(--r-pill);
  background: var(--blue-50); color: var(--blue-800);
  font-size: var(--t-xs); font-weight: 600;
}
.pf-skill button { display: inline-flex; color: var(--ink-400); }
.pf-skill button .ic { width: 12px; height: 12px; }

/* 求职状态选择弹层 */
.st-pick { display: flex; flex-direction: column; gap: 8px; margin: 4px 0 6px; }
.st-opt {
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%;
  padding: 12px 13px;
  border: 1px solid var(--line);
  border-radius: var(--r-lg);
  background: #fff;
  font-size: var(--t-sm);
  font-weight: 600;
  color: var(--ink-800);
}
.st-opt.on { border-color: var(--blue-600); background: var(--blue-50); color: var(--blue-800); }
.st-opt .ic { margin-left: auto; width: 16px; height: 16px; color: var(--blue-700); }
.st-radio {
  width: 17px; height: 17px;
  flex: none;
  border-radius: 50%;
  border: 1.6px solid var(--line-2);
}
.st-opt.on .st-radio { border-color: var(--blue-700); box-shadow: inset 0 0 0 3.5px #fff, inset 0 0 0 9px var(--blue-700); }

/* 余额卡 */
.wallet-card {
  background: linear-gradient(140deg, #FFFCF4, #FFF6E2);
  border: 1px solid var(--gold-200);
}
.wc-top { display: flex; align-items: center; }
.wc-label {
  display: flex;
  align-items: center;
  gap: 5px;
  font-size: var(--t-sm);
  font-weight: 700;
  color: var(--gold-700);
}
.wc-detail {
  margin-left: auto;
  display: inline-flex;
  align-items: center;
  gap: 2px;
  font-size: var(--t-xs);
  color: var(--ink-500);
  font-weight: 600;
}
.wc-main {
  display: flex;
  align-items: flex-end;
  gap: 12px;
  margin-top: 8px;
}
.wc-money { display: flex; align-items: baseline; gap: 3px; }
.wc-money .num {
  font-size: 40px;
  font-weight: 800;
  color: var(--ink-900);
  letter-spacing: -1px;
  line-height: 1.05;
}
.wc-money small { font-size: var(--t-sm); color: var(--ink-500); font-weight: 600; }
.wc-side {
  margin-left: auto;
  text-align: right;
  font-size: var(--t-xs);
  color: var(--ink-500);
  line-height: 1.8;
}
.wc-side b { color: var(--ink-800); font-family: var(--font-num); }
.wc-actions {
  display: flex;
  gap: 9px;
  margin-top: 14px;
  padding-top: 13px;
  border-top: 1px dashed var(--gold-200);
}
.wc-btn {
  flex: 1;
  height: 42px;
  border-radius: var(--r-lg);
  background: #fff;
  border: 1px solid var(--gold-200);
  color: var(--gold-700);
  font-size: var(--t-sm);
  font-weight: 800;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  position: relative;
}
.wc-btn-main { background: var(--gold-500); border-color: var(--gold-500); color: #3E2C05; }
.wc-badge {
  position: absolute;
  top: -8px; right: 6px;
  height: 18px;
  padding: 0 6px;
  border-radius: var(--r-pill);
  background: var(--danger);
  color: #fff;
  font-size: 10px;
  font-weight: 700;
  display: grid;
  place-items: center;
}

/* 五入口宫格（2026-10-14 试排：5 列更紧凑，单格横向更小） */
.pf-grid {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 8px;
  margin-top: 12px;
}
/* 「我的服务」宫格的空占位（2026-10-05）：没有落地页的项先空着 ——
   占位元素要留在网格里撑住行列对齐，但整体不可见、不可点。 */
.pf-cell.is-blank { visibility: hidden; }
.pf-cell {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: var(--r-lg);
  padding: 13px 4px 11px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 3px;
  box-shadow: var(--sh-1);
}
.pf-cell:active { background: var(--blue-50); }
.pc-ic {
  width: 36px; height: 36px;
  border-radius: var(--r-md);
  background: var(--blue-50);
  color: var(--blue-700);
  display: grid;
  place-items: center;
  margin-bottom: 4px;
}
.pc-ic .ic { width: 19px; height: 19px; }
.pf-cell b { font-size: var(--t-sm); font-weight: 700; color: var(--ink-900); }
.pc-s { font-size: 11px; color: var(--ink-400); }
.pc-s.dng { color: var(--danger); font-weight: 700; }
.pc-s.warn { color: var(--warn); font-weight: 700; }
.pc-s.ok { color: var(--success); font-weight: 700; }
/* 「邀请工友」那格用金色（原型 pc-s.gold），与其它格子的灰字区分开 */
.pc-s.gold { color: var(--gold-600); font-weight: 700; }

/* ==========================================================================
   原型（设计稿）样式回归 —— 「我的」/「会员中心」/「积分充值」
   ⚠️ 这几块照 2026-09-24 交付的设计稿原型搬回来（工程版改造时把结构换了、样式也就删了）。
      搬样式不改逻辑：数据仍取工程版真接口（余额 / 会员套餐 / 投递数 / 收藏数）。
   ⚠️ 两套会员卡**撞名过**：企业端那张（mobile.ent.js，vc-* 结构）原先也叫 `.vip-card`，
      与工人端「我的」页这张（原型类名）同一套选择器，改一处必坏另一处。
      企业端已改名 `.ent-vipcard`（见本文件尾部与 mobile.ent.js）——
      `.vip-card` 现在是工人端专用，别再拿给企业端用。
   ========================================================================== */
/* 资产条：上叠在 Hero 圆角下摆上 */
.ws-card {
  margin-top: -30px;
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 13px 14px 14px;
  box-shadow: var(--sh-2);
  position: relative;
  z-index: 2;
}
.ws-left { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.ws-label {
  display: flex; align-items: center; gap: 4px;
  font-size: var(--t-xs); font-weight: 600; color: var(--ink-500);
}
.ws-detail {
  margin-left: auto; display: inline-flex; align-items: center; gap: 1px;
  font-size: var(--t-xs); font-weight: 700; color: var(--blue-700);
}
.ws-num { font-size: 31px; font-weight: 800; color: var(--ink-900); letter-spacing: -.5px; line-height: 1.1; }
.ws-meta { font-size: 11px; color: var(--ink-400); margin-top: 1px; }
.ws-meta b { color: var(--ink-700); font-family: var(--font-num); font-weight: 700; }
.ws-charge {
  flex: none; height: 44px; padding: 0 17px;
  border-radius: 12px;   /* 设计稿：大圆角矩形，不是全圆 pill */
  background: linear-gradient(135deg, var(--gold-500), var(--gold-600));
  color: #3E2C05; font-size: var(--t-sm); font-weight: 800;
  display: inline-flex; align-items: center; justify-content: center; gap: 3px;
  box-shadow: 0 4px 12px rgba(201, 153, 43, .32);
}
.ws-charge:active { transform: translateY(1px); box-shadow: 0 2px 6px rgba(201, 153, 43, .28); }

/* 证件预警条：有到期 / 待复审才出现，无预警不占位 */
.cert-alert {
  width: 100%; display: flex; align-items: center; gap: 10px;
  margin-top: 12px; padding: 12px 13px;
  border-radius: var(--r-xl);
  background: linear-gradient(135deg, #FFFBF0, #FFF3DC);
  border: 1px solid var(--gold-200);
  box-shadow: var(--sh-1);
  text-align: left;
}
.cert-alert.is-over { background: linear-gradient(135deg, #FFF6F5, #FFECEA); border-color: rgba(217, 52, 43, .26); }
.ca-ic {
  width: 32px; height: 32px; border-radius: var(--r-md);
  background: rgba(201, 153, 43, .16); color: var(--gold-700);
  display: grid; place-items: center; flex: none;
}
.cert-alert.is-over .ca-ic { background: rgba(217, 52, 43, .12); color: var(--danger); }
.ca-main { flex: 1; min-width: 0; }
.ca-main b {
  display: block; font-size: var(--t-sm); font-weight: 800; color: var(--ink-900);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.ca-main small { display: block; font-size: 11px; color: #A96200; margin-top: 2px; }
.cert-alert.is-over .ca-main small { color: var(--danger); }
.ca-btn { flex: none; display: inline-flex; align-items: center; gap: 1px; font-size: var(--t-xs); font-weight: 800; color: var(--gold-700); }
.cert-alert.is-over .ca-btn { color: var(--danger); }

/* 「我的」页会员卡（原型金卡样式） */
.vip-card {
  display: flex; align-items: center; gap: 12px;
  width: 100%; margin-top: 12px; padding: 14px 15px;
  border-radius: var(--r-xl);
  background: linear-gradient(135deg, #2A4C88 0%, #16325E 100%);
  border: 1px solid rgba(255, 255, 255, .16);
  box-shadow: 0 8px 20px rgba(15, 58, 128, .22);
  text-align: left; position: relative; overflow: hidden;
}
.vip-card::after {
  content: ''; position: absolute; right: -34px; top: -46px;
  width: 140px; height: 140px; border-radius: 50%;
  background: radial-gradient(circle, rgba(240, 200, 105, .30), transparent 70%);
  pointer-events: none;
}
.vip-card .vip-crown {
  width: 42px; height: 42px; flex: none; border-radius: var(--r-md);
  background: linear-gradient(135deg, #F3D488, #D9A93F); color: #5A3E08;
  display: grid; place-items: center;
}
.vip-card .vip-main { flex: 1; min-width: 0; color: #fff; }
.vip-card .vip-main b {
  display: flex; align-items: baseline; flex-wrap: wrap; gap: 4px 8px;
  font-size: var(--t-md); font-weight: 800; letter-spacing: .5px; color: #F7E5B4;
}
.vip-card .vip-main b small { font-size: var(--t-xs); font-weight: 600; letter-spacing: 0; color: rgba(255, 255, 255, .78); }
/* 权益一行小字（设计稿），金色 */
.vip-card .vip-perks { display: block; margin-top: 6px; font-size: 11px; color: #F3D488; }
/* 到期时间：单独一行（设计稿「2027-03-15 到期 · 剩余 162 天」） */
.vip-card .vip-sub { display: block; font-size: 12px; color: rgba(255, 255, 255, .85); margin-top: 3px; }
.vip-card .vip-btn {
  flex: none; padding: 8px 15px; border-radius: var(--r-pill);
  background: linear-gradient(135deg, #F3D488, #D9A93F);
  color: #5A3E08; font-size: var(--t-sm); font-weight: 800;
}
.vip-card:active { filter: brightness(1.06); }
/* 2026-10-04 设计稿：开没开都是同一张深蓝卡（已开通显示套餐名与到期行） */
/* 皇冠章：圆形 + 柔光，比原方块更像一枚勋章 */
.vip-card .vip-crown {
  border-radius: 50%;
  box-shadow: 0 0 0 3px rgba(240, 200, 105, .16), 0 4px 12px rgba(0, 0, 0, .28);
}
/* 斜向流光（纯装饰）：4.6s 扫一次，pointer-events:none 不吃点击 */
.vip-card::before {
  content: ''; position: absolute; top: 0; bottom: 0; left: 0; width: 36%;
  background: linear-gradient(100deg, transparent, rgba(255, 255, 255, .16), transparent);
  transform: translateX(-140%);
  animation: vipShine 4.6s ease-in-out infinite;
  pointer-events: none;
}
@keyframes vipShine {
  0%, 68% { transform: translateX(-140%); }
  100% { transform: translateX(340%); }
}
/* 系统开了"减弱动效"就不扫光（尊重无障碍设置） */
@media (prefers-reduced-motion: reduce) {
  .vip-card::before { animation: none; display: none; }
}

/* 求职档案：完善度圆环（原型样式，工程版改成了进度条，这里一并保留） */
/* ⚠️ .rc-body 必须有：原型靠它把圆环与意向四格并排（flex）。
   少了它 .rc-ring 是 inline 元素 —— width:78px 对 inline 无效，svg 的
   width:100% 相对不存在的包含块回落 300px 默认宽，圆环撑满整行。 */
.rc-body {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-top: 13px;
}
.rc-ring { position: relative; width: 78px; height: 78px; flex: none; }
.rc-ring svg { display: block; width: 100%; height: 100%; }
.rc-ring-t {
  position: absolute; inset: 0; display: flex; flex-direction: column;
  align-items: center; justify-content: center; gap: 1px;
}
.rc-ring-t b { font-size: 15px; font-weight: 800; color: var(--blue-700); font-family: var(--font-num); line-height: 1; }
.rc-ring-t small { font-size: 9.5px; color: var(--ink-400); }
.rc-grid { flex: 1; min-width: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 7px; }

/* ==========================================================================
   会员中心 / 积分充值（**同一套付费页视觉语言**，2026-10-15 抽共用）
   ⚠️ 两个页面共用这份样式：`vip-* / vh-* / vp-*`（会员中心）与
      `pay-* / ph-* / pt-*`（积分充值）是**同一规则的成对选择器** ——
      改一处两页同时生效，不会各改各的慢慢漂开。
      用户要求「积分充值页做得像 VIP 充值页那样」，抽共用比复制一份更稳。
   ========================================================================== */
.vip-hero, .pay-hero {
  background: linear-gradient(168deg, #16264A, #0F3A80 62%, #1D4E9E);
  color: #fff; padding-bottom: 26px;
  border-radius: 0 0 var(--r-2xl) var(--r-2xl);
  margin-bottom: -14px;
}
.vip-hero .navbar, .pay-hero .navbar { background: transparent; }
.vh-card, .ph-card {
  display: flex; align-items: center; gap: 13px;
  margin: 8px 16px 0; padding: 16px;
  border-radius: var(--r-xl);
  background: rgba(255, 255, 255, .08);
  border: 1px solid rgba(222, 180, 79, .45);
  position: relative; overflow: hidden;
}
.vh-card::after, .ph-card::after {
  content: ''; position: absolute; right: -30px; top: -44px;
  width: 120px; height: 120px; border-radius: 50%;
  background: radial-gradient(circle, rgba(240, 200, 105, .30), transparent 70%);
  pointer-events: none;
}
.vh-crown, .ph-badge {
  width: 52px; height: 52px; flex: none; border-radius: var(--r-lg);
  background: linear-gradient(135deg, #F3D488, #D9A93F); color: #5A3E08;
  display: grid; place-items: center;
}
.vh-crown .ic, .ph-badge .ic { width: 28px; height: 28px; }
.vh-info, .ph-info { flex: 1; min-width: 0; position: relative; z-index: 1; }
.vh-info b, .ph-info b { display: block; font-size: 19px; font-weight: 800; letter-spacing: .5px; color: #F7E5B4; }
.vh-info small, .ph-info small { display: block; font-size: var(--t-xs); color: rgba(255, 255, 255, .75); margin-top: 4px; }
.vh-perks, .ph-pill {
  display: inline-block; margin-top: 9px; font-size: 11px; color: #F3D488;
  border: 1px solid rgba(243, 212, 136, .38); border-radius: var(--r-pill); padding: 3px 9px;
}
/* 积分充值页头：余额是主角，字号提到「金额级」（会员中心那张是身份卡，不用改） */
.ph-info .ph-num {
  display: block; font-size: 30px; font-weight: 800; letter-spacing: -1px;
  line-height: 1.1; color: #F7E5B4; font-family: var(--font-num);
  font-variant-numeric: tabular-nums;
}
.ph-info .ph-num small { display: inline; font-size: var(--t-sm); font-weight: 600; margin-left: 2px; color: rgba(247, 229, 180, .82); }

/* 套餐三卡 / 充值档位（同一套） */
.vip-plans, .pt-plans { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 9px; margin-top: 12px; }
.vip-pack, .pt-pack {
  position: relative; display: flex; flex-direction: column;
  align-items: center; gap: 3px; padding: 18px 4px 13px;
  border-radius: var(--r-lg); background: var(--bg);
  border: 1.5px solid transparent; text-align: center;
  font-family: inherit; cursor: pointer;
}
.vip-pack.on, .pt-pack.on { background: var(--gold-50); border-color: var(--gold-500); }
.vip-pack b, .pt-pack b { font-size: var(--t-md); font-weight: 800; color: var(--ink-900); }
.vp-price, .pt-price { display: flex; align-items: baseline; gap: 2px; margin-top: 3px; }
.vp-price em, .pt-price em {
  font-style: normal; font-size: 26px; font-weight: 800; letter-spacing: -.5px;
  color: var(--gold-600); font-family: var(--font-num);
}
.vip-pack.on .vp-price em, .pt-pack.on .pt-price em { color: var(--gold-700); }
.vp-price small, .pt-price small { font-size: var(--t-xs); color: var(--ink-500); font-weight: 600; }
.vp-per, .pt-per { font-size: 10.5px; color: var(--ink-400); }
.vp-best, .vp-save {
  position: absolute; top: -1px; right: -1px;
  font-size: 10px; font-weight: 800; padding: 3px 8px;
  border-radius: 0 var(--r-lg) 0 var(--r-md); line-height: 1;
}
.vp-best { background: linear-gradient(135deg, #F3D488, #D9A93F); color: #5A3E08; }
.vp-save { background: var(--gold-100); color: var(--gold-700); }
.vip-pack .vp-best + .vp-save { top: auto; bottom: -1px; right: -1px; border-radius: 0 0 var(--r-lg) 0 var(--r-md); }
.vip-pay, .pay-gold {
  margin-top: 14px; height: 46px;
  background: linear-gradient(135deg, #F3D488, #D9A93F);
  color: #4A3406; font-weight: 800;
}
.vip-pay:active, .pay-gold:active { filter: brightness(.96); }

/* 权益 / 常见问题列表 */
.vb-list { margin-top: 4px; }
.vb-row { display: flex; align-items: flex-start; gap: 11px; padding: 12px 0; border-bottom: 1px dashed var(--line); }
.vb-list .vb-row:last-child { border-bottom: 0; padding-bottom: 4px; }
.vb-ic {
  width: 36px; height: 36px; flex: none; border-radius: var(--r-md);
  background: var(--gold-50); border: 1px solid var(--gold-200);
  color: var(--gold-600); display: grid; place-items: center;
}
.vb-ic .ic { width: 18px; height: 18px; }
.vb-main { flex: 1; min-width: 0; }
.vb-main b { display: block; font-size: var(--t-sm); font-weight: 800; color: var(--ink-900); }
.vb-main small { display: block; font-size: var(--t-xs); color: var(--ink-500); margin-top: 3px; line-height: 1.6; }
.vb-qa { display: block; }
.vb-qa b { display: block; font-size: var(--t-sm); font-weight: 800; color: var(--ink-900); }
.vb-qa small { display: block; font-size: var(--t-xs); color: var(--ink-500); margin-top: 5px; line-height: 1.7; }

/* 简历完善度 */
.resume-card { border-left: 3px solid var(--blue-700); }
.rc-head { display: flex; align-items: center; gap: 10px; }
.rc-head h3 { font-size: var(--t-md); font-weight: 800; }
.rc-head p { font-size: var(--t-xs); color: var(--ink-500); margin-top: 3px; }
.rc-head .btn { margin-left: auto; }
.rc-bar {
  height: 9px;
  border-radius: var(--r-pill);
  background: var(--line-2);
  margin-top: 13px;
  overflow: hidden;
}
.rc-bar i {
  display: block;
  height: 100%;
  border-radius: var(--r-pill);
  background: linear-gradient(90deg, var(--blue-600), var(--blue-700));
}
.rc-foot {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-top: 9px;
  font-size: var(--t-xs);
  color: var(--ink-500);
}
.rc-foot b { color: var(--blue-700); font-size: var(--t-sm); font-family: var(--font-num); }
.rc-tip { margin-left: auto; color: var(--danger); }

/* 求职意向 */
.intent-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 9px;
}
/* 意向四格做成了 <button>（点任意一格进编辑资料）：button 的默认
   边框/居中/字体必须 reset 掉，否则和原型那块灰底 div 长得不一样 */
.ig-cell {
  appearance: none; -webkit-appearance: none; border: 0; width: 100%;
  font: inherit; text-align: left; cursor: pointer;
  background: var(--bg);
  border-radius: var(--r-lg);
  padding: 11px;
}
.ig-cell small { display: block; font-size: var(--t-xs); color: var(--ink-400); }
.ig-cell b {
  display: block;
  font-size: var(--t-sm);
  font-weight: 700;
  color: var(--ink-900);
  margin-top: 4px;
  line-height: 1.45;
}
.status-row {
  display: flex;
  align-items: center;
  gap: 7px;
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px dashed var(--line);
  font-size: var(--t-sm);
  color: var(--ink-600);
}
.status-row b { color: var(--success); font-weight: 800; }
.sr-dot {
  width: 8px; height: 8px;
  border-radius: 50%;
  background: var(--success);
  box-shadow: 0 0 0 3px var(--success-100);
  flex: none;
}
.status-row .btn { margin-left: auto; }

.pf-end {
  text-align: center;
  font-size: var(--t-xs);
  color: var(--ink-400);
  line-height: 1.8;
  padding: 22px 0 6px;
}
.pf-end .ic { margin: 0 auto 6px; color: var(--ink-300); }

/* ==========================================================================
   「我的」改版 · 待办聚合 / 入口配色 / 简历卡内分栏
   ========================================================================== */

/* 待办卡：实名 / 简历缺项 / 证书到期统一在首屏，不用进子页面才知道 */
/* 待办卡：紧跟浮岛白卡（2026-10-05 上移到余额卡之前），与 .wa-card 同款 12px 上距
   —— 原来它排在余额卡后面、贴着深蓝卡走（无上距），挪到首位后不给间距会顶到白卡。 */
.todo-card { margin-top: 12px; padding: 12px 12px 4px; }
.tc-head {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 0 2px 9px;
}
.tc-head .ic { width: 15px; height: 15px; color: var(--gold-600); }
.tc-head b { font-size: var(--t-sm); font-weight: 800; color: var(--ink-900); }
.tc-head small { font-size: 11px; color: var(--ink-500); margin-left: auto; }
.todo-card .pf-todo { margin: 0 0 8px; }
.todo-card .pf-todo:last-child { margin-bottom: 0; }

/* ==========================================================================
   每日签到卡（2026-10-12）
   放在「我的」页白卡之后、待办之前：签到是每天一次的正反馈，埋在屏底没人会看到。
   ⚠️ 只在 live 且 GET /me/checkin 取到数据时才渲染（逻辑见 mobile.screens-b.js），
      这张卡上任何一个数字都不能是猜的。
   ========================================================================== */
.ck-card { margin-top: 12px; padding: 12px 14px 13px; }
.ck-head { display: flex; align-items: center; gap: 6px; margin-bottom: 10px; }
.ck-head b {
  display: flex; align-items: center; gap: 5px;
  font-size: var(--t-sm); font-weight: 800; color: var(--ink-900);
}
.ck-head .ic { width: 15px; height: 15px; color: var(--gold-600); }
.ck-streak { margin-left: auto; font-size: 11px; color: var(--ink-500); }
.ck-streak .num { color: var(--gold-600); font-size: var(--t-sm); font-weight: 800; }
/* 近 7 天：已签的那天描金边框，一眼能看出断在哪天 */
.ck-dots { display: flex; gap: 4px; }
.ck-dot {
  flex: 1; padding: 6px 0; text-align: center;
  border-radius: var(--r-lg); border: 1px solid transparent;
  background: var(--bg-2, #F4F5F7);
  font-size: 11px; color: var(--ink-500);
}
.ck-dot.on {
  background: linear-gradient(120deg, #FFF8E8, #FFF1D6);
  border-color: var(--gold-200);
  color: var(--gold-600); font-weight: 800;
}
.ck-foot { display: flex; align-items: center; gap: 8px; margin-top: 10px; }
.ck-foot small { font-size: 11px; color: var(--ink-500); }
.ck-foot small b { color: var(--gold-600); }
.ck-btn {
  margin-left: auto; padding: 7px 18px;
  border: 0; border-radius: 999px;
  background: var(--blue-600); color: #fff;
  font-size: var(--t-sm); font-weight: 800;
}
.ck-btn[disabled] { opacity: .55; }
.ck-done {
  margin-left: auto; display: flex; align-items: center; gap: 4px;
  font-size: 11px; font-weight: 700; color: var(--ok, #17a673);
}
.ck-done .ic { width: 13px; height: 13px; }
/* 证书过期这类更急的走红色系，与金色「待完善」区分开 */
.pf-todo.dng { background: linear-gradient(120deg, #FFF1F0, #FDE9E7); border-color: #F6C9C5; }
.pf-todo.dng .pt-ic { background: var(--danger-100); color: var(--danger); }
.pf-todo.dng .pt-btn { color: var(--danger); }

/* 没有待办时也要给个说法，别留一块空白让人以为没加载出来 */
.pf-ok {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 12px 14px;
  /* 「全部就绪」条与待办卡同一个位置（待办为空时顶替它）：上移后紧跟白卡，同样要 12px 上距 */
  margin-top: 12px;
  margin-bottom: 12px;
  border-radius: var(--r-lg);
  background: var(--success-100);
  border: 1px solid #C6E8D3;
  font-size: var(--t-sm);
  font-weight: 700;
  color: var(--success-600);
}
.pf-ok .ic { width: 15px; height: 15px; }

/* 四个核心入口分色：扫一眼就能定位，不再四个一样的蓝块 */
.pc-ic.t-blue  { background: var(--blue-100);   color: var(--blue-700); }
.pc-ic.t-gold  { background: var(--gold-100);   color: var(--gold-700); }
.pc-ic.t-red   { background: var(--danger-100); color: var(--danger); }
.pc-ic.t-green { background: var(--success-100); color: var(--success); }

/* 简历卡内：缺项 chips（点了直接去编辑）+ 分栏 + 意向小标题 */
.rc-miss { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 10px; }
.rc-miss .pf-chip { padding: 5px 10px; font-size: 11px; color: var(--ink-600); cursor: pointer; }
.rc-miss .pf-chip:active { background: var(--blue-50); }
.rc-split { height: 1px; background: var(--line-2); margin: 12px 0 10px; }
.rc-sub {
  display: flex;
  align-items: center;
  gap: 5px;
  font-size: var(--t-xs);
  font-weight: 800;
  color: var(--ink-700);
  margin-bottom: 8px;
}
.rc-sub .ic { width: 14px; height: 14px; color: var(--ink-400); }
.rc-edit {
  margin-left: auto;
  display: inline-flex;
  align-items: center;
  gap: 3px;
  padding: 3px 8px;
  border-radius: var(--r-pill);
  background: var(--blue-50);
  color: var(--blue-700);
  font-size: 11px;
  font-weight: 700;
}
.rc-edit .ic { width: 12px; height: 12px; }

/* ==========================================================================
   账号余额
   ========================================================================== */
.bal-head {
  background: linear-gradient(168deg, var(--blue-800), var(--blue-700));
  color: #fff;
  padding-bottom: 24px;
  border-radius: 0 0 var(--r-2xl) var(--r-2xl);
  margin-bottom: -14px;
}
.bal-head .navbar { background: transparent; }
.bal-amount { padding: 6px 18px 0; }
.ba-label { font-size: var(--t-sm); color: rgba(255, 255, 255, .68); }
.ba-num {
  font-size: 46px;
  font-weight: 800;
  letter-spacing: -1.5px;
  margin-top: 6px;
  line-height: 1.05;
}
.ba-sub { font-size: var(--t-xs); color: rgba(255, 255, 255, .62); margin-top: 8px; }

/* 充值档位卡（.pack-grid / .pack / .pack-gift）2026-10-15 已退役：
   积分充值页改用与「会员中心」同一套的 .pt-pack / .pt-plans / .vp-best / .pay-gold
   （见上方「会员中心 / 积分充值」共用块）。此处不再保留第二套样式。
   ⚠️ `.pack` 这个**类名**仍在 pagePoints 的按钮上：mobile.app.js 的 data-pack 分支
   靠 `querySelectorAll('.pack')` 原地翻转高亮，删类名会打断那个分支。它不承担样式。 */
.pay-note {
  display: flex;
  align-items: flex-start;
  gap: 5px;
  font-size: var(--t-xs);
  color: var(--ink-400);
  line-height: 1.55;
  margin-top: 12px;
}
.pay-note .ic { flex: none; margin-top: 1px; color: var(--ink-300); }

.use-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 9px;
}
.ug-cell {
  background: var(--bg);
  border-radius: var(--r-lg);
  padding: 12px;
  display: flex;
  flex-direction: column;
  gap: 3px;
}
.ug-cell .ic { width: 19px; height: 19px; color: var(--blue-600); margin-bottom: 4px; }
.ug-cell b { font-size: var(--t-sm); font-weight: 800; color: var(--ink-900); }
.ug-cell small { font-size: 11px; color: var(--ink-500); line-height: 1.5; }

.row-ic.ok { background: var(--success-100); color: var(--success); }
.bill-a { font-size: var(--t-md); font-weight: 800; font-family: var(--font-num); }
.bill-a.in { color: var(--success); }
.bill-a.out { color: var(--ink-700); }

/* 收支明细头部：页签 + 汇总 */
.bill-head {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 12px 14px;
  border-bottom: 1px solid var(--line-2);
}
.bh-tabs {
  display: flex;
  gap: 3px;
  padding: 3px;
  border-radius: var(--r-md);
  background: var(--bg);
  flex: none;
}
.bh-tab {
  height: 28px;
  padding: 0 13px;
  border-radius: var(--r-sm);
  font-size: var(--t-sm);
  font-weight: 700;
  color: var(--ink-500);
}
.bh-tab.on { background: #fff; color: var(--blue-700); box-shadow: var(--sh-1); }
.bh-sum {
  margin-left: auto;
  display: flex;
  gap: 12px;
  font-size: var(--t-xs);
  color: var(--ink-500);
}
.bh-sum b { font-family: var(--font-num); font-size: var(--t-sm); font-weight: 800; }
.bh-sum b.in { color: var(--success); }
.bh-sum b.out { color: var(--ink-700); }

/* ==========================================================================
   投递记录
   ========================================================================== */
.dv-card { margin-top: 12px; }
.dv-card:first-child { margin-top: 14px; }
.dv-top { display: flex; align-items: flex-start; gap: 10px; }
.dv-main { flex: 1; min-width: 0; }
.dv-job { font-size: var(--t-md); font-weight: 800; color: var(--ink-900); }
.dv-co { font-size: var(--t-sm); color: var(--ink-500); margin-top: 5px; }
.dv-right {
  flex: none;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 6px;
}
.dv-note {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-top: 12px;
  padding: 9px 11px;
  border-radius: var(--r-md);
  background: var(--bg);
  font-size: var(--t-sm);
  color: var(--ink-600);
}
.dv-note .ic { flex: none; color: var(--ink-400); }
.dv-note-hl {
  background: var(--gold-50);
  border: 1px solid var(--gold-200);
  color: var(--gold-700);
  font-weight: 600;
}
.dv-note-hl .ic { color: var(--gold-600); }
.dv-foot {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px dashed var(--line);
}
.dv-time { flex: 1; font-size: var(--t-xs); color: var(--ink-400); }

/* ==========================================================================
   实名认证
   ========================================================================== */
.vf-banner {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-top: 14px;
  background: linear-gradient(140deg, var(--blue-800), var(--blue-700));
  border: 0;
  color: #fff;
}
.vb-ring { flex: none; }
.ring { position: relative; }
.ring svg { width: 100%; height: 100%; }
.ring-tx {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  font-size: var(--t-md);
  font-weight: 800;
  color: var(--gold-300);
  font-family: var(--font-num);
}
.vb-txt h3 { font-size: var(--t-lg); font-weight: 800; }
.vb-txt p {
  font-size: var(--t-sm);
  color: rgba(255, 255, 255, .7);
  margin-top: 6px;
  line-height: 1.55;
}

/* ---- 实名认证状态卡（W1 · 20261012）----
   四态（未提交 / 核验中 / 已通过 / 未通过）共用一张卡：底色定基调、图标盘给情绪、
   三步进度条说清「走到哪一步、还差什么」。原来只有一个圆环百分比 —— 50% 这个数
   既说不出卡在哪一步，也传达不了"交上去了、正在办"这种"有人在管"的感觉。 */
.vf-stat {
  margin: 14px 0 12px;
  border-radius: var(--r-xl);
  padding: 16px 14px 14px;
  color: #fff;
  background: linear-gradient(150deg, var(--blue-800), #1A4B9B);
}
/* 四态底色：todo / wait 同用品牌蓝（wait 靠脉动图标区分），pass 绿、reject 红。
   `.st-todo` / `.st-wait` 显式写出来（不是"省略即默认"）—— verify 的类名覆盖检查
   按字面收，省略会被判成"用了没定义的类"。 */
.vf-stat.st-todo, .vf-stat.st-wait { background: linear-gradient(150deg, var(--blue-800), #1A4B9B); }
.vf-stat.st-pass   { background: linear-gradient(150deg, #1D7A50, #135C3B); }
.vf-stat.st-reject { background: linear-gradient(150deg, #8F2A22, #6E1F19); }
.vs-top { display: flex; gap: 12px; align-items: flex-start; }
.vs-ic {
  position: relative;
  flex: none;
  width: 52px; height: 52px;
  border-radius: 50%;
  display: grid; place-items: center;
  background: rgba(255, 255, 255, .14);
  color: var(--gold-300);
}
.vs-ic svg { width: 27px; height: 27px; }
.st-pass .vs-ic { background: rgba(255, 255, 255, .18); color: #fff; }
.st-reject .vs-ic { background: rgba(255, 255, 255, .16); color: #FFD9D5; }
/* 核验中：双圈脉动（一圈 2s、错开 1s）—— 静态图标传达不了"正在办" */
.vs-ic.pulse::before, .vs-ic.pulse::after {
  content: '';
  position: absolute;
  inset: -4px;
  border-radius: 50%;
  border: 1.5px solid rgba(255, 255, 255, .35);
  animation: vf-pulse 2s ease-out infinite;
}
.vs-ic.pulse::after { animation-delay: 1s; }
@keyframes vf-pulse {
  0% { transform: scale(.82); opacity: 1; }
  100% { transform: scale(1.25); opacity: 0; }
}
.vs-txt { min-width: 0; padding-top: 2px; }
.vs-txt h3 { font-size: var(--t-lg); font-weight: 800; }
.vs-txt p { margin-top: 5px; font-size: 12px; line-height: 1.6; color: rgba(255, 255, 255, .78); }
/* 三步进度条 */
.vf-steps { display: flex; margin-top: 14px; }
.vf-st {
  position: relative;
  flex: 1;
  display: flex; flex-direction: column; align-items: center; gap: 5px;
}
.vf-st i {
  display: grid; place-items: center;
  width: 22px; height: 22px;
  border-radius: 50%;
  font-style: normal;
  font-size: 10.5px; font-weight: 900;
  background: rgba(255, 255, 255, .16);
  color: rgba(255, 255, 255, .92);
}
.vf-st i svg { width: 12px; height: 12px; }
.vf-st b { font-size: 10px; font-weight: 700; color: rgba(255, 255, 255, .72); }
.vf-st:not(:last-child)::after {
  content: '';
  position: absolute; top: 10px;
  left: calc(50% + 14px); right: calc(-50% + 14px);
  height: 2px;
  background: rgba(255, 255, 255, .18);
}
.vf-st.done i { background: #2FA36B; color: #fff; }
.vf-st.done::after { background: #2FA36B; }
.vf-st.done b { color: rgba(255, 255, 255, .9); }
.vf-st.cur i { background: var(--gold-500); color: #fff; box-shadow: 0 0 0 4px rgba(201, 153, 43, .25); }
.vf-st.cur b { color: #fff; font-weight: 800; }
.vf-st.bad i { background: #FF8A80; color: #5C1610; }
.vf-st.bad b { color: #FFD9D5; }
/* 通过态徽标行 */
.vs-meta { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 11px; }
.vs-meta span {
  display: inline-flex; align-items: center; gap: 4px;
  height: 24px; padding: 0 9px;
  border-radius: var(--r-pill);
  background: rgba(255, 255, 255, .13);
  font-size: 11px; font-weight: 700;
}
/* 只读摘要行（核验中 / 已通过：资料锁定，不给能填的假表单） */
.vf-blk { margin-bottom: 12px; }
.vf-ro { display: flex; align-items: center; gap: 8px; padding: 12px; }
.vf-ro + .vf-ro { border-top: 1px solid var(--line); }
.vf-ro b { font-size: var(--t-md); font-weight: 800; color: var(--ink-900); }
.vf-ro small { margin-left: auto; flex: none; font-size: var(--t-xs); color: var(--ink-400); }
.vf-ro .chip { margin-left: auto; }
/* 实名信息卡里的证件照（只读态：看的是自己传的材料 —— 不是上传位，不响应点击） */
.vf-ro-shots { display: flex; gap: 10px; padding: 0 12px 12px; }
.vf-ro-shots .vf-shot-b { min-height: 92px; cursor: default; }

.upload-row { display: flex; gap: 10px; }
.uploader {
  flex: 1;
  padding: 18px 8px;
  border-radius: var(--r-lg);
  border: 1.5px dashed var(--blue-300);
  background: var(--blue-50);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  color: var(--blue-700);
}
.uploader:active { background: var(--blue-100); }
.uploader .ic { width: 24px; height: 24px; margin-bottom: 3px; }
.uploader span { font-size: var(--t-sm); font-weight: 800; }
.uploader small { font-size: 11px; color: var(--ink-500); }

.cert-list { display: flex; flex-direction: column; gap: 9px; margin-top: 13px; }
.cert-item {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 11px 12px;
  border-radius: var(--r-lg);
  background: var(--bg);
}
.cert-item.ok { background: var(--success-100); }
.cert-item.warn { background: var(--warn-100); }
.ce-ic {
  width: 32px; height: 32px;
  border-radius: var(--r-md);
  background: rgba(255, 255, 255, .8);
  color: var(--success);
  display: grid;
  place-items: center;
  flex: none;
}
.cert-item.warn .ce-ic { color: var(--warn); }
.cert-item b { font-size: var(--t-sm); font-weight: 800; color: var(--ink-900); }
.cert-item small {
  display: block;
  font-size: 11px;
  color: var(--ink-500);
  margin-top: 3px;
  font-family: var(--font-num);
}
.cert-item > div { flex: 1; min-width: 0; }

/* ==========================================================================
   公告
   ========================================================================== */
.nt-row { align-items: flex-start; }
.nt-date {
  width: 46px;
  flex: none;
  text-align: center;
  padding-top: 2px;
}
.nt-date b {
  display: block;
  font-size: var(--t-xl);
  font-weight: 800;
  color: var(--blue-700);
  font-family: var(--font-num);
  line-height: 1.1;
}
.nt-date small { font-size: 11px; color: var(--ink-400); }
.nt-title {
  font-size: var(--t-base);
  font-weight: 600;
  line-height: 1.5;
}

/* ==========================================================================
   提示条 / 空状态
   ========================================================================== */
.tip-bar {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 11px 12px;
  border-radius: var(--r-lg);
  margin: 14px 0 4px;
  font-size: var(--t-sm);
  font-weight: 600;
  line-height: 1.45;
}
.tip-bar p { flex: 1; }
.tip-bar .ic { flex: none; }
.tip-bar .tip-btn {
  flex: none;
  height: 30px;
  padding: 0 11px;
  border-radius: var(--r-sm);
  font-size: var(--t-sm);
  font-weight: 700;
}
.tip-brand { background: var(--blue-50); color: var(--blue-700); }
.tip-brand .tip-btn { background: var(--blue-700); color: #fff; }
.tip-warn { background: var(--danger-100); color: #8E1F18; }
.tip-warn .tip-btn { background: var(--danger); color: #fff; }
/* ⚠️ `.tip-ok` 一直只被引用、从未被定义（screens-b 的"审核通过"提示条因此是无底色的裸文字）——
   本轮补上，与 .tip-success 同色但语义是"本条已通过"。 */
.tip-ok { background: var(--success-100); color: var(--success-600); }

.empty {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  padding: 60px 20px;
  text-align: center;
}
.em-ic {
  width: 62px; height: 62px;
  border-radius: var(--r-2xl);
  background: var(--blue-50);
  color: var(--blue-300);
  display: grid;
  place-items: center;
}
.empty p { font-size: var(--t-base); color: var(--ink-600); font-weight: 600; }
.empty small { font-size: var(--t-sm); color: var(--ink-400); }

/* ==========================================================================
   首页页脚
   ========================================================================== */
.home-foot { padding: 26px 0 6px; text-align: center; }
.hf-line {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: var(--t-xs);
  color: var(--ink-400);
  font-weight: 600;
}
.hf-line span { flex: 1; height: 1px; background: var(--line); }
.home-foot p { font-size: 11px; color: var(--ink-300); margin-top: 9px; line-height: 1.6; }

/* ==========================================================================
   登录页
   ========================================================================== */
/* ⚠️ 这里**不要**给 .screen-login 加 height/flex/min-height:0 来做滚动 ——
   登录页外面本来就包着一层 .app-body（display:block + overflow-y:auto + 固定高），
   滚动由它负责；在 .screen-login 上限制高度反而会让内容较短的「找回密码」页撑不满背景。
   （曾误加过一次：登录页协议行被裁时以为是缺滚动，实际根因是 live.adapter 的 bootIt 重复执行
     导致 bind() 绑两次，勾选被切换两次。已在 live.adapter.js 修幂等。） */
.screen-login { background: var(--bg); }
/* 品牌区：只负责"这是谁"，信息一句话说完；底部留 62px 给白卡上浮压住 */
.lg-hero {
  background: linear-gradient(168deg, var(--blue-900), var(--blue-700) 62%, #123E86);
  color: #fff;
  padding: 44px 22px 62px;
  position: relative;
  overflow: hidden;
  border-radius: 0 0 var(--r-2xl) var(--r-2xl);
}
.lg-hero::after {
  content: "";
  position: absolute;
  inset: 0;
  background-image: repeating-linear-gradient(
    -55deg, rgba(255, 255, 255, .05) 0 1px, transparent 1px 14px);
  pointer-events: none;
}
.lg-hero > * { position: relative; z-index: 1; }
.lg-brand { text-align: center; }
.lg-mark {
  width: 76px; height: 76px;
  border-radius: 22px;
  background: var(--gold-500);
  color: #3E2C05;
  display: grid;
  place-items: center;
  margin: 0 auto 16px;
  box-shadow: 0 10px 26px rgba(0, 0, 0, .26), inset 0 1px 0 rgba(255, 255, 255, .5);
}
.lg-name {
  font-size: 34px;
  font-weight: 900;
  letter-spacing: 5px;
  text-indent: 5px;
}
.lg-slogan {
  font-size: var(--t-sm);
  color: rgba(255, 255, 255, .78);
  line-height: 1.6;
  margin-top: 10px;
  letter-spacing: .2px;
}
/* 三个数字改成一排半透明 chip：原来是三格白字，占了太多视觉重量 */
.lg-stats {
  display: flex;
  justify-content: center;
  gap: 8px;
  margin-top: 22px;
}
.ls-cell {
  display: flex;
  align-items: baseline;
  gap: 5px;
  padding: 6px 12px;
  border-radius: var(--r-pill);
  background: rgba(255, 255, 255, .12);
  border: 1px solid rgba(255, 255, 255, .16);
}
.ls-cell b {
  font-size: var(--t-lg);
  font-weight: 800;
  color: var(--gold-300);
}
.ls-cell small {
  font-size: 11px;
  color: rgba(255, 255, 255, .72);
}

.lg-body { padding: 0 16px 30px; }
/* 表单白卡：上浮压住品牌区，把"登录"提到视觉最前 */
.lg-card {
  position: relative;
  z-index: 2;
  margin-top: -42px;
  padding: 18px 16px 16px;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: var(--r-2xl);
  box-shadow: var(--sh-2);
}

/* ---- 登录表单 ---- */
.lg-form { margin-bottom: 14px; }

/* 登录方式切换：验证码登录 / 账号密码登录 */
.lg-tabs {
  display: flex;
  gap: 4px;
  padding: 4px;
  margin-bottom: 14px;
  border-radius: var(--r-pill);
  background: rgba(16, 24, 40, .05);
}
.lg-tab {
  flex: 1;
  height: 38px;
  border-radius: var(--r-pill);
  font-size: var(--t-base);
  font-weight: 700;
  color: var(--ink-500);
  transition: color .15s, background .15s;
  /* 三个页签（验证码 / 密码 / 注册）字数不同，显式双向居中，避免字少的那个贴左 */
  display: flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
  padding: 0;
}
.lg-tab.on {
  background: #fff;
  color: var(--blue-700);
  box-shadow: 0 1px 4px rgba(16, 24, 40, .12);
}
.lg-forgot-row { margin-top: 10px; text-align: center; }

.lf-row + .lf-row { margin-top: 10px; }
/* 输入框：未聚焦浅灰底、聚焦转白底 + 蓝描边 —— 焦点在哪一眼看得出 */
.lg-field {
  display: flex;
  align-items: center;
  gap: 10px;
  height: 56px;
  padding: 0 14px;
  border-radius: var(--r-lg);
  background: var(--bg);
  border: 1.5px solid var(--line);
  transition: border-color .15s, box-shadow .15s, background .15s;
}
.lg-field:focus-within {
  background: #fff;
  border-color: var(--blue-500);
  box-shadow: 0 0 0 3px var(--blue-100);
}
.lf-tag {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  font-size: var(--t-base);
  font-weight: 700;
  color: var(--ink-800);
  flex: none;
}
.lf-tag .ic { color: var(--blue-600); }
.lf-sep { width: 1px; height: 20px; background: var(--line); flex: none; }
.lg-field input {
  flex: 1;
  min-width: 0;
  border: 0;
  outline: 0;
  background: none;
  font-family: inherit;
  font-size: var(--t-md);
  font-weight: 600;
  color: var(--ink-900);
  letter-spacing: .3px;
  /* ⚠️ 输入框文字居中：只靠父级 align-items:center 时，Android / iOS 内核会用各自的
     默认行高把文字顶偏（表现为"字贴着上边"）。撑满高度 + 显式行高才是稳的居中。 */
  height: 100%;
  line-height: 1.5;
  padding: 0;
}
.lg-field input::placeholder { font-weight: 400; color: var(--ink-400); letter-spacing: 0; }
/* "获取验证码"做成小胶囊按钮：原来只是带竖线的文字，点击区域太小 */
.lf-send {
  flex: none;
  font-size: var(--t-xs);
  font-weight: 700;
  color: var(--blue-700);
  padding: 7px 11px;
  border-radius: var(--r-pill);
  background: var(--blue-50);
  line-height: 1.2;
}
.lf-send.off { background: var(--line-2); color: var(--ink-400); }
.lg-form .btn { margin-top: 16px; height: 52px; border-radius: var(--r-lg); font-size: var(--t-base); }

/* 条件未满足时按钮仍是可点的，点了会明确提示缺什么 */
.btn.is-wait {
  background: var(--blue-200);
  color: #fff;
  font-size: var(--t-sm);
}
.btn.is-wait:active { background: var(--blue-200); }

/* "先随便看看"：幽灵按钮（有边框有底），比裸文字更像个可点的东西 */
.lg-later {
  width: 100%;
  margin-top: 12px;
  font-size: var(--t-sm);
  font-weight: 700;
  color: var(--ink-600);
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  height: 46px;
  border: 1px solid var(--line);
  border-radius: var(--r-lg);
  background: #fff;
}
.lg-later:active { background: var(--bg); border-color: var(--blue-300); }
.lg-later .ic { color: var(--ink-400); }

/* ---- 协议勾选 ---- */
.lg-agree-row {
  display: flex;
  align-items: flex-start;
  gap: 9px;
  padding: 2px 2px 4px;
  cursor: pointer;
}
.lg-agree-row .cbx { margin-top: 1px; }
.lg-agree-row > span:last-child {
  font-size: var(--t-xs);
  color: var(--ink-500);
  line-height: 1.7;
}
.lg-agree-row em { font-style: normal; color: var(--blue-700); font-weight: 700; }

/* 白卡外的内容要有呼吸：.lg-body 上边距被白卡的上浮吃掉了，这里补回来 */
.lg-trust {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 9px;
  margin-top: 14px;
}
.lt-cell {
  display: flex;
  align-items: center;
  gap: 7px;
  padding: 11px 12px;
  border-radius: var(--r-lg);
  background: #fff;
  border: 1px solid var(--line);
  font-size: var(--t-sm);
  font-weight: 600;
  color: var(--ink-700);
}
.lt-cell .ic { color: var(--blue-600); }

.lg-notice {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 14px;
  padding: 11px 12px;
  border-radius: var(--r-lg);
  background: var(--gold-50);
  border: 1px solid var(--gold-200);
}
.ln-tag {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  font-size: var(--t-xs);
  font-weight: 800;
  color: var(--gold-700);
  flex: none;
}
.ln-tx {
  flex: 1;
  font-size: var(--t-xs);
  color: var(--gold-700);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.lg-preview { margin-top: 6px; }
.lp-list {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: var(--r-xl);
  overflow: hidden;
}
.lp-item {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 13px 14px;
}
.lp-item + .lp-item { border-top: 1px solid var(--line-2); }
/* 登录页底部热门岗位现在是 <button>（可点进详情）：补回按钮的排版基准 */
button.lp-item { width: 100%; text-align: left; font: inherit; background: #fff; }
button.lp-item:active { background: var(--bg); }
button.lp-item .ic { flex: none; color: var(--ink-400); }
.lpi-main { flex: 1; min-width: 0; }
.lpi-main b { display: block; font-size: var(--t-base); font-weight: 700; color: var(--ink-900); }
.lpi-main small { display: block; font-size: var(--t-xs); color: var(--ink-400); margin-top: 4px; }

.lg-agree {
  font-size: var(--t-xs);
  color: var(--ink-400);
  text-align: center;
  line-height: 1.8;
  margin-top: 16px;
}

/* ==========================================================================
   公告详情
   ========================================================================== */
.screen-nd .page-body { padding-bottom: 24px; }
.nd-head {
  padding: 2px 2px 14px;
  border-bottom: 1px solid var(--line);
  margin-bottom: 14px;
}
.nd-kinds { display: flex; align-items: center; gap: 6px; margin-bottom: 10px; }
.nd-title {
  font-size: var(--t-xl);
  font-weight: 800;
  color: var(--ink-900);
  line-height: 1.42;
  letter-spacing: .2px;
}
.nd-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 12px;
  font-size: var(--t-xs);
  color: var(--ink-400);
}
.nd-meta span { display: inline-flex; align-items: center; gap: 4px; }
.nd-meta .ic { width: 13px; height: 13px; }

.nd-body p {
  font-size: var(--t-base);
  line-height: 1.85;
  color: var(--ink-700);
}
.nd-body p + p { margin-top: 13px; }

.nd-tips {
  margin-top: 12px;
  background: var(--gold-50);
  border-color: var(--gold-200);
}
.nt-head {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: var(--t-md);
  font-weight: 800;
  color: var(--gold-700);
  margin-bottom: 10px;
}
.nt-list { display: flex; flex-direction: column; gap: 9px; }
.nt-list li {
  display: flex;
  align-items: flex-start;
  gap: 7px;
  font-size: var(--t-sm);
  line-height: 1.65;
  color: #8A6414;
}
.nt-list .ic { flex: none; margin-top: 3px; color: var(--gold-600); stroke-width: 2.6; }

.nd-foot { margin-top: 16px; }
.nd-tip {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  font-size: var(--t-xs);
  color: var(--ink-400);
  margin-top: 12px;
}

/* ==========================================================================
   企业主页
   ========================================================================== */
.screen-co .page-body { padding-top: 0; }
.co-hero {
  background: linear-gradient(158deg, var(--blue-800), var(--blue-700));
  color: #fff;
  padding: 16px 16px 18px;
  position: relative;
  overflow: hidden;
}
.co-hero::after {
  content: "";
  position: absolute;
  inset: 0;
  background-image: repeating-linear-gradient(115deg,
    rgba(255, 255, 255, .05) 0 2px, transparent 2px 9px);
  pointer-events: none;
}
.co-hero > * { position: relative; z-index: 1; }
.coh-main { display: flex; align-items: center; gap: 12px; }
.coh-main .logo {
  width: 52px; height: 52px;
  border-radius: var(--r-lg);
  font-size: var(--t-md);
  flex: none;
}
.coh-txt { flex: 1; min-width: 0; }
.coh-name {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: var(--t-md);
  font-weight: 800;
  line-height: 1.35;
}
.coh-meta {
  font-size: var(--t-xs);
  color: rgba(255, 255, 255, .72);
  margin-top: 5px;
}
.coh-score { text-align: center; flex: none; }
.coh-score b {
  display: block;
  font-size: var(--t-2xl);
  font-weight: 900;
  color: var(--gold-300);
  line-height: 1;
}
.cs-stars {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  font-size: 10.5px;
  color: rgba(255, 255, 255, .7);
  margin-top: 4px;
}
.cs-stars .ic { width: 12px; height: 12px; color: var(--gold-400); }

.coh-nums {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 4px;
  margin-top: 16px;
  padding-top: 14px;
  border-top: 1px solid rgba(255, 255, 255, .16);
}
.cn-cell { text-align: center; }
.cn-cell b { display: block; font-size: var(--t-sm); font-weight: 800; }
.cn-cell small {
  display: block;
  font-size: 10.5px;
  color: rgba(255, 255, 255, .66);
  margin-top: 4px;
}

.co-facts {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 8px;
  margin-top: 12px;
}
.cf-cell {
  padding: 10px 12px;
  border-radius: var(--r-md);
  background: var(--bg);
}
.cf-cell small { display: block; font-size: var(--t-xs); color: var(--ink-400); }
.cf-cell b { display: block; font-size: var(--t-sm); font-weight: 700; color: var(--ink-800); margin-top: 4px; }

.co-addr {
  display: flex;
  align-items: center;
  gap: 7px;
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px dashed var(--line);
  font-size: var(--t-sm);
  color: var(--ink-600);
}
.co-addr .ic { color: var(--blue-600); flex: none; }
.co-addr span { flex: 1; min-width: 0; }

.lic-list { display: flex; flex-direction: column; }
.lic-row {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 11px 0;
}
.lic-row + .lic-row { border-top: 1px solid var(--line-2); }
.lr-ic {
  width: 34px; height: 34px;
  border-radius: var(--r-md);
  background: var(--blue-50);
  color: var(--blue-700);
  display: grid;
  place-items: center;
  flex: none;
}
.lr-main { flex: 1; min-width: 0; }
.lr-main b { display: block; font-size: var(--t-base); font-weight: 700; color: var(--ink-900); }
.lr-main small { display: block; font-size: var(--t-xs); color: var(--ink-400); margin-top: 3px; }

.env-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 8px;
}
.env-cell {
  height: 74px;
  border-radius: var(--r-md);
}
.env-cell.pic::after { font-size: var(--t-xs); }

.co-none {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: var(--t-sm);
  color: var(--ink-500);
}
.co-none .ic { color: var(--ink-400); flex: none; }

.co-enter {
  display: flex;
  align-items: center;
  gap: 5px;
  width: 100%;
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px dashed var(--line);
  font-size: var(--t-sm);
  font-weight: 700;
  color: var(--blue-700);
}
.co-enter .ic { margin-left: auto; color: var(--ink-400); }

.rev-list { display: flex; flex-direction: column; gap: 10px; }
.rev-item {
  display: flex;
  gap: 10px;
  padding: 13px 14px;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--r-xl);
  box-shadow: var(--sh-1);
}
.rev-main { flex: 1; min-width: 0; }
.rev-top { display: flex; align-items: center; gap: 8px; }
.rev-top b { font-size: var(--t-sm); font-weight: 800; color: var(--ink-900); }
.rev-stars { display: flex; gap: 2px; margin-left: auto; }
.rev-stars i {
  width: 11px; height: 11px;
  border-radius: 2px;
  background: var(--line);
  display: block;
}
.rev-stars i.on { background: var(--gold-500); }
.rev-sub { font-size: var(--t-xs); color: var(--ink-400); margin-top: 4px; }
.rev-tx {
  font-size: var(--t-sm);
  line-height: 1.7;
  color: var(--ink-600);
  margin-top: 7px;
}

/* ==========================================================================
   页面 E · 设置 / 我的简历 / 浏览足迹
   ========================================================================== */

/* ---- 设置开关（iOS 风格，原地翻转不重绘） ---- */
.set-row { align-items: center; }
.msw {
  flex: none;
  width: 46px; height: 27px;
  border-radius: 999px;
  background: var(--line);
  border: none;
  position: relative;
  transition: background .18s;
  padding: 0;
}
.msw i {
  position: absolute; top: 3px; left: 3px;
  width: 21px; height: 21px;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 1px 3px rgba(16, 28, 46, .24);
  transition: transform .18s;
}
.msw.on { background: var(--success); }
.msw.on i { transform: translateX(19px); }
.row-ic.out { background: var(--danger-100); color: var(--danger); }

/* ---- 我的简历 · 头部 ---- */
.resume-me { display: flex; gap: 14px; align-items: center; }
.rm-main { flex: 1; min-width: 0; }
.rm-name {
  font-size: var(--t-lg); font-weight: 800; color: var(--ink-900);
  display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
}
.rm-sub { margin-top: 4px; font-size: var(--t-sm); color: var(--ink-500); }
.rm-loc {
  margin-top: 6px; font-size: var(--t-xs); color: var(--ink-400);
  display: flex; align-items: center; gap: 4px;
}
.rm-loc b { color: var(--success); font-weight: 800; }

/* ---- 我的简历 · 从业经历 ---- */
.exp-list { display: flex; flex-direction: column; }
.exp-row { display: flex; gap: 12px; padding: 10px 0; }
.exp-row + .exp-row { border-top: 1px dashed var(--line-2); }
.exp-t {
  flex: none; width: 88px; padding-top: 2px;
  font-size: var(--t-xs); color: var(--ink-500);
  font-family: var(--font-num);
}
.exp-main b { display: block; font-size: var(--t-sm); font-weight: 700; color: var(--ink-900); }
.exp-main small {
  display: block; margin-top: 3px;
  font-size: var(--t-xs); color: var(--ink-500); line-height: 1.6;
}

/* ---- 我的简历 · 证书墙 bad 态 ---- */
.cert-item.bad { background: var(--danger-100); }
.cert-item.bad .ce-ic { color: var(--danger); }
.exp-row.first .exp-t { color: var(--success); font-weight: 700; }

/* ---------- 检查完善轮：收藏态星标 / 聊天附件 ---------- */
.nb-btn.on .ic { color: var(--gold-500); }
.bubble-file { display: inline-flex; align-items: center; gap: 6px; font-weight: 700; }


/* ==========================================================================
   页面 F · 我的发布 / 需求响应 / 举报反馈 / 条款正文 / 邀请工友 / 工资条 / 简历分享
   （mobile.screens-f.js 的视觉层，2026-09-24 新增）
   ========================================================================== */

/* ---------- 通用：主体类型与需求类型配色 ---------- */
.k-me    { background: var(--blue-100);    color: var(--blue-700); }
.k-team  { background: var(--gold-100);    color: var(--gold-700); }
.k-co    { background: var(--success-100); color: var(--success-600); }
.k-kind-buy  { background: var(--blue-100);    color: var(--blue-700); }
.k-kind-sell { background: var(--success-100); color: var(--success-600); }
.k-kind-rent { background: var(--gold-100);    color: var(--gold-700); }
.k-kind-help { background: var(--danger-100);  color: var(--danger); }

.tone-red  { background: var(--danger-100); color: var(--danger); }
.tone-warn { background: var(--warn-100);   color: var(--warn); }
.tone-chip { background: var(--bg);         color: var(--ink-500); }
.tone-gold { background: var(--gold-100);   color: var(--gold-700); }

.tip-gold    { background: var(--gold-50);   color: var(--gold-700); }
.tip-success { background: var(--success-100); color: var(--success-600); }

/* ==========================================================================
   1. 我的发布
   ========================================================================== */
.myp-sum {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--r-xl);
  padding: var(--s-3) 0;
  margin-bottom: var(--s-3);
}
.myp-sum-c { text-align: center; min-width: 0; }
.myp-sum-c b {
  display: block;
  font-family: var(--font-num);
  font-size: var(--t-xl);
  font-weight: 800;
  color: var(--blue-700);
  line-height: 1.2;
}
.myp-sum-c small { font-size: var(--t-xs); color: var(--ink-500); }

.myp-seg {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 4px;
  background: var(--blue-50);
  border-radius: var(--r-lg);
  padding: 4px;
  margin-bottom: var(--s-3);
}
.myp-seg-b {
  height: 42px;
  border: 0;
  border-radius: var(--r-md);
  background: transparent;
  color: var(--ink-600);
  font-family: var(--font);
  font-size: var(--t-sm);
  font-weight: 600;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
}
.myp-seg-b em {
  font-style: normal;
  font-family: var(--font-num);
  font-size: var(--t-xs);
  opacity: .7;
}
.myp-seg-b.on { background: #fff; color: var(--blue-700); box-shadow: var(--sh-1); }
.myp-seg-b.on em { opacity: 1; color: var(--blue-500); }

.myp-list { display: flex; flex-direction: column; gap: var(--s-3); }
.myp-card {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--r-xl);
  padding: var(--s-3);
}
.myp-card.is-off { opacity: .6; }
.myp-card.is-done { border-color: var(--gold-200); }

.myp-hd { display: flex; align-items: flex-start; gap: 10px; }
/* 2026-10-14：「我的招工 / 我的找活 / 我的需求」卡头可点（跳编辑 / 报价页）——
   给触达反馈：手型光标 + 按下底色。底部操作按钮不在卡头内，点按钮不会误触发跳转。 */
.myp-hd-tap, .f2-row-tap, .em-jc-top-tap { cursor: pointer; border-radius: 8px; margin: -4px; padding: 4px; }
.myp-hd-tap:active, .f2-row-tap:active, .em-jc-top-tap:active { background: var(--blue-50); }
/* 需求正文行（2026-10-14 新增，live 下来自 Demand.sumText / specs / area） */
.myp-body {
  display: flex; align-items: flex-start; gap: 6px;
  margin: 10px 0 0;
  padding: 8px 10px;
  border-radius: 8px;
  background: var(--blue-50);
  font-size: var(--t-xs);
  line-height: 1.6;
  color: var(--ink-700);
}
.myp-body .ic { flex: none; margin-top: 2px; color: var(--blue-500); }
/* 紧急需求标（Demand.isUrgent） */
.myp-urgent {
  display: inline-block;
  margin-right: 5px;
  padding: 0 5px;
  height: 17px; line-height: 17px;
  border-radius: 4px;
  background: var(--danger-100);
  color: var(--danger-600);
  font-size: 11px; font-weight: 700; font-style: normal;
  vertical-align: 2px;
}
.myp-ava {
  flex: none;
  width: 44px;
  height: 44px;
  border-radius: var(--r-md);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: var(--t-base);
  font-weight: 700;
}
.myp-hd-main { flex: 1; min-width: 0; }
.myp-n {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
  font-size: var(--t-base);
  font-weight: 700;
  color: var(--ink-900);
}
.myp-n-dmd { display: block; line-height: var(--lh-tight); }
.myp-kind {
  flex: none;
  display: inline-flex;
  align-items: center;
  gap: 3px;
  padding: 1px 8px;
  border-radius: var(--r-pill);
  background: var(--blue-50);
  color: var(--blue-600);
  font-size: var(--t-xs);
  font-weight: 500;
}
.myp-role { margin-top: 4px; font-size: var(--t-sm); color: var(--ink-500); }

.myp-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 14px;
  margin-top: 10px;
  font-size: var(--t-sm);
  color: var(--ink-600);
}
.myp-meta span { display: inline-flex; align-items: center; gap: 4px; }

.myp-data {
  display: flex;
  align-items: center;
  gap: var(--s-4);
  margin-top: 10px;
  padding: 10px 12px;
  background: var(--bg);
  border-radius: var(--r-md);
}
.myp-d { display: flex; flex-direction: column; min-width: 0; }
.myp-d b {
  font-family: var(--font-num);
  font-size: var(--t-md);
  font-weight: 800;
  color: var(--ink-800);
  line-height: 1.2;
}
.myp-d small { font-size: var(--t-xs); color: var(--ink-400); }
.myp-d-wide { margin-left: auto; text-align: right; }
.myp-d-wide b { font-size: var(--t-sm); font-weight: 600; color: var(--ink-600); }

.myp-acts { display: flex; gap: 8px; margin-top: 12px; }
.myp-a {
  flex: 1;
  height: 38px;
  border: 1px solid var(--line-2);
  border-radius: var(--r-md);
  background: var(--surface);
  color: var(--ink-700);
  font-family: var(--font);
  font-size: var(--t-sm);
  font-weight: 600;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
}
.myp-a-main   { background: var(--blue-50);   border-color: var(--blue-200); color: var(--blue-700); }
.myp-a-danger { background: var(--danger-100); border-color: var(--danger-100); color: var(--danger); }
.myp-a.is-dis { opacity: .45; }

.myp-pub {
  display: flex;
  align-items: center;
  gap: 4px;
  margin-top: 10px;
  font-size: var(--t-xs);
  color: var(--ink-400);
}
.myp-new { display: flex; flex-direction: column; gap: 8px; margin-top: var(--s-4); }

/* ==========================================================================
   2. 需求响应（发布者视角）
   ========================================================================== */
.mq-sum {
  background: var(--blue-700);
  border-radius: var(--r-xl);
  padding: var(--s-4) var(--s-3);
  color: #fff;
}
.mq-sum-hd { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.mq-kind {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 3px 9px;
  border-radius: var(--r-pill);
  background: rgba(255, 255, 255, .16);
  font-size: var(--t-xs);
}
.mq-title {
  margin: 12px 0 0;
  font-size: var(--t-lg);
  font-weight: 700;
  line-height: var(--lh-tight);
}
.mq-sum-data {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px 6px;
  margin-top: 14px;
  padding-top: 12px;
  border-top: 1px solid rgba(255, 255, 255, .14);
}
.mq-sd { text-align: center; min-width: 0; }
.mq-sd b {
  display: block;
  font-family: var(--font-num);
  font-size: var(--t-md);
  font-weight: 800;
  white-space: nowrap;
}
.mq-sd small { font-size: var(--t-xs); opacity: .7; white-space: nowrap; }
.mq-sd:last-child {
  grid-column: 1 / -1;
  display: flex;
  align-items: center;
  gap: 6px;
  text-align: left;
}
.mq-sd:last-child b { font-size: var(--t-sm); font-weight: 600; }

.mq-card {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--r-xl);
  padding: var(--s-3);
  margin-top: var(--s-3);
}
.mq-card.is-ok { border-color: var(--success); background: var(--success-100); }
.mq-card.is-no { opacity: .62; }

.mq-hd { display: flex; align-items: flex-start; gap: 10px; }
.mq-ava {
  flex: none;
  width: 40px;
  height: 40px;
  border-radius: var(--r-md);
  display: flex;
  align-items: center;
  justify-content: center;
}
.mq-hd-main { flex: 1; min-width: 0; }
.mq-who { font-size: var(--t-base); font-weight: 700; color: var(--ink-900); }
.mq-role { margin-top: 3px; font-size: var(--t-xs); color: var(--ink-500); }

.mq-price { display: flex; align-items: baseline; gap: 6px; margin-top: 10px; }
.mq-price b {
  font-family: var(--font-num);
  font-size: var(--t-2xl);
  font-weight: 800;
  color: var(--gold-600);
  line-height: 1.1;
}
.mq-price small { font-size: var(--t-xs); color: var(--ink-400); }

.mq-msg {
  margin: 8px 0 0;
  font-size: var(--t-sm);
  color: var(--ink-600);
  line-height: var(--lh-body);
}
.mq-foot {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-top: 12px;
  padding-top: 10px;
  border-top: 1px dashed var(--line-2);
}
.mq-tm { display: inline-flex; align-items: center; gap: 4px; font-size: var(--t-xs); color: var(--ink-400); }
.mq-acts { display: flex; gap: 8px; flex: none; }
.mq-a {
  height: 34px;
  padding: 0 14px;
  border: 1px solid var(--line-2);
  border-radius: var(--r-md);
  background: var(--surface);
  color: var(--ink-600);
  font-family: var(--font);
  font-size: var(--t-sm);
  font-weight: 600;
}
.mq-a-ok { background: var(--blue-700); border-color: var(--blue-700); color: #fff; }
.mq-res { font-size: var(--t-sm); font-weight: 600; display: inline-flex; align-items: center; gap: 4px; }
.mq-res.ok { color: var(--success-600); }
.mq-res.no { color: var(--ink-400); }

.mq-fraud {
  display: flex;
  gap: 10px;
  margin-top: var(--s-4);
  padding: var(--s-3);
  background: var(--danger-100);
  border-radius: var(--r-xl);
  color: #8E1F18;
}
.mq-fraud-ic { flex: none; }
.mq-fraud b { font-size: var(--t-sm); }
.mq-fraud p { margin: 4px 0 0; font-size: var(--t-sm); line-height: var(--lh-body); }
.mq-report { margin-top: var(--s-4); }

/* ==========================================================================
   3. 举报与反馈
   ========================================================================== */
.rp-target {
  display: flex;
  gap: 10px;
  padding: var(--s-3);
  background: var(--blue-50);
  border-radius: var(--r-xl);
  margin-bottom: var(--s-3);
}
.rp-target-ic { flex: none; color: var(--blue-700); }
.rp-target-tx b { display: block; font-size: var(--t-sm); color: var(--blue-900); }
.rp-target-tx small { font-size: var(--t-xs); color: var(--blue-600); }

.rp-fraud {
  display: flex;
  gap: 10px;
  padding: var(--s-3);
  background: var(--danger-100);
  border-radius: var(--r-xl);
  color: #8E1F18;
}
.rp-fraud-ic { flex: none; }
.rp-fraud b { font-size: var(--t-sm); }
.rp-fraud p { margin: 4px 0 0; font-size: var(--t-sm); line-height: var(--lh-body); }

.rp-types { display: flex; flex-direction: column; gap: 8px; }
.rp-type {
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: var(--r-xl);
  background: var(--surface);
  text-align: left;
  font-family: var(--font);
}
.rp-type.on { border-color: var(--blue-500); background: var(--blue-50); }
.rp-type-ic {
  flex: none;
  width: 36px;
  height: 36px;
  border-radius: var(--r-md);
  display: flex;
  align-items: center;
  justify-content: center;
}
.rp-type-tx { flex: 1; min-width: 0; }
.rp-type-tx b { display: block; font-size: var(--t-base); font-weight: 600; color: var(--ink-900); }
.rp-type-tx small { font-size: var(--t-xs); color: var(--ink-500); }
.rp-radio {
  flex: none;
  width: 22px;
  height: 22px;
  border: 1.5px solid var(--line-2);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
}
.rp-type.on .rp-radio { background: var(--blue-700); border-color: var(--blue-700); }

.rp-form { padding: var(--s-3); }
.rp-ta {
  width: 100%;
  min-height: 104px;
  border: 0;
  outline: 0;
  resize: none;
  font-family: var(--font);
  font-size: var(--t-base);
  line-height: var(--lh-body);
  color: var(--ink-800);
  background: transparent;
}
.rp-ta::placeholder { color: var(--ink-300); }

/* ---------- 企业入驻认证（工人账号「成为企业」）表单 ---------- */
.cv-form { display: flex; flex-direction: column; gap: 12px; }
.cv-row { display: flex; flex-direction: column; gap: 6px; }
.cv-row > small { font-size: var(--t-xs); font-weight: 700; color: var(--ink-500); }
.cv-inp {
  width: 100%;
  height: 42px;
  padding: 0 12px;
  border: 1px solid var(--line);
  border-radius: var(--r-lg);
  background: #fff;
  font-family: var(--font);
  font-size: var(--t-base);
  color: var(--ink-900);
  outline: 0;
}
.cv-inp::placeholder { color: var(--ink-300); }
.cv-inp:focus { border-color: var(--blue-700); box-shadow: 0 0 0 3px rgba(15, 58, 128, .08); }
.cv-two { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
/* ⛔ 旧的 .cv-seg / .cv-seg-btn / .cv-st 已随认证页美化一并撤下（2026-10-10）：
   行业选择改用 .cv2-seg（带行业图标），状态条改用 .cv2-status（图标舱 + 主副标题）。 */
.rp-ta-foot {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: var(--t-xs);
  color: var(--ink-400);
  padding-bottom: 10px;
  border-bottom: 1px solid var(--line);
}
.rp-ok { color: var(--success-600); display: inline-flex; align-items: center; gap: 3px; }

.rp-upload {
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%;
  margin-top: 12px;
  padding: 12px;
  border: 1px dashed var(--line-2);
  border-radius: var(--r-md);
  background: var(--bg);
  font-family: var(--font);
  text-align: left;
}
.rp-upload.on { border-style: solid; border-color: var(--blue-500); background: var(--blue-50); }
.rp-up-ic { flex: none; color: var(--blue-600); }
.rp-up-tx { font-size: var(--t-sm); color: var(--ink-600); }
.rp-up-tx small { display: block; font-size: var(--t-xs); color: var(--ink-400); margin-top: 2px; }

/* 举报证据缩略图：能看到自己传了什么、也能删了重传 —— 假上传时代这里只有一个数字 */
/* 置顶推广弹层：本地 / 全国两档 + 天数（P8） */
.tp-scope { display: flex; gap: 10px; margin: 4px 0 12px; }
.tp-sc {
  flex: 1; display: flex; flex-direction: column; gap: 3px; align-items: flex-start;
  padding: 12px; border: 1.5px solid var(--line); border-radius: var(--r-md);
  background: var(--bg-1); text-align: left;
}
.tp-sc.on { border-color: var(--gold-500, #f59e0b); background: rgba(245, 158, 11, .07); }
.tp-sc b { font-size: var(--t-sm); color: var(--ink-900); }
.tp-sc span { font-size: var(--t-xs); color: #f59e0b; font-weight: 600; }
.tp-sc small { font-size: var(--t-xs); color: var(--ink-400); line-height: 1.4; }
.tp-days { display: flex; gap: 8px; margin-bottom: 12px; }
.tp-d {
  flex: 1; padding: 9px 0; border: 1.5px solid var(--line); border-radius: var(--r-sm);
  background: var(--bg-1); font-size: var(--t-sm); color: var(--ink-700);
}
.tp-d.on { border-color: var(--gold-500, #f59e0b); background: rgba(245, 158, 11, .07); color: #b45309; font-weight: 600; }

/* 我发布的卡片：置顶中状态条 */
.myp-topbar {
  display: flex; align-items: center; gap: 5px; margin: 0 0 8px;
  padding: 6px 10px; border-radius: var(--r-sm);
  background: rgba(245, 158, 11, .1); color: #b45309;
  font-size: var(--t-xs); font-weight: 600;
}
.myp-topbar svg { width: 13px; height: 13px; }
.myp-a-top { color: #b45309; }

.rp-thumbs { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 10px; }
.rp-thumb { position: relative; width: 62px; height: 62px; border-radius: var(--r-sm); overflow: hidden; background: var(--bg-2); }
.rp-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.rp-thumb-x {
  position: absolute; top: 2px; right: 2px;
  width: 20px; height: 20px; padding: 0;
  display: flex; align-items: center; justify-content: center;
  border: 0; border-radius: 50%;
  background: rgba(0, 0, 0, .55); color: #fff;
}
.rp-thumb-x svg { width: 12px; height: 12px; }

.rp-tel {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px solid var(--line);
}
.rp-tel-l { flex: none; display: inline-flex; align-items: center; gap: 4px; font-size: var(--t-sm); color: var(--ink-600); }
.rp-tel-i {
  flex: 1;
  min-width: 0;
  border: 0;
  outline: 0;
  text-align: right;
  font-family: var(--font-num);
  font-size: var(--t-base);
  color: var(--ink-800);
  background: transparent;
}

.rp-submit { margin-top: var(--s-4); }

.rp-promise { display: flex; flex-wrap: wrap; gap: 8px; }
.rp-pm {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 6px 10px;
  border-radius: var(--r-pill);
  background: var(--blue-50);
  color: var(--blue-700);
  font-size: var(--t-xs);
}

.rp-done {
  text-align: center;
  padding: var(--s-6) var(--s-3);
  background: var(--surface);
  border-radius: var(--r-xl);
  border: 1px solid var(--line);
}
.rp-done-ic {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 56px;
  height: 56px;
  border-radius: 50%;
  background: var(--success-100);
  color: var(--success);
}
.rp-done h3 { margin: 14px 0 0; font-size: var(--t-lg); color: var(--ink-900); }
.rp-done p { margin: 8px 0 0; font-size: var(--t-sm); color: var(--ink-500); line-height: var(--lh-body); }
.rp-no {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-top: 14px;
  padding: 8px 14px;
  border-radius: var(--r-md);
  background: var(--bg);
  font-size: var(--t-sm);
  color: var(--ink-500);
}
.rp-no b { font-family: var(--font-num); color: var(--ink-900); font-size: var(--t-base); }

.rp-flow { padding: var(--s-2) var(--s-3); }
.rp-fl-row {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 0;
  font-size: var(--t-sm);
  color: var(--ink-400);
  border-bottom: 1px solid var(--line);
}
.rp-fl-row:last-child { border-bottom: 0; }
.rp-fl-row.on { color: var(--ink-800); font-weight: 600; }
.rp-fl-n {
  flex: none;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: var(--line);
  color: var(--ink-500);
  font-size: var(--t-xs);
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: var(--font-num);
}
.rp-fl-row.on .rp-fl-n { background: var(--blue-700); color: #fff; }

.rp-rec { padding: var(--s-3); margin-top: var(--s-3); }
.rp-rec-hd { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.rp-rec-hd b { font-size: var(--t-base); color: var(--ink-900); }
.rp-rec-t { margin: 6px 0 0; font-size: var(--t-sm); color: var(--ink-500); }
.rp-rec-f {
  display: flex;
  justify-content: space-between;
  margin-top: 8px;
  font-size: var(--t-xs);
  color: var(--ink-400);
}

/* ==========================================================================
   4. 条款正文
   ========================================================================== */
.doc-hd {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--r-xl);
  padding: var(--s-4) var(--s-3);
}
.doc-badge {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 2px 9px;
  border-radius: var(--r-pill);
  background: var(--blue-50);
  color: var(--blue-700);
  font-size: var(--t-xs);
  font-family: var(--font-num);
}
.doc-t { margin: 12px 0 0; font-size: var(--t-2xl); font-weight: 800; color: var(--ink-900); line-height: var(--lh-tight); }
.doc-meta { margin-top: 8px; display: inline-flex; align-items: center; gap: 4px; font-size: var(--t-xs); color: var(--ink-400); }
.doc-lead {
  margin: 12px 0 0;
  padding-top: 12px;
  border-top: 1px solid var(--line);
  font-size: var(--t-sm);
  color: var(--ink-600);
  line-height: var(--lh-body);
}

.doc-toc {
  margin-top: var(--s-3);
  background: var(--blue-50);
  border-radius: var(--r-xl);
  padding: var(--s-3);
}
.doc-toc-t { font-size: var(--t-xs); color: var(--blue-600); font-weight: 600; }
.doc-toc-i {
  display: flex;
  align-items: center;
  gap: 8px;
  width: 100%;
  padding: 9px 0;
  border: 0;
  background: transparent;
  text-align: left;
  font-family: var(--font);
  font-size: var(--t-sm);
  color: var(--blue-900);
  border-bottom: 1px solid rgba(15, 58, 128, .08);
}
.doc-toc-i:last-child { border-bottom: 0; }
.doc-toc-i .num {
  flex: none;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background: var(--blue-700);
  color: #fff;
  font-size: var(--t-xs);
  font-family: var(--font-num);
  display: flex;
  align-items: center;
  justify-content: center;
}

.doc-sec { margin-top: var(--s-4); scroll-margin-top: 12px; }
.doc-h { margin: 0; font-size: var(--t-md); font-weight: 700; color: var(--ink-900); }
.doc-p {
  margin: 10px 0 0;
  font-size: var(--t-base);
  line-height: 1.75;
  color: var(--ink-700);
}
.doc-foot {
  margin-top: var(--s-4);
  padding: var(--s-3);
  border-radius: var(--r-xl);
  background: var(--bg);
  font-size: var(--t-sm);
  color: var(--ink-500);
}
.doc-foot p { margin: 0; line-height: var(--lh-body); }
.doc-others { display: flex; flex-direction: column; gap: 8px; }
.doc-other {
  display: flex;
  align-items: center;
  gap: 8px;
  width: 100%;
  height: var(--tap);
  padding: 0 var(--s-3);
  border: 1px solid var(--line);
  border-radius: var(--r-xl);
  background: var(--surface);
  font-family: var(--font);
  font-size: var(--t-base);
  color: var(--ink-800);
}
.doc-other .ic:last-child { margin-left: auto; color: var(--ink-300); }

/* ==========================================================================
   5. 邀请工友
   ========================================================================== */
.ivt-hero {
  border-radius: var(--r-xl);
  padding: var(--s-4) var(--s-3);
  background: var(--blue-700);
  color: #fff;
}
.ivt-hero-top { display: flex; align-items: center; gap: 12px; }
.ivt-hero-ic {
  flex: none;
  width: 46px;
  height: 46px;
  border-radius: var(--r-md);
  background: var(--gold-500);
  color: #4A3406;
  display: flex;
  align-items: center;
  justify-content: center;
}
.ivt-hero-top b { display: block; font-size: var(--t-lg); }
.ivt-hero-top small { font-size: var(--t-xs); opacity: .78; }

.ivt-code {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-top: 16px;
  padding: 12px;
  border-radius: var(--r-md);
  background: rgba(255, 255, 255, .12);
}
.ivt-code-l { flex: 1; min-width: 0; }
.ivt-code-l span { display: block; font-size: var(--t-xs); opacity: .7; }
.ivt-code-l b {
  font-family: var(--font-num);
  font-size: var(--t-xl);
  font-weight: 800;
  letter-spacing: 1px;
}
.ivt-copy {
  flex: none;
  height: 36px;
  padding: 0 14px;
  border: 0;
  border-radius: var(--r-md);
  background: #fff;
  color: var(--blue-700);
  font-family: var(--font);
  font-size: var(--t-sm);
  font-weight: 700;
  display: inline-flex;
  align-items: center;
  gap: 4px;
}
.ivt-copy.on { background: var(--gold-500); color: #4A3406; }

.ivt-stat {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 6px;
  margin-top: 14px;
  padding-top: 12px;
  border-top: 1px solid rgba(255, 255, 255, .14);
}
.ivt-s { text-align: center; min-width: 0; }
.ivt-s b { display: block; font-family: var(--font-num); font-size: var(--t-md); font-weight: 800; }
.ivt-s small { font-size: var(--t-xs); opacity: .7; white-space: nowrap; }

.ivt-steps { padding: var(--s-2) var(--s-3); }
.ivt-step { display: flex; align-items: center; gap: 12px; padding: 11px 0; border-bottom: 1px solid var(--line); }
.ivt-step:last-child { border-bottom: 0; }
.ivt-step-n {
  flex: none;
  width: 26px;
  height: 26px;
  border-radius: 50%;
  background: var(--gold-100);
  color: var(--gold-700);
  font-family: var(--font-num);
  font-weight: 700;
  font-size: var(--t-sm);
  display: flex;
  align-items: center;
  justify-content: center;
}
.ivt-step-tx b { display: block; font-size: var(--t-base); color: var(--ink-800); }
.ivt-step-tx small { font-size: var(--t-xs); color: var(--ink-500); }

.ivt-share { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; }
.ivt-sh {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  padding: 12px 2px;
  border: 1px solid var(--line);
  border-radius: var(--r-xl);
  background: var(--surface);
  font-family: var(--font);
  font-size: var(--t-xs);
  color: var(--ink-600);
}
.ivt-sh-ic, .rsp-sh-ic {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
}
.sh-wechat { background: var(--success-100); color: var(--success-600); }
.sh-poster { background: var(--gold-100);    color: var(--gold-700); }
.sh-link   { background: var(--blue-100);    color: var(--blue-700); }
.sh-sms    { background: var(--blue-50);     color: var(--blue-600); }
.sh-img    { background: var(--warn-100);    color: var(--warn); }

.ivt-poster { margin-top: var(--s-3); }
.ivt-poster-card {
  border-radius: var(--r-xl);
  padding: var(--s-5) var(--s-4);
  background: var(--blue-900);
  color: #fff;
  text-align: center;
}
.ivt-poster-brand { display: inline-flex; align-items: center; gap: 5px; font-size: var(--t-sm); color: var(--gold-400); }
.ivt-poster-t { margin-top: 16px; font-size: var(--t-xl); font-weight: 800; }
.ivt-poster-s { margin-top: 8px; font-size: var(--t-sm); opacity: .78; }
.ivt-poster-code {
  margin-top: 18px;
  padding: 14px;
  border-radius: var(--r-md);
  background: rgba(255, 255, 255, .1);
}
.ivt-poster-code b { display: block; font-family: var(--font-num); font-size: var(--t-2xl); font-weight: 800; letter-spacing: 2px; }
.ivt-poster-code small { font-size: var(--t-xs); opacity: .72; }
.ivt-poster-tip { margin: 10px 0 0; text-align: center; font-size: var(--t-xs); color: var(--ink-400); }

.ivt-recs { padding: var(--s-2) var(--s-3); }
.ivt-rec { display: flex; align-items: center; gap: 10px; padding: 11px 0; border-bottom: 1px solid var(--line); }
.ivt-rec:last-child { border-bottom: 0; }
.ivt-rec-av {
  flex: none;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: var(--blue-100);
  color: var(--blue-700);
  font-size: var(--t-sm);
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
}
.ivt-rec-main { flex: 1; min-width: 0; }
.ivt-rec-main b { display: block; font-size: var(--t-base); color: var(--ink-800); }
.ivt-rec-main small { font-size: var(--t-xs); color: var(--ink-400); }
.ivt-rec-r { flex: none; text-align: right; }
.ivt-rec-r b { display: block; font-family: var(--font-num); font-size: var(--t-base); color: var(--gold-600); font-weight: 800; }
.ivt-rec-r small { font-size: var(--t-xs); color: var(--ink-400); }

/* ==========================================================================
   6. 工资条
   ========================================================================== */
.psl-sum {
  border-radius: var(--r-xl);
  padding: var(--s-4) var(--s-3);
  background: var(--blue-700);
  color: #fff;
}
.psl-sum-hd { display: flex; align-items: center; gap: 5px; font-size: var(--t-sm); opacity: .8; }
.psl-sum-big { display: flex; align-items: baseline; gap: 6px; margin-top: 10px; }
.psl-sum-big b {
  font-family: var(--font-num);
  font-size: 34px;
  font-weight: 800;
  line-height: 1;
  letter-spacing: -.5px;
}
.psl-sum-big small { font-size: var(--t-sm); opacity: .78; }
.psl-sum-sub { margin-top: 10px; font-size: var(--t-xs); opacity: .72; }

.psl-tip {
  display: flex;
  gap: 10px;
  margin-top: var(--s-3);
  padding: var(--s-3);
  border-radius: var(--r-xl);
  background: var(--blue-50);
  color: var(--blue-900);
}
.psl-tip-ic { flex: none; color: var(--blue-700); }
.psl-tip p { margin: 0; font-size: var(--t-sm); line-height: var(--lh-body); }

.psl-card {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--r-xl);
  margin-bottom: var(--s-3);
  overflow: hidden;
}
.psl-card.on { border-color: var(--blue-300); }
.psl-hd {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  width: 100%;
  padding: var(--s-3);
  border: 0;
  background: transparent;
  font-family: var(--font);
  text-align: left;
}
.psl-hd-l { min-width: 0; }
.psl-m { font-size: var(--t-base); font-weight: 700; color: var(--ink-900); }
.psl-co { margin-top: 4px; font-size: var(--t-xs); color: var(--ink-500); }
.psl-hd-r { flex: none; display: flex; align-items: center; gap: 8px; color: var(--ink-300); }
.psl-net { text-align: right; }
.psl-net b { display: block; font-family: var(--font-num); font-size: var(--t-lg); font-weight: 800; color: var(--gold-600); line-height: 1.15; }
.psl-net small { font-size: var(--t-xs); color: var(--ink-400); }
.psl-card.on .psl-hd-r .ic { transform: rotate(180deg); }

.psl-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 14px;
  padding: 0 var(--s-3) var(--s-3);
  font-size: var(--t-xs);
  color: var(--ink-500);
}
.psl-meta span { display: inline-flex; align-items: center; gap: 4px; }
.psl-st { padding: 1px 8px; border-radius: var(--r-pill); }
.psl-st.ok   { background: var(--success-100); color: var(--success-600); }
.psl-st.wait { background: var(--warn-100);    color: var(--warn); }

.psl-items {
  padding: var(--s-3);
  background: var(--bg);
  border-top: 1px solid var(--line);
}
.psl-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 8px 0;
  font-size: var(--t-sm);
  color: var(--ink-600);
}
.psl-item b { font-family: var(--font-num); font-weight: 600; color: var(--ink-800); }
.psl-item b.neg { color: var(--danger); }
.psl-item-sum { border-top: 1px dashed var(--line-2); }
.psl-item-net {
  margin-top: 4px;
  padding-top: 10px;
  border-top: 1px solid var(--line-2);
  font-weight: 700;
  color: var(--ink-900);
}
.psl-item-net b { font-size: var(--t-lg); font-weight: 800; color: var(--gold-600); }
.psl-note {
  display: flex;
  gap: 6px;
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px dashed var(--line-2);
  font-size: var(--t-xs);
  color: var(--ink-400);
  line-height: var(--lh-body);
}
.psl-note .ic { flex: none; }

/* ==========================================================================
   7. 简历预览与分享
   ========================================================================== */
.rsp-card {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--r-xl);
  overflow: hidden;
}
.rsp-top {
  display: flex;
  gap: 12px;
  padding: var(--s-3);
  background: var(--blue-700);
  color: #fff;
}
.rsp-av {
  flex: none;
  width: 52px;
  height: 52px;
  border-radius: var(--r-md);
  background: var(--gold-500);
  color: #4A3406;
  font-size: var(--t-xl);
  font-weight: 800;
  display: flex;
  align-items: center;
  justify-content: center;
}
.rsp-main { flex: 1; min-width: 0; }
.rsp-n { display: flex; align-items: center; gap: 8px; font-size: var(--t-lg); font-weight: 800; }
.rsp-vf {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  padding: 1px 7px;
  border-radius: var(--r-pill);
  background: rgba(255, 255, 255, .18);
  font-size: var(--t-xs);
  font-weight: 500;
}
.rsp-job { margin-top: 5px; font-size: var(--t-sm); opacity: .84; }
.rsp-tags { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 9px; }
.rsp-tags .chip { background: rgba(255, 255, 255, .9); }

.rsp-row {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  padding: 11px var(--s-3);
  border-bottom: 1px solid var(--line);
}
.rsp-k {
  flex: none;
  width: 88px;
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: var(--t-sm);
  color: var(--ink-500);
}
.rsp-v { flex: 1; min-width: 0; font-size: var(--t-base); color: var(--ink-800); }
.rsp-v em { display: block; margin-top: 3px; font-style: normal; font-size: var(--t-xs); color: var(--ink-400); }
.rsp-v-mask { font-family: var(--font-num); letter-spacing: .4px; }

.rsp-certs { padding: var(--s-3); }
.rsp-certs-t {
  display: flex;
  align-items: center;
  gap: 5px;
  font-size: var(--t-sm);
  font-weight: 600;
  color: var(--blue-700);
}
.rsp-cert {
  margin-top: 8px;
  padding: 10px 12px;
  border-radius: var(--r-md);
  background: var(--blue-50);
}
.rsp-cert span { display: block; font-size: var(--t-sm); color: var(--blue-900); font-weight: 600; }
.rsp-cert em {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  margin-top: 4px;
  font-style: normal;
  font-size: var(--t-xs);
  color: var(--success-600);
}
.rsp-cert-empty { margin-top: 8px; font-size: var(--t-sm); color: var(--ink-400); }

.rsp-foot {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  padding: 11px;
  background: var(--bg);
  border-top: 1px solid var(--line);
  font-size: var(--t-xs);
  color: var(--ink-400);
}

.rsp-share { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.rsp-sh {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  padding: 12px 2px;
  border: 1px solid var(--line);
  border-radius: var(--r-xl);
  background: var(--surface);
  font-family: var(--font);
  font-size: var(--t-xs);
  color: var(--ink-600);
}

.rsp-qrbox {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: var(--s-3);
  margin-top: var(--s-3);
}
.rsp-qr { flex: none; width: 88px; height: 88px; border-radius: var(--r-sm); background: #fff; }
.rsp-qr-tx { min-width: 0; }
.rsp-qr-tx b { display: block; font-size: var(--t-base); color: var(--ink-900); }
.rsp-qr-tx p { margin: 6px 0 0; font-size: var(--t-xs); color: var(--ink-500); line-height: var(--lh-body); }
.rsp-qr-code {
  display: inline-block;
  margin-top: 8px;
  padding: 2px 8px;
  border-radius: var(--r-xs);
  background: var(--bg);
  font-size: var(--t-xs);
  color: var(--ink-500);
}
.rsp-acts { display: flex; flex-direction: column; gap: 8px; margin-top: var(--s-4); }

/* 登录页协议链接行（独立于勾选行，避免与 data-lg-agree 抢点击） */
.lg-agree-links { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; padding-left: 30px; }
.lg-link {
  border: 0;
  background: transparent;
  padding: 0;
  font-family: var(--font);
  font-size: var(--t-xs);
  color: var(--blue-600);
  text-decoration: underline;
  text-underline-offset: 3px;
}

/* ---------- 游客登录墙 ----------
   未登录访问私有屏（消息 / 简历 / 收藏 / 余额…）或被拦下私有操作时显示，
   只给登录引导，不展示任何账号数据。变量一律带兜底值，避免主题变量改名后样式塌掉。 */
.gw {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 32px 24px;
}
.gw-box {
  width: 100%;
  max-width: 280px;
  padding: 26px 20px 22px;
  background: var(--c-card, #fff);
  border: 1px solid var(--line);
  border-radius: var(--r-l, 14px);
  box-shadow: var(--sh-1, 0 8px 24px rgba(6, 22, 49, .10));
  text-align: center;
}
.gw-t {
  font-size: 15px; font-weight: 800;
  color: var(--ink-900, #1b2432);
  margin-bottom: 8px;
}
.gw-d {
  font-size: var(--t-xs, 12px);
  color: var(--ink-500, #8a94a6);
  line-height: 1.7;
  margin-bottom: 18px;
}
.gw-back { margin-top: 10px; }
/* 消息未登录落地页专用容器：长内容走正常文档流（见 .mg-guest），不做垂直居中 */
.gw-msg { padding: 0; }
/* 登录墙：图标 + 权益清单，别只丢一句"需要登录" */
.gw-ic {
  width: 60px;
  height: 60px;
  margin: 0 auto 14px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  color: #fff;
  background: linear-gradient(140deg, var(--blue-500), var(--blue-700));
  box-shadow: 0 6px 16px rgba(15, 58, 128, .28);
}
.gw-ic .ic { width: 28px; height: 28px; }
.gw-perks {
  margin: 0 0 18px;
  padding: 12px 14px;
  border-radius: var(--r-md);
  background: var(--bg);
  text-align: left;
}
.gw-perk {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: var(--t-xs);
  color: var(--ink-700);
  line-height: 2;
}
.gw-perk .ic { flex: none; width: 14px; height: 14px; color: var(--blue-600); }

/* ---------- 未登录「我的」页 · 深蓝头条 + 白卡（guestProfile）----------
   ⚠️ 2026-10-08 版式（用户点选 G3）：深蓝只保留一条头条（顶栏 / 标题 / 按钮），
      下面整页浅底 + 白卡 —— 与消息页、找活大厅等浅色页同一套色调：
        顶栏主干 #0F3A80 · 页面底 var(--bg) · 白卡 #fff + 1px var(--line) + var(--r-xl)
      上一版是「整屏深蓝沉浸」，在 10 款方案里落选（整屏偏重、与其它页不同族）。
   ⚠️ 作用域：所有规则挂在 .pf-guest / .pg-* 下 —— 登录后的 .pf-* 一律不碰
      （mobile.ent.js 的企业版「我的」也复用 .pf-*，写基础规则会串到那边去）。
   ⚠️ 本页底色已与全站一致，**不再需要给 TabBar 反写深色**（旧版那 5 行 :has() 规则已删）。 */
.screen-profile.pf-guest { background: var(--bg); }
.screen-profile.pf-guest > * { position: relative; z-index: 1; }

/* ---- 极简线条风（d11）：白底描边居中卡，替代旧深蓝头条 ----
   ⚠️ 与消息游客页共享同一套"描边替代填充"语言：主色只做深蓝描边 + 文字，
      不铺色块；CTA 用深蓝描边（点击瞬间 active 反填充）。 */
.pg-top {
  flex: none;
  margin: 8px 14px 0;
  padding: 22px 16px 20px;
  text-align: center;
  color: var(--ink-900);
  background: #fff;
  border: 1.5px solid #D8E0EC;
  border-radius: 16px;
}
.pg-nav {
  height: 44px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: var(--t-lg);
  font-weight: 800;
  letter-spacing: .5px;
  color: var(--blue-700);
}
.pg-hd { padding: 6px 16px 0; }
.pg-hd h1 { font-size: var(--t-2xl); font-weight: 900; letter-spacing: .5px; }
.pg-hd p { margin-top: 8px; font-size: var(--t-sm); color: #6E7889; }
/* 描边主按钮：白底深蓝边，点击瞬间反填充（极简但不弱转化引导） */
.pg-cta { margin-top: 18px; background: #fff; color: var(--blue-700); border: 1.5px solid var(--blue-700); }
.pg-cta:active { background: var(--blue-50); }

/* ---- 浅底内容区 ---- */
.pg-body { flex: 1; min-height: 0; display: flex; flex-direction: column; padding-top: 16px; }

/* ---- 四行步骤：一张白卡内的四行，行间 1px 分隔（与消息页 .mo-row 同款语言）----
   ⚠️ 旧版是深底上的竖向时间轴 + 连线；换浅底白卡后改用分隔线 ——
      白色卡面上的连线会被读成"装饰"，分隔线才是这套体系里的"这是并列项"。 */
.pg-steps {
  flex: none;
  margin: 12px 14px 0;
  padding: 2px 14px;
  border-radius: var(--r-xl);
  background: #fff;
  border: 1.5px solid #D8E0EC;
}
.pg-step { position: relative; display: flex; align-items: flex-start; gap: 10px; padding: 13px 0; }
.pg-step + .pg-step { border-top: 1px solid var(--line-2); }
.pg-n {
  flex: none;
  width: 20px; height: 20px;
  margin-top: 1px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  font-size: 10.5px;
  font-weight: 800;
  color: var(--ink-400);
  background: var(--line-2);
}
/* 当前步：深蓝实心序号 —— 整屏唯一"你现在在这儿"（与头条同色，形成呼应） */
.pg-step.is-on .pg-n { color: #fff; background: var(--blue-700); }
.pg-b { flex: 1; min-width: 0; }
.pg-b b { display: block; font-size: 13.5px; font-weight: 800; color: var(--ink-900); }
.pg-b small { display: block; margin-top: 3px; font-size: var(--t-xs); color: var(--ink-400); line-height: 1.55; }
.pg-lk { flex: none; margin-top: 2px; color: #C6D0DC; }
.pg-lk .ic { width: 15px; height: 15px; }

/* 招工信任条：蓝领最怕的是被中介转手 —— 这两句都必须有出处，
   不能写"全部岗位真实有效"这类没法核的话：
     ·「企业直招与中介代招分开标注」→ certTag() 的「企业认证 / 中介认证」两个标签
     ·「号码由企业实名认证后提供」  → unlock 弹层原句（screens-b.js 平台担保那句）
   ⚠️ 浅金底（--gold-100 + --gold-300 描边）是全站"可信 / 承诺"的统一色，
      与首页公告卡、付费推广等处的金同一个。 */
.pg-trust {
  flex: none;
  display: flex;
  align-items: flex-start;
  gap: 11px;
  margin: 12px 14px 0;
  padding: 12px 13px;
  border-radius: var(--r-xl);
  background: #fff;
  box-shadow: inset 0 0 0 1.5px var(--gold-300);
}
.pg-ti {
  flex: none;
  width: 28px; height: 28px;
  border-radius: 9px;
  display: grid;
  place-items: center;
  color: var(--gold-600);
  background: rgba(201, 153, 43, .16);
}
.pg-tt { min-width: 0; }
.pg-tt b { display: block; font-size: 13px; font-weight: 800; color: #5A4300; }
.pg-tt small { display: block; margin-top: 3px; font-size: var(--t-xs); color: var(--gold-700); line-height: 1.6; }

/* 底部：说明 + 次入口。margin-top:auto 让它在矮屏随内容排、高屏坠到 TabBar 上方 */
.pg-foot { margin-top: auto; padding: 16px 14px 18px; text-align: center; }
.pg-note {
  margin: 0;
  font-size: var(--t-xs);
  color: var(--ink-400);
  line-height: 1.8;
}
.pg-link {
  margin-top: 4px;
  padding: 4px 8px;
  font-size: var(--t-xs);
  color: var(--blue-600);
  text-decoration: underline;
  text-underline-offset: 3px;
}

/* 矮屏（iPhone SE 一代一类，可视高 ≤ 700）：头条 + 白卡会把「先随便看看」顶出首屏。
   ⚠️ 本版唯一的真按钮（立即登录）在深蓝头条里、天然落在首屏上半部，
      所以底栏不需要 sticky / fixed，压缩竖向节奏即可。 */
@media (max-height: 700px) {
  .pg-top { padding-bottom: 16px; }
  .pg-hd h1 { font-size: var(--t-xl); }
  .pg-cta { margin-top: 14px; }
  .pg-body { padding-top: 12px; }
  .pg-step { padding: 11px 0; }
  .pg-foot { padding: 12px 14px 14px; }
}
/* 游客版首页提示条：蓝色（区别于证书提醒的金色），点进登录 */
.hh-tip-guest .hh-tip-i { background: var(--blue-50); color: var(--blue-600); }

/* ==========================================================================
   企业身份（mobile.ent.js）—— 移动端企业版 9 屏样式
   命名统一 em- 前缀（enterprise mobile），与工人端既有类完全隔离。
   ========================================================================== */
.em-stat-row { display: flex; gap: 10px; padding: 0 14px 10px; }
.em-stat { flex: 1; background: #fff; border-radius: 12px; padding: 10px 12px; text-align: center; }
.em-stat b { display: block; font-size: 20px; font-weight: 800; color: var(--ink-900, #1b2432); }
.em-stat small { font-size: 11px; color: var(--ink-500, #8a94a6); }

/* 「我的招工」屏内发布入口（实名个人没有企业端那种"发布岗位"习惯入口，
   把发布做成屏内主按钮，进屏就知道在哪发） */
.em-post-bar { flex: none; padding: 4px 14px 10px; background: #fff; }
.em-post-bar .btn { display: flex; align-items: center; justify-content: center; gap: 6px; }
.em-post-bar small { display: block; margin-top: 6px; font-size: 11px; text-align: center; color: var(--ink-500, #8a94a6); }

.em-job-card { padding: 12px; }
.em-jc-top { display: flex; gap: 10px; align-items: flex-start; }
.em-jc-main { flex: 1; min-width: 0; }
.em-jc-name { font-size: 16px; font-weight: 800; color: var(--ink-900, #1b2432); }
/* 岗位卡上的行业标签（2026-10-15 用户要求：选了行业，卡片上得看得见）。
   ⚠️ 行业色**不写在这里** —— 文字色由 mobile.ent.js 的 indTag() 按 window.IND[k].color
      走行内 style 注入，这一层只给形状 + 中性浅底。行业是数据不是样式，
      新增一个行业不该回来改 CSS（也别出现"CSS 里的行业色和 IND 里的不一致"）。 */
.em-ind {
  display: inline-block;
  vertical-align: middle;
  margin: -1px 6px 1px 0;
  padding: 0 6px;
  height: 18px;
  line-height: 18px;
  border-radius: 5px;
  font-size: 11px;
  font-style: normal;
  font-weight: 800;
  letter-spacing: .2px;
  background: #F1F4F9;
}
.em-jc-sub { margin-top: 4px; font-size: 12px; color: var(--ink-500, #8a94a6); }
.em-jc-right { text-align: right; display: flex; flex-direction: column; align-items: flex-end; gap: 6px; }
.em-jc-stats { display: flex; gap: 14px; margin-top: 10px; font-size: 12px; color: var(--ink-600, #5b6779); }
.em-jc-stats span { display: inline-flex; align-items: center; gap: 4px; }
.em-jc-note { margin-top: 8px; font-size: 12px; color: #b9522f; display: flex; align-items: center; gap: 4px; }
.em-jc-foot, .em-cand-foot, .em-iv-foot, .em-talent-foot {
  display: flex; gap: 8px; margin-top: 12px; flex-wrap: wrap;
}
.em-jc-foot .btn, .em-cand-foot .btn, .em-iv-foot .btn, .em-talent-foot .btn { flex: 1; min-width: 0; }
.em-tab-scroll { overflow-x: auto; white-space: nowrap; }

/* 表单 */
.em-form { padding: 12px; }
.em-form-t { font-size: 13px; font-weight: 800; color: var(--blue-700, #0F3A80); margin: 6px 0 8px; }
.em-form-t:first-child { margin-top: 0; }
.em-field { display: flex; align-items: center; gap: 10px; padding: 10px 0; border-bottom: 1px solid #eef1f5; }
.em-field:last-child { border-bottom: 0; }
.em-fl { width: 72px; flex: none; font-size: 13px; color: var(--ink-600, #5b6779); }
.em-field input { flex: 1; min-width: 0; border: 0; background: none; font-size: 14px; color: var(--ink-900, #1b2432); }
.em-input { width: 100%; border: 1px solid #e3e8ef; border-radius: 10px; padding: 10px 12px; font-size: 14px; margin-bottom: 10px; }
.em-ta { width: 100%; min-height: 84px; border: 1px solid #e3e8ef; border-radius: 10px; padding: 9px 11px; font-size: 13px; line-height: 1.7; }
.em-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.em-chip { border: 1px solid #e3e8ef; background: #fff; border-radius: 999px; padding: 6px 12px; font-size: 12px; color: var(--ink-600, #5b6779); }
.em-chip.on { border-color: #2f6bd8; color: #2f6bd8; background: #f2f7ff; font-weight: 700; }
.em-foot-bar { display: flex; gap: 10px; padding: 10px 14px 14px; background: #fff; border-top: 1px solid #eef1f5; }
.em-foot-bar .btn { flex: 1; }

/* 候选人 / 面试 / 人才 / 录用 */
.em-cand, .em-iv, .em-talent, .em-offer { padding: 12px; }
.em-cand-top { display: flex; gap: 10px; }
.em-cand-main { flex: 1; min-width: 0; }
.em-cand-name { display: flex; align-items: center; gap: 6px; font-size: 15px; font-weight: 800; }
.em-cand-sub { margin-top: 4px; font-size: 12px; color: var(--ink-500, #8a94a6); }
.em-cand-tags { display: flex; align-items: center; gap: 8px; margin-top: 8px; flex-wrap: wrap; }
.em-cert { display: inline-flex; align-items: center; gap: 4px; font-size: 11px; padding: 3px 8px; border-radius: 999px; background: #eef6ee; color: #2f7d3b; }
.em-cert-off { background: #fdf3e6; color: #b9522f; }
.em-time { font-size: 11px; color: var(--ink-400, #9aa4b5); margin-left: auto; }
.em-cand-note { margin-top: 8px; font-size: 12px; color: var(--ink-600, #5b6779); display: flex; gap: 4px; align-items: flex-start; }
.em-inline-form { margin-top: 10px; padding: 10px 12px; background: #f7f9fc; border-radius: 10px; }
.em-inline-foot { display: flex; gap: 8px; margin-top: 8px; }
.em-inline-foot .btn { flex: 1; }

.em-iv-top { display: flex; align-items: center; gap: 10px; }
.em-iv-who { flex: 1; display: flex; align-items: center; gap: 10px; min-width: 0; }
.em-iv-name { font-size: 15px; font-weight: 800; }
.em-iv-job { margin-top: 3px; font-size: 12px; color: var(--ink-500, #8a94a6); }
.em-iv-info { margin-top: 10px; font-size: 12px; color: var(--ink-600, #5b6779); display: grid; gap: 5px; }
.em-iv-info div { display: flex; align-items: center; gap: 5px; }

.em-offer-top { display: flex; align-items: center; gap: 10px; }
.em-offer-main { flex: 1; min-width: 0; }
.em-offer-name { display: flex; align-items: center; gap: 6px; font-size: 15px; font-weight: 800; }
.em-offer-sub { margin-top: 4px; font-size: 12px; color: var(--ink-500, #8a94a6); }
.em-offer-steps { display: flex; gap: 6px; margin: 12px 0 8px; }
.em-step { flex: 1; text-align: center; font-size: 11px; color: var(--ink-500, #8a94a6); padding: 6px 0; background: #f4f6fa; border-radius: 8px; }
.em-step.on { background: #eaf2ff; color: #2f6bd8; font-weight: 700; }

.em-search { display: flex; gap: 8px; align-items: center; margin-bottom: 10px; }
.em-search-box { flex: 1; display: flex; align-items: center; gap: 6px; background: #fff; border-radius: 999px; padding: 9px 14px; }
.em-search-box input { flex: 1; border: 0; background: none; font-size: 13px; }
.em-talent-top { display: flex; gap: 10px; }
.em-talent-main { flex: 1; min-width: 0; }
.em-talent-name { display: flex; align-items: center; gap: 6px; font-size: 15px; font-weight: 800; }
.em-talent-sub { margin-top: 4px; font-size: 12px; color: var(--ink-500, #8a94a6); }
.em-talent-tags { display: flex; gap: 6px; flex-wrap: wrap; margin-top: 8px; }
.em-tag { font-size: 11px; padding: 3px 8px; border-radius: 6px; background: #f4f6fa; color: var(--ink-600, #5b6779); }
.em-tag-ok { background: #eef6ee; color: #2f7d3b; display: inline-flex; align-items: center; gap: 3px; }
.em-talent-sal { margin-top: 8px; font-size: 13px; font-weight: 700; color: #d97706; }

/* 企业主页 / 我的 / 设置 */
.em-corp-head { display: flex; gap: 12px; align-items: center; padding: 14px; }
.em-corp-info { flex: 1; min-width: 0; }
.em-corp-name { display: flex; align-items: center; gap: 6px; font-size: 16px; font-weight: 800; }
.em-corp-sub { margin-top: 4px; font-size: 12px; color: var(--ink-500, #8a94a6); }
.em-home-stat { display: flex; gap: 10px; }
.em-home-stat > div { flex: 1; text-align: center; }
.em-home-stat b { display: block; font-size: 18px; font-weight: 800; }
.em-home-stat small { font-size: 11px; color: var(--ink-500, #8a94a6); }

.em-set { padding: 4px 12px; }
.em-set-row { display: flex; align-items: center; gap: 10px; padding: 12px 0; border-bottom: 1px solid #eef1f5; }
.em-set-row:last-child { border-bottom: 0; }
.em-set-row > div { flex: 1; min-width: 0; }
.em-set-row b { display: block; font-size: 14px; }
.em-set-row small { font-size: 12px; color: var(--ink-500, #8a94a6); }
.em-sw { border: 1px solid #e3e8ef; background: #fff; border-radius: 999px; padding: 6px 14px; font-size: 12px; color: var(--ink-500, #8a94a6); }
.em-sw.on { border-color: #2f6bd8; color: #2f6bd8; background: #f2f7ff; font-weight: 700; }
.em-danger { color: #d64545; border-color: #f3d6d6; }

/* 我的（企业）：头像位置放企业 logo 块 */
.em-me-av { overflow: hidden; }
.em-me-av .logo { width: 100%; height: 100%; border-radius: 50%; display: grid; place-items: center; }
.em-switch-card { padding: 12px; }
.em-switch-top { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; font-size: 13px; margin-bottom: 10px; }
.em-switch-top b { font-size: 14px; }
.em-switch-top span { font-size: 12px; color: var(--ink-500, #8a94a6); }
.em-todo { padding: 12px; }
.em-todo-t { font-size: 14px; font-weight: 800; margin-bottom: 10px; }
.em-todo-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.em-todo-cell { background: #f7f9fc; border: 0; border-radius: 10px; padding: 10px; text-align: left; font-size: 12px; color: var(--ink-600, #5b6779); }
.em-todo-cell b { display: block; font-size: 18px; color: var(--ink-900, #1b2432); }
.em-menu { padding: 4px 12px; }
.em-menu-row { display: flex; align-items: center; gap: 10px; width: 100%; padding: 12px 0; background: none; border: 0; border-bottom: 1px solid #eef1f5; text-align: left; }
.em-menu-row:last-child { border-bottom: 0; }
.em-menu-ic { width: 30px; height: 30px; border-radius: 9px; background: #f2f7ff; color: #2f6bd8; display: grid; place-items: center; flex: none; }
.em-menu-tx { flex: 1; min-width: 0; }
.em-menu-tx b { display: block; font-size: 14px; }
.em-menu-tx small { font-size: 12px; color: var(--ink-500, #8a94a6); }

/* 登录页身份说明（身份由后端 role 决定，不再让用户选） */
/* "一个账号两种身份"的口径提示：淡蓝提示条，压在白卡顶部当引导语 */
.lg-note {
  display: flex; align-items: flex-start; gap: 7px;
  margin-bottom: 14px; padding: 10px 12px;
  background: var(--blue-50);
  border: 1px solid var(--blue-100);
  border-radius: var(--r-lg);
  font-size: var(--t-xs); line-height: 1.6;
  font-weight: 600;
  color: var(--blue-700, #24509e);
}
.lg-note .ic { flex: none; margin-top: 2px; color: var(--blue-500); }

/* 登录页身份二选一（Web 端仍在用，移动端已改为自动识别 —— 样式保留备查） */
.lg-id { display: flex; gap: 10px; margin-bottom: 14px; }
.lg-id-cell { flex: 1; border: 1px solid #e3e8ef; background: #fff; border-radius: 12px; padding: 10px 12px; text-align: left; }
.lg-id-cell b { display: block; font-size: 14px; color: var(--ink-900, #1b2432); }
.lg-id-cell small { font-size: 11px; color: var(--ink-500, #8a94a6); }
.lg-id-cell.on { border-color: #2f6bd8; background: #f2f7ff; }
.lg-id-cell.on b { color: #2f6bd8; }

/* ---- 消息页 · 未登录落地页（window.pageMessagesGuest）· A2 分类入口版 ----
   与通用登录墙 .gw-* 并列。消息是**底部 Tab 页**，游客是点导航进来的，
   只给一张「XX 需要登录」的卡片会让人以为走进了死胡同 ——
   这个页面回答的是"登录后我能收到什么"，答案是三张可点的分类入口卡。
   ⚠️ 每张卡右侧**没有未读数**：未登录取不到未读（后端按 user 算），
      画数字就是造数据、登录进去对不上。那格用 chevR 表示"整卡可点"。 */
.mg-guest { padding: 8px 0 26px; }
.mg-hero {
  text-align: center;
  padding: 22px 18px 20px;
  margin: 8px 14px 0;
  background: #fff;
  border: 1.5px solid #D8E0EC;
  border-radius: 16px;
}
.mg-mark {
  display: flex; align-items: center; justify-content: center;
  width: 62px; height: 62px; margin: 0 auto 12px;
  border-radius: 50%; color: var(--blue-700);
  background: #fff;
  border: 1.5px solid var(--blue-700);
}
.mg-hero h1 { margin: 0 0 6px; font-size: 19px; font-weight: 800; color: var(--ink-900, #101C2E); }
.mg-hero p { margin: 0; font-size: var(--t-xs, 12px); line-height: 1.75; color: var(--ink-500, #6B7C93); }

.mg-t { padding: 16px 16px 8px; font-size: var(--t-xs, 12px); font-weight: 800; color: #33445C; letter-spacing: .3px; }
.mg-cats { display: flex; flex-direction: column; }
/* 整张卡 = 一个登录入口：点击面比只有底部按钮大得多，行为与底部主按钮一致 */
.mg-cat {
  display: flex; align-items: center; gap: 12px;
  width: calc(100% - 28px); margin: 0 14px 10px; padding: 14px;
  text-align: left; background: #fff;
  border: 1.5px solid #D8E0EC; border-radius: var(--r-lg, 13px);
}
.mg-cat:active { background: #F2F5FA; }
.mg-ci { flex: none; display: grid; place-items: center; width: 44px; height: 44px; border-radius: 12px; color: var(--blue-700); background: #fff; border: 1.5px solid var(--blue-700); }
.mg-ci .ic { width: 22px; height: 22px; }
.mg-cb { flex: 1; min-width: 0; }
.mg-cb b { display: block; font-size: 14.5px; font-weight: 700; color: var(--ink-900, #101C2E); }
.mg-cb small { display: block; margin-top: 3px; font-size: 11.5px; line-height: 1.55; color: var(--ink-500, #6B7C93); }
.mg-more { flex: none; display: flex; color: var(--ink-300, #AFBCCE); }
.mg-note { margin: 2px 16px 0; font-size: 11.5px; line-height: 1.7; color: var(--ink-500, #6B7C93); }
.mg-cta { margin-top: 20px; padding: 0 16px; display: flex; flex-direction: column; gap: 9px; }

/* 极简线条（d11）：游客页 CTA 走"描边"而非实色填充，与全站描边语言一致；
   作用域限定 .mg-guest / .pf-guest，不污染其他页的实色按钮 */
.mg-guest .btn-primary, .pf-guest .btn-primary { background: #fff; color: var(--blue-700); border: 1.5px solid var(--blue-700); }
.mg-guest .btn-primary:active, .pf-guest .btn-primary:active { background: var(--blue-50); }
.mg-guest .btn-plain, .pf-guest .btn-plain { background: #fff; color: var(--ink-500); border: 1.5px solid #D8E0EC; }

/* ==========================================================================
   P8：我的页 · 会员套餐（VIP）栏目
   数据源 GET /me/vip（pullMyVip → window.MY_VIP）；
   金色系与实名 chip（chip-gold）同源（tokens.css 的 --gold-*），
   不另起一套视觉 —— 会员是平台的"高级感"入口，不是促销弹窗。
   ========================================================================== */
.ent-vipcard { position: relative; overflow: hidden; }
.ent-vipcard::before {
  content: ''; position: absolute; inset: 0; pointer-events: none;
  background: linear-gradient(120deg, rgba(201, 153, 43, .08), transparent 55%);
}
.ent-vipcard.is-on::before {
  background: linear-gradient(120deg, rgba(201, 153, 43, .16), rgba(201, 153, 43, .04) 60%);
}
.ent-vipcard .vc-top { display: flex; align-items: center; justify-content: space-between; margin-bottom: 10px; }
.ent-vipcard .vc-crown { display: inline-flex; align-items: center; gap: 6px;
  font-size: 13px; font-weight: 700; color: var(--gold-600, #A87F1F); letter-spacing: .5px; }
.ent-vipcard .vc-chip { font-size: 11.5px; font-weight: 700; color: #7A5A10;
  background: linear-gradient(96deg, var(--gold-100, #F7EDD3), #fff 78%);
  border: 1px solid var(--gold-200, #EAD9A8); border-radius: 999px; padding: 3px 10px; }
.ent-vipcard .vc-main { display: flex; align-items: baseline; gap: 12px; flex-wrap: wrap; }
.ent-vipcard .vc-name { font-size: 17px; font-weight: 800; color: var(--ink-900, #1A2233); }
.ent-vipcard .vc-count { font-size: 13px; font-weight: 700; color: var(--gold-600, #A87F1F); font-variant-numeric: tabular-nums; }
.ent-vipcard .vc-sub { font-size: 12.5px; color: var(--ink-500, #6B7C93); }
.ent-vipcard .vc-quota { margin-top: 6px; font-size: 12.5px; color: var(--ink-500, #6B7C93); }
.ent-vipcard .vc-btn {
  margin-top: 12px; width: 100%; display: flex; align-items: center; justify-content: center;
  gap: 6px; padding: 10px 0; border: 0; border-radius: 10px; cursor: pointer;
  font-size: 14px; font-weight: 700; color: #3D2E05;
  background: linear-gradient(96deg, var(--gold-300, #E4C56E), var(--gold-500, #C9992B));
}
.ent-vipcard .vc-btn:active { opacity: .85; }

/* ===== 2026-10-03 「我的」页：右上角企业切换 / 账户卡 / 常用功能 4 列 ===== */

/* 右上角「企业」切换按钮（原先压在用户卡下方的身份条里） */
.pf-sw-ent { display: inline-flex; align-items: center; gap: 3px; height: 28px; padding: 0 10px;
  border-radius: 14px; border: 1px solid rgba(255,255,255,.42); background: rgba(255,255,255,.16);
  color: #fff; font-size: 12px; font-weight: 700; cursor: pointer; }
.pf-sw-ent svg { width: 13px; height: 13px; }
.pf-sw-ent:active { background: rgba(255,255,255,.28); }

/* 账户卡：账号余额 + 会员权益合成一张（原先是两张独立卡片） */
.ac-card { padding: 14px; }
.ac-part { padding: 2px 0; }
.ac-top { display: flex; align-items: center; justify-content: space-between; margin-bottom: 8px; }
.ac-label { display: inline-flex; align-items: center; gap: 5px; font-size: 13px; font-weight: 700;
  color: var(--ink-700, #3c4658); }
.ac-label svg { width: 14px; height: 14px; color: var(--brand, #2f6bd8); }
.ac-link { display: inline-flex; align-items: center; gap: 2px; background: none; border: 0; padding: 0;
  font-size: 12px; color: var(--ink-500, #8a94a6); cursor: pointer; }
.ac-link svg { width: 12px; height: 12px; }
.ac-main { display: flex; align-items: flex-end; justify-content: space-between; gap: 10px; }
.ac-money { font-size: 28px; font-weight: 800; color: var(--ink-900, #1b2432); line-height: 1.1; }
.ac-money .num { font-size: 30px; }
.ac-money small { font-size: 13px; font-weight: 600; margin-left: 3px; color: var(--ink-500, #8a94a6); }
.ac-side { display: flex; gap: 14px; text-align: right; }
.ac-side b { display: block; font-size: 14px; color: var(--ink-900, #1b2432); }
.ac-side small { font-size: 11px; color: var(--ink-500, #8a94a6); }
.ac-split { height: 1px; background: var(--line, #eef1f6); margin: 12px 0; }
.ac-vip-name { font-size: 16px; font-weight: 800; color: var(--ink-900, #1b2432); }
.ac-count { font-size: 12px; font-weight: 700; color: var(--brand, #2f6bd8); }
.ac-count-plain { font-weight: 500; color: var(--ink-500, #8a94a6); }
.ac-chip { font-size: 11px; font-weight: 700; color: #a8791f; background: #fff6e0;
  border-radius: 9px; padding: 2px 7px; }
.ac-quota { margin-top: 7px; font-size: 12px; color: var(--ink-600, #5b6779); }
.ac-quota b { color: var(--ink-900, #1b2432); }
.ac-acts { display: flex; gap: 8px; margin-top: 13px; }
.ac-btn { flex: 1; display: inline-flex; align-items: center; justify-content: center; gap: 4px;
  height: 36px; border-radius: 10px; border: 1px solid var(--line, #e6eaf2); background: #fff;
  font-size: 12px; font-weight: 700; color: var(--ink-700, #3c4658); cursor: pointer; }
.ac-btn svg { width: 13px; height: 13px; }
.ac-btn-main { background: var(--brand, #2f6bd8); border-color: var(--brand, #2f6bd8); color: #fff; }
.ac-btn-vip { background: #fff7e8; border-color: #f2d9a8; color: #a8791f; }
.ac-badge { margin-left: 3px; font-size: 10px; color: #d0483f; background: #ffeeee;
  border-radius: 8px; padding: 1px 5px; }

/* 常用功能：4 列卡片网格 */
.qk-card { padding: 12px 10px 6px; }
.qk-head { display: flex; align-items: center; gap: 5px; margin: 0 2px 10px; }
.qk-head svg { width: 14px; height: 14px; color: var(--brand, #2f6bd8); }
.qk-head b { font-size: 14px; font-weight: 800; color: var(--ink-900, #1b2432); }
.qk-head small { font-size: 11px; color: var(--ink-500, #8a94a6); margin-left: auto; }
.qk-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 2px; }
.qk-cell { display: flex; flex-direction: column; align-items: center; gap: 4px;
  padding: 10px 2px; border: 0; background: none; cursor: pointer; border-radius: 10px; }
.qk-cell:active { background: #f5f7fb; }
.qk-ic { width: 34px; height: 34px; border-radius: 11px; display: grid; place-items: center;
  background: #f2f6fd; color: var(--brand, #2f6bd8); }
.qk-ic svg { width: 17px; height: 17px; }
.qk-cell b { font-size: 12px; font-weight: 700; color: var(--ink-900, #1b2432); }
.qk-cell small { font-size: 10px; color: var(--ink-500, #8a94a6); text-align: center; line-height: 1.25; }

/* 实名认证：选填项标记（银行卡 / 证书不挡实名） */
.vf-opt { margin-left: 5px; font-style: normal; font-size: 10px; font-weight: 700;
  color: var(--ink-500, #8a94a6); background: #f2f4f8; border-radius: 8px; padding: 1px 5px; }

/* ==========================================================================
   发布页 · 方案 P1「分区编号长卷」（2026-10-05 落码）
   --------------------------------------------------------------------------
   找活发布 / 需求发布 统一：完成度头条（.pub-hero）+ 分区编号头（.sec-head .no）
   + 吸底提交条（.pub-fix）。企业端发布向导复用同一套 .pub-hero（见 ent.css）。
   ⚠️ 全部是新类，不动 .card / .sec-head / .btn 基础规则 ——
      secHead() 只有传 opt.no 时才吐编号块，其它调用方零影响。
   ========================================================================== */
/* ---- 完成度头条：深蓝 + 右上冷光晕（与「我的」Y 斜切 / 消息 M3 同一语言） ---- */
.pub-hero {
  position: relative;
  overflow: hidden;
  flex: none;
  margin: 12px 0 10px;
  padding: 13px 14px;
  border-radius: 16px;
  color: #fff;
  background: linear-gradient(150deg, #12428F 0%, var(--blue-700) 58%, #0A2A5E 100%);
  box-shadow: 0 14px 30px -18px rgba(10, 42, 94, .85);
}
.pub-hero::after {
  content: '';
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: radial-gradient(80% 70% at 90% -16%, rgba(126, 176, 255, .34), transparent 62%);
}
.pub-hero .ph-h { display: flex; align-items: center; gap: 9px; position: relative; z-index: 1; }
.pub-hero .ph-b {
  width: 36px; height: 36px; border-radius: 11px; flex: none;
  display: grid; place-items: center;
  color: var(--gold-300);
  background: rgba(255, 255, 255, .13);
  border: 1px solid rgba(255, 255, 255, .2);
}
.pub-hero .ph-b .ic { width: 19px; height: 19px; }
.pub-hero .ph-t { min-width: 0; }
.pub-hero .ph-t b { display: block; font-size: 14px; font-weight: 800; letter-spacing: .2px; }
.pub-hero .ph-t small { display: block; font-size: 10.5px; color: rgba(214, 229, 255, .72); }
.pub-hero .ph-p { margin-left: auto; text-align: right; flex: none; }
.pub-hero .ph-p b {
  display: block; font-size: 15px; font-weight: 800; color: var(--gold-300);
  font-family: var(--font-num);
}
.pub-hero .ph-p small { display: block; font-size: 9.5px; color: rgba(214, 229, 255, .6); }
.pub-hero .ph-bar {
  position: relative; z-index: 1; height: 5px; margin-top: 11px;
  border-radius: 3px; overflow: hidden; background: rgba(255, 255, 255, .16);
}
.pub-hero .ph-bar i {
  display: block; height: 100%; border-radius: 3px;
  background: linear-gradient(90deg, #F3D488, var(--gold-500));
  transition: width .3s ease;
}

/* ---- 分区编号头：secHead(title, {no:'01'}) 时取代竖条 ---- */
.sec-head .no {
  width: 21px; height: 21px; border-radius: 7px; flex: none;
  display: grid; place-items: center;
  font-size: 10.5px; font-weight: 900;
  color: var(--gold-700);
  background: var(--gold-100);
  border: 1px solid var(--gold-200);
  font-family: var(--font-num);
}
/* 章节副标（「必填 4」「选填」这类），靠右 */
.sec-head .sh-sub {
  margin-left: auto;
  font-size: 10.5px; font-weight: 700; color: var(--ink-400);
}

/* ---- 吸底提交条：随滚动常驻视口底部 ---- */
.screen-publish .page-body { padding-bottom: 0; }
.pub-fix {
  position: sticky;
  bottom: 0;
  z-index: 6;
  display: flex;
  align-items: center;
  gap: 10px;
  margin-top: 16px;
  padding: 8px 0 14px;
  background: linear-gradient(180deg, rgba(242, 245, 250, 0) 0%,
    rgba(242, 245, 250, .94) 36%, #F2F5FA 100%);
}
.pub-fix .pf-sub {
  flex: 1;
  height: 48px;
  border: 0;
  border-radius: 13px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  font-size: 15px;
  font-weight: 800;
  color: #fff;
  background: linear-gradient(135deg, #1E5BB8, var(--blue-700));
  box-shadow: 0 10px 22px -12px rgba(15, 58, 128, .85);
}
.pub-fix .pf-sub .ic { width: 17px; height: 17px; }
.pub-fix .pf-sub:active { filter: brightness(.94); }
.pub-fix .pf-tip {
  flex: none;
  max-width: 112px;
  font-size: 10.5px;
  font-weight: 700;
  line-height: 1.35;
  color: var(--ink-400);
}
.pub-fix .pf-tip b { display: block; color: var(--blue-700); font-size: 11.5px; }
/* 编号块是 21px（竖条只有 15px），卡片头需要抹平这点高度差 */
.sec-head.has-no { padding: 15px 2px 10px; }
.sec-head.tight.has-no { padding: 3px 0 11px; }

/* ==========================================================================
   客服工单 · 对话（用户端「我的工单」展开后看客服回复）
   ⚠️ 与后台 admin.css 的 .tk-msg 同款：两边看的是同一段对话，样式也应一致，
      否则同一句话在后台靠右、在用户端靠左，看着像两条不同的记录。
   ========================================================================== */
.tk-talk {
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 12px 14px 14px;
  border-top: 1px solid var(--line);
  background: var(--bg-2, #f7f8fa);
}
.tk-talk .pv-hint { margin: 0; font-size: 12px; color: var(--ink-400); }
.tk-msg {
  max-width: 88%;
  padding: 10px 13px;
  border-radius: var(--r-lg, 12px);
  background: var(--line-2, #f1f3f6);
  border: 1px solid var(--line, #e6e9ef);
}
.tk-msg.mine {
  align-self: flex-end;
  background: var(--blue-100, #e8f0ff);
  border-color: var(--blue-200, #cddffa);
}
.tk-msg-hd {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 4px;
}
.tk-msg-hd b { font-size: 12px; font-weight: 800; color: var(--ink-800, #1b2432); }
.tk-msg-hd .mono { font-size: 11px; color: var(--ink-400, #8a94a6); }
.tk-msg-b { font-size: 13px; line-height: 1.7; color: var(--ink-700, #3d4657); word-break: break-word; }

/* ==========================================================================
   列表页顶部 · 智能推荐面板（3 条）
   位置：筛选栏 → 「共 N 个岗位」统计行 → 本模块 → 岗位列表
   设计（2026-10-09 按设计稿 home-hot-10.html H1 还原）：浅色版式 ——
   头部/信任行在页面底色上，三行装进白卡（.rp-card）；理由金胶囊、编号金徽标。
   ========================================================================== */
/* ==========================================================================
   B4 · 左竖编号（2026-10-15 用户从 10 款「列表内推荐」里点款落码）
   --------------------------------------------------------------------------
   推荐不再是悬在列表上方的独立面板，而是**列表流里的前三张卡**：左端 30px 实色
   竖块写 01 / 02 / 03，右区三行（名称+右侧 / 理由金胶囊 / 地区·距离）。
   卡与下方列表卡同处一个滚动流，靠竖块编号与理由胶囊区分，不靠留白区分。

   ⛔ 竖块三色轮转（深蓝 / 金 / 深青）只为三条彼此可分辨，**不是金银铜排名** ——
      三条是按不同维度各挑一条，彼此不可比，「01 最好」是错误暗示。
   ⛔ 薪资改成「数字 15px + 单位 12px 第二行」堆叠：上一版行内 18px 薪资把中间列
      挤到截断（实测 why 121/108、loc 141/137），这是随 B4 一起落码的修复。
   ---
   退役：.rec-panel / .rp-sec / .rp-sec-right / .rp-card / .rp-more / .rp-row /
        .rp-rk / .rp-bd / .rp-pay / .rp-ft / .rp-g / .rp-gh / .rp-gbar
        （独立面板形态与 E8 关注点分区整组；要回退去 git 取，此处不留死代码）
   ========================================================================== */
.rp-b4 {
  display: flex;
  align-items: stretch;
  width: 100%;
  text-align: left;
  margin-bottom: 10px;
  padding: 0;
  border: 0;
  font: inherit;
  background: #fff;
  border-radius: var(--r-xl);
  overflow: hidden;
  box-shadow: inset 0 0 0 1px #EFF3F8, 0 1px 2px rgba(16, 28, 46, .05);
}
.rp-b4:active { background: #F7FAFD; }
.rp-b4n {
  flex: none;
  width: 30px;
  display: grid;
  place-items: center;
  background: linear-gradient(160deg, #2A559C, #0F3A80);
  color: #fff;
  font-size: 13px;
  font-weight: 900;
  letter-spacing: .2px;
}
.rp-b4n.g { background: linear-gradient(160deg, #E7C55F, #C9992B); color: #4A3400; }
.rp-b4n.t { background: linear-gradient(160deg, #12897A, #0B5A50); }
.rp-b4b {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  padding: 11px 0 11px 12px;
}
/* 第一行：名称（可伸缩，单行省略）+ 右侧（薪资 / 需求侧的类别·状态小标签） */
.rp-b4h { display: flex; align-items: flex-start; gap: 8px; }
.rp-b4h .rp-nm { flex: 1; min-width: 0; }

.rp-nm {
  display: block;
  font-size: 15px;
  font-weight: 800;
  color: #101C2E;
  line-height: 1.3;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
/* 理由金胶囊（设计稿 b1-why 同款）：浅金实底 + 深金字，无描边。
   inline-flex 让胶囊只包内容宽度；理由文案单行省略，三条高度不参差。 */
.rp-why {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  margin-top: 5px;
  max-width: 100%;
  min-width: 0;
  height: 21px;
  padding: 0 7px;
  border-radius: 6px;
  font-size: 12px;
  font-weight: 800;
  color: #8A6414;
  background: #FCF3DE;
}
.rp-why .ic { width: 12px; height: 12px; color: #8A6414; flex: none; }
/* 理由一律单行省略：薪资宽窄不定，放任换行会让三条的高度参差不齐 */
.rp-why-tx {
  min-width: 0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
/* B1 第三行「地区 · 距离」：纯事实行（调用方给就渲染，不给不占位）。 */
.rp-loc {
  display: block;
  margin-top: 4px;
  font-size: 12px;
  color: #93A1B5;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.rp-b4pay { flex: none; text-align: right; }
.rp-b4pay .salary {
  flex-direction: column;
  align-items: flex-end;
  gap: 0;
  font-size: 15px;
  font-weight: 900;
  color: var(--gold-600, #AE7E1A);
}
/* 单位落到第二行：行内拼在数字右边时（"8500-11000 元/月"）整块宽 100px+，
   会把名称压到只剩几个字。两行堆叠后右侧固定 ~64px，名称才拿得到宽度。 */
.rp-b4pay .salary .u {
  display: block;
  margin-left: 0;
  font-size: 12px;
  font-weight: 700;
  color: #93A1B5;
}
/* 需求侧右侧无薪资（原型数据无预算字段，不造假）：类别 / 状态小标签竖排右对齐 */
.rp-b4pay small {
  display: block;
  margin-top: 2px;
  font-size: 11px;
  font-weight: 700;
  color: #93A1B5;
  text-align: right;
  white-space: nowrap;
}
.rp-b4 > .ic-sm:last-child { flex: none; align-self: center; margin-right: 10px; color: #C3CDDA; }

/* 卡组脚注：口径小字 + 换一批 + 反付费排序承诺。
   ⛔ 面板外壳没了，这三条一条都不能丢 —— 换一批是真行为（各调用方 seen 表），
      「不含付费排序」是产品承诺，改版改的是长相不是承诺。 */
.rp-b4ft { display: flex; align-items: center; gap: 8px; padding: 0 2px 10px; }
.rp-b4ftx { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.rp-b4sub {
  font-size: 12px;
  font-weight: 400;
  color: #93A1B5;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.rp-b4tip {
  display: flex;
  align-items: center;
  gap: 4px;
  font-size: 12px;
  color: #93A1B5;
}
.rp-b4tip .ic { width: 12px; height: 12px; flex: none; }
.rp-b4spin {
  flex: none;
  display: inline-flex;
  align-items: center;
  gap: 3px;
  height: 26px;
  padding: 0 10px;
  border: 0;
  border-radius: var(--r-pill);
  background: #F2F7FD;
  color: #0F3A80;
  font-family: inherit;
  font-size: 12px;
  font-weight: 700;
}
.rp-b4spin:active { background: #E3EDF9; }
.rp-b4spin .ic { width: 12px; height: 12px; }

/* E8 关注点分区（2026-10-10 拍板）随 B4 落码退役：维度语义已由理由胶囊承载
   （「距你 18km，本批最近」/「本批薪资最高」），再挂一层「距离 / 薪资」抬头
   就是把同一件事说两遍。要回退：mobile.ui.js 的 RP_GDESC 表仍保留着。 */

/* ==========================================================================
   付费推广弹层 · 深色沉浸版（置顶 / 刷新共用）
   ----------------------------------------------------------------------
   为什么整块换深蓝：置顶和刷新是**花钱动作**，弹层从白色列表里"浮"出来时
   需要明确的边界感 —— 白底弹层压在白底列表上，用户分不清哪块是新的。
   深蓝 + 金色与主色同源（--blue-800 / --gold-300），不引入新色系。
   ⚠️ 深色底上的浅色小字一律用 rgba(255,255,255,.55) 以上，低于这个值
      对比度不达标（无障碍），改这条前先实测。
   ========================================================================== */
.sheet.is-dark {
  position: relative;
  overflow: hidden;
  color: #fff;
  background: linear-gradient(165deg, #0F3A80 0%, #0C3068 55%, #0A2A5C 100%);
  box-shadow: 0 -12px 40px rgba(4, 16, 36, .42);
}
/* 右上金色光晕：避免深蓝是一块平色 */
.sheet.is-dark::before {
  content: "";
  position: absolute;
  top: -58px; right: -40px;
  width: 170px; height: 170px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(201, 153, 43, .30), transparent 68%);
  pointer-events: none;
}
/* 斜纹：与首页 Hero 同一手法，保持家族感 */
.sheet.is-dark::after {
  content: "";
  position: absolute;
  inset: 0;
  background-image: repeating-linear-gradient(
    -55deg, rgba(255, 255, 255, .04) 0 1px, transparent 1px 11px);
  pointer-events: none;
}
.sheet.is-dark > * { position: relative; z-index: 1; }

.sheet.is-dark .sheet-grab { background: rgba(255, 255, 255, .32); }
.sheet.is-dark .su-ic { background: rgba(222, 180, 79, .20); color: var(--gold-300); }
.sheet.is-dark .su-head p { color: rgba(255, 255, 255, .66); }
.sheet.is-dark .su-close { color: rgba(255, 255, 255, .58); }

/* 范围卡 / 天数 chips：半透明白边玻璃态 */
.sheet.is-dark .tp-sc {
  background: rgba(255, 255, 255, .08);
  border-color: rgba(255, 255, 255, .18);
}
.sheet.is-dark .tp-sc b { color: #fff; }
.sheet.is-dark .tp-sc span { color: var(--gold-300); }
.sheet.is-dark .tp-sc small { color: rgba(255, 255, 255, .58); }
.sheet.is-dark .tp-sc.on {
  border-color: var(--gold-400);
  background: rgba(222, 180, 79, .16);
}
.sheet.is-dark .tp-d {
  background: rgba(255, 255, 255, .08);
  border-color: rgba(255, 255, 255, .18);
  color: rgba(255, 255, 255, .82);
}
.sheet.is-dark .tp-d.on {
  border-color: var(--gold-400);
  background: rgba(222, 180, 79, .18);
  color: var(--gold-200);
  font-weight: 700;
}

/* 结算格：应付走浅金，余额走白 */
.sheet.is-dark .sp-cell {
  background: rgba(255, 255, 255, .08);
  border-color: rgba(255, 255, 255, .14);
}
.sheet.is-dark .sp-cell span { color: rgba(255, 255, 255, .62); }
.sheet.is-dark .sp-cell b { color: #fff; }
.sheet.is-dark .sp-cell.is-pay b { color: var(--gold-300); }

/* 余额不足差额条（基础版＝浅底；深色弹层里由 .is-dark 覆盖成暗红） */
.su-gap {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-top: 10px;
  padding: 9px 11px;
  border-radius: var(--r-md);
  background: #FDEDEC;
  border: 1px solid #F3C3BE;
  font-size: var(--t-xs);
  color: #B3261E;
}
.su-gap .ic { flex: none; width: 14px; height: 14px; color: #D9342B; }
.su-gap b { color: #B3261E; font-family: var(--font-num); font-weight: 800; }

.sheet.is-dark .su-note { color: rgba(255, 255, 255, .60); }
.sheet.is-dark .su-note .ic { color: var(--gold-300); }
.sheet.is-dark .su-cancel { color: rgba(255, 255, 255, .55); }
/* 主按钮在深底上要有投影才"立得住" */
.sheet.is-dark .btn-gold { box-shadow: 0 6px 16px rgba(201, 153, 43, .30); }

/* 深色底上的禁用态：暗金按钮对比度不足，改成玻璃灰更明确"不可点" */
.sheet.is-dark .btn:disabled,
.sheet.is-dark .btn[disabled] {
  background: rgba(255, 255, 255, .12);
  color: rgba(255, 255, 255, .52);
  box-shadow: none;
}
/* ⚠️ 差额条不能用半透明红叠在深蓝上 —— 混色后发紫，看着像"提示"不像"报错"。
   用不透明暗红打底，蓝底透不过来，红才是红。 */
.sheet.is-dark .su-gap {
  background: #8A2620;
  border-color: rgba(255, 163, 155, .44);
  color: #FFCFC9;
}
.sheet.is-dark .su-gap .ic { color: #FF9A92; }
.sheet.is-dark .su-gap b { color: #FFE2DE; }

/* ==========================================================================
   记工记账（工具屏 tally）—— 2026-10-15
   ========================================================================== */
.screen-tally .tl-body { padding-bottom: 92px; }

/* 统计卡 */
.tl-stat { padding: 16px; }
.tls-top { display: flex; align-items: flex-start; }
.tls-main { flex: 1; }
.tls-lab { font-size: 12px; color: var(--ink-500); display: block; margin-bottom: 4px; }
.tls-num {
  font-size: 30px; font-weight: 800; color: var(--ink-900);
  font-family: var(--font-num); line-height: 1.1;
}
.tl-share {
  flex: none; display: inline-flex; align-items: center; gap: 3px;
  padding: 5px 10px; border-radius: var(--r-pill);
  background: var(--blue-50); color: var(--blue-700);
  font-size: 12px; font-weight: 700;
}
.tl-share .ic { width: 13px; height: 13px; }
.tls-row { display: flex; gap: 18px; margin-top: 12px; font-size: 13px; color: var(--ink-600); }
.tls-row b { font-family: var(--font-num); font-weight: 800; }
.tls-green { color: var(--success); }
.tls-red { color: var(--danger); }
.tls-sub { margin-top: 8px; font-size: 11px; color: var(--ink-400); }

/* 默认单价设置行 */
.tl-set {
  display: flex; align-items: center; gap: 8px;
  margin: 12px 14px 0; padding: 12px 14px;
  background: #fff; border-radius: var(--r-lg);
  box-shadow: 0 1px 3px rgba(16, 28, 46, .05);
  font-size: 13px; color: var(--ink-700); cursor: pointer;
}
.tl-set .ic:first-child { color: var(--gold-600); }
.tl-set span { flex: 1; }
.tl-set b { color: var(--ink-900); font-family: var(--font-num); }
.tl-set .ic:last-child { color: var(--ink-400); }

/* 流水 */
.tl-list { margin-top: 4px; }
.tl-month { font-size: 12px; font-weight: 800; color: var(--ink-500); padding: 12px 4px 6px; }
.tl-item {
  display: flex; align-items: center; gap: 10px;
  padding: 12px 14px; background: #fff;
  border-bottom: 1px solid var(--line-2);
}
.tl-dot { width: 8px; height: 8px; border-radius: 50%; flex: none; }
.tl-dot.t-blue { background: var(--blue-600); }
.tl-dot.t-gold { background: var(--gold-500); }
.tl-dot.t-gray { background: var(--ink-300); }
.tl-dot.t-green { background: var(--success); }
.tl-dot.t-red { background: var(--danger); }
.tl-main { flex: 1; min-width: 0; }
.tl-main b { display: block; font-size: 14px; font-weight: 800; color: var(--ink-900); }
.tl-main small {
  display: block; font-size: 11px; color: var(--ink-500); margin-top: 2px;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.tl-right { flex: none; display: flex; align-items: center; gap: 8px; }
.tl-plus { color: var(--success); font-family: var(--font-num); font-weight: 800; font-size: 15px; }
.tl-paid { color: var(--success); font-family: var(--font-num); font-weight: 800; }
.tl-paid + small, .tl-out + small { color: var(--ink-400); font-size: 10px; margin-left: 2px; }
.tl-out { color: var(--danger); font-family: var(--font-num); font-weight: 800; }
.tl-gray { color: var(--ink-400); font-family: var(--font-num); }
.tl-del { border: 0; background: none; color: var(--ink-400); font-size: 12px; padding: 4px 2px; }
.tl-del:active { color: var(--danger); }
.tl-empty { text-align: center; padding: 40px 20px; color: var(--ink-400); }
.tl-empty .ic { width: 40px; height: 40px; color: var(--ink-300); }
.tl-empty p { font-size: 15px; font-weight: 700; color: var(--ink-600); margin: 10px 0 4px; }
.tl-empty small { font-size: 12px; line-height: 1.6; }

/* 底部记一笔 */
.tl-fab {
  position: fixed; left: 50%; transform: translateX(-50%);
  bottom: calc(16px + env(safe-area-inset-bottom, 0px));
  z-index: 30;
  display: inline-flex; align-items: center; gap: 6px;
  height: 48px; padding: 0 26px; border: 0; border-radius: 999px;
  background: var(--blue-700); color: #fff;
  font-size: 16px; font-weight: 800;
  box-shadow: 0 8px 22px rgba(15, 58, 128, .36);
}
.tl-fab .ic { width: 16px; height: 16px; }

/* 弹层内表单（复用 .sheet 容器） */
.tl-sheet { padding-bottom: calc(20px + env(safe-area-inset-bottom, 0px)); }
.tl-set-h { font-size: 15px; font-weight: 800; color: var(--ink-900); text-align: center; padding: 4px 0 12px; }
.tl-tabs { display: flex; gap: 6px; margin-bottom: 14px; }
.tl-tab {
  flex: 1; height: 34px; border: 1px solid var(--line); border-radius: var(--r-md);
  background: #fff; color: var(--ink-600); font-size: 13px; font-weight: 700;
}
.tl-tab.on { background: var(--blue-700); border-color: var(--blue-700); color: #fff; }
.tl-form { display: flex; flex-direction: column; gap: 10px; margin-bottom: 16px; }
.tl-f {
  display: flex; align-items: center; gap: 10px;
  background: var(--bg); border-radius: var(--r-md); padding: 0 12px; height: 46px;
}
.tl-lab { width: 92px; flex: none; font-size: 13px; color: var(--ink-600); }
.tl-f input {
  flex: 1; border: 0; background: none; outline: none;
  font-size: 15px; color: var(--ink-900); font-family: var(--font-num);
  min-width: 0; height: 100%;
}
.tl-f input::-webkit-input-placeholder { color: var(--ink-300); font-family: var(--font); }

/* ==========================================================================
   发布招工 · 认证引导墙（求职者）+ 用工主体认证页（企业 / 中介）
   2026-10-10 按用户要求美化。骨架见 mobile.ent.js 的 workerAuthWall 与
   mobile.screens-f.js 的 authForm / authDone。
   约定：字号只取全站既有档（11 / 12 / 14 / 17 / 19），圆角同卡片口径 --r-xl；
   主色沿用 --blue-700 家族，金只用在"身份标识"和"亮点勾"这类点缀上。
   ========================================================================== */

/* ---------- A. 认证引导墙 ---------- */
.aw-hero {
  position: relative;
  overflow: hidden;
  padding: 16px;
  margin-bottom: 12px;
  border-radius: var(--r-xl);
  background: linear-gradient(135deg, #0A2A5C 0%, #0F3A80 56%, #17509E 100%);
  color: #fff;
}
.aw-hero::after {
  content: "";
  position: absolute;
  right: -46px; top: -54px;
  width: 140px; height: 140px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(201, 153, 43, .42), rgba(201, 153, 43, 0) 68%);
}
.aw-hero-top { position: relative; display: flex; align-items: center; gap: 11px; }
.aw-hero-ic {
  flex: none;
  width: 40px; height: 40px;
  display: grid; place-items: center;
  border-radius: var(--r-lg);
  background: rgba(255, 255, 255, .14);
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .22);
  color: var(--gold-300);
}
.aw-hero-tx { min-width: 0; flex: 1; }
.aw-hero-tx b { display: block; font-size: var(--t-md); font-weight: 800; letter-spacing: -.2px; }
.aw-hero-tx small {
  display: block; margin-top: 4px;
  font-size: var(--t-xs); line-height: 1.5;
  color: rgba(255, 255, 255, .74);
}
.aw-hero-st {
  position: relative;
  display: inline-block;
  margin-top: 12px;
  height: 23px; line-height: 23px;
  padding: 0 10px;
  border-radius: var(--r-pill);
  font-size: var(--t-xs); font-weight: 700;
}
.aw-hero-st.ok { background: rgba(23, 138, 76, .22); color: #9BE3BB; box-shadow: inset 0 0 0 1px rgba(155, 227, 187, .38); }
.aw-hero-st.warn { background: rgba(217, 130, 0, .20); color: #FFD79A; box-shadow: inset 0 0 0 1px rgba(255, 215, 154, .42); }

.aw-row {
  display: flex; align-items: center; gap: 10px;
  width: 100%; text-align: left;
  padding: 13px 12px;
  margin-bottom: 10px;
  border-radius: var(--r-xl);
  background: #fff;
  box-shadow: inset 0 0 0 1px var(--line-2), 0 1px 2px rgba(16, 28, 46, .04);
}
.aw-row:active { background: #F7FAFD; }
.aw-row-n {
  flex: none;
  width: 24px; height: 24px;
  display: grid; place-items: center;
  border-radius: var(--r-md);
  background: var(--blue-50);
  color: var(--blue-700);
  font-size: var(--t-xs); font-weight: 800;
}
.aw-row.is-done .aw-row-n { background: var(--success-100); color: var(--success-600); }
.aw-row-tx { min-width: 0; flex: 1; }
.aw-row-tx b { display: block; font-size: var(--t-sm); font-weight: 800; color: var(--ink-900); }
.aw-row-tx small { display: block; margin-top: 2px; font-size: var(--t-xs); line-height: 1.45; color: var(--ink-400); }
.aw-row-go { flex: none; display: inline-flex; align-items: center; gap: 2px; font-size: var(--t-xs); font-weight: 700; color: var(--blue-700); }
.aw-row.is-done .aw-row-go { color: var(--success-600); }

.aw-card {
  display: flex; align-items: center; gap: 12px;
  width: 100%; text-align: left;
  padding: 14px 12px;
  margin-bottom: 10px;
  border-radius: var(--r-xl);
  background: #fff;
  box-shadow: inset 0 0 0 1px var(--line-2), 0 1px 2px rgba(16, 28, 46, .04);
}
.aw-card:active { background: #F7FAFD; }
.aw-card-ic {
  flex: none;
  width: 42px; height: 42px;
  display: grid; place-items: center;
  border-radius: var(--r-lg);
  background: var(--blue-50);
  color: var(--blue-700);
}
.aw-card-ic .ic { width: 22px; height: 22px; }
.aw-card-tx { min-width: 0; flex: 1; }
.aw-card-tx b { display: block; font-size: var(--t-base); font-weight: 800; color: var(--ink-900); }
.aw-card-tx small { display: block; margin-top: 3px; font-size: var(--t-xs); line-height: 1.45; color: var(--ink-500); }
.aw-tag {
  display: inline-block;
  margin-top: 7px;
  height: 21px; line-height: 21px;
  padding: 0 8px;
  border-radius: var(--r-pill);
  background: var(--gold-100);
  color: var(--gold-700);
  font-size: 11px; font-weight: 700;
}
.aw-card-go { flex: none; color: var(--ink-300); }

/* ---------- B. 用工主体认证页（企业 / 中介） ---------- */
.cv2-hero {
  position: relative;
  overflow: hidden;
  padding: 16px;
  margin-bottom: 12px;
  border-radius: var(--r-xl);
  background: linear-gradient(135deg, #0A2A5C 0%, #0F3A80 56%, #17509E 100%);
  color: #fff;
}
.cv2-hero::after {
  content: "";
  position: absolute;
  right: -48px; top: -58px;
  width: 150px; height: 150px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(201, 153, 43, .44), rgba(201, 153, 43, 0) 68%);
}
/* 中介：同一骨架换成金棕侧光 —— 两种机构身份在视觉上可区分，但不另起一套版式 */
.cv2-hero.is-agency { background: linear-gradient(135deg, #0A2A5C 0%, #1C3A66 40%, #6B4E10 100%); }
.cv2-hero.is-agency::after { background: radial-gradient(circle, rgba(222, 180, 79, .50), rgba(222, 180, 79, 0) 68%); }

.cv2-hero-top { position: relative; display: flex; align-items: center; gap: 11px; }
.cv2-hero-ic {
  flex: none;
  width: 42px; height: 42px;
  display: grid; place-items: center;
  border-radius: var(--r-lg);
  background: rgba(255, 255, 255, .14);
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .22);
  color: var(--gold-300);
}
.cv2-hero-tx { min-width: 0; flex: 1; }
.cv2-hero-tx em {
  display: inline-block;
  height: 19px; line-height: 19px;
  padding: 0 7px;
  border-radius: var(--r-sm);
  background: rgba(255, 255, 255, .16);
  color: #fff;
  font-size: 11px; font-weight: 700; font-style: normal;
}
.cv2-hero.is-agency .cv2-hero-tx em { background: var(--gold-500); color: #3A2A05; }
.cv2-hero-tx b { display: block; margin-top: 6px; font-size: var(--t-lg); font-weight: 800; letter-spacing: -.3px; }
.cv2-hero-tx p { margin: 5px 0 0; font-size: var(--t-xs); line-height: 1.5; color: rgba(255, 255, 255, .74); }
.cv2-pills { position: relative; display: flex; flex-wrap: wrap; gap: 6px; margin-top: 12px; }
.cv2-pills span {
  display: inline-flex; align-items: center; gap: 3px;
  height: 24px; padding: 0 9px;
  border-radius: var(--r-pill);
  background: rgba(255, 255, 255, .12);
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .18);
  font-size: var(--t-xs); font-weight: 700;
}
.cv2-pills .ic { width: 12px; height: 12px; color: var(--gold-300); }

/* 4 步流程条 */
.cv2-steps {
  display: flex;
  gap: 4px;
  padding: 12px 6px 10px;
  margin-bottom: 12px;
  border-radius: var(--r-xl);
  background: #fff;
  box-shadow: inset 0 0 0 1px var(--line-2);
}
.cv2-step { flex: 1; min-width: 0; text-align: center; }
.cv2-step i {
  display: grid; place-items: center;
  width: 22px; height: 22px; margin: 0 auto;
  border-radius: 50%;
  background: var(--line-2);
  color: var(--ink-400);
  font-size: 11px; font-weight: 800; font-style: normal;
}
.cv2-step b { display: block; margin-top: 6px; font-size: var(--t-xs); font-weight: 700; color: var(--ink-400); }
.cv2-step.on i { background: var(--blue-700); color: #fff; }
.cv2-step.on b { color: var(--ink-900); }
.cv2-step.done i { background: var(--success-100); color: var(--success-600); }
.cv2-step.done b { color: var(--ink-600); }

/* 认证状态卡（已提交过时顶掉引导条） */
.cv2-status {
  display: flex; align-items: center; gap: 10px;
  padding: 12px;
  margin-bottom: 12px;
  border-radius: var(--r-xl);
}
.cv2-st-ic {
  flex: none;
  width: 28px; height: 28px;
  display: grid; place-items: center;
  border-radius: 50%;
  background: rgba(255, 255, 255, .68);
}
.cv2-st-tx { min-width: 0; flex: 1; }
.cv2-st-tx b { display: block; font-size: var(--t-sm); font-weight: 800; }
.cv2-st-tx small { display: block; margin-top: 2px; font-size: var(--t-xs); line-height: 1.45; opacity: .84; }
.cv2-status.wait { background: var(--gold-50); color: #8A5B00; box-shadow: inset 0 0 0 1px #F2E0B8; }
.cv2-status.pass { background: var(--success-100); color: #0B6B3E; box-shadow: inset 0 0 0 1px #BFE6D0; }
.cv2-status.reject { background: var(--danger-100); color: #A3211A; box-shadow: inset 0 0 0 1px #F5C9C5; }

/* 表单细节：必填标 / 字段说明 */
.cv2-req {
  display: inline-block;
  margin-left: 5px;
  height: 17px; line-height: 17px;
  padding: 0 5px;
  border-radius: var(--r-xs);
  background: var(--danger-100);
  color: var(--danger-600);
  font-size: 11px; font-weight: 700; font-style: normal;
}
.cv-row > small.cv2-hint {
  display: flex; align-items: flex-start; gap: 4px;
  font-size: var(--t-xs);
  font-weight: 400;
  color: var(--ink-400);
  line-height: 1.45;
}
.cv2-hint .ic { width: 12px; height: 12px; margin-top: 2px; flex: none; color: var(--danger); }

/* 行业选择（带行业图标） */
.cv2-seg { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.cv2-seg-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 4px;
  height: 40px;
  border: 1px solid var(--line);
  border-radius: var(--r-lg);
  background: #fff;
  font-family: inherit;
  font-size: var(--t-sm); font-weight: 700;
  color: var(--ink-600);
}
.cv2-seg-btn .ic { width: 14px; height: 14px; }
.cv2-seg-btn.on { border-color: var(--blue-700); background: var(--blue-50); color: var(--blue-700); }

/* 提交区 */
.cv2-submit { margin-top: 16px; }
.cv2-submit-note {
  display: flex; align-items: center; justify-content: center; gap: 4px;
  margin: 9px 0 0;
  font-size: var(--t-xs);
  color: var(--ink-400);
}
.cv2-submit-note .ic { width: 13px; height: 13px; flex: none; color: var(--success); }

/* 核验说明 */
.cv2-safe {
  margin-top: 12px;
  padding: 12px;
  border-radius: var(--r-xl);
  background: #fff;
  box-shadow: inset 0 0 0 1px var(--line-2);
}
.cv2-safe-h { display: flex; align-items: baseline; gap: 6px; margin-bottom: 6px; }
.cv2-safe-h b { font-size: var(--t-sm); font-weight: 800; color: var(--ink-900); }
.cv2-safe-h small { font-size: var(--t-xs); color: var(--ink-400); }
.cv2-check { display: flex; align-items: flex-start; gap: 8px; padding: 8px 0; }
.cv2-check + .cv2-check { border-top: 1px solid var(--line-2); }
.cv2-ck-ic { flex: none; margin-top: 1px; color: var(--success); }
.cv2-ck-ic .ic { width: 14px; height: 14px; }
.cv2-check b { display: block; font-size: var(--t-sm); font-weight: 700; color: var(--ink-800); }
.cv2-check small { display: block; margin-top: 2px; font-size: var(--t-xs); line-height: 1.45; color: var(--ink-400); }

/* 提交成功态 */
.cv2-done {
  padding: 22px 16px 18px;
  margin-bottom: 12px;
  border-radius: var(--r-xl);
  text-align: center;
  background: linear-gradient(180deg, #EAF2FF 0%, #F7FAFD 100%);
  box-shadow: inset 0 0 0 1px var(--line-2);
}
.cv2-done-ic {
  display: inline-grid; place-items: center;
  width: 54px; height: 54px;
  border-radius: 50%;
  background: #fff;
  color: var(--success);
  box-shadow: 0 2px 10px rgba(15, 58, 128, .10), inset 0 0 0 1px var(--line);
}
.cv2-done h3 { margin: 12px 0 0; font-size: var(--t-lg); font-weight: 800; color: var(--ink-900); }
.cv2-done p { margin: 7px 0 0; font-size: var(--t-sm); line-height: 1.55; color: var(--ink-500); }

/* ==========================================================================
   浏览足迹 · 搜索 + 类型/时间筛选（H9 方案）
   ========================================================================== */
.his-search {
  display: flex; align-items: center; gap: 7px;
  height: 42px; padding: 0 11px; margin-bottom: 9px;
  border-radius: var(--r-md); background: var(--surface); color: var(--ink-400);
  box-shadow: inset 0 0 0 1px var(--line);
}
.his-search input {
  flex: 1; min-width: 0; height: 100%; border: 0; outline: 0; background: none;
  font-family: inherit; font-size: var(--t-md); color: var(--ink-900);
}
.his-search input::placeholder { color: var(--ink-400); }
.his-search input::-webkit-search-cancel-button { display: none; }
.his-search .his-x {
  display: none; flex: none; align-items: center; justify-content: center;
  width: 22px; height: 22px; padding: 0; border: 0; border-radius: 50%;
  background: var(--blue-50); color: var(--ink-500);
}
.his-search.has-val .his-x { display: flex; }
/* V4：类型四段等宽分段控件（计数内嵌）+ 时间收成右侧下拉
   —— 两组 chips 换成「分段块 + 下拉」，省约 26px，同时把主维度（类型）
   与次维度（时间）用形态差表达出来，不用读文字就知道哪个主哪个次。 */
.his-seg {
  display: flex; gap: 3px; padding: 3px; margin-bottom: 9px;
  border-radius: var(--r-md); background: var(--line-2);
}
.his-seg button {
  flex: 1 1 0; min-width: 0; height: 31px; padding: 0 4px; border: 0;
  border-radius: var(--r-sm); background: none; color: var(--ink-600);
  font-family: inherit; font-size: var(--t-sm); font-weight: 700;
  display: inline-flex; align-items: center; justify-content: center; gap: 4px;
}
.his-seg button em {
  font-style: normal; font-size: var(--t-xs); font-weight: 800; opacity: .75;
  font-variant-numeric: tabular-nums;
}
.his-seg button.on {
  background: var(--surface); color: var(--blue-700); font-weight: 800;
  box-shadow: 0 2px 6px -2px rgba(16, 28, 46, .28);
}
.his-seg button.on em { opacity: .9; }
.his-tline { display: flex; align-items: center; gap: 8px; margin-bottom: 9px; }
.his-tl-lb { font-size: var(--t-sm); color: var(--ink-400); }
/* ⚠️ 下拉菜单必须**绝对定位**：入流的话展开一瞬间会把整张列表顶下去，
   手指正按着的那一行会跳走。 */
.his-dd { margin-left: auto; position: relative; }
.his-dd-btn {
  display: inline-flex; align-items: center; gap: 5px; height: 28px; padding: 0 10px;
  border: 0; border-radius: var(--r-sm); background: var(--surface);
  font-family: inherit; font-size: var(--t-sm); font-weight: 800; color: var(--blue-700);
  box-shadow: inset 0 0 0 1px var(--line-2);
}
.his-dd-btn.open { box-shadow: inset 0 0 0 1.5px var(--blue-400); }
.his-dd-menu {
  position: absolute; right: 0; top: 33px; z-index: 6; min-width: 110px; padding: 4px;
  display: flex; flex-direction: column; gap: 2px;
  border-radius: var(--r-md); background: var(--surface);
  box-shadow: 0 14px 28px -16px rgba(15, 58, 128, .75), inset 0 0 0 1px var(--line);
}
.his-dd-opt {
  display: flex; align-items: center; gap: 6px; height: 32px; padding: 0 9px;
  border: 0; border-radius: var(--r-xs); background: none; text-align: left;
  font-family: inherit; font-size: var(--t-sm); font-weight: 700; color: var(--ink-700);
}
.his-dd-opt.on { background: var(--blue-50); color: var(--blue-700); font-weight: 800; }
.his-dd-opt svg { margin-left: auto; }
.his-hit {
  display: flex; align-items: center; gap: 8px;
  margin: 0 2px 8px; font-size: var(--t-xs); color: var(--ink-400);
}
.his-hit .his-reset, .his-hit .his-clear {
  display: inline-flex; align-items: center; gap: 3px;
  padding: 0; border: 0; background: none;
  font-family: inherit; font-size: var(--t-xs); font-weight: 800;
}
.his-hit .his-reset { color: var(--blue-700); }
.his-hit .his-clear { margin-left: auto; color: var(--ink-500); }
.his-hl {
  background: var(--gold-100); color: var(--gold-700);
  border-radius: 3px; padding: 0 2px;
}
/* 下架行：整行压低而不是隐藏 —— 它确实是足迹，只是不能点进去 */
.row.link.his-dead { opacity: .55; }
.row.link.his-dead .row-title { color: var(--ink-500); }

/* ======================================================================
   账号设置（2026-10-12）
   只补这一屏确实缺的几件新样式；行的骨架（.row / .row-ic / .row-main /
   .row-title / .row-desc / .link）沿用「设置」屏那套 —— 不另起一套，
   否则两边的行宽、留白、字号会各自漂移，看着像两个产品。
   ====================================================================== */
.row-tail {
  margin-right: 6px; font-size: 12px; color: var(--ink-500);
  max-width: 130px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}

/* 头像行：左侧是头像预览，不是一个图标 */
.ac-av-row { align-items: center; }
.ac-av {
  position: relative; flex: 0 0 46px; width: 46px; height: 46px; margin-right: 6px;
  border-radius: 50%; overflow: hidden; display: flex; align-items: center; justify-content: center;
  background: var(--brand-100, #e8f0ff); color: var(--brand-600, #2f6bd8);
  font-size: 17px; font-weight: 700;
}
.ac-av.has-img { background: #eceff3; }
.ac-av img { display: block; width: 100%; height: 100%; object-fit: cover; }
.ac-av em {
  position: absolute; right: -1px; bottom: -1px; width: 18px; height: 18px; border-radius: 50%;
  background: #fff; color: var(--ink-500); box-shadow: 0 1px 3px rgba(15, 23, 42, .22);
  display: flex; align-items: center; justify-content: center;
}
.ac-av em svg { width: 11px; height: 11px; }

/* 邮箱行：主区里是一个输入框 */
.ac-mail-row { align-items: center; }
.ac-mail-row .row-main { flex: 1; min-width: 0; }
.ac-mail-row input { margin-top: 4px; padding: 7px 9px; font-size: 13px; }

/* 换绑手机号：三步指示器 */
.rb-steps { display: flex; align-items: center; gap: 4px; margin: 0 0 14px; }
.rb-step { display: flex; align-items: center; gap: 5px; font-size: 12px; color: var(--ink-400, #9aa3af); white-space: nowrap; }
.rb-step i {
  flex: 0 0 17px; width: 17px; height: 17px; border-radius: 50%; font-style: normal; font-size: 11px;
  background: #eceff3; color: var(--ink-500); display: flex; align-items: center; justify-content: center;
}
.rb-step.done, .rb-step.on { color: var(--brand-600, #2f6bd8); font-weight: 600; }
.rb-step.done i, .rb-step.on i { background: var(--brand-600, #2f6bd8); color: #fff; }
.rb-steps em { flex: 1; min-width: 8px; height: 1px; background: #eceff3; }

.rb-act { margin-top: 14px; }
.rb-done { padding: 6px 0 2px; text-align: center; color: var(--success, #22a06b); }
.rb-done svg { width: 40px; height: 40px; }
.rb-done p { margin: 8px 0 0; font-size: 14px; color: var(--ink-700, #334155); }
.rb-done b { font-size: 16px; }

/* ==========================================================================
   证件照片上传（认证申请 · 举报举证 · 证书 通用）
   --------------------------------------------------------------------------
   照片列表挂在 DOM 上（缩略图 img[data-u]），提交时从 DOM 读回 ——
   界面上看到的，就是提交时发出去的，不会出现"图在框里、提交时丢了"。
   ========================================================================== */
.up-box { display: flex; flex-wrap: wrap; gap: 8px; }
.up-box:empty { display: none; }
.up-thumb { position: relative; width: 72px; height: 72px; border-radius: 8px; overflow: hidden;
  border: 1px solid var(--line, #e3e8ef); background: var(--ink-50, #f6f8fb); }
.up-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.up-del { position: absolute; top: 2px; right: 2px; width: 20px; height: 20px; padding: 0;
  border: 0; border-radius: 50%; background: rgba(0, 0, 0, .55); color: #fff;
  font-size: 15px; line-height: 20px; cursor: pointer; }
.up-btn { align-self: flex-start; min-height: 34px; padding: 0 12px; cursor: pointer;
  border: 1px dashed var(--blue-300, #9dc0f5); border-radius: 8px; background: #fff;
  color: var(--blue-700, #0f3a80); font-size: var(--t-xs, 12px); font-weight: 600; }
.up-btn:hover { background: var(--blue-50, #f2f7ff); }
.up-hint { font-size: var(--t-xs, 12px); color: var(--ink-400, #8a94a6); line-height: 1.5; }
/* 必传 / 选传角标：与表单标签同排，别让用户提交到一半才发现差材料 */
.req { margin-left: 6px; font-style: normal; font-weight: 700; color: #c62828; }
.opt { margin-left: 6px; font-style: normal; font-weight: 600; color: var(--ink-400, #8a94a6); }

/* ==========================================================================
   记录页 5 款风格（2026-10-14 用户逐页点款）
   --------------------------------------------------------------------------
   来源：reports/ui-review-20261004/mysvc-5x5.html
     · 我的招工（我的岗位） → J3 · 深色页头
     · 我的找活（我的名片） → F2 · 实名名片墙
     · 我的证书             → T2 · 证件照式
     · 浏览足迹             → H2 · 时间分组
     · 我的收藏             → C5 · 金编辑
   命名一律带本款前缀（mj- / f2- / ct2- / h2- / c5-），与既有共用类互不干扰。
   ========================================================================== */

/* ---------- J3 · 深色页头 —— 2026-10-14 已退役 ----------
   「我的服务」六屏统一到 S1 · 深蓝工牌后，我的招工不再单挂一层深蓝 Hero 带：
   统计回到共用的白色统计卡（window.mypStat），页签回到标准 .tab-row / .tab-cell，
   页头由浅色改为深蓝实底 —— 六屏从此同一张脸。
   .mj-hero / .mj-hero-row / .mj-tabs 规则连同 JS 调用一并删除；
   需要回看旧稿见 reports/ui-review-20261004/mysvc-5x5.html。 */
/* 发布栏：统一后它落在 .page-body 里（页面底色上），左右留白交给 .page-body，
   这里只保留上下节奏，不再铺一条白底。 */
.em-post-bar.is-flat { background: transparent; padding: 0 0 2px; }

/* ---------- F2 · 实名名片墙 ----------
   在册名片做成横版实名名片：左深蓝头像块（头像 + 姓名 + 主体实名），
   右侧工种大字 + 实名章 + 期望薪资；下面用既有小卡收历史。 */
.f2-card { padding: 0; overflow: hidden; }
.f2-row { display: flex; }
.f2-l {
  width: 86px;
  flex: none;
  padding: 14px 6px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 5px;
  text-align: center;
  color: #fff;
  background: linear-gradient(165deg, var(--blue-700), #16418F);
}
.f2-ava {
  width: 44px; height: 44px;
  flex: none;
  border-radius: 50%;
  display: grid;
  place-items: center;
  font-size: var(--t-md);
  font-weight: 800;
  color: #fff;
  background: rgba(255, 255, 255, .16);
  box-shadow: inset 0 0 0 1.5px rgba(255, 255, 255, .52);
}
.f2-n { font-size: var(--t-sm); font-weight: 800; line-height: 1.25; }
.f2-kind { font-size: 10px; color: #B9C9E4; }
.f2-r { flex: 1; min-width: 0; padding: 11px 12px; }
.f2-rh { display: flex; align-items: center; gap: 6px; }
.f2-role {
  flex: 1; min-width: 0;
  font-size: 15px;
  font-weight: 800;
  color: var(--ink-900);
  overflow-wrap: break-word;
}
/* 实名章：描边款，与证书页 T2 的状态章同一套「证件感」语言 */
.f2-stamp {
  flex: none;
  display: inline-flex;
  align-items: center;
  height: 18px;
  padding: 0 6px;
  border: 1.5px solid currentColor;
  border-radius: 5px;
  font-size: 9.5px;
  font-weight: 900;
  letter-spacing: .5px;
}
.f2-stamp.on { color: var(--success); }
.f2-stamp.review { color: var(--warn); }
.f2-stamp.off { color: var(--ink-400); }
.f2-sub { margin-top: 4px; font-size: 11px; color: var(--ink-400); }
.f2-sal {
  margin-top: 8px;
  font-size: var(--t-md);
  font-weight: 900;
  color: var(--gold-600);
  font-family: var(--font-num);
  font-variant-numeric: tabular-nums;
  line-height: 1.15;
}
.f2-meta {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-top: 8px;
  padding-top: 7px;
  border-top: 1px solid var(--line-2);
  font-size: 10.5px;
  color: var(--ink-600);
}
.f2-meta b { font-family: var(--font-num); color: var(--ink-900); }
.f2-exp { margin-left: auto; font-weight: 700; color: var(--warn); }
/* 动作条（置顶 / 编辑 / 刷新 / 上下架）：真实付费动作，一样都不能少，收进卡底一行 */
.f2-acts {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  padding: 10px 12px;
  border-top: 1px solid var(--line-2);
}
.f2-acts .myp-a { min-width: 0; }

/* ---------- T2 · 证件照式 ----------
   每本证做成横版证件：左 8px 状态色带（绿有效 / 橙预警 / 红过期）+ 证名大字 +
   mono 编号 + 发证机关 + 日期行。色带即状态语言，与 J2/F5 色条系同构。 */
.ct2 { padding: 0; padding-left: 8px; }
.ct2::before { width: 8px; }
.ct2-body { padding: 11px 12px; }
.ct2-head { display: flex; align-items: flex-start; gap: 8px; }
.ct2-id { flex: 1; min-width: 0; }
.ct2-name {
  display: block;
  font-size: 14.5px;
  font-weight: 800;
  color: var(--ink-900);
  line-height: 1.35;
  overflow-wrap: break-word;
}
.ct2-kind { display: block; margin-top: 3px; font-size: 10.5px; color: var(--ink-400); }
.ct2-stamp {
  flex: none;
  display: inline-flex;
  align-items: center;
  height: 20px;
  padding: 0 7px;
  border: 1.5px solid currentColor;
  border-radius: 5px;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .5px;
  white-space: nowrap;
}
.ct2-stamp.ok   { color: var(--success); }
.ct2-stamp.soon { color: var(--warn); }
.ct2-stamp.over { color: var(--danger); }
.ct2-no {
  margin-top: 8px;
  font-size: 11px;
  color: var(--ink-600);
  font-family: var(--font-num);
  letter-spacing: .4px;
  overflow-wrap: break-word;
}
.ct2-no b { font-weight: 700; color: var(--ink-800); }
.ct2-dates {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 14px;
  margin-top: 7px;
  font-size: 10.5px;
  color: var(--ink-400);
}
.ct2-dates b { font-weight: 800; color: var(--ink-700); font-family: var(--font-num); }
.ct2-dates b.soon { color: var(--warn); }
.ct2-dates b.over { color: var(--danger); }
.ct2-plat { margin-left: auto; }
.ct2-bar { height: 3px; margin: 11px 0 0; border-radius: 2px; }
.ct2-note {
  display: flex;
  flex-direction: column;
  gap: 3px;
  margin-top: 9px;
  font-size: 10.5px;
  line-height: 1.5;
  color: var(--ink-500);
}
.ct2-note b { color: var(--danger); font-weight: 800; }

/* ---------- H2 · 时间分组 ----------
   流水按天分桶（今天 / 昨天 / 更早）+ 竖线串联，每组一个色点分组头。
   分桶只认 hisDaysAgo（原型串与 LIVE 的 MM-DD 都认），认不出的归「更早」。 */
.h2-grp {
  display: flex;
  align-items: center;
  gap: 6px;
  margin: 14px 2px 8px;
  font-size: var(--t-xs);
  font-weight: 800;
  color: var(--ink-600);
}
.h2-grp i { width: 7px; height: 7px; border-radius: 50%; flex: none; }
.h2-grp em {
  margin-left: auto;
  font-style: normal;
  font-weight: 400;
  font-size: 10.5px;
  color: var(--ink-400);
}
.h2-tl { position: relative; padding-left: 14px; }
.h2-tl::before {
  content: "";
  position: absolute;
  left: 3px; top: 8px; bottom: 8px;
  width: 1.5px;
  background: var(--line);
}
.h2-row {
  position: relative;
  display: flex;
  align-items: center;
  gap: 8px;
  width: 100%;
  margin-bottom: 8px;
  padding: 11px 12px;
  text-align: left;
  font-family: inherit;
  cursor: pointer;
}
.h2-row::before {
  content: "";
  position: absolute;
  left: -14px; top: 17px;
  width: 7px; height: 7px;
  border-radius: 50%;
  background: #fff;
  box-shadow: inset 0 0 0 2px var(--blue-700);
}
.h2-row.is-dead { opacity: .55; }
.h2-row.is-dead::before { box-shadow: inset 0 0 0 2px var(--ink-300); }
.h2-main { flex: 1; min-width: 0; }
.h2-t {
  display: block;
  font-size: var(--t-sm);
  font-weight: 800;
  color: var(--ink-900);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.h2-d {
  display: block;
  margin-top: 3px;
  font-size: 10.5px;
  color: var(--ink-400);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.h2-row.is-dead .h2-t { color: var(--ink-500); }

/* ---------- C5 · 金编辑 ----------
   招聘中卡金顶线 + 18px 金薪资 + 卡底更新小字，钱的权重最高。 */
.gold-top { box-shadow: inset 0 3px 0 -1px var(--gold-400), 0 1px 2px rgba(16, 28, 46, .05); }
.c5-card {
  display: block;
  width: 100%;
  margin-bottom: 9px;
  padding: 13px 12px;
  text-align: left;
  font-family: inherit;
  cursor: pointer;
}
.c5-top { display: flex; align-items: flex-start; gap: 8px; }
.c5-main { flex: 1; min-width: 0; }
.c5-name {
  display: block;
  font-size: 15px;
  font-weight: 800;
  color: var(--ink-900);
  overflow-wrap: break-word;
}
.c5-sub { display: block; margin-top: 4px; font-size: 11.5px; color: var(--ink-400); }
.c5-right {
  flex: none;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 5px;
  text-align: right;
}
.c5-sal {
  font-size: 18px;
  font-weight: 900;
  line-height: 1.1;
  letter-spacing: -.3px;
  color: var(--gold-600);
  font-family: var(--font-num);
  font-variant-numeric: tabular-nums;
}
.c5-sal small { margin-left: 2px; font-size: 10px; font-weight: 700; color: var(--ink-400); }
.c5-foot {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 9px;
  padding-top: 8px;
  border-top: 1px solid var(--line-2);
  font-size: 10.5px;
  color: var(--ink-500);
}
.c5-foot .c5-sub2 { margin-left: auto; color: var(--ink-400); }

/* ==========================================================================
   招工发布页 · P3「深蓝头图 + 双列紧凑」
   来源：reports/ui-review-20261004/publish-redesign-3.html 的 P3（2026-10-14 应用）。
   与「我的」页斜切头 / 消息页同语言：深蓝头图 + 白色浮岛卡骑下沿 + 双列紧凑字段 + 金钮。
   ⚠️ 全部收在 .screen-pj 作用域内，不碰共用 .em-*（em-chip / em-ta 只做外观覆盖，
      交互协议与 input id 原样保留 —— readJobForm() 仍按 id 取值提交）。
   ⚠️ 双列规则（设计稿 notes）：390px 下双列输入框只有 168px 宽，只放短字段；
      长字段（岗位名称 / 工作地点）一律 .wide 独占一行。
   ========================================================================== */
.screen-pj .pj-head {
  flex: none;
  position: relative;
  overflow: hidden;
  padding: 14px 15px 34px;
  color: #fff;
  background: linear-gradient(168deg, #134694 0%, var(--blue-700) 52%, #0A2A5E 100%);
}
/* 右上冷光晕 + 细斜纹：与「我的」页斜切头同族 */
.screen-pj .pj-head::after {
  content: '';
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    radial-gradient(86% 72% at 88% -14%, rgba(126, 176, 255, .32), transparent 62%),
    repeating-linear-gradient(-52deg, rgba(255, 255, 255, .05) 0 1px, transparent 1px 11px);
}
.screen-pj .pj-r1 { display: flex; align-items: center; gap: 9px; position: relative; z-index: 1; }
.screen-pj .pj-bk {
  width: 28px;
  height: 28px;
  border-radius: 9px;
  display: grid;
  place-items: center;
  color: #fff;
  background: rgba(255, 255, 255, .14);
  flex: none;
}
.screen-pj .pj-bk:active { background: rgba(255, 255, 255, .24); }
.screen-pj .pj-bk .ic { width: 15px; height: 15px; }
.screen-pj .pj-r1 b { font-size: 17px; font-weight: 800; letter-spacing: .4px; }
.screen-pj .pj-rt {
  margin-left: auto;
  flex: none;
  max-width: 42%;
  font-size: 11px;
  font-weight: 700;
  color: var(--gold-300);
  background: rgba(240, 208, 138, .13);
  border: 1px solid rgba(240, 208, 138, .32);
  border-radius: 8px;
  padding: 5px 9px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.screen-pj .pj-r2 {
  position: relative;
  z-index: 1;
  margin-top: 9px;
  font-size: 11.5px;
  color: rgba(214, 229, 255, .78);
  line-height: 1.55;
}
.screen-pj .pj-r3 { position: relative; z-index: 1; margin-top: 11px; display: flex; gap: 7px; flex-wrap: wrap; }
.screen-pj .pj-r3 span {
  font-size: 10px;
  font-weight: 700;
  color: rgba(255, 255, 255, .9);
  background: rgba(255, 255, 255, .12);
  border: 1px solid rgba(255, 255, 255, .18);
  border-radius: 7px;
  padding: 4px 8px;
  display: flex;
  align-items: center;
  gap: 4px;
}
.screen-pj .pj-r3 span .ic { width: 12px; height: 12px; color: var(--gold-300); }

/* 浮岛：内容区骑在头图下沿（page-body 通用左右 14px 保留） */
.screen-pj .page-body {
  position: relative;
  z-index: 2;
  margin-top: -22px;
  flex: 1;   /* 内容矮时把底部金钮压到屏底 */
}
.screen-pj .pj-card {
  background: #fff;
  border-radius: 16px;
  padding: 12px 13px 13px;
  margin-bottom: 10px;
  box-shadow: 0 16px 34px -26px rgba(10, 42, 94, .7);
}
.screen-pj .pj-ch { display: flex; align-items: center; gap: 7px; margin-bottom: 9px; }
.screen-pj .pj-ch .bar {
  width: 3.5px;
  height: 13px;
  border-radius: 2px;
  background: var(--gold-500);
  flex: none;
}
.screen-pj .pj-ch h3 { font-size: 13.5px; font-weight: 800; color: #16233A; }
.screen-pj .pj-ch small { margin-left: auto; font-size: 10.5px; color: var(--ink-400); font-weight: 700; }

/* 双列字段网格 */
.screen-pj .pj-g2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; }
.screen-pj .pj-g2 .f { display: flex; flex-direction: column; gap: 5px; min-width: 0; }
.screen-pj .pj-g2 .f.wide { grid-column: span 2; }
.screen-pj .pj-g2 .lb {
  font-size: 11.5px;
  font-weight: 800;
  color: #22314E;
  display: flex;
  align-items: center;
  gap: 3px;
}
.screen-pj .pj-g2 .lb i { font-style: normal; color: var(--danger); }
.screen-pj .pj-g2 input {
  height: 38px;
  border-radius: 10px;
  border: 1px solid #E3E9F2;
  background: #FAFCFF;
  padding: 0 11px;
  font-size: 13px;
  color: var(--ink-900);
  min-width: 0;
  width: 100%;
}
.screen-pj .pj-g2 input::placeholder { color: #A9B5C6; }
/* 薪资：金色等宽数字（P3 .ip.money） */
.screen-pj .pj-g2 input.money {
  font-family: var(--font-num);
  font-weight: 800;
  color: var(--gold-600);
}
/* 工作地点（三级滚轮选择器入口）：同一 .ip 语言，可点 */
.screen-pj .pj-tap {
  height: 38px;
  border-radius: 10px;
  border: 1px solid #E3E9F2;
  background: #FAFCFF;
  display: flex;
  align-items: center;
  padding: 0 11px;
  font-size: 13px;
  color: var(--ink-900);
  gap: 5px;
  min-width: 0;
  width: 100%;
}
.screen-pj .pj-tap > span {
  flex: 1;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  text-align: left;
}
.screen-pj .pj-tap.ph > span { color: #A9B5C6; }
.screen-pj .pj-tap:active { border-color: var(--blue-600, #2F6BD8); }
.screen-pj .pj-tap .ic { width: 13px; height: 13px; color: #B4BFCF; flex: none; }

/* 福利 chips / 多行文本沿用 em-* 交互，只把外观拉进 P3 语言 */
.screen-pj .em-chip { border-color: #E3E9F2; background: #FAFCFF; }
.screen-pj .em-ta { border-color: #E3E9F2; background: #FAFCFF; border-radius: 10px; }

/* 底部金钮（P3 .fix3）：吸底常驻 —— 发长表单时按钮永远在手边 */
.screen-pj .pj-foot {
  position: sticky;
  bottom: 0;
  z-index: 3;
  display: flex;
  gap: 9px;
  align-items: center;
  padding: 10px 14px calc(12px + env(safe-area-inset-bottom, 0px));
  background: var(--bg);
}
.screen-pj .pj-draft {
  height: 48px;
  padding: 0 16px;
  border-radius: 14px;
  background: #fff;
  border: 1px solid #E3E9F2;
  color: #5A6B82;
  font-size: 13.5px;
  font-weight: 700;
  flex: none;
}
.screen-pj .pj-submit {
  flex: 1;
  height: 48px;
  border-radius: 14px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  font-size: 15px;
  font-weight: 800;
  color: #3A2A05;
  background: linear-gradient(135deg, #F3D488, var(--gold-500));
  box-shadow: 0 12px 24px -12px rgba(201, 153, 43, .85);
}
.screen-pj .pj-submit:active { opacity: .9; }
.screen-pj .pj-submit .ic { width: 16px; height: 16px; }

/* ==========================================================================
   扩展工具三件套（2026-10-14 新增）
   —— 拼车发布 / 事故案例视频学习 / 提升学历
   前缀：tk-（三个模块共用的表单原子）· ac-（事故案例）· ed-（提升学历）
   配色沿用 P1 落码后的口径：深蓝 #0F3A80 + 金 #C9992B，卡片用 1px inset 描边
   划界、不做浮起的外投影（全页只有真正的浮层才给投影）。
   ========================================================================== */
.tk-card { padding: 12px 13px 13px; border-radius: 12px; }
/* 拼车发布屏：底部留白交给吸底按钮栏，内容区只留一点呼吸 */
.screen-pool .page-body { padding-bottom: 18px; }
.tk-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.tk-f { display: flex; flex-direction: column; gap: 5px; min-width: 0; }
.tk-f.wide { grid-column: span 2; }
.tk-lb { font-size: 11.5px; font-weight: 800; color: #22314E; display: flex; align-items: center; gap: 3px; }
.tk-lb i { font-style: normal; color: var(--danger); }
.tk-f input, .tk-ta {
  width: 100%; border-radius: 10px; border: 1px solid #E3E9F2; background: #FAFCFF;
  padding: 0 11px; font-size: 13.5px; color: var(--ink-900); font-family: inherit;
  height: 44px; box-sizing: border-box;
}
.tk-ta { height: auto; padding: 10px 11px; line-height: 1.7; resize: none; }
.tk-f input::placeholder, .tk-ta::placeholder { color: #A9B5C6; }
.tk-f input:focus, .tk-ta:focus { border-color: var(--blue-600, #2F6BD8); outline: none; }
/* 地区选择（复用三级滚轮）：外观与输入框同族，但整体是一个按钮 */
.tk-area {
  height: 44px; border-radius: 10px; border: 1px solid #E3E9F2; background: #FAFCFF;
  display: flex; align-items: center; gap: 6px; padding: 0 11px; font-family: inherit;
  font-size: 13.5px; color: var(--ink-900); width: 100%; box-sizing: border-box; cursor: pointer;
}
.tk-area > span { flex: 1; min-width: 0; text-align: left; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tk-area.ph > span { color: #A9B5C6; }
.tk-area .ic { width: 13px; height: 13px; color: #B4BFCF; flex: none; }
.tk-area:active { border-color: var(--blue-600, #2F6BD8); }
/* chips（单选 / 多选） */
.tk-chips { display: flex; flex-wrap: wrap; gap: 7px; }
.tk-chip {
  display: inline-flex; align-items: center; gap: 4px;
  min-height: 34px; padding: 0 11px; border-radius: 9px;
  border: 1px solid #E3E9F2; background: #FAFCFF; color: #52627A;
  font-family: inherit; font-size: 12.5px; font-weight: 700; cursor: pointer;
}
.tk-chip.on { border-color: var(--blue-600, #2F6BD8); background: #EAF1FB; color: var(--blue-700); }
.tk-chip .ic { width: 12px; height: 12px; }
.tk-chips-2 .tk-chip, .tk-chips-3 .tk-chip, .tk-chips-4 .tk-chip { flex: 1; justify-content: center; }
/* 空位数步进器 */
.tk-seat { display: flex; align-items: center; gap: 10px; padding-bottom: 12px; }
.tk-seat .tk-lb { flex: none; }
.tk-stepper { display: flex; align-items: center; gap: 0; border: 1px solid #E3E9F2; border-radius: 10px; overflow: hidden; }
.tk-stepper button {
  width: 42px; height: 40px; border: 0; background: #F7FAFF; color: var(--blue-700);
  display: grid; place-items: center; cursor: pointer;
}
.tk-stepper button:active { background: #EAF1FB; }
.tk-stepper button.is-dis { color: #C4CCD8; }
.tk-stepper b { min-width: 46px; text-align: center; font-size: 16px; font-weight: 900; color: var(--ink-900); }
.tk-seat > small { font-size: 11px; color: var(--ink-400); }
.tk-hint {
  display: flex; align-items: flex-start; gap: 6px; margin-top: 10px;
  font-size: 11.5px; color: var(--ink-500); line-height: 1.65;
}
.tk-hint .ic { width: 13px; height: 13px; color: #9AA5B5; margin-top: 1px; }
.tk-note {
  margin: 14px 2px 4px; font-size: 11.5px; color: var(--ink-400); line-height: 1.8;
}
/* 底部按钮栏 */
.tk-foot {
  position: sticky; bottom: 0; z-index: 3; display: flex; gap: 9px; align-items: center;
  padding: 10px 14px calc(12px + env(safe-area-inset-bottom, 0px)); background: var(--bg);
}
.tk-foot .btn { height: 48px; border-radius: 14px; font-weight: 800; }
.tk-foot .btn-plain { flex: none; padding: 0 18px; }
.tk-submit { flex: 1; display: flex; align-items: center; justify-content: center; gap: 6px; }
/* 下架（危险操作）：做成朴素的危险色文字按钮，不做大红块 —— 它是次要动作 */
.tk-danger {
  margin: 14px 0 4px; width: 100%; height: 46px; border-radius: 12px;
  border: 1px solid #F3D2CF; background: #FFF6F5; color: var(--danger);
  font-family: inherit; font-size: 13.5px; font-weight: 800;
  display: flex; align-items: center; justify-content: center; gap: 6px; cursor: pointer;
}
.tk-danger:active { background: #FDECEA; }
/* 实名门槛页 */
.tk-gate { text-align: center; padding: 26px 6px 10px; }
.tk-gate-ic {
  width: 62px; height: 62px; border-radius: 20px; margin: 0 auto 15px;
  display: grid; place-items: center; color: var(--blue-700);
  background: linear-gradient(150deg, #EAF1FB, #D8E6F9);
  box-shadow: inset 0 0 0 1px rgba(15, 58, 128, .08);
}
.tk-gate > b { display: block; font-size: 17px; font-weight: 900; color: var(--ink-900); }
.tk-gate > p { margin: 11px 4px 0; font-size: 12.5px; line-height: 1.85; color: var(--ink-500); text-align: left; }
.tk-gate-ul { list-style: none; margin: 14px 0 20px; padding: 0; text-align: left; }
.tk-gate-ul li {
  display: flex; align-items: flex-start; gap: 7px; padding: 7px 0;
  font-size: 12.5px; color: var(--ink-600); line-height: 1.6;
}
.tk-gate-ul .ic { width: 14px; height: 14px; color: var(--success); margin-top: 2px; flex: none; }
.tk-gate .btn-block + .btn-block { margin-top: 9px; }
/* 发布入口大按钮（事故案例 / 提升学历 / 拼车共用形态） */
.tk-pub {
  width: 100%; margin-top: 12px; padding: 13px; border-radius: 14px;
  border: 1px dashed #C9D6E8; background: #FAFCFF;
  display: flex; align-items: center; gap: 10px; text-align: left;
  font-family: inherit; cursor: pointer;
}
.tk-pub:active { background: #F2F7FF; }
.tk-pub.is-gate { border-color: #E3E9F2; background: #FBFCFE; }
.tk-pub-ic {
  width: 34px; height: 34px; border-radius: 11px; flex: none; display: grid; place-items: center;
  color: #fff; background: linear-gradient(150deg, #3A7BE0, var(--blue-700));
}
.tk-pub.is-gate .tk-pub-ic { background: #DDE5F0; color: #8797AD; }
.tk-pub-ic .ic { width: 17px; height: 17px; }
.tk-pub-tx { flex: 1; min-width: 0; }
.tk-pub-tx b { display: block; font-size: 13.5px; font-weight: 800; color: var(--ink-900); }
.tk-pub-tx small { display: block; margin-top: 3px; font-size: 11px; color: var(--ink-400); line-height: 1.5; }

/* ---------- 拼车：我发布的 ---------- */
.cm-pool.is-mine { border-left: 3px solid var(--gold-500); padding-left: 9px; }
.cm-mine {
  font-style: normal; margin-left: 6px; padding: 1.5px 6px; border-radius: 5px;
  font-size: 10px; font-weight: 800; color: #8A6510; background: #FDF3DA;
  vertical-align: middle;
}
.cm-p-edit { flex: none; }
.cm-pub.is-live { border-style: solid; border-color: #CBE3D3; background: #F7FCF9; }
.cm-pub.is-live .cm-pub-ic { background: linear-gradient(150deg, #34B96F, #178A4C); }
.cm-pub.is-gate .cm-pub-ic { background: #DDE5F0; color: #8797AD; }

/* ===================== 事故案例 · 在线视频学习 ===================== */
.screen-acc .page-body { padding-bottom: 18px; }
.ac-hero {
  position: relative; overflow: hidden; border-radius: 14px; margin-bottom: 12px; min-height: 132px;
  display: flex; align-items: flex-end;
  background: linear-gradient(160deg, #16305C, #0A1D3C);
}
.ac-hero-bg {
  position: absolute; inset: 0; background-size: cover; background-position: center;
  opacity: .3; mix-blend-mode: luminosity;
}
.ac-hero::after {
  content: ''; position: absolute; inset: 0;
  background: linear-gradient(90deg, rgba(8, 20, 42, .92), rgba(8, 20, 42, .38));
}
.ac-hero-tx { position: relative; z-index: 1; padding: 16px 15px; color: #fff; }
.ac-hero-tx > b { display: block; font-size: 18px; font-weight: 900; letter-spacing: .3px; }
.ac-hero-tx > small { display: block; margin-top: 7px; font-size: 11.5px; color: rgba(214, 229, 255, .78); line-height: 1.6; }
.ac-hero-st { display: flex; gap: 9px; margin-top: 12px; }
.ac-hero-st > span {
  display: inline-flex; align-items: center; gap: 4px; padding: 4px 9px; border-radius: 7px;
  font-size: 11px; font-weight: 800; color: #fff;
  background: rgba(255, 255, 255, .13); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .16);
}
.ac-hero-st .ic { width: 12px; height: 12px; }
.ac-hero-st b { font-size: 13px; }
.ac-hero-st .warn { background: rgba(217, 130, 0, .26); color: #FFD9A0; }
.ac-hero-st .ok { background: rgba(23, 138, 76, .26); color: #A9E8C4; }
/* 类型筛选 */
.ac-filters { display: flex; gap: 7px; overflow-x: auto; padding: 2px 0 10px; scrollbar-width: none; }
.ac-filters::-webkit-scrollbar { display: none; }
.ac-fchip {
  flex: none; display: inline-flex; align-items: center; gap: 4px; min-height: 32px; padding: 0 11px;
  border-radius: 999px; border: 1px solid #E3E9F2; background: #fff; color: #5A6B82;
  font-family: inherit; font-size: 12.5px; font-weight: 700; cursor: pointer; white-space: nowrap;
}
.ac-fchip em { font-style: normal; font-size: 10.5px; color: #A9B5C6; }
.ac-fchip.on { border-color: var(--blue-700); background: var(--blue-700); color: #fff; }
.ac-fchip.on em { color: rgba(255, 255, 255, .72); }
/* 课程卡
   ⚠️ 类名用 ac-course 不用 ac-card：`.ac-card` 早被「账户卡」（我的页）占用过，
      同名会静默互相覆盖（见 mobile.screens-g.js 顶部约定），换个不撞车的名字。 */
.ac-list { display: flex; flex-direction: column; gap: 10px; }
.ac-course {
  display: flex; gap: 11px; padding: 10px; border-radius: 13px; border: 1px solid #EFF3F8;
  background: #fff; text-align: left; font-family: inherit; cursor: pointer; align-items: stretch;
}
.ac-course:active { background: #FAFCFF; }
.ac-course.is-done { border-color: #DDEBE3; }
.ac-thumb {
  position: relative; flex: none; width: 124px; height: 74px; border-radius: 10px; overflow: hidden;
  background: #E7EDF5;
}
.ac-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.ac-play {
  position: absolute; left: 50%; top: 50%; width: 30px; height: 30px; margin: -15px 0 0 -15px;
  border-radius: 50%; display: grid; place-items: center; color: #fff;
  background: rgba(10, 26, 54, .58); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .35);
  backdrop-filter: blur(2px);
}
.ac-play .ic { width: 14px; height: 14px; }
.ac-dur {
  position: absolute; right: 5px; bottom: 5px; padding: 1px 5px; border-radius: 4px;
  font-style: normal; font-size: 10px; font-weight: 800; color: #fff; background: rgba(8, 18, 36, .72);
}
.ac-seen {
  position: absolute; left: 5px; top: 5px; display: inline-flex; align-items: center; gap: 3px;
  padding: 2px 6px; border-radius: 5px; font-size: 10px; font-weight: 800;
  color: #0F4A2A; background: rgba(169, 232, 196, .92);
}
.ac-seen .ic { width: 11px; height: 11px; }
.ac-main { flex: 1; min-width: 0; display: flex; flex-direction: column; justify-content: center; }
.ac-tags { display: flex; gap: 5px; flex-wrap: wrap; margin-bottom: 6px; }
.ac-must, .ac-kind, .ac-ind {
  font-style: normal; font-size: 10px; font-weight: 800; padding: 2px 6px; border-radius: 5px;
}
.ac-must { color: #fff; background: linear-gradient(135deg, #E0662F, #C2451A); }
.ac-kind { color: #46566E; background: #EDF2F9; }
.ac-ind { color: #8A6510; background: #FDF3DA; }
.ac-t {
  font-size: 13.5px; font-weight: 800; color: var(--ink-900); line-height: 1.45;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.ac-sub { display: block; margin-top: 5px; font-size: 11px; color: var(--ink-400); }
.ac-must-bar {
  width: 100%; margin-top: 12px; padding: 12px 13px; border-radius: 12px; cursor: pointer;
  border: 1px solid #F3D2A8; background: #FFF9EF;
  display: flex; align-items: center; gap: 8px; font-family: inherit; font-size: 12.5px; color: #8A5A0B;
}
.ac-must-bar b { font-size: 14px; }
.ac-must-bar em { margin-left: auto; font-style: normal; font-weight: 800; display: inline-flex; align-items: center; gap: 2px; }
.ac-must-bar .ic { width: 14px; height: 14px; }
/* 「只看必修」已打开：这一条变成"当前视图说明 + 退出入口"，
   配色跟着切到主色，避免和"还有 N 课没学"的警示态混淆。 */
.ac-must-bar.is-on {
  border-color: #C6D8F5; background: #F2F7FF; color: var(--blue-700);
}
.ac-must-bar.is-on b { color: var(--blue-700); }
/* 播放页 */
.screen-acc-play .ac-video { background: #060D1A; }
.ac-player { width: 100%; aspect-ratio: 16 / 9; display: block; background: #060D1A; }
.ac-play-hd { padding: 13px 14px 14px; background: #fff; border-bottom: 1px solid #EFF3F8; }
.ac-play-hd h2 { font-size: 16px; font-weight: 900; color: var(--ink-900); line-height: 1.5; }
.ac-play-meta { display: flex; align-items: center; gap: 7px; flex-wrap: wrap; margin-top: 9px; }
.ac-play-dur, .ac-play-v {
  display: inline-flex; align-items: center; gap: 3px; font-size: 11px; color: var(--ink-400); font-weight: 700;
}
.ac-play-dur .ic, .ac-play-v .ic { width: 12px; height: 12px; }
.ac-play-st {
  display: flex; align-items: center; gap: 6px; margin-top: 11px; padding: 8px 11px; border-radius: 9px;
  font-size: 12px; font-weight: 700; color: #8A5A0B; background: #FFF9EF; box-shadow: inset 0 0 0 1px #F3E0BE;
}
.ac-play-st .ic { width: 14px; height: 14px; }
.ac-play-st.ok { color: #0F4A2A; background: #F1FAF4; box-shadow: inset 0 0 0 1px #CFE9DA; }
.ac-sec { padding: 15px 14px 2px; }
.ac-sec-t {
  display: flex; align-items: center; gap: 7px; font-size: 14px; font-weight: 900; color: var(--ink-900);
  margin-bottom: 9px;
}
.ac-sec-t i { width: 3.5px; height: 14px; border-radius: 2px; background: var(--blue-700); flex: none; }
.ac-sec-t i.warn { background: #D98200; }
.ac-sec-t i.ok { background: var(--success); }
.ac-sec-t i.brand { background: var(--gold-500); }
.ac-scene { display: flex; align-items: center; gap: 5px; font-size: 11.5px; color: var(--ink-400); margin-bottom: 8px; }
.ac-scene .ic { width: 12px; height: 12px; }
.ac-p { font-size: 13px; line-height: 1.9; color: var(--ink-600); }
.ac-ul { list-style: none; display: flex; flex-direction: column; gap: 8px; }
.ac-ul li {
  display: flex; gap: 8px; padding: 10px 11px; border-radius: 10px; font-size: 12.5px;
  line-height: 1.75; color: #4A3A18; background: #FFFAF0; box-shadow: inset 0 0 0 1px #F3E4C6;
}
.ac-ul li::before {
  content: ''; flex: none; width: 5px; height: 5px; border-radius: 50%; margin-top: 8px; background: #D98200;
}
.ac-ul.ok li { color: #10432A; background: #F4FBF6; box-shadow: inset 0 0 0 1px #D4EBDE; }
.ac-ul.ok li::before { background: var(--success); }
.ac-rules { display: flex; flex-direction: column; gap: 7px; }
.ac-rule {
  display: flex; align-items: center; gap: 7px; padding: 10px 11px; border-radius: 10px;
  font-size: 12px; color: #3B4C66; background: #F7FAFF; box-shadow: inset 0 0 0 1px #E4ECF7;
}
.ac-rule .ic { width: 13px; height: 13px; color: var(--blue-600, #2F6BD8); flex: none; }
.ac-play-foot { padding: 16px 14px calc(16px + env(safe-area-inset-bottom, 0px)); }

/* ===================== 提升学历 ===================== */
.screen-edu .page-body { padding-bottom: 18px; }
.ed-hero {
  display: flex; gap: 12px; align-items: center; padding: 15px; border-radius: 14px; margin-bottom: 12px;
  background: linear-gradient(150deg, #1B3C74, var(--blue-700)); color: #fff; overflow: hidden; position: relative;
}
.ed-hero::after {
  content: ''; position: absolute; width: 190px; height: 190px; right: -70px; top: -90px; border-radius: 50%;
  background: radial-gradient(circle, rgba(201, 153, 43, .3), transparent 66%);
}
.ed-hero-ic {
  position: relative; z-index: 1; flex: none; width: 48px; height: 48px; border-radius: 15px;
  display: grid; place-items: center; color: var(--gold-300, #EDD083);
  background: rgba(255, 255, 255, .13); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .18);
}
.ed-hero-tx { position: relative; z-index: 1; min-width: 0; }
.ed-hero-tx b { display: block; font-size: 15.5px; font-weight: 900; }
.ed-hero-tx small { display: block; margin-top: 6px; font-size: 11px; line-height: 1.65; color: rgba(214, 229, 255, .8); }
/* 筛选 */
.ed-filters { background: #fff; border-radius: 12px; padding: 11px 12px; margin-bottom: 12px; box-shadow: inset 0 0 0 1px #EFF3F8; }
.ed-fl-row { display: flex; align-items: flex-start; gap: 9px; }
.ed-fl-row + .ed-fl-row { margin-top: 9px; padding-top: 9px; border-top: 1px dashed #EEF2F8; }
.ed-fl-lb { flex: none; width: 52px; font-size: 11.5px; font-weight: 800; color: #7A8698; padding-top: 7px; }
.ed-chips { display: flex; flex-wrap: wrap; gap: 6px; flex: 1; }
.ed-chip {
  min-height: 30px; padding: 0 10px; border-radius: 8px; border: 1px solid #E3E9F2; background: #FAFCFF;
  color: #5A6B82; font-family: inherit; font-size: 12px; font-weight: 700; cursor: pointer;
}
.ed-chip.on { border-color: var(--blue-700); background: var(--blue-700); color: #fff; }
/* 老师卡 */
.ed-list { display: flex; flex-direction: column; gap: 11px; }
.ed-card {
  padding: 12px 13px; border-radius: 13px; background: #fff; box-shadow: inset 0 0 0 1px #EFF3F8;
}
.ed-card.is-mine { box-shadow: inset 0 0 0 1px #E9D9AE; background: #FFFDF7; }
.ed-hd { display: flex; align-items: center; gap: 10px; }
.ed-av {
  flex: none; width: 44px; height: 44px; border-radius: 50%; display: grid; place-items: center;
  font-size: 17px; font-weight: 900; color: #fff;
  background: linear-gradient(150deg, #3A7BE0, var(--blue-700));
}
.ed-av.lg { width: 54px; height: 54px; font-size: 21px; }
.ed-main { flex: 1; min-width: 0; }
.ed-main b { display: flex; align-items: center; gap: 6px; font-size: 15px; font-weight: 900; color: var(--ink-900); }
.ed-main small { display: block; margin-top: 4px; font-size: 11.5px; color: var(--ink-500); }
.ed-mine {
  font-style: normal; padding: 1.5px 6px; border-radius: 5px; font-size: 10px; font-weight: 800;
  color: #8A6510; background: #FDF3DA;
}
.ed-lv {
  flex: none; font-style: normal; padding: 3px 8px; border-radius: 7px; font-size: 11px; font-weight: 800;
  color: var(--blue-700); background: #EAF1FB;
}
.ed-lv.lg { font-size: 12px; padding: 4px 10px; }
.ed-org {
  display: flex; align-items: center; gap: 5px; margin-top: 9px;
  font-size: 11.5px; color: var(--ink-500);
}
.ed-org .ic { width: 12px; height: 12px; color: #A9B5C6; }
.ed-subs { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 9px; }
.ed-subs span {
  padding: 3px 8px; border-radius: 6px; font-size: 11px; font-weight: 700;
  color: #46667E; background: #F1F6FB;
}
.ed-subs.big span { font-size: 12px; padding: 5px 11px; color: var(--blue-700); background: #EAF1FB; }
.ed-brief {
  margin-top: 9px; font-size: 12px; line-height: 1.8; color: var(--ink-500);
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.ed-foot { display: flex; align-items: center; gap: 8px; margin-top: 12px; padding-top: 11px; border-top: 1px solid #F2F6FA; }
.ed-area {
  flex: 1; min-width: 0; display: flex; align-items: center; gap: 4px;
  font-size: 11px; color: var(--ink-400); overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.ed-area .ic { width: 12px; height: 12px; flex: none; }
.ed-btn {
  flex: none; height: 34px; padding: 0 13px; border-radius: 9px; cursor: pointer;
  border: 1px solid #E3E9F2; background: #fff; color: #52627A;
  font-family: inherit; font-size: 12.5px; font-weight: 800;
  display: inline-flex; align-items: center; gap: 4px;
}
.ed-btn .ic { width: 13px; height: 13px; }
.ed-btn.main { border-color: transparent; background: var(--blue-700); color: #fff; }
.ed-btn:active { opacity: .86; }
/* 老师详情 */
.ed-hero-card { padding: 15px; border-radius: 14px; background: #fff; box-shadow: inset 0 0 0 1px #EFF3F8; margin-bottom: 12px; }
.ed-hc-top { display: flex; align-items: center; gap: 11px; }
.ed-hc-me { flex: 1; min-width: 0; }
.ed-hc-me b { display: flex; align-items: center; gap: 6px; font-size: 18px; font-weight: 900; color: var(--ink-900); }
.ed-hc-me small { display: block; margin-top: 5px; font-size: 12px; color: var(--ink-500); }
.ed-hc-kv { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin-top: 14px; padding-top: 13px; border-top: 1px dashed #EEF2F8; }
.ed-hc-kv > div span { display: block; font-size: 11px; color: var(--ink-400); }
.ed-hc-kv > div b { display: block; margin-top: 4px; font-size: 12.5px; font-weight: 800; color: var(--ink-900); }
.ed-resume { font-size: 13px; line-height: 1.95; color: var(--ink-600); }
.ed-contact { display: flex; flex-direction: column; gap: 10px; }
.ed-ct-row { display: flex; align-items: center; gap: 9px; font-size: 13px; color: var(--ink-600); }
.ed-ct-row .ic { width: 15px; height: 15px; color: var(--blue-600, #2F6BD8); flex: none; }
.ed-ct-lb { font-size: 12px; color: var(--ink-400); width: 34px; flex: none; }
.ed-ct-row b { font-weight: 800; color: var(--ink-900); }
.ed-ct-copy {
  margin-left: auto; height: 30px; padding: 0 11px; border-radius: 8px; cursor: pointer;
  border: 1px solid #E3E9F2; background: #FAFCFF; color: var(--blue-700);
  font-family: inherit; font-size: 12px; font-weight: 800;
}