/* ============================================================
   之江招才 · 移动端视觉层 v2（2026-10-27）
   依据 Ardot 设计稿《之江招才 · 移动端改版》file/740847253390501

   设计令牌（从设计稿 2x 导出图采样，除以 2 得 CSS px）：
     主蓝   #1B5BD6    深蓝渐变 #002F70 → #0A4EA6
     浅蓝   #EAF1FD    页面底 #F4F6FA    卡片 #FFFFFF
     深字   #0E1B2E    次字 #3A4A5F    弱字 #8A94A6
     危险   #D93A2B    危险底 #FDECEA    极浅 #F8FAFD / #F5F7FA
     圆角   卡片 16 / 控件 12 / 胶囊 999
     边距   页面 16 / 卡片内 16 / 卡片间 12

   ⚠️ 整个文件包在 @media (max-width: 900px) 里：
      桌面端样式（ui.css / card-v2.css / style.css）保持原样，不受影响。
      本文件必须在 ui.css 之后引入，同特异性时才能覆盖。
   ============================================================ */

/* 移动端专用节点：桌面端一律不显示（桌面沿用各自原有结构） */
.ui-job__m2head,
.ui-job__m2foot,
.ui-job__facts2,
.m2-top,
.m2-cta,
.m2-more,
.m2-more__note,
.m2-shown,
.m2-disc,
.m2-notice,
.m2-filters,
.m2-listhead,
.m2-dfacts,
.m2-related,
.m2-footnote,
.m2-stateleft,
.ui-types { display: none; }

/* ============================================================
   新增页面（我的 / 消息列表 / 意见反馈）
   这几页桌面端原本不存在，所以基础样式写在 @media 外，
   桌面端用 720 居中容器兜底，移动端再细化。
   ============================================================ */
.m2-mine {
  max-width: 720px;
  margin: 0 auto;
  padding: 14px 16px 24px;
}
.m2-card {
  background: #fff;
  border-radius: 16px;
  padding: 16px;
  margin-bottom: 12px;
  box-shadow: 0 1px 3px rgba(14, 27, 46, .05);
}
.m2-card__t {
  display: flex;
  align-items: center;
  font-size: 15px;
  font-weight: 700;
  color: #0e1b2e;
  margin-bottom: 12px;
}
.m2-card__n {
  margin-left: auto;
  font-size: 12px;
  font-weight: 400;
  color: #8a94a6;
}
.m2-card__n b { font-weight: 400; }

.m2-menu-list { padding: 0; overflow: hidden; }
.m2-row {
  display: flex;
  align-items: center;
  gap: 11px;
  min-height: 52px;
  padding: 0 16px;
  font-size: 15px;
  color: #0e1b2e;
  text-decoration: none;
  background: none;
  border: 0;
  width: 100%;
  text-align: left;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}
