/* ==========================================================================
   速才 · 浙江人才政策信息服务平台 — 设计系统 v1.0
   设计原则：高信息密度 / 低视觉噪音 / 清爽政务风 / 转化导向
   使用方式：所有页面只允许引用本文件的变量与类名，禁止页面内自造样式
   ========================================================================== */

:root {
  /* ---------- 品牌色 ---------- */
  --brand:        #1B6EF3;   /* 主色：政务蓝 */
  --brand-deep:   #0D4FD6;
  --brand-grad:   linear-gradient(165deg, #2E84FF 0%, #0D4FD6 100%);
  --cta:          #FF6A3D;   /* 转化橙：仅用于咨询/办理按钮 */
  --cta-grad:     linear-gradient(135deg, #FF8A50 0%, #FF5A26 100%);

  /* ---------- 中性色 ---------- */
  --bg:           #F3F5F9;   /* 页面底色 */
  --card:         #FFFFFF;
  --ink-1:        #171B26;   /* 主标题 */
  --ink-2:        #565D6E;   /* 正文/次要 */
  --ink-3:        #9BA1B1;   /* 辅助/时间/来源 */
  --line:         #EDF0F6;   /* 分割线 */

  /* ---------- 语义标签色（浅底深字，禁止实心大色块） ---------- */
  --tag-blue-bg:   #EAF2FF;  --tag-blue:   #1B6EF3;
  --tag-green-bg:  #E6F7EF;  --tag-green:  #0A9E66;
  --tag-orange-bg: #FFF1E7;  --tag-orange: #EE7A1A;
  --tag-purple-bg: #F1EDFF;  --tag-purple: #6A4FE0;
  --tag-red-bg:    #FDECEC;  --tag-red:    #E0463C;

  /* ---------- 字号阶梯（全平台只允许这 5 档） ---------- */
  --fs-hero:   20px;  /* 页头主标语 */
  --fs-title:  17px;  /* 页面标题/模块标题 */
  --fs-card:   15px;  /* 卡片标题 */
  --fs-body:   14px;  /* 正文 */
  --fs-meta:   12px;  /* 辅助信息 */

  /* ---------- 间距阶梯（4 的倍数，只允许这些值） ---------- */
  --sp-1: 4px;  --sp-2: 8px;  --sp-3: 12px;  --sp-4: 16px;  --sp-5: 20px;  --sp-6: 24px;

  /* ---------- 圆角 ---------- */
  --r-lg: 14px;  --r-md: 10px;  --r-sm: 6px;  --r-pill: 999px;

  /* ---------- 阴影（轻量，禁止厚重投影） ---------- */
  --shadow-card: 0 1px 2px rgba(23,32,60,.04), 0 6px 16px rgba(23,32,60,.05);
  --shadow-cta:  var(--shadow-card);
  --shadow-bar:  var(--shadow-card);

  /* ---------- 稳定组件尺寸 ---------- */
  --content-max: 480px;
  --touch-size: 44px;
  --nav-icon-size: 46px;
  --brand-mark-size: 34px;
  --tabbar-size: 64px;
  --notice-overlap: -34px;
  --hero-bg: var(--brand-grad);
  --hero-ink: var(--card);
}

/* ============================ 基础重置 ============================ */
* { margin: 0; padding: 0; box-sizing: border-box; -webkit-tap-highlight-color: transparent; }
html { font-size: var(--fs-body); }
body {
  font-family: -apple-system, BlinkMacSystemFont, "PingFang SC", "HarmonyOS Sans SC", "Microsoft YaHei", sans-serif;
  background: var(--bg);
  color: var(--ink-1);
  line-height: 1.65;
  -webkit-font-smoothing: antialiased;
}
a { text-decoration: none; color: inherit; }
img { max-width: 100%; display: block; }
button { font-family: inherit; border: none; background: none; cursor: pointer; }

/* 移动端容器：桌面预览时呈现"手机"效果 */
.container {
  max-width: var(--content-max);
  margin: 0 auto;
  min-height: 100vh;
  background: var(--bg);
  box-shadow: none;
  position: relative;
  padding-bottom: calc(var(--tabbar-size) + env(safe-area-inset-bottom));
}

/* ============================ 页头（品牌区） ============================ */
.page-hero {
  background: var(--hero-bg);
  padding: var(--sp-5) var(--sp-4) calc(var(--sp-6) + var(--sp-6));
  border-radius: 0 0 22px 22px;
  color: var(--ink-1);
}
.hero-brand { display: flex; align-items: center; gap: var(--sp-2); }
.hero-logo {
  width: 34px; height: 34px; border-radius: 9px;
  background: rgba(255,255,255,.18);
  border: 1px solid rgba(255,255,255,.35);
  display: flex; align-items: center; justify-content: center;
  font-size: var(--fs-card); font-weight: 700; letter-spacing: 1px;
}
.hero-name { font-size: var(--fs-title); font-weight: 700; color: var(--hero-ink); }
.hero-slogan { margin-top: var(--sp-3); font-size: var(--fs-hero); font-weight: 700; letter-spacing: .5px; color: var(--hero-ink); }
.hero-sub { margin-top: 3px; font-size: var(--fs-meta); color: var(--ink-2); }
.hero-support { margin-top: 5px; font-size: var(--fs-meta); color: rgba(255,255,255,.86); line-height: 1.5; }

/* 搜索框（嵌入页头） */
.search-bar {
  margin-top: var(--sp-4);
  display: flex; align-items: center; gap: var(--sp-2);
  background: #fff;
  border: 1px solid #E2EBFA;
  border-radius: var(--r-pill);
  padding: 9px var(--sp-4);
  box-shadow: 0 2px 8px rgba(46,123,240,.06);
}
.search-bar svg { flex: none; }
.search-bar input {
  flex: 1; border: none; outline: none;
  font-size: var(--fs-body); color: var(--ink-1); background: transparent;
}
.search-bar input::placeholder { color: var(--ink-3); }

/* 内页顶栏（非首页使用） */
.top-bar {
  background: var(--brand-grad);
  color: #fff;
  padding: var(--sp-4);
  display: flex; align-items: center; gap: var(--sp-3);
  position: sticky; top: 0; z-index: 20;
}
.top-bar .back {
  width: 30px; height: 30px; border-radius: var(--r-pill);
  background: rgba(255,255,255,.16);
  display: flex; align-items: center; justify-content: center;
  color: #fff; font-size: var(--fs-body);
}
.top-bar .top-title { font-size: var(--fs-title); font-weight: 600; flex: 1; }

/* ============================ 公告条 ============================ */
.notice-bar {
  margin: -34px var(--sp-4) 0;
  background: var(--card);
  border-radius: var(--r-lg);
  box-shadow: var(--shadow-card);
  display: flex; align-items: center; gap: var(--sp-2);
  padding: 10px var(--sp-3);
  position: relative; z-index: 2;
  overflow: hidden;
}
.notice-badge {
  flex: none;
  font-size: var(--fs-meta); font-weight: 600; color: var(--brand);
  background: var(--tag-blue-bg);
  border-radius: var(--r-sm);
  padding: 2px 7px;
}
.notice-text {
  flex: 1; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  font-size: var(--fs-meta); color: var(--ink-2);
}

/* ============================ 金刚区（栏目导航） ============================ */
.nav-grid {
  margin: var(--sp-3) var(--sp-4) 0;
  background: var(--card);
  border-radius: var(--r-lg);
  box-shadow: var(--shadow-card);
  padding: var(--sp-4) var(--sp-2);
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--sp-4) 0;
}
.nav-item { display: flex; flex-direction: column; align-items: center; gap: var(--sp-2); }
.nav-icon {
  width: 46px; height: 46px; border-radius: 13px;
  display: flex; align-items: center; justify-content: center;
  font-size: var(--fs-body); font-weight: 700; color: #fff; letter-spacing: 1px;
}
.nav-icon.c1 { background: linear-gradient(135deg,#4E9CFF,#1B6EF3); }
.nav-icon.c2 { background: linear-gradient(135deg,#3ECF9B,#0A9E66); }
.nav-icon.c3 { background: linear-gradient(135deg,#8F7BFF,#6A4FE0); }
.nav-icon.c4 { background: linear-gradient(135deg,#FFB054,#F07A1B); }
.nav-icon.c5 { background: linear-gradient(135deg,#FF8B7E,#E0463C); }
.nav-icon.c6 { background: linear-gradient(135deg,#3FC5E8,#0E93C4); }
.nav-label { font-size: var(--fs-meta); color: var(--ink-2); font-weight: 500; }

/* ============================ 数据速览条 ============================ */
.stats-row {
  margin: var(--sp-3) var(--sp-4) 0;
  display: flex; gap: var(--sp-3);
}
.stat-card {
  flex: 1;
  background: var(--card);
  border-radius: var(--r-md);
  box-shadow: var(--shadow-card);
  padding: var(--sp-3);
  text-align: center;
}
.stat-num { font-size: var(--fs-hero); font-weight: 700; color: var(--brand); font-variant-numeric: tabular-nums; }
.stat-num.orange { color: var(--cta); }
.stat-num.green { color: var(--tag-green); }
.stat-label { font-size: var(--fs-meta); color: var(--ink-3); margin-top: 1px; }

/* ============================ 模块标题 ============================ */
.section-head {
  margin: var(--sp-5) var(--sp-4) var(--sp-3);
  display: flex; align-items: center; justify-content: space-between;
}
.section-title {
  font-size: var(--fs-title); font-weight: 600;
  display: flex; align-items: center; gap: var(--sp-2);
}
.section-title::before {
  content: ""; width: 4px; height: 15px; border-radius: 2px;
  background: var(--brand-grad);
}
.section-more { font-size: var(--fs-meta); color: var(--ink-3); }

/* ============================ 信息卡片（核心组件） ============================ */
.post-list { margin: 0 var(--sp-4); display: flex; flex-direction: column; gap: var(--sp-3); }
.post-card {
  background: var(--card);
  border-radius: var(--r-lg);
  box-shadow: var(--shadow-card);
  padding: var(--sp-4);
  display: block;
}
.post-tags { display: flex; gap: var(--sp-2); margin-bottom: var(--sp-2); flex-wrap: wrap; }
.tag {
  font-size: var(--fs-meta); font-weight: 500;
  padding: 2px 8px; border-radius: var(--r-sm);
  line-height: 1.5;
}
.tag.blue   { background: var(--tag-blue-bg);   color: var(--tag-blue); }
.tag.green  { background: var(--tag-green-bg);  color: var(--tag-green); }
.tag.orange { background: var(--tag-orange-bg); color: var(--tag-orange); }
.tag.purple { background: var(--tag-purple-bg); color: var(--tag-purple); }
.tag.red    { background: var(--tag-red-bg);    color: var(--tag-red); }
.tag.plain  { background: #F2F4F8; color: var(--ink-2); }

.post-title {
  font-size: var(--fs-card); font-weight: 600; color: var(--ink-1);
  line-height: 1.5;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;
  overflow: hidden;
}
.post-desc {
  margin-top: var(--sp-1);
  font-size: var(--fs-meta); color: var(--ink-2);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.post-meta {
  margin-top: var(--sp-2);
  display: flex; align-items: center; gap: var(--sp-3);
  font-size: var(--fs-meta); color: var(--ink-3);
}
.talent-search-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: var(--sp-3);
}
.talent-search-head > div { min-width: 0; flex: 1; }
.talent-search-action {
  flex: 0 0 auto;
  padding: var(--sp-1) var(--sp-2);
  border-radius: var(--r-pill);
  background: var(--tag-blue-bg);
}
.talent-search-facts {
  margin-top: var(--sp-2);
  display: flex;
  flex-wrap: wrap;
  gap: var(--sp-2);
}
.talent-search-facts span {
  max-width: 100%;
  padding: var(--sp-1) var(--sp-2);
  border-radius: var(--r-sm);
  background: var(--bg);
  color: var(--ink-2);
  font-size: var(--fs-meta);
  line-height: 1.5;
}
.post-meta .dot { width: 3px; height: 3px; border-radius: 50%; background: var(--ink-3); opacity: .5; }

/* 补贴人员动态流 */
.subsidy-person-card {
  display: block;
  padding: var(--sp-4);
  background: var(--card);
  border-radius: var(--r-lg);
  box-shadow: var(--shadow-card);
  overflow: hidden;
}
.subsidy-person-head { display: flex; align-items: flex-start; gap: var(--sp-3); }
.subsidy-recipient { min-width: 0; flex: 1; }
.subsidy-person-name {
  font-size: var(--fs-card); font-weight: 600; color: var(--ink-1); line-height: 1.5;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.subsidy-recipient .post-tags { margin: var(--sp-1) 0 0; }
.subsidy-amount { flex: none; text-align: right; color: var(--brand); }
.subsidy-amount small { display: block; font-size: var(--fs-meta); color: var(--ink-3); font-weight: 400; }
.subsidy-amount b { display: block; font-size: var(--fs-title); font-weight: 700; font-variant-numeric: tabular-nums; }
.subsidy-type { margin-top: var(--sp-3); font-size: var(--fs-body); font-weight: 600; color: var(--ink-1); }
.subsidy-context {
  margin-top: var(--sp-1); font-size: var(--fs-meta); color: var(--ink-2); line-height: 1.5;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.subsidy-person-meta {
  display: flex; align-items: center; gap: var(--sp-3);
  margin-top: var(--sp-2); font-size: var(--fs-meta); color: var(--ink-3);
}
.subsidy-person-foot {
  display: flex; align-items: center; justify-content: space-between; gap: var(--sp-3);
  margin-top: var(--sp-3); padding-top: var(--sp-3); border-top: 1px solid var(--line);
  font-size: var(--fs-meta); color: var(--ink-3);
}
.subsidy-person-foot span:first-child { min-width: 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.subsidy-person-foot span:last-child { flex: none; color: var(--brand); }
.subsidy-detail-list { border-top: 1px solid var(--line); }
.subsidy-detail-row {
  display: flex; align-items: center; justify-content: space-between; gap: var(--sp-3);
  padding: var(--sp-3) 0; border-bottom: 1px solid var(--line);
}
.subsidy-detail-row > div { min-width: 0; }
.subsidy-detail-row b { display: block; font-size: var(--fs-body); font-weight: 600; }
.subsidy-detail-row span { display: block; font-size: var(--fs-meta); color: var(--ink-3); }
.subsidy-detail-row strong { flex: none; font-size: var(--fs-body); color: var(--brand); font-variant-numeric: tabular-nums; }
.subsidy-rise { animation: subsidy-rise .28s ease both; }
.subsidy-delay-1 { animation-delay: .05s; }
.subsidy-delay-2 { animation-delay: .1s; }
.subsidy-delay-3 { animation-delay: .15s; }
.subsidy-delay-4 { animation-delay: .2s; }
.subsidy-delay-5 { animation-delay: .25s; }
@keyframes subsidy-rise {
  from { opacity: 0; transform: translateY(var(--sp-2)); }
  to { opacity: 1; transform: translateY(0); }
}
@media (prefers-reduced-motion: reduce) {
  .subsidy-rise { animation: none; }
}
.subsidy-stream-card {
  margin: 0 var(--sp-4);
  background: var(--card);
  border-radius: var(--r-lg);
  box-shadow: var(--shadow-card);
  overflow: hidden;
}
.subsidy-stream-head {
  display: flex; align-items: center; justify-content: space-between;
  padding: var(--sp-2) var(--sp-4);
  font-size: var(--fs-meta); color: var(--ink-3);
}
.subsidy-stream-head b { font-size: var(--fs-card); color: var(--ink-1); font-weight: 600; }
.subsidy-stream-row {
  display: grid;
  grid-template-columns: calc(var(--sp-6) * 3) minmax(0, 1fr) auto auto;
  align-items: center; gap: var(--sp-2);
  padding: var(--sp-2) var(--sp-4);
  border-top: 1px solid var(--line);
}
.subsidy-stream-name,
.subsidy-stream-type { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.subsidy-stream-name { font-size: var(--fs-body); font-weight: 600; color: var(--ink-1); }
.subsidy-stream-type,
.subsidy-stream-date { font-size: var(--fs-meta); color: var(--ink-3); }
.subsidy-stream-row strong { font-size: var(--fs-body); color: var(--brand); font-weight: 600; font-variant-numeric: tabular-nums; }
.housing-subsidy-row { grid-template-columns: calc(var(--sp-6) * 3) minmax(0, 1fr) auto; }
.housing-subsidy-main { min-width: 0; display: flex; flex-direction: column; gap: var(--sp-1); }
.housing-subsidy-row .subsidy-stream-type { overflow: visible; white-space: normal; text-overflow: clip; color: var(--ink-2); line-height: 1.4; }
.housing-subsidy-row strong { white-space: nowrap; }
.skill-compact-list {
  margin: 0 var(--sp-4);
  background: var(--card);
  border-radius: var(--r-lg);
  box-shadow: var(--shadow-card);
  overflow: hidden;
}
.skill-compact-head {
  display: flex; align-items: center; justify-content: space-between;
  padding: var(--sp-2) var(--sp-4);
  font-size: var(--fs-meta); color: var(--ink-3);
}
.skill-compact-head b { font-size: var(--fs-card); color: var(--ink-1); font-weight: 600; }
.skill-compact-row { display: block; padding: var(--sp-2) var(--sp-4); border-top: 1px solid var(--line); }
.skill-compact-top { display: flex; align-items: center; gap: var(--sp-2); min-width: 0; }
.skill-compact-top .tag { flex: none; }
.skill-compact-top b {
  min-width: 0; flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;
  font-size: var(--fs-body); color: var(--ink-1); font-weight: 600;
}
.skill-compact-bottom { display: flex; align-items: center; gap: var(--sp-2); margin-top: var(--sp-1); }
.skill-compact-profession { min-width: 0; flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; font-size: var(--fs-meta); color: var(--ink-2); }
.skill-compact-time { flex: none; font-size: var(--fs-meta); color: var(--ink-2); font-variant-numeric: tabular-nums; }
.skill-compact-time i,
.skill-compact-time em { font-style: normal; color: var(--ink-3); }
.skill-deadline-row {
  display: grid;
  grid-template-columns: calc(var(--sp-6) * 3) minmax(0, 1fr);
  align-items: center; gap: var(--sp-3);
  padding: var(--sp-2) var(--sp-4);
  border-top: 1px solid var(--line);
}
.skill-deadline-count {
  border-radius: var(--r-md); padding: var(--sp-2) var(--sp-1); text-align: center;
  background: var(--tag-blue-bg); color: var(--tag-blue);
}
.skill-deadline-count.urgent { background: var(--tag-red-bg); color: var(--tag-red); }
.skill-deadline-count.soon { background: var(--tag-orange-bg); color: var(--tag-orange); }
.skill-deadline-count.plain { background: var(--bg); color: var(--ink-3); }
.skill-deadline-count strong { display: block; font-size: var(--fs-card); line-height: 1.4; font-weight: 700; white-space: nowrap; }
.skill-deadline-count span { display: block; font-size: var(--fs-meta); }
.skill-deadline-main { min-width: 0; }
.skill-deadline-profession { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; font-size: var(--fs-card); color: var(--ink-1); font-weight: 600; }
.skill-deadline-tags { display: flex; align-items: center; gap: var(--sp-1); margin-top: var(--sp-1); }
.skill-deadline-time { display: flex; align-items: center; gap: var(--sp-1); margin-top: var(--sp-1); font-size: var(--fs-meta); color: var(--ink-2); font-variant-numeric: tabular-nums; white-space: nowrap; }
.skill-deadline-time em { font-style: normal; color: var(--ink-3); }
.skill-deadline-time b { color: var(--ink-1); font-weight: 600; }
.title-deadline-row { align-items: start; }
.title-deadline-name {
  white-space: normal;
  line-height: 1.45;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}
.skill-deadline-footer { display: flex; align-items: center; justify-content: space-between; gap: var(--sp-2); }
.skill-deadline-footer .skill-deadline-time { min-width: 0; }
.skill-detail-link {
  flex: none;
  color: var(--brand);
  background: var(--tag-blue-bg);
  border-radius: var(--r-sm);
  padding: var(--sp-1) var(--sp-2);
  font-size: var(--fs-meta);
  font-weight: 600;
}

/* ============================ 横向滑动专区 ============================ */
.h-scroll {
  display: flex; gap: var(--sp-3);
  padding: 0 var(--sp-4) var(--sp-1);
  overflow-x: auto;
  scrollbar-width: none;
}
.h-scroll::-webkit-scrollbar { display: none; }
.h-card {
  flex: none; width: 250px;
  background: var(--card);
  border-radius: var(--r-lg);
  box-shadow: var(--shadow-card);
  padding: var(--sp-4);
}
.h-card .h-top { display: flex; justify-content: space-between; align-items: center; margin-bottom: var(--sp-2); }
.h-card .h-title { font-size: var(--fs-body); font-weight: 600; line-height: 1.45;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.h-card .h-meta { margin-top: var(--sp-2); font-size: var(--fs-meta); color: var(--ink-3); }

/* ============================ 分类 Tab / 筛选 chips ============================ */
.cat-tabs {
  background: var(--card);
  display: flex;
  padding: 0 var(--sp-4);
  border-bottom: 1px solid var(--line);
  position: sticky; top: 62px; z-index: 15;
}
.cat-tab {
  flex: 1; text-align: center;
  padding: var(--sp-3) 0 10px;
  font-size: var(--fs-body); color: var(--ink-2);
  position: relative;
}
.cat-tab.active { color: var(--brand); font-weight: 600; }
.cat-tab.active::after {
  content: ""; position: absolute; left: 50%; bottom: 0; transform: translateX(-50%);
  width: 24px; height: 3px; border-radius: 2px; background: var(--brand);
}
.chip-row {
  display: flex; gap: var(--sp-2);
  padding: var(--sp-3) var(--sp-4);
  overflow-x: auto; scrollbar-width: none;
}
.chip-row::-webkit-scrollbar { display: none; }
.chip {
  flex: none;
  font-size: var(--fs-meta); color: var(--ink-2);
  background: var(--card);
  border: 1px solid var(--line);
  padding: 5px 12px; border-radius: var(--r-pill);
}
.chip.active { background: var(--tag-blue-bg); color: var(--brand); border-color: transparent; font-weight: 500; }
.region-filter-bar {
  display: flex;
  align-items: center;
  gap: var(--sp-2);
  margin: var(--sp-3) var(--sp-4);
}
.region-filter-bar label {
  min-width: 0;
  flex: 1;
  display: flex;
  align-items: center;
  gap: var(--sp-2);
  padding: var(--sp-2) var(--sp-3);
  border: 1px solid var(--line);
  border-radius: var(--r-md);
  background: var(--card);
}
.region-filter-bar label > span { flex: none; color: var(--ink-3); font-size: var(--fs-meta); }
.region-filter-bar select { min-width: 0; flex: 1; border: 0; outline: 0; color: var(--ink-1); background: transparent; font-size: var(--fs-body); }
.region-filter-bar .chip { flex: none; }
.skill-filter-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--sp-2); margin: 0 var(--sp-4) var(--sp-3); }
.skill-filter-grid label { min-width: 0; padding: var(--sp-2) var(--sp-3); border: 1px solid var(--line); border-radius: var(--r-md); background: var(--card); }
.skill-filter-grid label > span { display: block; color: var(--ink-3); font-size: var(--fs-meta); }
.skill-filter-grid select { width: 100%; min-width: 0; margin-top: var(--sp-1); border: 0; outline: 0; color: var(--ink-1); background: transparent; font-size: var(--fs-body); }

/* ============================ 详情页正文排版 ============================ */
.article-card {
  margin: var(--sp-3) var(--sp-4) 0;
  background: var(--card);
  border-radius: var(--r-lg);
  box-shadow: var(--shadow-card);
  padding: var(--sp-5) var(--sp-4);
}
.article-title { font-size: var(--fs-hero); font-weight: 700; line-height: 1.45; }
.article-meta {
  margin-top: var(--sp-2); padding-bottom: var(--sp-3);
  border-bottom: 1px solid var(--line);
  font-size: var(--fs-meta); color: var(--ink-3);
  display: flex; gap: var(--sp-3); flex-wrap: wrap;
}
.article-body { padding-top: var(--sp-3); font-size: var(--fs-body); color: var(--ink-1); }
.article-body p { margin-bottom: var(--sp-3); }
.article-body h2 { margin: var(--sp-5) 0 var(--sp-3); font-size: 24px; line-height: 1.45; }
.article-body h3 { margin: var(--sp-4) 0 var(--sp-2); font-size: 20px; line-height: 1.5; }
.article-body h4 { font-size: var(--fs-card); margin: var(--sp-4) 0 var(--sp-2); color: var(--ink-1); }
.article-body ol, .article-body ul { padding-left: 1.2em; margin-bottom: var(--sp-3); color: var(--ink-1); }
.article-body li { margin-bottom: var(--sp-1); }
.article-body blockquote { margin: var(--sp-4) 0; border-left: 3px solid var(--brand); padding: var(--sp-3) var(--sp-4); color: var(--ink-2); background: var(--bg); }
.article-body hr { margin: var(--sp-5) 0; border: 0; border-top: 1px solid var(--line); }
.article-body a { color: var(--brand); text-decoration: underline; }
.detail-container { padding-bottom: calc(var(--sp-6) + var(--sp-6) + var(--sp-6) + var(--sp-6) + env(safe-area-inset-bottom)); }

.skill-action-card {
  margin: var(--sp-3) var(--sp-4) 0;
  padding: var(--sp-4);
  border-radius: var(--r-lg);
  background: var(--card);
  box-shadow: var(--shadow-card);
}
.skill-action-card h2 { margin-top: var(--sp-2); font-size: var(--fs-title); line-height: 1.45; }
.detail-action-card.style-highlight { border-left: 4px solid var(--brand); background: var(--tag-blue-bg); }
.detail-action-card.style-compact { padding: var(--sp-3) var(--sp-4); }
.detail-action-card.style-compact h2 { margin-top: var(--sp-1); font-size: var(--fs-card); }
.detail-action-card.style-compact p { margin: var(--sp-1) 0 var(--sp-3); }
.skill-action-card p { margin-top: var(--sp-1); color: var(--ink-2); font-size: var(--fs-body); }
.skill-action-card .btn-block { display: block; margin-top: var(--sp-3); }
.consult-popup-icon svg { width: var(--sp-6); height: var(--sp-6); }
.attachment-access { margin: var(--sp-4) 0 var(--sp-3); padding: var(--sp-4); border-radius: var(--r-md); background: var(--tag-blue-bg); }
.attachment-access h4 { margin: var(--sp-2) 0 0; font-size: var(--fs-card); }
.attachment-access p { margin: var(--sp-1) 0 0; color: var(--ink-2); font-size: var(--fs-meta); }
.attachment-access .btn-block { display: block; margin-top: var(--sp-3); }

/* 附件下载条 */
.attach-item {
  display: flex; align-items: center; gap: var(--sp-2);
  width: 100%; text-align: left;
  background: #F7F9FC;
  border: 1px solid var(--line);
  border-radius: var(--r-md);
  padding: 10px var(--sp-3);
  margin-bottom: var(--sp-2);
  font-size: var(--fs-meta); color: var(--brand);
}
.attach-item .file-ico {
  flex: none; width: 26px; height: 26px; border-radius: var(--r-sm);
  background: var(--tag-blue-bg); color: var(--brand);
  display: flex; align-items: center; justify-content: center; font-size: var(--fs-meta);
}

/* ============================ 转化组件（CTA） ============================ */
.cta-bar {
  position: fixed; bottom: 0; left: 50%; transform: translateX(-50%);
  width: 100%; max-width: 480px;
  background: var(--card);
  box-shadow: var(--shadow-bar);
  padding: 10px var(--sp-4) calc(10px + env(safe-area-inset-bottom));
  display: flex; align-items: center; gap: var(--sp-3);
  z-index: 40;
}
.cta-text { flex: 1; }
.cta-text .t1 { font-size: var(--fs-body); font-weight: 600; }
.cta-text .t2 { font-size: var(--fs-meta); color: var(--ink-3); }
.btn-cta {
  background: var(--cta-grad);
  color: #fff; font-size: var(--fs-body); font-weight: 600;
  padding: 10px 22px; border-radius: var(--r-pill);
  box-shadow: var(--shadow-cta);
  white-space: nowrap;
}
.btn-ghost {
  border: 1px solid var(--line); color: var(--ink-2);
  font-size: var(--fs-meta);
  padding: 8px 14px; border-radius: var(--r-pill);
  background: var(--card);
}

/* 首页侧边悬浮咨询 */
.float-consult {
  position: fixed; right: calc(50% - 228px); bottom: 110px;
  width: 48px; height: 48px; border-radius: 50%;
  background: var(--cta-grad);
  box-shadow: var(--shadow-cta);
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  color: #fff; font-size: var(--fs-meta); line-height: 1.2;
  z-index: 35;
}
@media (max-width: 480px) { .float-consult { right: 12px; } }

/* ============================ 留资弹层 ============================ */
.modal-mask {
  position: fixed; inset: 0; background: rgba(15,20,35,.5);
  z-index: 60; display: none;
  align-items: flex-end; justify-content: center;
}
.modal-mask.show { display: flex; }
.modal-panel {
  width: 100%; max-width: 480px;
  max-height: calc(100vh - var(--sp-4));
  overflow-y: auto;
  background: var(--card);
  border-radius: 20px 20px 0 0;
  padding: var(--sp-5) var(--sp-4) calc(var(--sp-5) + env(safe-area-inset-bottom));
  animation: rise .28s ease;
}
@keyframes rise { from { transform: translateY(40px); opacity: 0; } to { transform: translateY(0); opacity: 1; } }
.modal-title { font-size: var(--fs-title); font-weight: 700; text-align: center; }
.modal-sub { font-size: var(--fs-meta); color: var(--ink-3); text-align: center; margin: var(--sp-1) 0 var(--sp-4); }
.form-item { margin-bottom: var(--sp-3); }
.form-item input, .form-item select {
  width: 100%; border: 1px solid var(--line); border-radius: var(--r-md);
  background: #F8FAFD;
  padding: 11px var(--sp-3); font-size: var(--fs-body); color: var(--ink-1);
  outline: none; appearance: none;
}
.form-item input:focus { border-color: var(--brand); background: #fff; }
.sms-code-row { display: grid; grid-template-columns: minmax(0, 1fr) 112px; gap: var(--sp-2); align-items: start; }
.sms-code-row .form-item { margin-bottom: 0; }
.sms-send-button {
  min-height: var(--touch-size);
  border-radius: var(--r-md);
  background: var(--brand-soft);
  color: var(--brand);
  font-size: var(--fs-meta);
  font-weight: 600;
}
.sms-send-button:disabled { color: var(--ink-3); background: var(--bg); }
.btn-block {
  width: 100%; text-align: center;
  background: var(--cta-grad); color: #fff;
  font-size: var(--fs-card); font-weight: 600;
  padding: 12px; border-radius: var(--r-pill);
  box-shadow: var(--shadow-cta);
  margin-top: var(--sp-2);
}
.modal-tip { font-size: var(--fs-meta); color: var(--ink-3); text-align: center; margin-top: var(--sp-3); }

/* ============================ 底部 Tabbar ============================ */
.tabbar {
  position: fixed; bottom: 0; left: 50%; transform: translateX(-50%);
  width: 100%; max-width: 480px;
  background: var(--card);
  box-shadow: var(--shadow-bar);
  display: flex;
  padding: 6px 0 calc(6px + env(safe-area-inset-bottom));
  z-index: 30;
}
.tabbar-item {
  flex: 1; display: flex; flex-direction: column; align-items: center; gap: 2px;
  font-size: var(--fs-meta); color: var(--ink-3);
}
.tabbar-item.active { color: var(--brand); font-weight: 600; }
.tabbar-item svg { width: 22px; height: 22px; }

/* ============================ 我的页面 ============================ */
.profile-hero {
  background: var(--hero-bg);
  padding: var(--sp-6) var(--sp-4) var(--sp-6);
  color: var(--ink-1);
  display: flex; align-items: center; gap: var(--sp-3);
}
.avatar {
  width: 54px; height: 54px; border-radius: 50%;
  background: var(--brand-grad);
  color: #fff;
  display: flex; align-items: center; justify-content: center;
  font-size: var(--fs-hero); font-weight: 700;
  box-shadow: 0 4px 10px rgba(46,123,240,.3);
}
.menu-card {
  margin: var(--sp-3) var(--sp-4) 0;
  background: var(--card); border-radius: var(--r-lg);
  box-shadow: var(--shadow-card);
  overflow: hidden;
}
.menu-item {
  display: flex; align-items: center; gap: var(--sp-3);
  padding: 14px var(--sp-4);
  font-size: var(--fs-body);
  border-bottom: 1px solid var(--line);
}
.menu-item:last-child { border-bottom: none; }
.menu-item .m-ico {
  width: 30px; height: 30px; border-radius: 8px;
  display: flex; align-items: center; justify-content: center; font-size: var(--fs-card);
}
.menu-item .m-arrow { margin-left: auto; color: var(--ink-3); font-size: var(--fs-body); }

/* 空状态 / 加载更多 */
.load-more {
  text-align: center; font-size: var(--fs-meta); color: var(--ink-3);
  padding: var(--sp-4) 0;
}

/* ==========================================================================
   v1.1 新增组件：品牌强化 / 今日速递 / 趋势图 / 公示名单 / 路径转化 / 计算器
   ========================================================================== */

/* ---------- 页头品牌强化 ---------- */
.page-hero { position: relative; overflow: hidden; }
.hero-deco { position: absolute; border-radius: 50%; pointer-events: none; }
.hero-deco.d1 { width: 150px; height: 150px; right: -46px; top: -56px; background: rgba(46,123,240,.08); }
.hero-deco.d2 { width: 76px; height: 76px; right: 62px; top: 30px; background: rgba(46,123,240,.06); }
.hero-deco.d3 { width: 200px; height: 200px; left: -90px; bottom: -120px; background: rgba(46,123,240,.05); }
.hero-brand { position: relative; z-index: 1; }
.hero-brand.single { gap: 0; }
.hero-logo {
  background: var(--brand-grad);
  border: none;
  color: #fff;
  box-shadow: 0 4px 10px rgba(46,123,240,.3);
}
.hero-trust {
  position: relative; z-index: 1;
  margin-top: var(--sp-3);
  display: inline-flex; align-items: center; gap: 6px;
  font-size: var(--fs-meta); color: rgba(255,255,255,.92);
  background: rgba(255,255,255,.16);
  border: 1px solid rgba(255,255,255,.24);
  padding: 3px 10px; border-radius: var(--r-pill);
}
.hero-trust b { color: #FFE0D1; font-weight: 700; }
.page-hero .search-bar { position: relative; z-index: 1; }

/* ---------- 今日公示速递（白卡 + 品牌蓝大数字） ---------- */
.today-board {
  margin: var(--sp-3) var(--sp-4) 0;
  background: var(--card);
  border-radius: var(--r-lg);
  padding: var(--sp-4);
  box-shadow: var(--shadow-card);
  position: relative;
}
.today-head { display: flex; justify-content: space-between; align-items: center; margin-bottom: var(--sp-3); }
.today-title { font-size: var(--fs-body); font-weight: 700; display: flex; align-items: center; gap: 7px; color: var(--ink-1); }
.live-dot {
  width: 7px; height: 7px; border-radius: 50%;
  background: #2ECC71;
  box-shadow: 0 0 0 3px rgba(46,204,113,.18);
  animation: pulse 1.6s ease-in-out infinite;
}
@keyframes pulse { 50% { opacity: .45; } }
.today-date { font-size: var(--fs-meta); color: var(--ink-3); }
.today-grid { display: flex; }
.today-item { flex: 1; text-align: center; position: relative; color: inherit; text-decoration: none; }
.today-item:active .today-num { transform: scale(.98); }
.today-item + .today-item::before {
  content: ""; position: absolute; left: 0; top: 14%; height: 72%; width: 1px;
  background: var(--line);
}
.today-num { font-size: var(--fs-hero); font-weight: 800; color: var(--brand); font-variant-numeric: tabular-nums; line-height: 1.2; }
.today-num small { font-size: var(--fs-meta); font-weight: 400; color: var(--ink-3); margin-left: 1px; }
.today-label { font-size: var(--fs-meta); color: var(--ink-2); margin-top: 2px; }
.today-mini-date { font-size: var(--fs-meta); color: var(--ink-3); margin-top: var(--sp-1); }
.today-foot {
  margin-top: var(--sp-3); padding-top: 10px;
  border-top: 1px dashed var(--line);
  font-size: var(--fs-meta); color: var(--ink-3); text-align: center;
}
.today-foot b { color: var(--cta); font-weight: 700; }

/* ---------- 近7日趋势 mini 柱状图（白卡） ---------- */
.trend-card {
  margin: var(--sp-3) var(--sp-4) 0;
  background: var(--card);
  border-radius: var(--r-lg);
  box-shadow: var(--shadow-card);
  padding: var(--sp-4);
}
.trend-head { display: flex; justify-content: space-between; align-items: center; margin-bottom: var(--sp-3); }
.trend-title { font-size: var(--fs-body); font-weight: 600; }
.trend-more { font-size: var(--fs-meta); color: var(--ink-3); }
.mini-bars { display: flex; align-items: flex-end; gap: 8px; height: 74px; }
.mini-bar { flex: 1; display: flex; flex-direction: column; align-items: center; gap: 5px; height: 100%; justify-content: flex-end; }
.mini-bar .bar {
  width: 100%; border-radius: 5px 5px 2px 2px;
  background: linear-gradient(180deg, #7FB2FF, #1B6EF3);
  min-height: 6px;
  position: relative;
}
.mini-bar .bar.top { background: linear-gradient(180deg, #FFB27A, #FF6A3D); }
.mini-bar .bar::after {
  content: attr(data-v);
  position: absolute; top: -16px; left: 50%; transform: translateX(-50%);
  font-size: var(--fs-meta); color: var(--ink-3);
  font-variant-numeric: tabular-nums;
}
.mini-bar .day { font-size: var(--fs-meta); color: var(--ink-3); }

/* ---------- 工具入口横幅（积分测算） ---------- */
.tool-banner {
  margin: var(--sp-3) var(--sp-4) 0;
  border-radius: var(--r-lg);
  padding: var(--sp-4);
  background: linear-gradient(120deg, #FFF4EC, #FFE9DA);
  border: 1px solid #FFDCC7;
  display: flex; align-items: center; gap: var(--sp-3);
}
.tool-ico {
  width: 42px; height: 42px; border-radius: 11px; flex: none;
  background: var(--cta-grad); color: #fff;
  display: flex; align-items: center; justify-content: center; font-size: var(--fs-hero);
  box-shadow: var(--shadow-cta);
}
.tool-t1 { font-size: var(--fs-body); font-weight: 700; color: #7A3B12; }
.tool-t2 { font-size: var(--fs-meta); color: #A5714B; margin-top: 1px; }
.tool-btn {
  margin-left: auto; flex: none;
  background: var(--cta-grad); color: #fff;
  font-size: var(--fs-meta); font-weight: 600;
  padding: 8px 15px; border-radius: var(--r-pill);
  box-shadow: var(--shadow-cta);
}

/* ---------- 公示名单 ---------- */
.roster-card {
  margin: var(--sp-3) var(--sp-4) 0;
  background: var(--card); border-radius: var(--r-lg);
  box-shadow: var(--shadow-card); overflow: hidden;
}
.roster-head { padding: var(--sp-4) var(--sp-4) 10px; display: flex; justify-content: space-between; align-items: center; }
.roster-title { font-size: var(--fs-card); font-weight: 600; }
.roster-count { font-size: var(--fs-meta); color: var(--ink-3); }
.roster-row {
  display: grid; grid-template-columns: calc(var(--sp-6) + var(--sp-6) + var(--sp-1)) auto minmax(0, 1fr) auto;
  align-items: center; gap: var(--sp-2);
  padding: var(--sp-2) var(--sp-4);
  border-top: 1px solid var(--line);
  font-size: var(--fs-body);
}
.roster-name { min-width: 0; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.roster-company { min-width: 0; color: var(--ink-2); font-size: var(--fs-meta); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.roster-detail { color: var(--brand); font-size: var(--fs-meta); font-weight: 600; white-space: nowrap; }
.roster-ticker-card {
  --roster-row-height: calc(var(--sp-6) + var(--sp-6) + var(--sp-4));
  --roster-window-height: calc(var(--roster-row-height) + var(--roster-row-height) + var(--roster-row-height) + var(--roster-row-height) + var(--roster-row-height));
}
.roster-ticker-card.rows-3 { --roster-window-height: calc(var(--roster-row-height) + var(--roster-row-height) + var(--roster-row-height)); }
.roster-ticker-card.rows-4 { --roster-window-height: calc(var(--roster-row-height) + var(--roster-row-height) + var(--roster-row-height) + var(--roster-row-height)); }
.roster-ticker-card.rows-6 { --roster-window-height: calc(var(--roster-row-height) + var(--roster-row-height) + var(--roster-row-height) + var(--roster-row-height) + var(--roster-row-height) + var(--roster-row-height)); }
.roster-ticker-window {
  height: var(--roster-window-height);
  overflow: hidden;
}
.roster-ticker-track {
  will-change: transform;
}
.roster-ticker-track.moving {
  transition: transform 520ms ease;
}
.roster-ticker-track .roster-row {
  height: var(--roster-row-height);
  padding-top: 0;
  padding-bottom: 0;
}
@media (prefers-reduced-motion: reduce) {
  .roster-ticker-window { height: auto; }
  .roster-ticker-track { transform: none; transition: none; }
}

.talent-kv-list { margin-top: var(--sp-3); border-top: 1px solid var(--line); }
.talent-kv-row { display: grid; grid-template-columns: calc(var(--sp-6) * 4) minmax(0, 1fr); gap: var(--sp-3); padding: var(--sp-2) 0; border-bottom: 1px solid var(--line); }
.talent-kv-row span { color: var(--ink-3); font-size: var(--fs-meta); }
.talent-kv-row strong { color: var(--ink-1); font-size: var(--fs-body); font-weight: 600; text-align: right; overflow-wrap: anywhere; }
.application-condition { margin-top: var(--sp-4); }
.application-condition h4 { font-size: var(--fs-card); }
.application-condition p,
.company-access p { margin-top: var(--sp-2); color: var(--ink-2); font-size: var(--fs-body); line-height: 1.65; }
.company-access .btn-ghost { margin-top: var(--sp-3); }
.company-tags { padding-top: var(--sp-3); }
.company-tags > b { display: block; margin-bottom: var(--sp-2); font-size: var(--fs-body); }
.company-tags > div { display: flex; flex-wrap: wrap; gap: var(--sp-1); }


/* ---------- 人员公示详情 ---------- */
.talent-person-screen {
  padding-bottom: calc(var(--sp-6) * 4 + env(safe-area-inset-bottom));
}
.talent-person-card {
  margin: var(--sp-3) var(--sp-4) 0;
  padding: var(--sp-4);
  background: var(--card);
  border-radius: var(--r-lg);
  box-shadow: var(--shadow-card);
}
.talent-person-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--sp-3);
}
.talent-person-date {
  flex: none;
  color: var(--ink-3);
  font-size: var(--fs-meta);
}
.talent-person-name {
  margin-top: var(--sp-3);
  color: var(--ink-1);
  font-size: var(--fs-hero);
  font-weight: 700;
  line-height: 1.4;
}
.talent-person-subtitle {
  margin-top: var(--sp-1);
  color: var(--ink-2);
  font-size: var(--fs-meta);
}
.talent-fact-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--sp-2);
  margin-top: var(--sp-4);
}
.talent-fact {
  min-width: 0;
  padding: var(--sp-2);
  border-radius: var(--r-md);
}
.talent-fact.blue { background: var(--tag-blue-bg); color: var(--tag-blue); }
.talent-fact.orange { background: var(--tag-orange-bg); color: var(--tag-orange); }
.talent-fact.green { background: var(--tag-green-bg); color: var(--tag-green); }
.talent-fact span,
.talent-fact strong {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
}
.talent-fact span {
  font-size: var(--fs-meta);
  white-space: nowrap;
}
.talent-fact strong {
  margin-top: var(--sp-1);
  font-size: var(--fs-body);
  font-weight: 700;
  line-height: 1.4;
  overflow-wrap: anywhere;
}
.talent-person-details {
  margin-top: var(--sp-4);
  padding-top: var(--sp-1);
}
.talent-person-detail {
  display: grid;
  grid-template-columns: calc(var(--sp-6) * 3) minmax(0, 1fr);
  gap: var(--sp-3);
  padding: var(--sp-3) 0;
}
.talent-person-detail span,
.talent-person-minor {
  color: var(--ink-3);
  font-size: var(--fs-meta);
}
.talent-person-detail strong {
  color: var(--ink-1);
  font-size: var(--fs-body);
  font-weight: 600;
  text-align: right;
  overflow-wrap: anywhere;
}
.talent-person-minor {
  display: flex;
  flex-wrap: wrap;
  gap: var(--sp-4);
  padding-top: var(--sp-3);
}
.talent-person-minor strong {
  margin-left: var(--sp-1);
  color: var(--ink-2);
  font-size: var(--fs-meta);
  font-weight: 600;
}
.talent-condition-card {
  padding: var(--sp-4);
}
.talent-section-heading span {
  color: var(--brand);
  font-size: var(--fs-meta);
  font-weight: 700;
}
.talent-section-heading h2 {
  margin-top: var(--sp-1);
  color: var(--ink-1);
  font-size: var(--fs-title);
  font-weight: 700;
  line-height: 1.4;
}
.talent-condition-text {
  margin-top: var(--sp-3);
  padding-left: var(--sp-3);
  border-left: var(--sp-1) solid var(--brand);
  color: var(--ink-1);
  font-size: var(--fs-body);
  font-weight: 600;
  line-height: 1.65;
}
.talent-condition-note {
  margin-top: var(--sp-3);
  padding: var(--sp-2) var(--sp-3);
  border-radius: var(--r-md);
  background: var(--bg);
  color: var(--ink-2);
  font-size: var(--fs-meta);
  line-height: 1.6;
}
.talent-person-apply .path-t1,
.talent-person-apply .path-t2,
.talent-person-apply .path-kicker,
.talent-person-apply .path-btn {
  position: relative;
  z-index: 1;
}
.talent-apply-button {
  display: block;
  width: 100%;
  text-align: center;
}
.talent-person-screen .article-safe-space {
  height: calc(var(--sp-6) * 3);
}


/* ---------- 路径转化卡（详情页核心） ---------- */
.path-cta {
  margin: var(--sp-3) var(--sp-4) 0;
  border-radius: var(--r-lg);
  padding: var(--sp-4);
  background: linear-gradient(135deg, #EAF2FF, #F5FAFF);
  border: 1px solid #D3E4FF;
  position: relative; overflow: hidden;
}
.path-cta::after {
  content: ""; position: absolute; width: 90px; height: 90px; border-radius: 50%;
  background: rgba(27,110,243,.06); right: -30px; top: -30px;
}
.path-cta.orange { background: linear-gradient(135deg, #FFF1E7, #FFFAF5); border-color: #FFDEC9; }
.path-cta.orange::after { background: rgba(255,106,61,.07); }
.path-kicker { font-size: var(--fs-meta); color: var(--brand); font-weight: 700; letter-spacing: 1px; position: relative; z-index: 1; }
.path-cta.orange .path-kicker { color: var(--cta); }
.path-t1 { font-size: var(--fs-card); font-weight: 700; margin-top: 4px; position: relative; z-index: 1; }
.path-t2 { font-size: var(--fs-meta); color: var(--ink-2); margin-top: 5px; line-height: 1.6; position: relative; z-index: 1; }
.path-btn {
  display: inline-block; margin-top: 10px;
  background: var(--brand-grad); color: #fff;
  font-size: var(--fs-body); font-weight: 600;
  padding: 8px 18px; border-radius: var(--r-pill);
  position: relative; z-index: 1;
}
.path-cta.orange .path-btn { background: var(--cta-grad); box-shadow: var(--shadow-cta); }

/* ---------- 积分计算器 ---------- */
.calc-wizard {
  min-height: calc(100vh - 56px);
  background: #F5F5F5;
  padding: 12px 0 calc(88px + env(safe-area-inset-bottom));
}
.calc-score-card {
  margin: 12px 16px 0;
  background: #FFFFFF;
  border-radius: 12px;
  box-shadow: 0 2px 8px rgba(0,0,0,.06);
  padding: 16px;
  display: grid;
  grid-template-columns: 72px 1fr;
  gap: 12px;
  align-items: center;
}
.calc-score-main { min-width: 0; }
.calc-score {
  color: #1F2937;
  font-size: 48px;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
  line-height: 1;
}
.calc-score-label {
  margin-top: 4px;
  color: #9CA3AF;
  font-size: 12px;
}
.calc-score-mid { min-width: 0; }
.calc-progress {
  height: 6px;
  border-radius: 999px;
  background: #E5E7EB;
  overflow: hidden;
}
.calc-progress.large {
  height: 8px;
  margin-top: 12px;
}
.calc-progress-fill {
  height: 100%;
  border-radius: inherit;
  background: #1677FF;
  transition: width .18s ease;
}
.calc-assist {
  margin-top: 8px;
  color: #9CA3AF;
  font-size: 12px;
  line-height: 1.45;
}
.calc-gap {
  grid-column: 1 / -1;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  color: #4B5563;
  font-size: 12px;
  line-height: 1.45;
}
.calc-gap b {
  color: #FF6B35;
  font-size: 15px;
  font-weight: 800;
  white-space: nowrap;
}
.calc-steps {
  margin: 12px 16px 0;
  background: #FFFFFF;
  border-radius: 12px;
  box-shadow: 0 2px 8px rgba(0,0,0,.04);
  padding: 12px 8px;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 4px;
}
.calc-step {
  min-width: 0;
  border: 0;
  background: transparent;
  color: #9CA3AF;
  text-align: center;
  cursor: pointer;
}
.calc-step-dot {
  width: 24px;
  height: 24px;
  border-radius: 999px;
  margin: 0 auto 4px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #E5E7EB;
  color: #9CA3AF;
  font-size: 12px;
  font-weight: 700;
}
.calc-step-title {
  display: block;
  font-size: 12px;
  line-height: 1.25;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.calc-step.active {
  color: #1677FF;
  font-weight: 700;
}
.calc-step.active .calc-step-dot {
  background: #1677FF;
  color: #FFFFFF;
}
.calc-step.done {
  color: #52C41A;
}
.calc-step.done .calc-step-dot {
  background: #52C41A;
  color: #FFFFFF;
}
.calc-collapse-card,
.calc-result-card,
.calc-detail-card {
  margin: 12px 16px 0;
  background: #FFFFFF;
  border-radius: 12px;
  box-shadow: 0 2px 8px rgba(0,0,0,.04);
  overflow: hidden;
}
.calc-collapse-head {
  width: 100%;
  min-height: 56px;
  border: 0;
  background: transparent;
  padding: 16px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  text-align: left;
  cursor: pointer;
}
.calc-collapse-left {
  min-width: 0;
  flex: 1;
}
.calc-collapse-title {
  display: block;
  color: #1F2937;
  font-size: 15px;
  font-weight: 700;
  line-height: 1.35;
}
.calc-collapse-title b {
  margin-right: 4px;
  color: #52C41A;
}
.calc-collapse-meta {
  margin-top: 4px;
  color: #9CA3AF;
  font-size: 12px;
}
.calc-collapse-right {
  flex: none;
  display: flex;
  align-items: center;
  gap: 8px;
}
.calc-caret {
  color: #9CA3AF;
  font-size: 12px;
}
.calc-collapse-body {
  border-top: 1px solid #E5E7EB;
  padding: 0 16px 16px;
}
.calc-field {
  padding: 16px 0;
  border-bottom: 1px solid #F2F3F5;
}
.calc-field:last-child {
  border-bottom: 0;
  padding-bottom: 0;
}
.calc-label {
  margin-bottom: 12px;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  color: #1F2937;
  font-size: 14px;
  line-height: 1.35;
}
.calc-label-main,
.calc-label > span:first-child {
  min-width: 0;
  flex: 1;
}
.calc-label strong {
  font: inherit;
  font-weight: 700;
}
.calc-help {
  display: block;
  margin-top: 4px;
  color: #9CA3AF;
  font-size: 12px;
  font-weight: 400;
  line-height: 1.35;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.calc-score-tag {
  flex: none;
  min-width: 48px;
  height: 22px;
  padding: 0 8px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: #FFFFFF;
  background: #9CA3AF;
  font-size: 12px;
  font-weight: 700;
  white-space: nowrap;
}
.calc-score-tag.earned {
  background: #52C41A;
}
.calc-score-tag.deduct {
  background: #FF6B35;
}
.opt-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}
.opt {
  min-height: 48px;
  border: 1px solid #E5E7EB;
  border-radius: 8px;
  padding: 8px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  background: #FFFFFF;
  color: #1F2937;
  font-size: 14px;
  text-align: center;
  cursor: pointer;
  transition: all .15s ease;
}
.opt small {
  margin-top: 2px;
  display: block;
  color: #9CA3AF;
  font-size: 12px;
}
.opt.on {
  border-color: #1677FF;
  background: #F0F5FF;
  color: #1677FF;
  font-weight: 700;
}
.opt.on small {
  color: #1677FF;
  opacity: .82;
}
.number-line {
  height: 44px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto 32px 32px;
  align-items: center;
  gap: 8px;
}
.number-input {
  width: 100%;
  height: 44px;
  min-height: 44px;
  border: 1px solid #D9D9D9;
  border-radius: 8px;
  outline: 0;
  background: #FFFFFF;
  color: #1F2937;
  font-size: 15px;
  font-weight: 700;
  text-align: center;
  box-sizing: border-box;
}
.number-input:focus {
  border-color: #1677FF;
}
.number-input::placeholder {
  color: #9CA3AF;
  font-weight: 400;
}
.number-unit {
  color: #4B5563;
  font-size: 12px;
  white-space: nowrap;
}
.step-btn {
  width: 32px;
  height: 32px;
  border: 1px solid #E5E7EB;
  border-radius: 8px;
  background: #F7F8FA;
  color: #1677FF;
  font-size: 17px;
  font-weight: 800;
  cursor: pointer;
}
.calc-inline-help {
  margin-top: 8px;
  color: #9CA3AF;
  font-size: 12px;
  line-height: 1.35;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.calc-note {
  margin: 12px 16px 0;
  color: #9CA3AF;
  font-size: 12px;
  line-height: 1.5;
}
.calc-result-card {
  padding: 24px 16px;
  text-align: center;
}
.calc-result-score {
  color: #1F2937;
  font-size: 48px;
  font-weight: 800;
  line-height: 1;
}
.calc-result-title {
  margin-top: 4px;
  color: #4B5563;
  font-size: 15px;
  font-weight: 700;
}
.calc-result-tip {
  margin-top: 12px;
  color: #9CA3AF;
  font-size: 12px;
  line-height: 1.5;
}
.calc-detail-card {
  padding: 16px;
}
.calc-detail-title {
  margin-bottom: 8px;
  color: #1F2937;
  font-size: 15px;
  font-weight: 700;
}
.calc-detail-row {
  min-height: 46px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  border-bottom: 1px solid #F2F3F5;
}
.calc-detail-row:last-child {
  border-bottom: 0;
}
.calc-detail-main {
  min-width: 0;
  flex: 1;
}
.calc-detail-main b {
  display: block;
  color: #1F2937;
  font-size: 14px;
  font-weight: 600;
}
.calc-detail-main small {
  display: block;
  margin-top: 2px;
  color: #9CA3AF;
  font-size: 12px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.calc-result-actions {
  margin-top: 12px;
}
.calc-bottom-space {
  height: 72px;
}
.calc-bottom-bar {
  position: fixed;
  left: 50%;
  bottom: 0;
  z-index: 80;
  width: 100%;
  max-width: 480px;
  min-height: calc(56px + env(safe-area-inset-bottom));
  padding: 6px 16px calc(6px + env(safe-area-inset-bottom));
  transform: translateX(-50%);
  background: #FFFFFF;
  box-shadow: 0 -1px 4px rgba(0,0,0,.06);
  display: grid;
  grid-template-columns: 1fr 1.4fr;
  gap: 12px;
  box-sizing: border-box;
}
.calc-nav-btn {
  height: 44px;
  border-radius: 8px;
  font-size: 14px;
  font-weight: 700;
  cursor: pointer;
}
.calc-nav-btn.ghost {
  border: 1px solid #D9D9D9;
  background: #FFFFFF;
  color: #4B5563;
}
.calc-nav-btn.ghost.disabled,
.calc-nav-btn.ghost:disabled {
  color: #C2C7D0;
  background: #F7F8FA;
}
.calc-nav-btn.primary {
  border: 0;
  background: #1677FF;
  color: #FFFFFF;
}
.calc-nav-btn.primary.orange {
  background: #FF6B35;
}
.calc-collapse-body.compact {
  padding: 0 16px 12px;
}
.compact .calc-table-row {
  min-height: 48px;
  padding: 6px 0;
  border-bottom: 1px solid #E5E7EB;
  display: flex;
  align-items: center;
  gap: 8px;
}
.compact .calc-table-row:last-child {
  border-bottom: 0;
}
.row-main {
  min-width: 0;
  flex: 1;
}
.row-title {
  display: block;
  color: #1F2937;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.25;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.row-rule {
  display: block;
  margin-top: 2px;
  color: #9CA3AF;
  font-size: 12px;
  line-height: 1.25;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.row-number {
  flex: none;
  display: grid;
  grid-template-columns: 48px auto 28px 28px 50px;
  align-items: center;
  gap: 4px;
}
.compact-input {
  width: 48px;
  height: 36px;
  min-height: 36px;
  border: 1px solid #D9D9D9;
  border-radius: 4px;
  outline: 0;
  background: #FFFFFF;
  color: #1F2937;
  font-size: 14px;
  font-weight: 800;
  text-align: center;
  box-sizing: border-box;
}
.compact-input:focus {
  border-color: #1677FF;
}
.compact-unit {
  color: #4B5563;
  font-size: 12px;
  white-space: nowrap;
}
.compact-step {
  width: 28px;
  height: 28px;
  border: 1px solid #E5E7EB;
  border-radius: 4px;
  background: #F7F8FA;
  color: #1677FF;
  font-size: 15px;
  font-weight: 800;
  cursor: pointer;
}
.compact-score {
  min-width: 50px;
  height: 22px;
  padding: 0 6px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: #FFFFFF;
  background: #9CA3AF;
  font-size: 12px;
  font-weight: 700;
  white-space: nowrap;
  box-sizing: border-box;
}
.compact-score.earned {
  background: #52C41A;
}
.compact-score.deduct {
  background: #FF6B35;
}
.honor-tabs {
  padding: 8px 0 4px;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 4px;
}
.honor-tab {
  height: 32px;
  border: 1px solid #E5E7EB;
  border-radius: 4px;
  background: #FFFFFF;
  color: #4B5563;
  font-size: 12px;
  font-weight: 700;
  cursor: pointer;
}
.honor-tab.on {
  border-color: #1677FF;
  background: #1677FF;
  color: #FFFFFF;
}
.compact-opt-grid {
  padding-top: 8px;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}
.compact-opt {
  min-height: 60px;
  border: 1px solid #E5E7EB;
  border-radius: 8px;
  padding: 8px 6px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  background: #FFFFFF;
  color: #1F2937;
  font-size: 14px;
  text-align: center;
  cursor: pointer;
}
.compact-opt small {
  margin-top: 2px;
  color: #9CA3AF;
  font-size: 12px;
}
.compact-opt.on {
  border-color: #1677FF;
  background: #F0F5FF;
  color: #1677FF;
  font-weight: 700;
}
.compact-opt.on small {
  color: #1677FF;
}
.calc-select-line {
  min-height: 48px;
  padding: 8px 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}
.select-value,
.row-select-wrap {
  min-width: 0;
  flex: none;
  height: 36px;
  display: flex;
  align-items: center;
  gap: 6px;
}
.compact-select {
  max-width: 170px;
  height: 36px;
  border: 1px solid #D9D9D9;
  border-radius: 4px;
  background: #FFFFFF;
  color: #1F2937;
  font-size: 12px;
  padding: 0 8px;
}
.row-options,
.row-chip-wrap {
  min-width: 0;
  flex: 1.35;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: 4px;
}
.row-choice {
  min-height: 24px;
  border: 1px solid #E5E7EB;
  border-radius: 4px;
  padding: 0 7px;
  display: inline-flex;
  align-items: center;
  background: #FFFFFF;
  color: #4B5563;
  font-size: 12px;
  font-weight: 600;
  cursor: pointer;
}
.row-choice small {
  margin-left: 2px;
  color: #9CA3AF;
}
.row-choice.on {
  border-color: #1677FF;
  background: #F0F5FF;
  color: #1677FF;
}

/* 金刚区新增颜色 c7-c10 */
.nav-icon.c7 { background: linear-gradient(135deg,#F7B733,#E8890C); }
.nav-icon.c8 { background: linear-gradient(135deg,#5F8BFF,#3B5BDB); }
.nav-icon.c9 { background: linear-gradient(135deg,#34D1BF,#0CA678); }
.nav-icon.c10 { background: linear-gradient(135deg,#B197FC,#845EF7); }
.nav-icon.c11 { background: linear-gradient(135deg,#4E9CFF,#1B6EF3); }
.nav-icon.c12 { background: linear-gradient(135deg,#3ECF9B,#0A9E66); }
.nav-grid.c5 { grid-template-columns: repeat(5, 1fr); gap: var(--sp-4) 0; }
.nav-grid.c5 .nav-icon { width: 42px; height: 42px; font-size: var(--fs-meta); border-radius: 12px; }
.nav-grid.c5 .nav-label { font-size: var(--fs-meta); }

/* ---------- 人才公示批次卡（列表页专用） ---------- */
.batch-card {
  background: var(--card);
  border-radius: var(--r-lg);
  box-shadow: var(--shadow-card);
  padding: var(--sp-4);
  display: block;
}
.batch-head { display: flex; align-items: flex-start; justify-content: space-between; gap: var(--sp-2); }
.batch-title {
  font-size: var(--fs-card); font-weight: 600; line-height: 1.45; flex: 1;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.batch-stats {
  margin-top: var(--sp-3);
  display: flex; align-items: center;
  background: #F7FAFF;
  border: 1px solid #EAF1FD;
  border-radius: var(--r-md);
  padding: 10px var(--sp-3);
}
.batch-stat { flex: 1; text-align: center; position: relative; }
.batch-stat + .batch-stat::before {
  content: ""; position: absolute; left: 0; top: 16%; height: 68%; width: 1px;
  background: #E3EAF6;
}
.batch-stat .n { font-size: var(--fs-title); font-weight: 800; color: var(--brand); font-variant-numeric: tabular-nums; line-height: 1.25; }
.batch-stat .n small { font-size: var(--fs-meta); font-weight: 400; color: var(--ink-3); }
.batch-stat .l { font-size: var(--fs-meta); color: var(--ink-3); margin-top: 1px; }
.batch-foot {
  margin-top: var(--sp-3);
  display: flex; align-items: center; justify-content: space-between;
  font-size: var(--fs-meta); color: var(--ink-3);
}
.batch-link { color: var(--brand); font-weight: 600; }

.publicity-section { margin-top: var(--sp-3); }
.section-subtitle {
  margin-top: 2px;
  color: var(--ink-3);
  font-size: var(--fs-meta);
  line-height: 1.45;
}
.rank-list {
  margin: 0 var(--sp-4);
  overflow: hidden;
  border-radius: var(--r-lg);
  background: var(--card);
  box-shadow: var(--shadow-card);
}
.rank-row {
  display: grid;
  grid-template-columns: 30px minmax(0, 1fr) auto auto;
  align-items: center;
  gap: var(--sp-2);
  width: 100%;
  min-height: 58px;
  padding: 9px var(--sp-4);
  border-bottom: 1px solid var(--line);
  color: inherit;
  border-top: 0;
  border-right: 0;
  border-left: 0;
  background: transparent;
  text-align: left;
  font: inherit;
}
.rank-row:last-child { border-bottom: 0; }
.rank-index {
  display: inline-flex;
  width: 24px;
  height: 24px;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  color: var(--ink-3);
  background: var(--bg);
  font-size: var(--fs-meta);
  font-weight: 700;
}
.rank-index.top { color: #9A4A09; background: #FFF1E7; }
.rank-main { min-width: 0; display: grid; gap: 2px; }
.rank-main strong {
  min-width: 0;
  overflow: hidden;
  color: var(--ink-1);
  font-size: 15px;
  font-weight: 700;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.rank-main small,
.rank-count small {
  color: var(--ink-3);
  font-size: var(--fs-meta);
}
.rank-count {
  display: flex;
  align-items: baseline;
  gap: 2px;
  color: var(--brand);
  font-variant-numeric: tabular-nums;
}
.rank-count b { font-size: var(--fs-title); }
.rank-link {
  color: var(--brand);
  font-size: var(--fs-meta);
  font-weight: 600;
  white-space: nowrap;
}
.district-rank-list {
  display: grid;
  gap: var(--sp-3);
  margin: 0 var(--sp-4);
}
.district-rank-card {
  overflow: hidden;
  border-radius: var(--r-lg);
  background: var(--card);
  box-shadow: var(--shadow-card);
}
.district-rank-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--sp-3);
  padding: 10px var(--sp-4);
  border-bottom: 1px solid var(--line);
}
.district-rank-head strong {
  display: block;
  color: var(--ink-1);
  font-size: 16px;
}
.district-rank-head small {
  display: block;
  margin-top: 2px;
  color: var(--ink-3);
  font-size: var(--fs-meta);
}
.district-rank-head span {
  flex-shrink: 0;
  padding: 4px 9px;
  border-radius: 999px;
  color: var(--brand);
  background: var(--brand-soft);
  font-size: var(--fs-meta);
  font-weight: 700;
}
.mini-rank-row {
  display: grid;
  grid-template-columns: 26px minmax(0, 1fr) auto auto;
  align-items: center;
  gap: var(--sp-2);
  width: 100%;
  min-height: 50px;
  padding: 7px var(--sp-4);
  border: 0;
  border-bottom: 1px solid var(--line);
  color: inherit;
  background: transparent;
  text-align: left;
  font: inherit;
}
.mini-rank-row:last-child { border-bottom: 0; }
.rank-index.mini {
  width: 22px;
  height: 22px;
}
.publicity-scope-card {
  display: grid;
  gap: 4px;
  margin: var(--sp-3) var(--sp-4) 0;
  padding: var(--sp-4);
  border-radius: var(--r-lg);
  background: var(--card);
  box-shadow: var(--shadow-card);
}
.publicity-scope-card span,
.publicity-scope-card small {
  color: var(--ink-3);
  font-size: var(--fs-meta);
}
.publicity-scope-card strong {
  color: var(--ink-1);
  font-size: var(--fs-title);
  line-height: 1.35;
}

/* ==========================================================================
   杭州职业发展平台 · 共享应用组件
   公共端与运营端统一使用本文件中的颜色、字体、圆角和阴影 Tokens。
   ========================================================================== */

html,
body,
#app,
#admin { min-height: 100%; }

body { letter-spacing: 0; }

button,
input,
select,
textarea { font: inherit; letter-spacing: 0; }

.app-root { min-height: 100vh; }

.fs-20 { font-size: var(--fs-hero) !important; }
.fs-17 { font-size: var(--fs-title) !important; }
.fs-15 { font-size: var(--fs-card) !important; }
.fs-14 { font-size: var(--fs-body) !important; }
.fs-12 { font-size: var(--fs-meta) !important; }

.home-screen,
.inner-page,
.article-page,
.profile-page { padding-bottom: calc(var(--tabbar-size) + var(--sp-6)); }

.line-icon,
.tiny-icon,
.service-icon,
.tab-icon {
  width: var(--sp-6);
  height: var(--sp-6);
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.tiny-icon { width: var(--sp-4); height: var(--sp-4); }
.service-icon { width: var(--sp-6); height: var(--sp-6); }

/* 首页品牌 Hero：图片由后台上传，文字单独渲染 */
.page-hero.home-hero {
  min-height: 232px;
  padding: var(--sp-4) var(--sp-4) calc(var(--sp-6) + var(--sp-6));
  border-radius: 0 0 var(--r-lg) var(--r-lg);
  background-color: var(--brand-deep);
  background-image: var(--brand-grad);
  background-position: center;
  background-size: cover;
  color: var(--card);
  isolation: isolate;
}

.page-hero.home-hero::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background: var(--hero-overlay-color, var(--ink-1));
  opacity: var(--hero-overlay-opacity, .2);
}

.home-hero.theme-light,
.home-hero.theme-pending { color: var(--card); }
.home-hero.theme-dark { color: var(--ink-1); }

.home-hero .hero-brand,
.home-hero .hero-copy,
.home-hero .search-bar { position: relative; z-index: 1; }

.home-hero .hero-brand { color: inherit; }
.home-hero .hero-logo {
  width: var(--brand-mark-size);
  height: var(--brand-mark-size);
  border-radius: var(--r-md);
  color: var(--brand);
  background: var(--card);
  box-shadow: var(--shadow-card);
  font-size: var(--fs-meta);
  letter-spacing: 0;
}

.hero-brand > span:nth-child(2) { display: grid; line-height: 1.35; }
.home-hero .hero-name { color: inherit; font-size: var(--fs-card); }
.hero-brand-sub { color: inherit; font-size: var(--fs-meta); font-weight: 400; opacity: .82; }
.hero-city {
  margin-left: auto;
  padding: var(--sp-1) var(--sp-2);
  border: 1px solid currentColor;
  border-radius: var(--r-pill);
  color: inherit;
  font-size: var(--fs-meta);
  opacity: .9;
}

.hero-copy { margin-top: var(--sp-4); color: inherit; }
.hero-copy h1 {
  max-width: 82%;
  color: inherit;
  font-size: var(--fs-hero);
  font-weight: 700;
  line-height: 1.4;
}
.hero-copy p {
  max-width: 88%;
  margin-top: var(--sp-1);
  color: inherit;
  font-size: var(--fs-body);
  line-height: 1.5;
  opacity: .88;
}
.home-hero.position-center .hero-copy { text-align: center; }
.home-hero.position-center .hero-copy h1,
.home-hero.position-center .hero-copy p { margin-inline: auto; }
.home-hero.position-right .hero-copy { text-align: right; }
.home-hero.position-right .hero-copy h1,
.home-hero.position-right .hero-copy p { margin-left: auto; }

.home-hero .search-bar {
  min-height: var(--touch-size);
  margin-top: var(--sp-4);
  padding: 0 var(--sp-3);
  border: 0;
  border-radius: var(--r-md);
  box-shadow: var(--shadow-card);
}
.home-hero .search-bar .line-icon { width: var(--sp-5); height: var(--sp-5); color: var(--ink-3); }
.home-hero .search-bar button {
  display: grid;
  width: var(--touch-size);
  height: var(--touch-size);
  place-items: center;
  color: var(--brand);
}

.notice-bar {
  min-height: var(--touch-size);
  margin: var(--notice-overlap) var(--sp-4) 0;
  padding: var(--sp-2) var(--sp-3);
}
.notice-badge { font-size: var(--fs-meta); padding: var(--sp-1) var(--sp-2); }
.notice-bar > .tiny-icon { flex: none; color: var(--ink-3); }

.nav-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--sp-4) 0;
  margin-top: var(--sp-3);
  padding: var(--sp-4) var(--sp-2);
}
.nav-icon {
  width: var(--nav-icon-size);
  height: var(--nav-icon-size);
  border-radius: var(--r-md);
  font-size: var(--fs-meta);
  letter-spacing: 0;
}
.nav-icon .service-icon { color: var(--card); }
.nav-label { font-size: var(--fs-meta); }

.stats-row { gap: var(--sp-3); }
.stats-row .stat-card { min-width: 0; padding: var(--sp-3); }
.stat-num { display: block; font-size: var(--fs-title); line-height: 1.35; }
.stat-label { display: block; margin-top: var(--sp-1); font-size: var(--fs-meta); }

.section-head { margin: var(--sp-5) var(--sp-4) var(--sp-3); }
.section-title { margin: 0; font-size: var(--fs-title); }
.section-more { font-size: var(--fs-meta); }

.post-card { width: 100%; text-align: left; }
.post-title { margin: 0; }
.post-desc { line-height: 1.5; }
.post-meta { gap: var(--sp-2); overflow: hidden; white-space: nowrap; }
.post-meta > span:first-child { overflow: hidden; text-overflow: ellipsis; }
.tag { font-size: var(--fs-meta); padding: var(--sp-1) var(--sp-2); }
.tag.plain { background: var(--bg); }

.home-chip-row { padding-bottom: 0; }
.service-list {
  margin: 0 var(--sp-4);
  overflow: hidden;
  border-radius: var(--r-lg);
  background: var(--card);
  box-shadow: var(--shadow-card);
}
.service-list-item {
  display: flex;
  min-height: calc(var(--touch-size) + var(--sp-4));
  align-items: center;
  gap: var(--sp-3);
  padding: var(--sp-3) var(--sp-4);
  border-bottom: 1px solid var(--line);
}
.service-list-item:last-child { border-bottom: 0; }
.service-list-icon {
  display: grid;
  width: var(--touch-size);
  height: var(--touch-size);
  flex: none;
  place-items: center;
  border-radius: var(--r-md);
  color: var(--brand);
  background: var(--tag-blue-bg);
}
.service-list-item > span:nth-child(2) { display: grid; flex: 1; min-width: 0; }
.service-list-item strong { font-size: var(--fs-card); font-weight: 600; }
.service-list-item small { color: var(--ink-3); font-size: var(--fs-meta); }
.service-list-item > .tiny-icon { color: var(--ink-3); }

.float-consult {
  right: max(var(--sp-3), calc(50% - 228px));
  bottom: calc(var(--tabbar-size) + var(--sp-5));
  width: 48px;
  height: 48px;
  color: var(--card);
  font-size: var(--fs-meta);
}

.tabbar {
  min-height: var(--tabbar-size);
  padding: var(--sp-1) 0 env(safe-area-inset-bottom);
}
.tabbar-item {
  min-height: var(--touch-size);
  justify-content: center;
  gap: var(--sp-1);
  font-size: var(--fs-meta);
}
.tabbar-item .line-icon,
.tabbar-item .tab-icon { width: var(--sp-6); height: var(--sp-6); }

/* 列表页 */
.top-bar { min-height: 56px; padding: var(--sp-3) var(--sp-4); }
.top-bar .back { width: var(--touch-size); height: var(--touch-size); background: transparent; }
.top-bar-spacer { width: var(--touch-size); }
.cat-tabs { top: 0; }
.cat-tab { padding: var(--sp-3) 0; font-size: var(--fs-body); }
.list-search {
  display: flex;
  min-height: var(--touch-size);
  align-items: center;
  gap: var(--sp-2);
  margin: var(--sp-3) var(--sp-4) 0;
  padding-left: var(--sp-3);
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: var(--r-md);
  background: var(--card);
}
.list-search .line-icon { width: var(--sp-5); height: var(--sp-5); color: var(--ink-3); }
.list-search input { min-width: 0; flex: 1; border: 0; outline: 0; color: var(--ink-1); background: transparent; font-size: var(--fs-body); }
.list-search button { align-self: stretch; padding: 0 var(--sp-4); color: var(--card); background: var(--brand); font-size: var(--fs-body); }
.notice-inline,
.empty-card,
.access-card,
.empty-state-card {
  margin: 0 var(--sp-4);
  padding: var(--sp-4);
  border-radius: var(--r-lg);
  color: var(--ink-2);
  background: var(--card);
  box-shadow: var(--shadow-card);
  font-size: var(--fs-body);
}
.notice-inline { margin-bottom: var(--sp-3); color: var(--brand); background: var(--tag-blue-bg); box-shadow: none; }

/* 详情页 */
.article-card { padding: var(--sp-4); }
.article-title { font-size: var(--fs-hero); }
.article-body { line-height: 1.65; }
.article-body h4 { font-size: var(--fs-card); }
.access-card strong { display: block; color: var(--ink-1); font-size: var(--fs-card); }
.access-card p { margin: var(--sp-1) 0 var(--sp-3); color: var(--ink-3); font-size: var(--fs-meta); }
.btn-primary,
.primary-btn {
  display: inline-flex;
  min-height: var(--touch-size);
  align-items: center;
  justify-content: center;
  padding: 0 var(--sp-4);
  border-radius: var(--r-md);
  color: var(--card);
  background: var(--brand);
  font-size: var(--fs-body);
  font-weight: 600;
}
.article-safe-space { height: calc(var(--tabbar-size) + var(--sp-6)); }
.cta-bar { padding: var(--sp-2) var(--sp-4) calc(var(--sp-2) + env(safe-area-inset-bottom)); }
.cta-text { display: grid; }
.cta-text .t1 { font-size: var(--fs-body); }
.cta-text .t2 { font-size: var(--fs-meta); }
.btn-cta { min-height: var(--touch-size); padding: 0 var(--sp-5); box-shadow: none; }

/* 弹层与表单 */
.modal-mask { background: color-mix(in srgb, var(--ink-1) 52%, transparent); }
.modal-panel { border-radius: var(--r-lg) var(--r-lg) 0 0; padding: var(--sp-4) var(--sp-4) calc(var(--sp-5) + env(safe-area-inset-bottom)); }
.sheet-handle { width: var(--sp-6); height: var(--sp-1); margin: 0 auto var(--sp-3); border-radius: var(--r-pill); background: var(--line); }
.form-item { display: grid; gap: var(--sp-1); }
.form-item > span { color: var(--ink-2); font-size: var(--fs-meta); }
.form-item input,
.form-item select { min-height: var(--touch-size); padding: 0 var(--sp-3); background: var(--bg); }
.btn-block { min-height: var(--touch-size); padding: 0 var(--sp-4); box-shadow: none; }
.modal-tip { font-size: var(--fs-meta); }
.result-panel { text-align: center; }
.result-icon {
  display: grid;
  width: 48px;
  height: 48px;
  margin: 0 auto var(--sp-3);
  place-items: center;
  border-radius: var(--r-pill);
  color: var(--tag-green);
  background: var(--tag-green-bg);
}

/* 兼容现有登录与信息详情弹层 */
.modal-backdrop {
  position: fixed;
  inset: 0;
  z-index: 60;
  display: flex;
  align-items: flex-end;
  justify-content: center;
  background: color-mix(in srgb, var(--ink-1) 52%, transparent);
}
.sheet {
  width: 100%;
  max-width: var(--content-max);
  max-height: 88vh;
  overflow: auto;
  border-radius: var(--r-lg) var(--r-lg) 0 0;
  background: var(--card);
}
.sheet-head { display: flex; align-items: center; justify-content: space-between; padding: var(--sp-4); border-bottom: 1px solid var(--line); }
.sheet-head strong,
.sheet-head h2 { margin: 0; font-size: var(--fs-title); }
.sheet-body { display: grid; gap: var(--sp-3); padding: var(--sp-4); }
.ghost-btn { min-height: var(--touch-size); padding: 0 var(--sp-3); border: 1px solid var(--line); border-radius: var(--r-md); color: var(--ink-2); background: var(--card); font-size: var(--fs-body); }
.field { display: grid; gap: var(--sp-1); }
.field label { color: var(--ink-2); font-size: var(--fs-meta); }
.field input,
.field select,
.field textarea { min-height: var(--touch-size); padding: 0 var(--sp-3); border: 1px solid var(--line); border-radius: var(--r-md); background: var(--bg); color: var(--ink-1); }
.kv { display: grid; grid-template-columns: 88px 1fr; gap: var(--sp-3); padding: var(--sp-2) 0; border-bottom: 1px solid var(--line); font-size: var(--fs-body); }
.kv span:first-child { color: var(--ink-3); }
.consult-popup-icon { display: grid; width: 48px; height: 48px; margin: 0 auto; place-items: center; border-radius: var(--r-pill); color: var(--brand); background: var(--tag-blue-bg); }
.consult-popup-title { text-align: center; font-size: var(--fs-title); font-weight: 600; }
.consult-popup-copy { text-align: center; color: var(--ink-2); font-size: var(--fs-body); }

/* 我的与预留页 */
.profile-hero { background: var(--brand-grad); color: var(--card); }
.profile-hero h1 { font-size: var(--fs-title); }
.profile-hero p { color: inherit; font-size: var(--fs-meta); opacity: .82; }
.avatar { box-shadow: var(--shadow-card); }
.menu-item { width: 100%; text-align: left; background: var(--card); }
.menu-item .m-ico .tab-icon { color: var(--brand); }
.empty-state-card { margin-top: var(--sp-5); text-align: center; }
.empty-state-icon { display: grid; width: 48px; height: 48px; margin: 0 auto var(--sp-3); place-items: center; border-radius: var(--r-md); color: var(--brand); background: var(--tag-blue-bg); }
.empty-state-card h1 { font-size: var(--fs-title); }
.empty-state-card p { margin: var(--sp-2) 0 var(--sp-4); color: var(--ink-3); font-size: var(--fs-body); }

/* 职称计划与统计页继续复用同一套白卡组件 */
.title-plans-screen { min-height: 100vh; padding-bottom: var(--sp-6); background: var(--bg); }
.title-plans-topbar { display: grid; min-height: 56px; grid-template-columns: var(--touch-size) 1fr var(--touch-size); align-items: center; padding: var(--sp-2) var(--sp-3); color: var(--card); background: var(--brand-grad); }
.title-plans-topbar button { display: grid; width: var(--touch-size); height: var(--touch-size); place-items: center; color: var(--card); }
.title-plans-topbar strong { text-align: center; font-size: var(--fs-title); }
.title-plans-hero { margin: var(--sp-3) var(--sp-4) 0; padding: var(--sp-4); border-radius: var(--r-lg); background: var(--card); box-shadow: var(--shadow-card); }
.title-plans-hero small { color: var(--brand); font-size: var(--fs-meta); }
.title-plans-hero h1 { font-size: var(--fs-hero); }
.title-plan-summary { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--sp-3); margin-top: var(--sp-3); }
.title-plan-summary div { text-align: center; }
.title-plan-summary strong { display: block; color: var(--brand); font-size: var(--fs-title); }
.title-plan-summary span { color: var(--ink-3); font-size: var(--fs-meta); }
.title-plan-search { display: flex; min-height: var(--touch-size); margin: var(--sp-3) var(--sp-4) 0; overflow: hidden; border: 1px solid var(--line); border-radius: var(--r-md); background: var(--card); }
.title-plan-search input { min-width: 0; flex: 1; padding: 0 var(--sp-3); border: 0; outline: 0; font-size: var(--fs-body); }
.title-plan-search button { padding: 0 var(--sp-4); color: var(--card); background: var(--brand); font-size: var(--fs-body); }
.title-plan-status-tabs { display: flex; margin-top: var(--sp-3); padding: 0 var(--sp-4); overflow-x: auto; gap: var(--sp-2); }
.title-plan-status-tabs button { flex: none; padding: var(--sp-2) var(--sp-3); border-radius: var(--r-pill); color: var(--ink-2); background: var(--card); font-size: var(--fs-meta); }
.title-plan-status-tabs button.active { color: var(--brand); background: var(--tag-blue-bg); }
.title-plan-filters { display: flex; gap: var(--sp-2); padding: var(--sp-3) var(--sp-4) 0; overflow-x: auto; }
.title-plan-filters select { min-height: var(--touch-size); padding: 0 var(--sp-3); border: 1px solid var(--line); border-radius: var(--r-pill); color: var(--ink-2); background: var(--card); font-size: var(--fs-meta); }
.title-plan-list { display: grid; gap: var(--sp-3); margin: 0 var(--sp-4); }
.title-plan-card { display: grid; gap: var(--sp-2); width: 100%; padding: var(--sp-4); border-radius: var(--r-lg); background: var(--card); box-shadow: var(--shadow-card); text-align: left; }
.title-plan-card-head,
.title-plan-card-foot,
.title-plan-row { display: flex; align-items: flex-start; justify-content: space-between; gap: var(--sp-3); }
.title-plan-card-head strong { font-size: var(--fs-card); }
.title-plan-tags { display: flex; flex-wrap: wrap; gap: var(--sp-2); }
.title-plan-tags i,
.plan-status { padding: var(--sp-1) var(--sp-2); border-radius: var(--r-sm); color: var(--brand); background: var(--tag-blue-bg); font-size: var(--fs-meta); font-style: normal; }
.title-plan-row small,
.title-plan-card-foot small { color: var(--ink-3); font-size: var(--fs-meta); }
.title-plan-row b,
.title-plan-card-foot b { color: var(--ink-2); font-size: var(--fs-meta); font-weight: 500; }
.title-plan-detail-head h2 { margin-top: var(--sp-2); font-size: var(--fs-title); }
.title-plan-long-text { padding: var(--sp-3); border-radius: var(--r-md); background: var(--bg); }
.title-plan-long-text h3 { font-size: var(--fs-card); }
.title-plan-long-text p { margin-top: var(--sp-1); color: var(--ink-2); font-size: var(--fs-body); }
.title-plan-detail-actions { display: flex; gap: var(--sp-2); }

/* 职业技能与荣誉申报：复用统一移动端信息架构 */
.service-page { padding-bottom: calc(var(--tabbar-size) + var(--sp-5)); }
.service-summary-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: var(--sp-4);
  margin: var(--sp-3) var(--sp-4) 0;
  padding: var(--sp-4);
  border-radius: var(--r-lg);
  background: var(--card);
  box-shadow: var(--shadow-card);
}
.service-summary-card > div > span { color: var(--brand); font-size: var(--fs-meta); font-weight: 600; }
.service-summary-card h1 { margin-top: var(--sp-1); font-size: var(--fs-hero); line-height: 1.4; }
.service-summary-card p { margin-top: var(--sp-1); color: var(--ink-2); font-size: var(--fs-meta); }
.service-summary-card > strong { color: var(--brand); font-size: var(--fs-title); text-align: center; }
.service-summary-card > strong small { display: block; color: var(--ink-3); font-size: var(--fs-meta); font-weight: 400; }
.service-tabs {
  position: static;
  margin-top: var(--sp-3);
  overflow-x: auto;
  scrollbar-width: none;
}
.service-tabs::-webkit-scrollbar { display: none; }
.service-tabs .cat-tab { min-width: calc(var(--sp-6) * 3); flex: 1 0 auto; }
.module-filter-row {
  display: flex;
  gap: var(--sp-2);
  padding: 0 var(--sp-4);
  overflow-x: auto;
}
.module-filter-row select,
.module-filter-row button {
  min-height: var(--touch-size);
  flex: none;
  padding: 0 var(--sp-3);
  border: 1px solid var(--line);
  border-radius: var(--r-pill);
  color: var(--ink-2);
  background: var(--card);
  font-size: var(--fs-meta);
}
.module-filter-row button { border-color: var(--brand); color: var(--brand); }
.detail-kv-list { margin-top: var(--sp-3); border-top: 1px solid var(--line); }
.detail-loading { margin-top: var(--sp-4); }
.honor-card {
  display: grid;
  grid-template-columns: calc(var(--sp-6) * 4) minmax(0, 1fr);
  align-items: stretch;
  gap: var(--sp-3);
}
.honor-card-cover {
  position: relative;
  display: grid;
  width: 100%;
  height: 100%;
  min-height: calc(var(--sp-6) * 4);
  place-items: center;
  overflow: hidden;
  border-radius: var(--r-md);
  color: var(--brand);
  background: var(--tag-blue-bg);
}
.honor-card-cover > .service-icon { width: var(--sp-6); height: var(--sp-6); }
.honor-card-cover > img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.honor-card-main { display: flex; min-width: 0; flex-direction: column; justify-content: center; }
.honor-card-main .post-tags { margin-bottom: var(--sp-1); }
.honor-card-main .post-meta { margin-top: var(--sp-2); }
.attach-item > span:nth-child(2) { flex: 1; }
.attach-item > .tiny-icon { color: var(--ink-3); }

@media (min-width: 481px) {
  body:not(.admin-body) { background: var(--line); }
  .container { box-shadow: var(--shadow-card); }
}

/* 职业资格：考试日程、动态名单与本人结果查询 */
.qualification-screen { padding-bottom: calc(var(--tabbar-size) + var(--sp-6)); }
.qualification-intro {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--sp-2);
  margin: var(--sp-3) var(--sp-4) 0;
  padding: var(--sp-3);
  border-radius: var(--r-lg);
  background: var(--card);
  box-shadow: var(--shadow-card);
}
.qualification-intro > div { min-width: 0; text-align: center; }
.qualification-intro > div + div { border-left: 1px solid var(--line); }
.qualification-intro strong { display: block; color: var(--brand); font-size: var(--fs-title); line-height: 1.4; font-variant-numeric: tabular-nums; }
.qualification-intro span { display: block; margin-top: var(--sp-1); color: var(--ink-3); font-size: var(--fs-meta); }
.qualification-tabs { position: static; margin-top: var(--sp-3); }
.qualification-section { margin-top: var(--sp-3); }
.qualification-section-note { margin-top: var(--sp-1); color: var(--ink-3); font-size: var(--fs-meta); }
.qualification-filter-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: var(--sp-2);
  margin: 0 var(--sp-4);
  padding: var(--sp-3);
  border-radius: var(--r-lg);
  background: var(--card);
  box-shadow: var(--shadow-card);
}
.qualification-filter-card input,
.qualification-filter-card select {
  min-width: 0;
  min-height: var(--touch-size);
  padding: 0 var(--sp-3);
  border: 1px solid var(--line);
  border-radius: var(--r-md);
  outline: none;
  color: var(--ink-1);
  background: var(--bg);
  font: inherit;
  font-size: var(--fs-body);
}
.qualification-status-row { padding-bottom: 0; }
.qualification-schedule-list {
  margin: var(--sp-3) var(--sp-4) 0;
  overflow: hidden;
  border-radius: var(--r-lg);
  background: var(--card);
  box-shadow: var(--shadow-card);
}
.qualification-schedule-row {
  display: grid;
  grid-template-columns: calc(var(--sp-6) * 3) minmax(0, 1fr) auto;
  align-items: start;
  gap: var(--sp-3);
  padding: var(--sp-3) var(--sp-4);
  border-bottom: 1px solid var(--line);
}
.qualification-schedule-row:last-child { border-bottom: 0; }
.qualification-countdown {
  padding: var(--sp-2) var(--sp-1);
  border-radius: var(--r-md);
  color: var(--brand);
  background: var(--tag-blue-bg);
  text-align: center;
}
.qualification-countdown.urgent { color: var(--tag-red); background: var(--tag-red-bg); }
.qualification-countdown strong { display: block; font-size: var(--fs-body); line-height: 1.4; }
.qualification-countdown span { display: block; margin-top: var(--sp-1); font-size: var(--fs-meta); }
.qualification-schedule-main { min-width: 0; }
.qualification-schedule-title {
  color: var(--ink-1);
  font-size: var(--fs-card);
  font-weight: 600;
  line-height: 1.45;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.qualification-schedule-main .post-tags { margin-top: var(--sp-1); }
.qualification-time-grid {
  display: grid;
  grid-template-columns: calc(var(--sp-6) * 2) minmax(0, 1fr);
  gap: var(--sp-1) var(--sp-2);
  margin-top: var(--sp-2);
  font-size: var(--fs-meta);
  line-height: 1.45;
}
.qualification-time-grid span { color: var(--ink-3); }
.qualification-time-grid b { color: var(--ink-2); font-weight: 500; }
.qualification-detail-link { align-self: center; color: var(--brand); font-size: var(--fs-meta); white-space: nowrap; }
.qualification-roster-row { grid-template-columns: calc(var(--sp-6) * 2) auto minmax(0, 1fr) auto; color: inherit; text-decoration: none; }
.qualification-roster-main { min-width: 0; display: grid; gap: var(--sp-1); }
.qualification-roster-major { min-width: 0; color: var(--ink-2); font-size: var(--fs-meta); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.qualification-roster-level { color: var(--ink-1); font-size: var(--fs-meta); font-weight: 600; white-space: nowrap; }
.qualification-roster-cta { margin-top: var(--sp-3); }
.qualification-query-card {
  margin: 0 var(--sp-4);
  padding: var(--sp-4);
  border-radius: var(--r-lg);
  background: var(--card);
  box-shadow: var(--shadow-card);
}
.qualification-query-card .post-desc { margin-top: var(--sp-1); }
.qualification-query-card form { margin-top: var(--sp-3); }
.qualification-result {
  margin-top: var(--sp-3);
  padding: var(--sp-3);
  border-radius: var(--r-md);
  background: var(--bg);
}
.qualification-result.found { background: var(--tag-green-bg); }
.qualification-result-title { color: var(--ink-1); font-size: var(--fs-body); font-weight: 600; }
.qualification-result-row { display: grid; gap: var(--sp-1); padding: var(--sp-3) 0; border-bottom: 1px solid var(--line); color: inherit; text-decoration: none; }
.qualification-result-row:last-child { padding-bottom: 0; border-bottom: 0; }
.qualification-result-row > div { display: flex; justify-content: space-between; gap: var(--sp-2); }
.qualification-result-row strong,
.qualification-result-row b { color: var(--ink-1); font-size: var(--fs-body); }
.qualification-result-row span { color: var(--ink-2); font-size: var(--fs-meta); }
.qualification-cta { margin-bottom: var(--sp-5); }
.qualification-detail-times { margin-top: var(--sp-2); border-top: 1px solid var(--line); }
.qualification-detail-times > div { display: grid; grid-template-columns: calc(var(--sp-6) * 4) minmax(0, 1fr); gap: var(--sp-3); padding: var(--sp-3) 0; border-bottom: 1px solid var(--line); }
.qualification-detail-times span { color: var(--ink-3); font-size: var(--fs-meta); }
.qualification-detail-times strong { color: var(--ink-1); font-size: var(--fs-body); font-weight: 600; text-align: right; }
.consult-sales-name { margin-top: var(--sp-3); color: var(--brand); font-size: var(--fs-meta); font-weight: 600; text-align: center; }
.consult-popup-qr { display: block; width: min(100%, calc(var(--sp-6) * 10)); aspect-ratio: 1; object-fit: contain; margin: var(--sp-3) auto; border: 1px solid var(--line); border-radius: var(--r-md); background: var(--card); }