.m2-row + .m2-row { border-top: 1px solid #f2f5fa; }
.m2-row:active { background: #f7f9fc; }
.m2-row__ic {
  width: 19px;
  height: 19px;
  flex: 0 0 auto;
  color: #4a5668;
}
.m2-row__label { flex: 1 1 auto; }
.m2-row__val { font-size: 13px; color: #8a94a6; }
.m2-row__go { color: #c2cad6; font-size: 18px; line-height: 1; }

.m2-ver {
  margin: 16px 0 0;
  text-align: center;
  font-size: 12px;
  color: #9aa5b6;
  line-height: 1.7;
}

/* ---- 二级页头（返回 + 居中标题） ---- */
.m2-subhd {
  background: linear-gradient(180deg, #002f70 0%, #07428f 100%);
  border-radius: 0;
  padding: 0 0 16px;
}
.m2-subhd__bar {
  display: flex;
  align-items: center;
  height: 52px;
  padding: 0 8px;
  position: relative;
}
.m2-subhd__back {
  width: 40px;
  height: 40px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  text-decoration: none;
}
.m2-subhd__back svg {
  width: 22px;
  height: 22px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.m2-subhd__title {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  margin: 0;
  font-size: 18px;
  font-weight: 600;
  color: #fff;
  white-space: nowrap;
}
.m2-subhd__desc {
  margin: 4px 16px 0;
  font-size: 13px;
  line-height: 1.65;
  color: rgba(255, 255, 255, .78);
}

/* ---- 用户区 ---- */
.m2-user {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 6px 0 20px;
}
.m2-user__av {
  width: 56px;
  height: 56px;
  flex: 0 0 auto;
  border-radius: 50%;
  background: rgba(255, 255, 255, .2);
  color: #fff;
  font-size: 21px;
  font-weight: 600;
  line-height: 56px;
  text-align: center;
}
.m2-user__main { min-width: 0; }
.m2-user__name {
  font-size: 20px;
  font-weight: 700;
  color: #fff;
  line-height: 1.3;
}
.m2-user__meta {
  margin-top: 4px;
  font-size: 12.5px;
  color: rgba(255, 255, 255, .72);
}

/* ---- 表单：单选胶囊 ----
   ⚠️ 这里刻意用 .m2-rchip 而不是 .m2-chip：
     .m2-chip 是「链接型胶囊」（<a> 本身就是药丸），
     表单是「label 包隐藏 radio + span 当药丸」，两者结构不同。
     早先两者共用 .m2-chip，结果 label 和 span 各套一层药丸，
     宽度直接翻倍 —— 一行四个类型排不下，「其他」被挤到屏幕外。 */
.m2-rchip { position: relative; }
.m2-rchip input {
  position: absolute;
  opacity: 0;
  width: 0;
  height: 0;
}
.m2-rchip span {
  display: inline-flex;
  align-items: center;
  height: 34px;
  padding: 0 16px;
  border-radius: 999px;
  background: #f2f5fa;
  font-size: 13.5px;
  color: #3a4a5f;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}
.m2-rchip input:checked + span {
  background: #1b5bd6;
  color: #fff;
  font-weight: 500;
}
.m2-rchip input:focus-visible + span {
  outline: 2px solid #1b5bd6;
  outline-offset: 2px;
}
.m2-area {
  display: block;
  width: 100%;
  min-height: 140px;
  padding: 13px 14px;
  border: 0;
  border-radius: 12px;
  background: #f5f7fa;
  font: inherit;
  font-size: 15px;
  line-height: 1.75;
  color: #0e1b2e;
  resize: vertical;
  outline: none;
}
.m2-area::placeholder { color: #9aa5b6; }
.m2-input {
  display: block;
  width: 100%;
  height: 48px;
  padding: 0 14px;
  border: 0;
  border-radius: 12px;
  background: #f5f7fa;
  font: inherit;
  font-size: 15px;
  color: #0e1b2e;
  outline: none;
}
.m2-input::placeholder { color: #9aa5b6; }
.m2-err {
  margin: 0 0 12px;
  padding: 10px 14px;
  border-radius: 10px;
  background: #fdecea;
  color: #d93a2b;
  font-size: 13px;
  line-height: 1.6;
}

.m2-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 48px;
  padding: 0 26px;
  border: 0;
  border-radius: 12px;
  background: #1b5bd6;
  font: inherit;
  font-size: 16px;
  font-weight: 600;
  color: #fff;
  text-decoration: none;
  cursor: pointer;
}
.m2-btn:active { background: #154bb5; }
.m2-btn--block { display: flex; width: 100%; }

/* ---- 空态 / 完成态 ---- */
.m2-empty,
.m2-done { text-align: center; padding: 34px 22px; }
.m2-empty__t,
.m2-done h2 {
  margin: 0;
  font-size: 16px;
  font-weight: 700;
  color: #0e1b2e;
}
.m2-empty__d,
.m2-done p {
  margin: 8px 0 18px;
  font-size: 13px;
  line-height: 1.7;
  color: #8a94a6;
}
.m2-done__ic {
  width: 46px;
  height: 46px;
  margin-bottom: 12px;
  color: #1b5bd6;
}
.m2-done h2 { margin-bottom: 0; }

/* ---- 移动端顶部菜单（details 实现，无需 JS） ---- */
.m2-menu { position: relative; margin-left: auto; }
.m2-menu > summary {
  list-style: none;
  cursor: pointer;
  width: 34px;
  height: 34px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 8px;
  color: #fff;
}
.m2-menu > summary::-webkit-details-marker { display: none; }
.m2-menu > summary svg {
  width: 21px;
  height: 21px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
}
.m2-menu__panel {
  position: absolute;
  right: 0;
  top: 42px;
  z-index: 60;
  min-width: 132px;
  padding: 6px;
  border-radius: 12px;
  background: #fff;
  box-shadow: 0 12px 28px -8px rgba(14, 27, 46, .28);
}
.m2-menu__panel a {
  display: block;
  padding: 10px 12px;
  border-radius: 8px;
  font-size: 14px;
  color: #0e1b2e;
  text-decoration: none;
}
.m2-menu__panel a:active { background: #f2f5fa; }

.m2-brand { text-decoration: none; }

/* ============================================================
   地区总览页 /zhaopin（设计稿第 3 屏）
   这一页桌面端也真实存在（枢纽页，进 sitemap），所以基础样式写在
   @media 外，两端共用一套；移动端只在下面补间距与字号。
   ============================================================ */
.m2-sechead {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  margin: 0 0 10px;
}
.m2-sechead__t {
  margin: 0;
  font-size: 17px;
  font-weight: 700;
  color: #0e1b2e;
}
.m2-sechead__n {
  font-size: 12.5px;
  color: #8a94a6;
}

.m2-citygrid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 9px;
}
.m2-citycard {
  display: block;
  padding: 14px 12px 12px;
  border: 1px solid transparent;
  border-radius: 14px;
  background: #fff;
  box-shadow: 0 1px 3px rgba(14, 27, 46, .05);
  text-decoration: none;
  -webkit-tap-highlight-color: transparent;
}
.m2-citycard:active { background: #f7f9fc; }
.m2-citycard__n {
  display: block;
  font-size: 15.5px;
  font-weight: 600;
  color: #0e1b2e;
  line-height: 1.3;
}
.m2-citycard__c {
  display: block;
  margin-top: 4px;
  font-size: 12px;
  color: #8a94a6;
}
/* 选中（当前定位城市）：浅蓝底 + 蓝边 + 蓝字 */
.m2-citycard.is-on {
  background: #eaf1fd;
  border-color: #1b5bd6;
}
.m2-citycard.is-on .m2-citycard__n,
.m2-citycard.is-on .m2-citycard__c { color: #1b5bd6; }

/* 热门区县卡 */
.m2-dcard {
  margin-top: 12px;
  padding: 16px;
  border-radius: 16px;
  background: #fff;
  box-shadow: 0 1px 3px rgba(14, 27, 46, .05);
}
.m2-dcard__hd {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.m2-dcard__t {
  margin: 0;
  font-size: 15px;
  font-weight: 700;
  color: #0e1b2e;
}
.m2-dcard__more {
  font-size: 13px;
  color: #1b5bd6;
  text-decoration: none;
}
.m2-dcard__sub {
  margin: 6px 0 12px;
  font-size: 12px;
  color: #8a94a6;
}

/* 胶囊 chip：地区页与列表筛选卡共用 */
.m2-chips {
  display: flex;
  flex-wrap: nowrap;
  gap: 8px;
  overflow-x: auto;
  scrollbar-width: none;
  -webkit-overflow-scrolling: touch;
}
.m2-chips::-webkit-scrollbar { display: none; }
.m2-chips--wrap {
  flex-wrap: wrap;
  overflow: visible;
}
.m2-chip {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  height: 34px;
  padding: 0 14px;
  border-radius: 999px;
  background: #f5f7fa;
  font-size: 13.5px;
  line-height: 34px;
  color: #3a4a5f;
  text-decoration: none;
  white-space: nowrap;
  -webkit-tap-highlight-color: transparent;
}
.m2-chip:active { background: #eaf1fd; }
.m2-chip.is-on {
  background: #1b5bd6;
  color: #fff;
  font-weight: 500;
}
/* 排序组：选中不抢眼，浅蓝底 + 蓝字（设计稿里排序是次级筛选） */
.m2-chip--soft.is-on {
  background: #eaf1fd;
  color: #1b5bd6;
}
/* 四选一并排（意见反馈的反馈类型）：pad 收到 11px 才排得下一行，
   再宽就只能横滑 —— 设计稿是一排四个 */
.m2-chips--fit {
  gap: 7px;
  flex-wrap: wrap;
  overflow: visible;
}
.m2-chips--fit .m2-rchip span {
  padding: 0 11px;
  font-size: 13px;
}

/* 宽口径 chip（区县名 3 字）：给它一点呼吸，避免挤成一条 */
.m2-chips--wrap .m2-chip { padding: 0 16px; }

/* 提示卡（浅蓝底 + 图标） */
.m2-tipcard {
  display: flex;
  align-items: flex-start;
  gap: 9px;
  margin-top: 12px;
  padding: 13px 14px;
  border-radius: 14px;
  background: #eaf1fd;
}
.m2-tipcard svg {
  flex: 0 0 auto;
  width: 17px;
  height: 17px;
  margin-top: 1px;
  fill: none;
  stroke: #1b5bd6;
  stroke-width: 1.7;
}
.m2-tipcard p {
  margin: 0;
  font-size: 12.5px;
  line-height: 1.7;
  color: #2c4a78;
}

/* 定位条（设计稿：当前定位 · 杭州市西湖区 + 重新定位） */
.m2-geo {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 14px;
  padding: 0 14px;
  height: 44px;
  border-radius: 12px;
  background: rgba(255, 255, 255, .14);
}
.m2-geo svg {
  flex: 0 0 auto;
  width: 16px;
  height: 16px;
  fill: none;
  stroke: #fff;
  stroke-width: 1.7;
  stroke-linejoin: round;
}
.m2-geo__t {
  font-size: 13px;
  color: #fff;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.m2-geo__btn {
  margin-left: auto;
  font-size: 13px;
  font-weight: 500;
  color: #fff;
  text-decoration: none;
  white-space: nowrap;
}

@media (max-width: 900px) {

  /* ---------------------------------------------------------- 令牌 */
  .ui,
  .ui-nav,
  .ui-footer,
  .ui-tabbar,
  .m2 {
    --m2-blue: #1b5bd6;
    --m2-blue-press: #154bb5;
    --m2-navy: #002f70;
    --m2-navy-2: #0a4ea6;
    --m2-soft: #eaf1fd;
    --m2-bg: #f4f6fa;
    --m2-card: #fff;
    --m2-ink: #0e1b2e;
    --m2-sub: #3a4a5f;
    --m2-muted: #8a94a6;
    --m2-red: #d93a2b;
    --m2-red-bg: #fdecea;
    --m2-line: #edf1f7;
    --m2-line-2: #e4eaf2;
    --m2-field: #f5f7fa;
    --m2-r-card: 16px;
    --m2-r-ctrl: 12px;
    --m2-r-pill: 999px;
    --m2-shadow: 0 1px 3px rgba(14, 27, 46, .05);
  }

  /* ---------------------------------------------------------- 页面底 */
  body.ui-page,
  .ui {
    background: var(--m2-bg);
  }

  .ui-container {
    max-width: none;
    padding-left: 16px;
    padding-right: 16px;
  }

  /* ==========================================================
     一、顶部（logo 行 + 大标题 + 搜索 + 热门搜索）
     设计稿：深蓝渐变，顶部最深处 #002F70 → 底部 #0A4EA6
     ========================================================== */
  .ui-hero {
    background: linear-gradient(180deg, #002f70 0%, #043b85 46%, #0a4ea6 100%);
    border-radius: 0 0 0 0;
    padding: 0 0 18px;
  }
  .ui-hero::after {
    display: none;                    /* 旧版装饰层，设计稿没有 */
  }
  /* 左右内边距由 .ui-container 提供，这里不能再加一遍（双层会吃掉 32px，
     让 26px 的标题在 390 宽下被迫断行） */
  .ui-hero__inner {
    padding: 14px 0 0;
  }

  /* logo 行（模板新增 .m2-top，桌面端隐藏） */
  .m2-top {
    display: flex;
    align-items: center;
    gap: 9px;
    margin-bottom: 14px;
  }
  .m2-logo {
    width: 28px;
    height: 28px;
    flex: 0 0 auto;
    border-radius: 8px;
    background: #fff;
    color: var(--m2-blue);
    font-size: 15px;
    font-weight: 700;
    line-height: 28px;
    text-align: center;
    letter-spacing: -.5px;
  }
  .m2-brand {
    font-size: 15px;
    font-weight: 700;
    color: #fff;
    letter-spacing: .3px;
  }
  .m2-menu {
    margin-left: auto;
    width: 34px;
    height: 34px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    border: 0;
    border-radius: 8px;
    background: none;
    color: #fff;
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
  }
  .m2-menu:active { background: rgba(255, 255, 255, .14); }
  .m2-menu svg {
    width: 21px;
    height: 21px;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
  }

  /* 旧版 badge（「覆盖省属及 11 个地市…」）设计稿换成 logo 行，隐藏 */
  .ui-hero__badge {
    display: none;
  }

  .ui-hero__title {
    margin: 0;
    font-size: 23px;
    line-height: 1.4;
    font-weight: 700;
    letter-spacing: -.2px;
    color: #fff;
    max-width: 100%;
  }

  .ui-hero__desc {
    margin: 7px 0 0;
    font-size: 12.5px;
    line-height: 1.6;
    color: rgba(255, 255, 255, .76);
    max-width: none;
  }

  /* ---------------------------------------------------------- 搜索框 */
  .ui-search {
    position: relative;
    display: flex;
    align-items: center;
    gap: 0;
    margin-top: 14px;
    height: 48px;
    padding: 0 14px;
    background: #fff;
    border: 0;
    border-radius: 12px;
    box-shadow: 0 4px 14px -6px rgba(0, 20, 50, .35);
  }
  /* 旧版「地市」下拉在移动端取消（设计稿改为搜索 + 地区页） */
  .ui-search__scope {
    display: none;
  }
  .ui-search::before {
    content: "";
    flex: 0 0 auto;
    width: 18px;
    height: 18px;
    margin-right: 9px;
    background: currentColor;
    color: #9aa5b6;
    -webkit-mask: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%239aa5b6' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='m20 20-3.6-3.6'/%3E%3C/svg%3E") center/contain no-repeat;
    mask: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%239aa5b6' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='m20 20-3.6-3.6'/%3E%3C/svg%3E") center/contain no-repeat;
  }
  .ui-search__input {
    flex: 1 1 auto;
    min-width: 0;
    height: 100%;
    padding: 0;
    border: 0;
    background: none;
    font-size: 15px;
    line-height: 48px;
    color: var(--m2-ink);
    outline: none;
  }
  .ui-search__input::placeholder {
    color: #9aa5b6;
  }
  .ui-search__btn {
    flex: 0 0 auto;
    height: 24px;
    margin-left: 10px;
    padding: 0 0 0 13px;
    border: 0;
    border-left: 1px solid var(--m2-line-2);
    border-radius: 0;
    background: none;
    font-size: 15px;
    font-weight: 600;
    color: var(--m2-blue);
    line-height: 24px;
  }

  /* ---------------------------------------------------------- 热门搜索 */
  .ui-hot {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-top: 13px;
    overflow-x: auto;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
  }
  .ui-hot::-webkit-scrollbar { display: none; }
  .ui-hot__label {
    flex: 0 0 auto;
    font-size: 12px;
    color: rgba(255, 255, 255, .64);
  }
  .ui-hot__item {
    flex: 0 0 auto;
    height: 30px;
    padding: 0 14px;
    border-radius: var(--m2-r-pill);
    background: rgba(255, 255, 255, .14);
    font-size: 12.5px;
    line-height: 30px;
    color: #fff;
    text-decoration: none;
  }
  .ui-hot__item:active { background: rgba(255, 255, 255, .24); }

  /* ==========================================================
     一·B 列表页专属（设计稿第 2 屏「正在报名的公告」）
     触发条件：body.is-list（即 ?open=1）。首页版式完全不受影响。
     ========================================================== */

  /* 这一屏没有 hero 搜索框与热门词 —— 搜索挪进了下方筛选卡 */
  body.is-list .ui-search,
  body.is-list .ui-hot,
  body.is-list .ui-stats,
  body.is-list .ui-region-sec,
  body.is-list .ui-types,
  body.is-list .ui-sortbar,
  body.is-list .ui-section__head--list { display: none; }
  /* 列表页（这一屏本身就是「正在报名」）不需要「去看正在报名」的 CTA，
     点了还会把当前筛选条件全清掉 */
  body.is-list .ui-cta { display: none; }

  /* 顶部须知条（半透明白，压在深蓝 hero 上） */
  .m2-notice {
    display: flex;
    align-items: flex-start;
    gap: 9px;
    margin-top: 15px;
    padding: 12px 13px;
    border-radius: 12px;
    background: rgba(255, 255, 255, .13);
  }
  .m2-notice svg {
    flex: 0 0 auto;
    width: 16px;
    height: 16px;
    margin-top: 1px;
    fill: none;
    stroke: rgba(255, 255, 255, .86);
    stroke-width: 1.8;
  }
  .m2-notice p {
    margin: 0;
    font-size: 12px;
    line-height: 1.65;
    color: rgba(255, 255, 255, .88);
  }

  /* 筛选卡（压在 hero 下沿，白底浮起） */
  .m2-filters {
    display: block;
    margin: -10px 20px 0;
    padding: 14px 14px 6px;
    border-radius: var(--m2-r-card);
    background: #fff;
    box-shadow: 0 2px 10px -4px rgba(14, 27, 46, .12);
  }
  .m2-filters__search {
    display: flex;
    align-items: center;
    height: 42px;
    padding: 0 12px;
    border-radius: 12px;
    background: var(--m2-field);
  }
  .m2-filters__search svg {
    flex: 0 0 auto;
    width: 17px;
    height: 17px;
    margin-right: 8px;
    fill: none;
    stroke: #9aa5b6;
    stroke-width: 1.9;
    stroke-linecap: round;
  }
  .m2-filters__search input {
    flex: 1 1 auto;
    min-width: 0;
    height: 100%;
    padding: 0;
    border: 0;
    background: none;
    font-size: 14px;
    color: var(--m2-ink);
    outline: none;
    -webkit-appearance: none;
  }
  .m2-filters__search input::placeholder { color: #9aa5b6; }
  .m2-filters__search input::-webkit-search-cancel-button { display: none; }

  .m2-filters__hd {
    display: flex;
    align-items: center;
    margin: 14px 0 2px;
  }
  .m2-filters__t {
    font-size: 14px;
    font-weight: 700;
    color: var(--m2-ink);
  }
  .m2-filters__reset {
    margin-left: auto;
    font-size: 13px;
    font-weight: 500;
    color: var(--m2-blue);
    text-decoration: none;
  }
  .m2-fgroup { margin-top: 12px; }
  .m2-fgroup:last-child { margin-bottom: 8px; }
  .m2-fgroup__t {
    margin-bottom: 8px;
    font-size: 12.5px;
    color: var(--m2-muted);
  }
  /* 筛选卡里的 chip 比地区页略矮一点，四组叠起来才不占满整屏 */
  .m2-fgroup .m2-chip {
    height: 32px;
    padding: 0 13px;
    font-size: 13px;
    line-height: 32px;
    background: var(--m2-field);
  }
  .m2-fgroup .m2-chip.is-on { background: var(--m2-blue); color: #fff; }
  .m2-fgroup .m2-chip--soft.is-on { background: var(--m2-soft); color: var(--m2-blue); }

  /* 计数行：共 N 条正在报名 / 排序口径 */
  .m2-listhead {
    display: flex;
    align-items: baseline;
    gap: 8px;
    margin: 20px 0 10px;
  }
  .m2-listhead__n {
    font-size: 15px;
    font-weight: 700;
    color: var(--m2-ink);
  }
  .m2-listhead__s {
    margin-left: auto;
    font-size: 12px;
    color: var(--m2-muted);
    white-space: nowrap;
  }

  /* 定位提示：上下留白，与计数行/排序 tab 拉开层级 */
  .ui-geo {
    margin: 18px 0 18px;
  }

  /* ==========================================================
     二、数据统计卡（白底浮起，4 列）
     ========================================================== */
  .ui-stats {
    margin: -2px 0 0;
    padding: 0;
    background: transparent;
    border: 0;
  }
  .ui-stats__inner {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0;
    margin: 14px auto 0;
    padding: 15px 6px;
    background: var(--m2-card);
    border-radius: var(--m2-r-card);
    box-shadow: var(--m2-shadow);
  }
  .ui-stat {
    text-align: center;
    padding: 0;
    border: 0;
    background: none;
  }
  .ui-stat__num {
    font-size: 21px;
    line-height: 1.2;
    font-weight: 700;
    color: var(--m2-ink);
    letter-spacing: -.3px;
  }
  .ui-stat__num.is-accent {
    color: var(--m2-blue);
  }
  .ui-stat__label {
    margin-top: 5px;
    font-size: 11.5px;
    line-height: 1.3;
    color: var(--m2-muted);
  }

  /* ==========================================================
     三、区块头（按地区找公告 / 单位性质…）
     ========================================================== */
  .ui-section {
    padding: 0;
  }
  .ui-section > .ui-container {
    padding: 0;
  }
  .ui-section__head {
    display: flex;
    align-items: baseline;
    gap: 10px;
    margin: 24px 0 12px;
  }
  .ui-section__title {
    margin: 0;
    font-size: 17px;
    font-weight: 700;
    color: var(--m2-ink);
    letter-spacing: -.1px;
  }
  .ui-link,
  .ui-section__head .ui-link {
    margin-left: auto;
    font-size: 12.5px;
    font-weight: 400;
    color: var(--m2-muted);
    text-decoration: none;
  }
  .ui-section__head .ui-link::after {
    content: "›";
    margin-left: 2px;
  }

  /* ---------------------------------------------------------- 地区胶囊 */
  .ui-regions {
    display: flex;
    gap: 8px;
    margin: 0;
    padding: 0 0 2px;
    overflow-x: auto;
    scroll-snap-type: x proximity;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
  }
  .ui-regions::-webkit-scrollbar { display: none; }
  .ui-region,
  .ui-regions a {
    flex: 0 0 auto;
    scroll-snap-align: start;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    height: 34px;
    padding: 0 16px;
    border: 1px solid var(--m2-line-2);
    border-radius: var(--m2-r-pill);
    background: #fff;
    font-size: 13.5px;
    line-height: 32px;
    color: var(--m2-ink);
    text-decoration: none;
    white-space: nowrap;
  }
  .ui-region b,
  .ui-regions a b {
    font-size: 11.5px;
    font-weight: 400;
    color: var(--m2-muted);
  }
  .ui-region.is-on,
  .ui-regions a.is-on {
    background: var(--m2-blue);
    border-color: var(--m2-blue);
    color: #fff;
    font-weight: 500;
  }
  .ui-region.is-on b,
  .ui-regions a.is-on b { color: rgba(255, 255, 255, .74); }

  /* ---------------------------------------------------------- 单位性质统计卡 */
  .ui-types {
    margin: 12px 20px 0;
    padding: 16px 6px;
    background: var(--m2-card);
    border-radius: var(--m2-r-card);
    box-shadow: var(--m2-shadow);
  }
  .ui-types__inner {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
  }
  .ui-type {
    text-align: center;
    padding: 0;
    border: 0;
    background: none;
    text-decoration: none;
  }
  .ui-type__label {
    font-size: 12.5px;
    color: var(--m2-sub);
    line-height: 1.4;
  }
  .ui-type__num {
    margin-top: 4px;
    font-size: 15px;
    font-weight: 700;
    color: var(--m2-blue);
    line-height: 1.3;
  }

  /* ==========================================================
     四、排序 tabs（最新公告 / 即将截止 / 最受关注）
     ========================================================== */
  .ui-tabs {
    display: flex;
    align-items: center;
    gap: 22px;
    margin: 24px 0 12px;
    padding: 0;
    border: 0;
    background: none;
    overflow: visible;
  }
  .ui-tabs__item,
  .ui-tabs a {
    position: relative;
    flex: 0 0 auto;
    height: auto;
    padding: 0 0 8px;
    border: 0;
    border-radius: 0;
    background: none;
    font-size: 16.5px;
    font-weight: 500;
    color: var(--m2-muted);
    line-height: 1.4;
  }
  .ui-tabs__item.is-on,
  .ui-tabs a.is-on {
    color: var(--m2-ink);
    font-weight: 700;
  }
  .ui-tabs__item.is-on::after,
  .ui-tabs a.is-on::after {
    content: "";
    position: absolute;
    left: 50%;
    bottom: 0;
    width: 22px;
    height: 3px;
    margin-left: -11px;
    border-radius: 2px;
    background: var(--m2-blue);
  }
  .ui-tabs__count {
    margin-left: auto;
    font-size: 12.5px;
    font-weight: 400;
    color: var(--m2-muted);
  }

  /* ==========================================================
     五、公告卡片（移动端结构）
     设计稿：标签 + 剩余天数 / 标题 2 行 / 地市·学历·招N人 / 报名截止 + 查看公告
     与桌面的差别：没有左侧日期栏（日期并入「报名截止」行）
     ========================================================== */
  /* 卡片不自己留边距：外层 .ui-container 已经给了内容区左右边界，
     再叠 16px 就会比上方统计卡窄一圈（2026-10-27 强哥指出的对齐问题） */
  .ui-jobs,
  .ui-list {
    display: block;
    margin: 0;
    padding: 0;
  }

  .ui-job.ui-job--v2 {
    display: block;
    position: relative;
    margin: 0 0 12px;
    padding: 14px 16px 13px;
    background: var(--m2-card);
    border: 0;
    border-radius: var(--m2-r-card);
    box-shadow: var(--m2-shadow);
  }
  .ui-job.ui-job--v2:last-child { margin-bottom: 0; }

  /* 左侧日期栏在移动端不显示（设计稿把截止日放到卡片底行） */
  .ui-job.ui-job--v2 .ui-job__time {
    display: none;
  }
  .ui-job.ui-job--v2 .ui-job__main {
    display: block;
    padding: 0;
  }
  .ui-job.ui-job--v2 .ui-job__go {
    display: none;
  }

  /* 移动端专用头部行：左标签 + 右剩余天数 */
  .ui-job__m2head {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 10px;
  }
  .ui-job__tag {
    display: inline-flex;
    align-items: center;
    height: 24px;
    padding: 0 10px;
    border-radius: 7px;
    background: var(--m2-soft);
    font-size: 12px;
    font-weight: 500;
    line-height: 24px;
    color: var(--m2-blue);
    white-space: nowrap;
  }
  .ui-job__tag.is-empty { display: none; }
  .ui-job__left2 {
    margin-left: auto;
    font-size: 12.5px;
    font-weight: 500;
    line-height: 24px;
    color: var(--m2-muted);
  }
  .ui-job__left2.is-red { color: var(--m2-red); }
  .ui-job__left2.is-orange { color: #e0700c; }
  .ui-job__left2.is-faint { color: var(--m2-muted); }

  .ui-job.ui-job--v2 .ui-job__h {
    margin: 0;
    font-size: 16.5px;
    line-height: 1.45;
    font-weight: 600;
    color: var(--m2-ink);
    letter-spacing: -.1px;
  }
  .ui-job.ui-job--v2 .ui-job__title {
    color: inherit;
    text-decoration: none;
  }
  .ui-job.ui-job--v2 .ui-job__top {
    display: inline-block;
    height: 20px;
    margin-right: 6px;
    padding: 0 6px;
    border-radius: 5px;
    background: var(--m2-red-bg);
    font-size: 11px;
    font-weight: 500;
    line-height: 20px;
    color: var(--m2-red);
    vertical-align: 2px;
  }

  /* 条件行：地市 · 学历 · 招 N 人
     ⚠️ !important 是被逼的：card-v2.css 里那段移动端「三项胶囊」老改版写着
        .ui-job--v2 .ui-job__facts { display:none !important }，
        不加 !important 这里永远压不过它（踩过：首页卡片条件行整行消失）。 */
  .ui-job.ui-job--v2 .ui-job__facts {
    display: flex !important;
    margin: 7px 0 0;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0;
    font-size: 12.5px;
    line-height: 1.6;
    color: var(--m2-muted);
  }
  .ui-job.ui-job--v2 .ui-job__f {
    border: 0;
    padding: 0;
    background: none;
    font-size: 12.5px;
    color: var(--m2-muted);
    line-height: 1.6;
  }
  .ui-job.ui-job--v2 .ui-job__f + .ui-job__f::before {
    content: "·";
    margin: 0 5px;
    color: #c3cbd8;
  }
  /* 移动端条件行：首页版保留「城市 · 单位性质 · 学历」（设计稿第 1 屏口径），
     人数在这一屏不出现 —— 它由列表版的条件行负责。 */
  .ui-jobs--home .ui-job.ui-job--v2 .ui-job__f.is-hc { display: none; }

  /* 列表版（设计稿第 2 屏：城市 · 学历 · 招 N 人）：换用 __facts2 */
  .ui-jobs--list .ui-job.ui-job--v2 .ui-job__facts { display: none !important; }
  .ui-jobs--list .ui-job.ui-job--v2 .ui-job__f.is-typ { display: none; }
  .ui-jobs--list .ui-job__facts2 {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    margin: 7px 0 0;
    font-size: 12.5px;
    line-height: 1.6;
    color: var(--m2-muted);
  }
  .ui-jobs--list .ui-job__facts2 span + span::before {
    content: "·";
    margin: 0 5px;
    color: #c3cbd8;
  }

  .ui-job.ui-job--v2 .ui-job__sum,
  .ui-job.ui-job--v2 .ui-job__match,
  .ui-job.ui-job--v2 .ui-job__mob {
    display: none;
  }

  /* 底行：报名截止 + 查看公告 */
  .ui-job__m2foot {
    display: flex;
    align-items: center;
    margin-top: 9px;
    font-size: 12.5px;
    line-height: 1.5;
  }
  .ui-job__dl {
    color: var(--m2-sub);
  }
  .ui-job__dl.is-red {
    color: var(--m2-red);
    font-weight: 500;
  }
  .ui-job__more {
    margin-left: auto;
    color: var(--m2-blue);
    font-size: 13px;
    text-decoration: none;
    white-space: nowrap;
  }
  .ui-job__more::after {
    content: "›";
    margin-left: 3px;
  }

  /* ==========================================================
     六、CTA 卡（168 条公告正在报名）
     ========================================================== */
  .m2-cta {
    margin: 20px 0 0;
    padding: 18px 18px 18px;
    border-radius: var(--m2-r-card);
    background: linear-gradient(135deg, #1b5bd6 0%, #11408f 100%);
    color: #fff;
  }
  .m2-cta__title {
    font-size: 18px;
    font-weight: 700;
    line-height: 1.4;
  }
  .m2-cta__desc {
    margin-top: 6px;
    font-size: 12.5px;
    line-height: 1.65;
    color: rgba(255, 255, 255, .78);
  }
  .m2-cta__btn {
    display: block;
    margin-top: 14px;
    height: 46px;
    border-radius: 10px;
    background: #fff;
    font-size: 15px;
    font-weight: 600;
    line-height: 46px;
    color: var(--m2-blue);
    text-align: center;
    text-decoration: none;
  }
  .m2-cta__btn:active { background: #f2f6ff; }

  /* ==========================================================
     七、页脚（深蓝，免责声明）
     ========================================================== */
  .ui-footer {
    margin-top: 24px;
    padding: 0;
    background: #0e2a47;
    border: 0;
    border-radius: 0;
  }
  .ui-footer > .ui-container {
    padding: 22px 0 24px;
  }
  /* 页脚上半部分的站点导航列在移动端折叠掉，只留免责声明区 */
  .ui-footer__grid,
  .ui-footer__cols,
  .ui-footer__nav,
  .ui-footer__brand,
  .ui-footer__top { display: none; }
  /* 旧的 __bottom 两行（版权 + 提示）由设计稿的 .m2-disc 取代 */
  .ui-footer__bottom { display: none; }

  .m2-disc { display: block; }
  /* 详情页去掉整个底部 footer（深蓝底 + m2-disc 信息条），避免留空深蓝块 */
  body.is-detail .ui-footer { display: none; }
  .m2-disc__brand {
    font-size: 13.5px;
    font-weight: 600;
    line-height: 1.55;
    color: #fff;
    letter-spacing: .2px;
  }
  .m2-disc__h {
    margin: 14px 0 6px;
    font-size: 12.5px;
    font-weight: 400;
    color: #dce6f2;
  }
  .m2-disc__p {
    margin: 0;
    font-size: 12px;
    line-height: 1.85;
    color: #8ea3bd;
  }
  .m2-disc__warn {
    margin: 12px 0 0;
    font-size: 12.5px;
    font-weight: 600;
    line-height: 1.7;
    color: #f0c063;
  }
  .m2-disc__meta {
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px solid rgba(255, 255, 255, .1);
    font-size: 11.5px;
    line-height: 1.9;
    color: #7b90a9;
  }
  .m2-disc__meta span { display: block; }

  /* ==========================================================
     八、底部标签栏（4 项，选中为白色胶囊）
     ========================================================== */
  .ui-tabbar {
    display: block;
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 90;
    padding: 0 0 env(safe-area-inset-bottom);
    background: #f4f6fa;
    border-top: 1px solid rgba(14, 27, 46, .06);
    box-shadow: 0 -2px 14px -8px rgba(14, 27, 46, .18);
  }
  .ui-tabbar__inner {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0;
    max-width: none;
    margin: 0;
    padding: 7px 10px 6px;
    background: none;
  }
  .ui-tabbar__item {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 3px;
    height: 52px;
    padding: 0;
    border: 0;
    border-radius: 26px;
    background: none;
    font-size: 11.5px;
    font-weight: 500;
    line-height: 1.2;
    color: #6b7688;
    text-decoration: none;
    -webkit-tap-highlight-color: transparent;
  }
  .ui-tabbar__item svg {
    width: 21px;
    height: 21px;
    stroke-width: 1.7;
  }
  .ui-tabbar__item.is-on {
    background: #fff;
    color: var(--m2-blue);
    font-weight: 600;
    box-shadow: 0 2px 10px -3px rgba(14, 27, 46, .16);
  }
  .ui-tabbar__item.is-on svg {
    stroke-width: 1.9;
  }

  /* 有标签栏的页面，底部留出空间（避免最后一张卡被遮挡） */
  body.ui-page {
    padding-bottom: calc(70px + env(safe-area-inset-bottom));
  }
  .is-detail body.ui-page,
  body.ui-page.is-detail {
    padding-bottom: calc(84px + env(safe-area-inset-bottom));
  }

  /* ==========================================================
     九、首页列表区收尾（排序 tabs / 更多按钮 / CTA / 侧栏）
     ========================================================== */

  /* 列表区标题：设计稿把标题并入排序 tabs，这里只留 tabs 一行 */
  .ui-section__head--list { display: none; }
  .ui-job__m2head { display: flex; }
  .ui-job__m2foot { display: flex; }

  /* 排序条 → 设计稿 tabs */
  .ui-sortbar {
    display: flex;
    align-items: center;
    gap: 22px;
    margin: 0 0 12px;
    padding: 0;
    border: 0;
    background: none;
    overflow: visible;
  }
  .ui-sortbar__item {
    position: relative;
    flex: 0 0 auto;
    height: auto;
    padding: 0 0 8px;
    border: 0;
    border-radius: 0;
    background: none;
    font-size: 16.5px;
    font-weight: 500;
    line-height: 1.4;
    color: var(--m2-muted);
  }
  .ui-sortbar__item.is-on {
    color: var(--m2-ink);
    font-weight: 700;
  }
  .ui-sortbar__item.is-on::after {
    content: "";
    position: absolute;
    left: 50%;
    bottom: 0;
    width: 22px;
    height: 3px;
    margin-left: -11px;
    border-radius: 2px;
    background: var(--m2-blue);
  }
  .ui-sortbar__right { display: none; }
  .ui-sortbar__total {
    margin-left: auto;
    font-size: 12.5px;
    font-weight: 400;
    color: var(--m2-muted);
  }

  /* 地区：桌面是竖排卡片，移动端压成单行胶囊（设计稿无条数） */
  .ui-region {
    display: inline-flex;
    align-items: center;
    gap: 0;
    height: 34px;
    padding: 0 16px;
    border: 1px solid var(--m2-line-2);
    border-radius: var(--m2-r-pill);
    background: #fff;
  }
  .ui-region__name {
    font-size: 13.5px;
    font-weight: 400;
    color: var(--m2-ink);
    line-height: 32px;
  }
  .ui-region__meta { display: none; }
  .ui-regions__note { display: none; }
  .ui-region.is-on {
    background: var(--m2-blue);
    border-color: var(--m2-blue);
  }
  .ui-region.is-on .ui-region__name { color: #fff; font-weight: 500; }

  /* 单位性质 4 列白卡（顶部） */
  .ui-types {
    display: block;
    margin: 12px 20px 0;
    padding: 16px 6px;
    background: var(--m2-card);
    border-radius: var(--m2-r-card);
    box-shadow: var(--m2-shadow);
  }

  /* 侧栏：设计稿移动端只有 CTA，其余卡片收起 */
  .ui-layout {
    display: block;
  }
  .ui-layout > aside {
    display: block;
    margin: 20px 0 0;
    padding: 0;
  }
  .ui-layout > aside > .ui-card { display: none; }

  /* CTA 卡 */
  .ui-cta {
    margin: 0;
    padding: 18px;
    border: 0;
    border-radius: var(--m2-r-card);
    background: linear-gradient(135deg, #1b5bd6 0%, #11408f 100%);
    box-shadow: none;
  }
  .ui-cta__title {
    margin: 0;
    font-size: 18px;
    font-weight: 700;
    line-height: 1.4;
    color: #fff;
  }
  .ui-cta__desc {
    margin: 6px 0 0;
    font-size: 12.5px;
    line-height: 1.65;
    color: rgba(255, 255, 255, .78);
  }
  .ui-cta .ui-btn,
  .ui-cta .ui-btn--white {
    display: block;
    width: 100%;
    height: 46px;
    margin-top: 14px;
    padding: 0;
    border: 0;
    border-radius: 10px;
    background: #fff;
    font-size: 15px;
    font-weight: 600;
    line-height: 46px;
    color: var(--m2-blue);
    text-align: center;
  }

  /* 分页器 → 「查看更多」 */
  .ui-pager { display: none; }
  .m2-more {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    height: 50px;
    margin: 14px 0 0;
    border-radius: var(--m2-r-ctrl);
    background: #fff;
    box-shadow: var(--m2-shadow);
    font-size: 15px;
    font-weight: 600;
    color: var(--m2-blue);
    text-decoration: none;
  }
  .m2-more svg {
    width: 17px;
    height: 17px;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
  }
  .m2-more:active { background: #f7f9fc; }
  /* 无限滚动 sentinel：空内容时矮到几乎不可见（触底触发器），
     有文字（加载中 / 加载失败重试）时才展开成正常卡片。 */
  .m2-more--auto { height: 6px; margin: 0; background: transparent;
    box-shadow: none; border-radius: 0; }
  .m2-more--auto:not(:empty) { height: 50px; margin: 14px 0 0;
    border-radius: var(--m2-r-ctrl); background: #fff;
    box-shadow: var(--m2-shadow); }
  .m2-shown {
    display: block;
    margin: 18px 0 0;
    text-align: center;
    font-size: 12.5px;
    line-height: 1.7;
    color: var(--m2-muted);
  }
  .m2-more__note {
    display: block;
    margin: 14px 0 0;
    text-align: center;
    font-size: 12.5px;
    line-height: 1.7;
    color: var(--m2-muted);
  }

  /* 地区总览页：页面底灰，区块自带的白底要去掉，白卡才浮得起来 */
  body.is-region { background: var(--m2-bg); }
  body.is-region .ui-section--region {
    background: none;
    padding: 16px 0 0;
    margin: 0;
  }

  /* 我的 / 反馈 / 收藏：容器内边距 */
  .m2-mine { padding: 14px 16px 24px; }
  .m2-hero--mine { padding-bottom: 18px; }

  /* ==========================================================
     十、收口修正
     ========================================================== */

  /* 设计稿没有白色站内导航条：品牌位由 hero 里的 .m2-top 承担 */
  .ui-nav { display: none; }

  /* 热门搜索只占一行（横滑），不能被挤成两行 */
  .ui-hot { flex-wrap: nowrap; }

  /* 排序 tabs 在 390 宽下 3 项 + 总数要放得下 */
  .ui-sortbar,
  .ui-tabs { gap: 18px; }
  .ui-sortbar__item,
  .ui-tabs__item,
  .ui-tabs a { font-size: 15.5px; }

  /* hero 顶部贴合屏幕（设计稿 header 直接顶到状态栏） */
  .ui-hero { margin-top: 0; }

  /* ==========================================================
     十一、公告详情页（设计稿第 6 屏）
     结构沿用详情页原有的 .m-bar / .m-deadline / .keyinfo / .m-cta，
     这里只换皮（配色、圆角、留白），并补 .m-deadline 里的三栏事实。
     body 背景从纯白改成页面底灰，白卡才立得起来。
     ========================================================== */
  body.is-detail,
  body.is-detail.ui-page { background: var(--m2-bg); }

  /* 顶部栏：深蓝底 + 白字（原来是半透明白底） */
  .m-bar {
    background: var(--m2-blue);
    border-bottom: 0;
    height: 50px;
    padding: 0 8px;
    backdrop-filter: none;
  }
  .m-bar-btn {
    width: 34px;
    height: 34px;
    border-radius: 10px;
    background: none;
    color: #fff;
  }
  .m-bar-btn:active { background: rgba(255, 255, 255, .16); }
  .m-bar-title {
    font-size: 16px;
    font-weight: 600;
    color: #fff;
  }
  /* 设计稿顶部右侧只有一个键：分享留在这里，
     复制链接有「分享」兜底，收起来；「生成海报」是核心功能，不能砍，留在原位。 */
  .m-bar-actions [data-copy] { display: none; }

  .detail-wrap { padding: 12px 16px 26px; }
  .detail-main {
    padding: 0;
    background: none;
    box-shadow: none;
  }

  /* 标题卡 */
  .detail-head {
    padding: 16px 16px 15px;
    border-radius: var(--m2-r-card);
    background: #fff;
    box-shadow: var(--m2-shadow);
  }
  .detail-head .card-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 12px;
  }
  .detail-head .badge {
    height: 24px;
    padding: 0 10px;
    border: 0;
    border-radius: 7px;
    background: var(--m2-soft);
    font-size: 12px;
    font-weight: 500;
    line-height: 24px;
    color: var(--m2-blue);
  }
  .detail-head .badge-top {
    background: var(--m2-red-bg);
    color: var(--m2-red);
  }
  /* 设计稿没有「城市·区县」标签（地市信息在正文三栏的「工作地点」里） */
  .detail-head .badge-city { display: none; }
  /* 报名状态：浅橙底胶囊，代替原来隐掉的状态 */
  .detail-head .state {
    display: inline-flex;
    align-items: center;
    height: 24px;
    padding: 0 10px;
    border-radius: 7px;
    background: var(--m2-red-bg);
    font-size: 12px;
    font-weight: 500;
    line-height: 24px;
    color: var(--m2-red);
  }
  .detail-head .state-green,
  .detail-head .state-blue {
    background: var(--m2-red-bg);
    color: var(--m2-red);
  }
  .detail-head .state-muted,
  .detail-head .state-gray {
    background: #eef1f6;
    color: var(--m2-muted);
  }
  .m2-stateleft { display: inline; font-weight: 400; }

  .detail-head h1 {
    margin: 0;
    font-size: 21px;
    line-height: 1.45;
    font-weight: 700;
    color: var(--m2-ink);
    letter-spacing: -.2px;
  }
  .detail-sub {
    margin-top: 11px;
    font-size: 12px;
    color: var(--m2-muted);
  }

  /* 报名截止卡：浅红底 + 红色日期 + 红色胶囊剩余天数 */
  .m-deadline {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    margin-top: 12px;
    padding: 14px 16px 15px;
    border-radius: var(--m2-r-card);
    background: #fff;
    box-shadow: var(--m2-shadow);
  }
  /* 设计稿：白色卡片内嵌浅红提示块，包住「报名截止 + 日期 + 剩N天徽章」 */
  .m-dl-top {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 14px 16px;
    border-radius: 14px;
    background: var(--m2-red-bg);
  }
  .m-dl-main { flex: 1 1 auto; min-width: 0; }
  .m-dl-main span { font-size: 14px; color: var(--m2-red); opacity: .9; }
  .m-dl-main b {
    display: block;
    margin-top: 4px;
    font-size: 17px;
    font-weight: 700;
    color: var(--m2-red);
    letter-spacing: 0;
  }
  .m-dl-badge {
    width: auto;
    height: 44px;
    min-width: 96px;
    margin-left: 0;
    flex-shrink: 0;
    flex-direction: column;
    justify-content: center;
    gap: 0;
    padding: 0 16px;
    border-radius: 14px;
    background: var(--m2-red);
    box-shadow: 0 4px 12px rgba(217, 58, 43, .28);
    font-size: 12px;
    font-weight: 600;
    letter-spacing: .3px;
    text-align: center;
  }
  .m-dl-badge b { font-size: 20px; line-height: 1.1; font-weight: 800; }
  .m-dl-badge span { font-size: 11px; opacity: .92; line-height: 1.1; margin-top: 1px; }
  /* style.css 里还有一套旧版移动端 .m-deadline（琥珀/浅红整卡），
     特异性同为 .m-deadline.is-*，这里用同等特异性 + 后加载优势压回白卡结构 */
  .m-deadline.is-ending { background: #fff; }
  .m-deadline.is-ending .m-dl-top { background: var(--m2-red-bg); }
  .m-deadline.is-ending .m-dl-main span,
  .m-deadline.is-ending .m-dl-main b { color: var(--m2-red); }
  .m-deadline.is-ending .m-dl-badge { background: var(--m2-red); box-shadow: 0 4px 12px rgba(217, 58, 43, .28); }
  .m-deadline.is-over { background: #fff; }
  .m-deadline.is-over .m-dl-top { background: #eef1f6; }
  .m-deadline.is-over .m-dl-main span,
  .m-deadline.is-over .m-dl-main b { color: var(--m2-muted); }
  .m-deadline.is-over .m-dl-badge { background: #9aa7b8; box-shadow: none; }

  /* 三栏事实（招录人数 / 学历要求 / 工作地点）挂在截止卡里 —— 设计稿是同一张卡 */
  .m2-dfacts {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 16px;
    margin-top: 8px;
    padding-top: 2px;
  }
  .m2-dfacts__i { min-width: 0; }
  .m2-dfacts__k {
    display: block;
    font-size: 13px;
    color: var(--m2-muted);
  }
  .m2-dfacts__v {
    display: block;
    margin-top: 3px;
    font-size: 13.5px;
    font-weight: 600;
    color: var(--m2-ink);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  /* 原来的六格关键信息在移动端收起（与上面三栏重复） */
  .keyinfo { display: none; }

  /* 状态提示条（已截止/即将开始）：设计稿没有这块，但信息有价值，
     收成一张同圆角的浅色卡，别让它像裸文字挂在灰底上 */
  .notice {
    margin-top: 12px;
    padding: 12px 14px;
    border: 0;
    border-left: 0;
    border-radius: 12px;
    background: var(--m2-soft);
    font-size: 12.5px;
    line-height: 1.7;
    color: #2c4a78;
  }
  .notice-muted { background: #eef1f6; color: var(--m2-sub); }
  .notice-warn { background: var(--m2-red-bg); color: var(--m2-red); }
  .notice-info { background: var(--m2-soft); color: #2c4a78; }

  /* 正文卡 */
  .article {
    margin-top: 12px;
    padding: 16px;
    border-radius: var(--m2-r-card);
    background: #fff;
    box-shadow: var(--m2-shadow);
    font-size: 15px;
    line-height: 1.85;
    color: var(--m2-sub);
  }
  .article h3 {
    margin: 20px 0 8px;
    font-size: 16px;
    font-weight: 700;
    color: var(--m2-ink);
  }
  .article h3:first-child { margin-top: 0; }

  /* 附件卡（设计稿：白卡 + 浅灰行 + 蓝色下载图标） */
  .attach-box {
    margin-top: 12px;
    padding: 16px;
    border: 0;
    border-radius: var(--m2-r-card);
    background: #fff;
    box-shadow: var(--m2-shadow);
  }
  .attach-head {
    margin-bottom: 12px;
  }
  .attach-head svg { display: none; }
  .attach-head h2 {
    font-size: 15px;
    font-weight: 700;
    color: var(--m2-ink);
  }
  .attach-count {
    margin-left: auto;
    font-size: 12px;
    color: var(--m2-muted);
  }
  .attach-list { margin: 0; padding: 0; }
  .attach-item {
    align-items: center;
    gap: 10px;
    padding: 11px 12px;
    margin-bottom: 8px;
    border: 0;
    border-radius: 12px;
    background: var(--m2-field);
  }
  .attach-item:last-child { margin-bottom: 0; }
  .attach-ext { display: none; }
  .attach-item::before {
    content: "";
    flex: 0 0 auto;
    width: 17px;
    height: 17px;
    background: currentColor;
    color: var(--m2-blue);
    -webkit-mask: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231b5bd6' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14 3.5H7.4a2 2 0 0 0-2 2v13a2 2 0 0 0 2 2h9.2a2 2 0 0 0 2-2V8z'/%3E%3Cpath d='M14 3.5V8h4.6'/%3E%3C/svg%3E") center/contain no-repeat;
    mask: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231b5bd6' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14 3.5H7.4a2 2 0 0 0-2 2v13a2 2 0 0 0 2 2h9.2a2 2 0 0 0 2-2V8z'/%3E%3Cpath d='M14 3.5V8h4.6'/%3E%3C/svg%3E") center/contain no-repeat;
  }
  .attach-name {
    flex: 1 1 auto;
    min-width: 0;
    font-size: 13.5px;
    font-weight: 500;
    color: var(--m2-ink);
    text-decoration: none;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .attach-dl {
    flex: 0 0 auto;
    width: 18px;
    height: 18px;
    font-size: 0;
    line-height: 0;
    color: var(--m2-blue);
    background: currentColor;
    -webkit-mask: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231b5bd6' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 4v11'/%3E%3Cpath d='m7.6 10.6 4.4 4.4 4.4-4.4'/%3E%3Cpath d='M5 19.5h14'/%3E%3C/svg%3E") center/contain no-repeat;
    mask: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231b5bd6' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 4v11'/%3E%3Cpath d='m7.6 10.6 4.4 4.4 4.4-4.4'/%3E%3Cpath d='M5 19.5h14'/%3E%3C/svg%3E") center/contain no-repeat;
  }
  .attach-tip { display: none; }

  /* 相关公告卡：把右栏（移动端隐藏）里的推荐提到正文下方 */
  .m2-related {
    display: block;
    margin-top: 12px;
    padding: 16px;
    border-radius: var(--m2-r-card);
    background: #fff;
    box-shadow: var(--m2-shadow);
  }
  .m2-related__hd {
    display: flex;
    align-items: center;
    margin-bottom: 4px;
  }
  .m2-related__t {
    margin: 0;
    font-size: 15px;
    font-weight: 700;
    color: var(--m2-ink);
  }
  .m2-related__more {
    margin-left: auto;
    font-size: 13px;
    color: var(--m2-blue);
    text-decoration: none;
  }
  .m2-related__row {
    display: block;
    padding: 11px 0;
    border-top: 1px solid var(--m2-line);
    text-decoration: none;
  }
  .m2-related__row:first-of-type { border-top: 0; }
  .m2-related__title {
    display: block;
    font-size: 14.5px;
    font-weight: 600;
    line-height: 1.5;
    color: var(--m2-ink);
  }
  .m2-related__meta {
    display: block;
    margin-top: 4px;
    font-size: 12px;
    color: var(--m2-muted);
  }

  /* 页脚说明 + 底部行动条 */
  .m2-footnote {
    display: block;
    margin: 14px 0 0;
    text-align: center;
    font-size: 12px;
    line-height: 1.7;
    color: var(--m2-muted);
  }

  .m-cta {
    gap: 8px;
    padding: 8px 12px calc(8px + env(safe-area-inset-bottom));
    background: rgba(255, 255, 255, .98);
    border-top: 1px solid var(--m2-line-2);
    box-shadow: 0 -2px 12px -6px rgba(14, 27, 46, .2);
  }
  .m-cta-btn2 {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
    min-width: 72px;
    height: 44px;
    padding: 0 12px;
    border: 1px solid var(--m2-line-2);
    border-radius: 12px;
    background: #fff;
    font-size: 13px;
    font-weight: 500;
    color: var(--m2-sub);
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
  }
  .m-cta-btn2:active { background: #f7f9fc; }
  .m-cta-btn2 svg {
    width: 16px;
    height: 16px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
  }
  .m-cta-btn2.is-on { color: var(--m2-blue); border-color: #b9cff2; background: var(--m2-soft); }
  .m-cta-btn2.is-on svg { fill: var(--m2-blue); stroke: var(--m2-blue); }
  .m-cta-btn {
    flex: 1 1 auto;
    height: 44px;
    border-radius: 12px;
    background: var(--m2-blue);
    font-size: 15px;
    font-weight: 600;
    box-shadow: 0 6px 16px -8px rgba(27, 91, 214, .8);
  }
  .m-cta-btn:active { background: var(--m2-blue-press); }

  /* 详情页底部不需要标签栏（有行动条），正文再补 12px 收尾 */
  body.is-detail .ui-tabbar { display: none; }
  body.is-detail { padding-bottom: calc(76px + env(safe-area-inset-bottom)); }

}