/* ==========================================================================
   邢企职通车 · 官网设计系统
   site.css —— 单一入口，包含 tokens / 基础层 / 组件层 / 页面层
   主色：蓝色系  |  风格：现代简约
   ========================================================================== */

/* ---------- 1. 设计令牌 ---------- */
:root {
  /* 品牌蓝 */
  --brand-50:  #eff6ff;
  --brand-100: #dbeafe;
  --brand-200: #bfdbfe;
  --brand-300: #93c5fd;
  --brand-500: #3b82f6;
  --brand-600: #2563eb;
  --brand-700: #1d4ed8;
  --brand-800: #1e40af;
  --brand-900: #1e3a8a;
  /* 强调色（薪资 / 高亮） */
  --accent:    #f97316;
  --accent-bg: #fff7ed;
  /* 中性 */
  --ink-900: #0f172a;
  --ink-800: #1e293b;
  --ink-700: #334155;
  --ink-600: #475569;
  --ink-500: #64748b;
  --ink-400: #94a3b8;
  --ink-300: #cbd5e1;
  --ink-200: #e2e8f0;
  /* 背景与描边 */
  --bg:        #f5f7fb;
  --surface:   #ffffff;
  --line:      #e8ecf3;
  --line-soft: #f1f4f9;
  /* 语义色 */
  --success: #16a34a;
  --warning: #f59e0b;
  --danger:  #dc2626;
  /* 圆角 */
  --r-xs: 6px;
  --r-sm: 8px;
  --r-md: 12px;
  --r-lg: 16px;
  --r-xl: 22px;
  --r-pill: 999px;
  /* 阴影 */
  --sh-xs: 0 1px 2px rgba(15, 23, 42, .05);
  --sh-sm: 0 2px 8px rgba(15, 23, 42, .06);
  --sh-md: 0 8px 24px rgba(15, 23, 42, .08);
  --sh-lg: 0 18px 44px rgba(15, 23, 42, .12);
  --sh-brand: 0 10px 26px rgba(37, 99, 235, .28);
  /* 布局 */
  --container: 1200px;
  --header-h: 64px;
  --font: -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB",
          "Microsoft YaHei", "Helvetica Neue", Arial, sans-serif;
}

/* ---------- 2. 重置与基础 ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  font-family: var(--font);
  font-size: 14px;
  line-height: 1.6;
  color: var(--ink-800);
  background: var(--bg);
  -webkit-font-smoothing: antialiased;
  /* Sticky Footer：内容不足一屏时页脚仍吸在视口底部（配合 .site-footer 的 margin-top:auto） */
  min-height: 100vh;
  display: flex;
  flex-direction: column;
}
h1, h2, h3, h4, h5 { margin: 0; font-weight: 600; color: var(--ink-900); }
p { margin: 0; }
ul, ol { margin: 0; padding: 0; list-style: none; }
a { color: inherit; text-decoration: none; transition: color .18s ease, background-color .18s ease, border-color .18s ease; }
a:hover { color: var(--brand-600); }
img { max-width: 100%; display: block; border: 0; }
button, input, select, textarea { font: inherit; color: inherit; }
button { cursor: pointer; border: 0; background: none; }
hr { border: 0; border-top: 1px solid var(--line); margin: 0; }
::selection { background: var(--brand-200); }

/* ---------- 3. 布局工具 ---------- */
.container { width: 100%; max-width: var(--container); margin: 0 auto; padding: 0 24px; }
.page { padding: 28px 0 56px; }
.stack-8  { display: flex; flex-direction: column; gap: 8px; }
.stack-12 { display: flex; flex-direction: column; gap: 12px; }
.stack-16 { display: flex; flex-direction: column; gap: 16px; }
.row { display: flex; align-items: center; }
.row-between { display: flex; align-items: center; justify-content: space-between; }
.wrap { flex-wrap: wrap; }
.gap-8 { gap: 8px; } .gap-12 { gap: 12px; } .gap-16 { gap: 16px; } .gap-24 { gap: 24px; }
.grow { flex: 1 1 auto; min-width: 0; }
.muted { color: var(--ink-500); }
.strong { color: var(--ink-900); font-weight: 600; }
.nowrap { white-space: nowrap; }
.ellipsis { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.clamp-2 { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.hidden { display: none !important; }

/* ---------- 4. 按钮 ---------- */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 6px;
  height: 38px; padding: 0 18px;
  border-radius: var(--r-sm);
  font-size: 14px; font-weight: 500; white-space: nowrap;
  border: 1px solid transparent;
  transition: all .18s ease;
}
.btn--primary { background: var(--brand-600); color: #fff; box-shadow: var(--sh-brand); }
.btn--primary:hover { background: var(--brand-700); color: #fff; transform: translateY(-1px); }
.btn--outline { background: #fff; color: var(--brand-600); border-color: var(--brand-200); }
.btn--outline:hover { background: var(--brand-50); border-color: var(--brand-500); color: var(--brand-700); }
.btn--ghost { background: var(--brand-50); color: var(--brand-700); }
.btn--ghost:hover { background: var(--brand-100); color: var(--brand-800); }
.btn--soft { background: #fff; color: var(--ink-600); border-color: var(--line); }
.btn--soft:hover { color: var(--brand-600); border-color: var(--brand-300); }
.btn--lg { height: 46px; padding: 0 26px; font-size: 15px; border-radius: var(--r-md); }
.btn--sm { height: 32px; padding: 0 12px; font-size: 13px; border-radius: var(--r-xs); }
.btn--block { width: 100%; }

/* ---------- 5. 标签 ---------- */
.tag {
  display: inline-flex; align-items: center;
  height: 24px; padding: 0 9px;
  border-radius: var(--r-xs);
  background: var(--bg);
  color: var(--ink-600);
  font-size: 12px; line-height: 1;
}
.tag--soft { background: var(--brand-50); color: var(--brand-700); }
.tag--line { background: #fff; border: 1px solid var(--line); }
.tag--accent { background: var(--accent-bg); color: #c2410c; }
.tag--salary { background: transparent; color: var(--accent); font-weight: 600; padding: 0; font-size: 15px; }

/* ---------- 6. 卡片 ---------- */
.card {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--r-lg);
  box-shadow: var(--sh-xs);
}
.card--pad { padding: 22px; }
.card--hover { transition: box-shadow .2s ease, transform .2s ease, border-color .2s ease; }
.card--hover:hover { box-shadow: var(--sh-md); transform: translateY(-3px); border-color: var(--brand-200); }

/* 企业/头像 占位图（无图片资源时使用） */
.logo-ph {
  display: inline-flex; align-items: center; justify-content: center;
  width: 48px; height: 48px; flex: 0 0 auto;
  border-radius: var(--r-sm);
  background: linear-gradient(135deg, var(--brand-100) 0%, #ffffff 100%);
  color: var(--brand-700);
  font-size: 18px; font-weight: 600;
  box-shadow: inset 0 0 0 1px rgba(37, 99, 235, .10);
  overflow: hidden;
}
.logo-ph--lg { width: 72px; height: 72px; border-radius: var(--r-md); font-size: 26px; }
.logo-ph--sm { width: 36px; height: 36px; font-size: 15px; }
.logo-ph img { width: 100%; height: 100%; object-fit: cover; }

/* ---------- 7. 空状态 ---------- */
.empty {
  padding: 56px 24px; text-align: center; color: var(--ink-400);
  background: var(--surface); border: 1px dashed var(--line); border-radius: var(--r-lg);
}
.empty__title { color: var(--ink-600); font-size: 15px; margin-bottom: 4px; }

/* ---------- 8. 分页 ---------- */
.pager { display: flex; justify-content: center; align-items: center; gap: 8px; margin-top: 32px; }
.pager a, .pager span {
  min-width: 36px; height: 36px; padding: 0 12px;
  display: inline-flex; align-items: center; justify-content: center;
  border-radius: var(--r-sm); border: 1px solid var(--line); background: #fff;
  color: var(--ink-600); font-size: 13px;
}
.pager a:hover { border-color: var(--brand-500); color: var(--brand-600); }
.pager .is-active { background: var(--brand-600); border-color: var(--brand-600); color: #fff; }
.pager .is-disabled { color: var(--ink-300); pointer-events: none; }

/* ---------- 9. 区块标题 ---------- */
.section { margin-top: 52px; }
.section:first-child { margin-top: 0; }
.section-head { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 20px; }
.section-title {
  display: flex; align-items: center; gap: 10px;
  font-size: 20px; font-weight: 600; letter-spacing: -.01em;
}
.section-title::before {
  content: ""; width: 4px; height: 18px; border-radius: var(--r-pill);
  background: linear-gradient(180deg, var(--brand-500), var(--brand-700));
  flex: 0 0 auto;
}
.section-title small { font-size: 13px; font-weight: 400; color: var(--ink-400); margin-left: 0; }
.section-more {
  display: inline-flex; align-items: center; gap: 4px;
  padding: 6px 14px; border-radius: var(--r-pill);
  font-size: 13px; color: var(--ink-500);
  background: var(--surface); border: 1px solid var(--line);
  transition: all .18s ease;
}
.section-more:hover { color: var(--brand-600); border-color: var(--brand-200); background: var(--brand-50); }

/* 区块浅色承托带：让上下区块产生节奏，避免整页一片白 */
.section--band {
  padding: 26px 26px 28px;
  background: linear-gradient(135deg, #f8fafc 0%, #eff6ff 58%, #f8fafc 100%);
  border: 1px solid var(--line); border-radius: var(--r-xl);
}

/* 浮层区块：上移压住 Hero 下沿，形成视觉层次 */
.section.section--float { margin-top: -36px; position: relative; z-index: 2; }

/* ==========================================================================
   10. 站点头部
   ========================================================================== */
.site-header {
  position: sticky; top: 0; z-index: 100;
  background: rgba(255, 255, 255, .92);
  backdrop-filter: saturate(180%) blur(12px);
  border-bottom: 1px solid var(--line);
}
.site-header__inner {
  height: var(--header-h);
  display: flex; align-items: center; gap: 28px;
}
.brand { display: flex; align-items: center; gap: 10px; flex: 0 0 auto; }
.brand__mark {
  width: 36px; height: 36px; border-radius: 10px;
  background: linear-gradient(135deg, var(--brand-500), var(--brand-700));
  color: #fff; font-size: 17px; font-weight: 600;
  display: flex; align-items: center; justify-content: center;
  box-shadow: var(--sh-brand);
}
.brand__name { font-size: 18px; font-weight: 600; color: var(--ink-900); letter-spacing: -.02em; }
.brand__sub { display: block; font-size: 10px; color: var(--ink-400); letter-spacing: .16em; text-transform: uppercase; }
.brand:hover .brand__name { color: var(--brand-600); }

.main-nav { display: flex; align-items: center; gap: 4px; }
.main-nav a {
  padding: 8px 14px; border-radius: var(--r-sm);
  font-size: 15px; color: var(--ink-700);
}
.main-nav a:hover { background: var(--brand-50); color: var(--brand-700); }
.main-nav a.is-active { color: var(--brand-600); font-weight: 500; background: var(--brand-50); }

.header-tools { margin-left: auto; display: flex; align-items: center; gap: 12px; }
.header-city {
  display: inline-flex; align-items: center; gap: 6px;
  height: 34px; padding: 0 12px; border-radius: var(--r-pill);
  background: var(--bg); color: var(--ink-600); font-size: 13px;
}
.header-city svg { opacity: .6; }
.header-link { font-size: 14px; color: var(--ink-600); }
.header-link:hover { color: var(--brand-600); }
.header-logout { font-size: 14px; color: var(--ink-400); }
.header-logout:hover { color: var(--danger); }
.header-logout:disabled { opacity: .6; cursor: not-allowed; }
.user-chip { display: flex; align-items: center; gap: 8px; padding: 4px 10px 4px 4px; border-radius: var(--r-pill); }
.user-chip:hover { background: var(--bg); }
.user-chip__name { font-size: 14px; color: var(--ink-700); }

/* ==========================================================================
   11. 首页
   ========================================================================== */
.hero {
  color: #fff; padding: 66px 0 78px;
  position: relative; overflow: hidden;
  background:
    radial-gradient(820px 340px at 84% -16%, rgba(191, 219, 254, .42), transparent 68%),
    radial-gradient(620px 300px at 4% 112%, rgba(96, 165, 250, .34), transparent 70%),
    linear-gradient(135deg, #1e3a8a 0%, #2563eb 48%, #3b82f6 100%);
}
.hero::after {
  content: ""; position: absolute; right: -120px; top: -120px;
  width: 420px; height: 420px; border-radius: 50%;
  background: rgba(255, 255, 255, .07);
}
.hero::before {
  content: ""; position: absolute; left: -80px; bottom: -160px;
  width: 320px; height: 320px; border-radius: 50%;
  background: rgba(255, 255, 255, .05);
}
.hero__inner { position: relative; z-index: 1; }

/* Hero 徽标（带呼吸小圆点） */
.hero-badge {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 6px 14px; margin-bottom: 18px;
  border-radius: var(--r-pill);
  background: rgba(255, 255, 255, .14);
  border: 1px solid rgba(255, 255, 255, .24);
  font-size: 13px; color: #fff;
}
.hero-badge::before {
  content: ""; width: 6px; height: 6px; border-radius: 50%;
  background: #4ade80; box-shadow: 0 0 0 3px rgba(74, 222, 128, .3);
  flex: 0 0 auto;
}

.hero h1 { color: #fff; font-size: 38px; line-height: 1.24; letter-spacing: -.02em; }
.hero h1 em {
  font-style: normal;
  background: linear-gradient(90deg, #bfdbfe 0%, #ffffff 100%);
  -webkit-background-clip: text; background-clip: text;
  -webkit-text-fill-color: transparent;
}
.hero__desc { margin-top: 14px; font-size: 15px; color: rgba(255, 255, 255, .82); }

.hero-search {
  margin-top: 30px; max-width: 720px;
  background: #fff; border-radius: var(--r-lg);
  padding: 10px; display: flex; gap: 10px;
  box-shadow: var(--sh-lg);
}
.hero-search__input {
  flex: 1; height: 46px; padding: 0 16px;
  border: 0; border-radius: var(--r-sm); background: var(--bg);
  font-size: 15px; outline: none;
}
.hero-search__input:focus { background: var(--brand-50); }
.hero-search .btn { height: 46px; padding: 0 30px; border-radius: var(--r-sm); }

.hero-hot { margin-top: 18px; display: flex; align-items: center; flex-wrap: wrap; gap: 10px; font-size: 13px; }
.hero-hot__label { color: rgba(255, 255, 255, .7); }
.hero-hot a {
  padding: 4px 12px; border-radius: var(--r-pill);
  background: rgba(255, 255, 255, .14); color: #fff; font-size: 13px;
}
.hero-hot a:hover { background: rgba(255, 255, 255, .26); color: #fff; }

.hero-stats { margin-top: 34px; display: flex; flex-wrap: wrap; gap: 14px; }
.hero-stat {
  min-width: 132px; padding: 14px 22px;
  border-radius: var(--r-md);
  background: rgba(255, 255, 255, .12);
  border: 1px solid rgba(255, 255, 255, .18);
  backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px);
}
.hero-stat b { display: block; font-size: 26px; font-weight: 700; color: #fff; line-height: 1.1; }
.hero-stat span { font-size: 13px; color: rgba(255, 255, 255, .76); }

/* 首页：分类 + 职位 双栏 */
.home-grid { display: grid; grid-template-columns: 250px 1fr; gap: 24px; align-items: start; }

.cat-panel { padding: 10px; position: sticky; top: calc(var(--header-h) + 20px); }
.cat-panel__head {
  display: flex; align-items: center; gap: 8px;
  padding: 12px 14px 10px; font-size: 15px; font-weight: 600; color: var(--ink-900);
}
.cat-panel__head::before {
  content: ""; width: 4px; height: 16px; border-radius: var(--r-pill);
  background: linear-gradient(180deg, var(--brand-500), var(--brand-700));
  flex: 0 0 auto;
}
.cat-list a {
  display: flex; align-items: center; justify-content: space-between; gap: 8px;
  padding: 10px 14px; border-radius: var(--r-sm);
  font-size: 14px; color: var(--ink-700);
}
.cat-list a:hover { background: var(--brand-50); color: var(--brand-700); }
/* ⚠️ 修复：原 `.cat-list a span` 会把「分类名 + 数量」两个 span 一起染成最浅的 --ink-300，
   导致整个分类列表文字淡到几乎看不清（2026-10-12 用户反馈）。改为按位置区分：
   分类名用深色，右侧数量才用浅色小字。 */
.cat-list a span:first-child { color: var(--ink-800); font-weight: 500; }
.cat-list a span:last-child { color: var(--ink-400); font-size: 12px; }
.cat-list a:hover span:first-child { color: var(--brand-700); }
.cat-list a:hover span:last-child { color: var(--brand-500); }

/* 职位卡片网格 */
.job-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.job-card { padding: 18px 20px; display: flex; flex-direction: column; gap: 12px; position: relative; overflow: hidden; }
/* 悬停时左侧渐显色条，增加反馈与层次 */
.job-card::before {
  content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 3px;
  background: linear-gradient(180deg, var(--brand-500), var(--brand-700));
  transform: scaleY(0); transform-origin: top;
  transition: transform .24s ease;
}
.job-card:hover::before { transform: scaleY(1); }
.job-card__top { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.job-card__name { font-size: 16px; font-weight: 600; color: var(--ink-900); }
.job-card__name:hover { color: var(--brand-600); }
.job-card__salary { color: var(--accent); font-size: 16px; font-weight: 600; white-space: nowrap; }
.job-card__tags { display: flex; flex-wrap: wrap; gap: 8px; }
.job-card__foot {
  display: flex; align-items: center; gap: 10px;
  padding-top: 12px; border-top: 1px solid var(--line-soft);
}
.job-card__company { font-size: 13px; color: var(--ink-600); }
.job-card__industry { font-size: 12px; color: var(--ink-400); margin-left: auto; }

/* 首页：企业卡片 */
.company-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.company-tile { padding: 20px; display: flex; flex-direction: column; gap: 14px; position: relative; overflow: hidden; }
/* 悬停时顶部渐显彩条（蓝→橙），与企业卡片呼应 */
.company-tile::after {
  content: ""; position: absolute; left: 0; right: 0; top: 0; height: 3px;
  background: linear-gradient(90deg, var(--brand-500), var(--accent));
  opacity: 0; transition: opacity .24s ease;
}
.company-tile:hover::after { opacity: 1; }
.company-tile__head { display: flex; align-items: center; gap: 12px; }
.company-tile__name { font-size: 15px; font-weight: 600; color: var(--ink-900); }
.company-tile__name:hover { color: var(--brand-600); }
.company-tile__tags { display: flex; flex-wrap: wrap; gap: 6px; }
.company-tile__jobs { display: flex; flex-direction: column; gap: 2px; }
.company-tile__job {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  padding: 8px 10px; border-radius: var(--r-sm); font-size: 13px;
}
.company-tile__job:hover { background: var(--brand-50); }
.company-tile__job .name { color: var(--ink-700); }
.company-tile__job .sal { color: var(--accent); font-weight: 500; white-space: nowrap; }

/* 首页：快捷找活宫格（彩色图标入口，打破一片白的单调） */
.quick-grid { display: grid; grid-template-columns: repeat(8, minmax(0, 1fr)); gap: 12px; }
.quick-item {
  display: flex; flex-direction: column; align-items: center; gap: 10px;
  padding: 20px 8px 16px;
  background: var(--surface); border: 1px solid var(--line);
  border-radius: var(--r-md);
  transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
.quick-item:hover { transform: translateY(-3px); box-shadow: var(--sh-md); border-color: transparent; }
.quick-item__ico {
  width: 46px; height: 46px; border-radius: var(--r-md);
  display: flex; align-items: center; justify-content: center;
  color: #fff; font-size: 19px; font-weight: 600;
  box-shadow: 0 6px 14px rgba(15, 23, 42, .14);
}
.quick-item__name { font-size: 13px; color: var(--ink-700); text-align: center; }
.quick-item:hover .quick-item__name { color: var(--brand-600); }

/* 宫格图标配色轮换（8 色循环） */
.quick-item:nth-child(8n+1) .quick-item__ico { background: linear-gradient(135deg, #60a5fa, #2563eb); }
.quick-item:nth-child(8n+2) .quick-item__ico { background: linear-gradient(135deg, #fb923c, #ea580c); }
.quick-item:nth-child(8n+3) .quick-item__ico { background: linear-gradient(135deg, #34d399, #059669); }
.quick-item:nth-child(8n+4) .quick-item__ico { background: linear-gradient(135deg, #a78bfa, #7c3aed); }
.quick-item:nth-child(8n+5) .quick-item__ico { background: linear-gradient(135deg, #22d3ee, #0891b2); }
.quick-item:nth-child(8n+6) .quick-item__ico { background: linear-gradient(135deg, #f472b6, #db2777); }
.quick-item:nth-child(8n+7) .quick-item__ico { background: linear-gradient(135deg, #fbbf24, #d97706); }
.quick-item:nth-child(8n+8) .quick-item__ico { background: linear-gradient(135deg, #818cf8, #4f46e5); }

/* 首页：底部 CTA 区块（企业招聘入口） */
.cta-band {
  position: relative; overflow: hidden;
  margin-top: 52px; padding: 36px 42px;
  border-radius: var(--r-xl); color: #fff;
  background: linear-gradient(120deg, #1e3a8a 0%, #2563eb 52%, #3b82f6 100%);
  box-shadow: var(--sh-lg);
  display: flex; align-items: center; justify-content: space-between; gap: 28px;
}
.cta-band::after {
  content: ""; position: absolute; right: -70px; top: -90px;
  width: 300px; height: 300px; border-radius: 50%;
  background: rgba(255, 255, 255, .08);
}
.cta-band__text { position: relative; z-index: 1; }
.cta-band__title { font-size: 22px; font-weight: 600; color: #fff; }
.cta-band__desc { margin-top: 8px; font-size: 14px; color: rgba(255, 255, 255, .84); }
.cta-band__actions { position: relative; z-index: 1; display: flex; gap: 12px; flex: 0 0 auto; }
.cta-band .btn--light { background: #fff; color: var(--brand-700); }
.cta-band .btn--light:hover { background: var(--brand-50); }
.cta-band .btn--outline-light { background: rgba(255, 255, 255, .14); color: #fff; border: 1px solid rgba(255, 255, 255, .36); }
.cta-band .btn--outline-light:hover { background: rgba(255, 255, 255, .26); color: #fff; }

/* ==========================================================================
   12. 职位列表页
   ========================================================================== */
.filter-bar {
  padding: 6px 20px; margin-bottom: 20px;
}
.filter-row { display: flex; gap: 16px; padding: 12px 0; border-bottom: 1px solid var(--line-soft); }
.filter-row:last-child { border-bottom: 0; }
.filter-row__label { flex: 0 0 68px; color: var(--ink-400); font-size: 13px; line-height: 26px; }
.filter-row__opts { display: flex; flex-wrap: wrap; gap: 4px; flex: 1; }
.filter-opt {
  padding: 4px 12px; border-radius: var(--r-xs); font-size: 13px; color: var(--ink-600);
}
.filter-opt:hover { background: var(--brand-50); color: var(--brand-700); }
.filter-opt.is-active { background: var(--brand-600); color: #fff; }

.result-head { display: flex; align-items: baseline; justify-content: space-between; margin-bottom: 14px; }
.result-head h2 { font-size: 17px; }
.result-head .count { font-size: 13px; color: var(--ink-400); font-weight: 400; margin-left: 8px; }

.job-list { display: flex; flex-direction: column; gap: 12px; }
.job-row {
  display: flex; align-items: center; gap: 18px;
  padding: 18px 20px;
  background: #fff; border: 1px solid var(--line); border-radius: var(--r-lg);
  transition: box-shadow .2s ease, border-color .2s ease, transform .2s ease;
}
.job-row:hover { box-shadow: var(--sh-md); border-color: var(--brand-200); transform: translateY(-1px); }
.job-row__main { flex: 1 1 auto; min-width: 0; }
.job-row__title-line { display: flex; align-items: center; gap: 10px; }
.job-row__name { font-size: 16px; font-weight: 600; color: var(--ink-900); }
.job-row__name:hover { color: var(--brand-600); }
.job-row__salary { color: var(--accent); font-size: 16px; font-weight: 600; }
.job-row__tags { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 10px; }
.job-row__desc { margin-top: 8px; font-size: 13px; color: var(--ink-400); }
.job-row__side { display: flex; flex-direction: column; align-items: flex-end; gap: 10px; flex: 0 0 auto; }
.job-row__company { display: flex; align-items: center; gap: 10px; }
.job-row__company .name { font-size: 13px; color: var(--ink-600); }
.job-row__time { font-size: 12px; color: var(--ink-300); }

.hot-tags { display: flex; flex-wrap: wrap; gap: 8px; }
.hot-tags a {
  padding: 6px 14px; border-radius: var(--r-pill);
  background: #fff; border: 1px solid var(--line); color: var(--ink-600); font-size: 13px;
}
.hot-tags a:hover { border-color: var(--brand-300); color: var(--brand-600); background: var(--brand-50); }

.side-panel { padding: 20px; }
.side-panel + .side-panel { margin-top: 16px; }
.side-panel__title { font-size: 15px; font-weight: 600; margin-bottom: 14px; }

/* ==========================================================================
   13. 公司列表 / 详情
   ========================================================================== */
.chips { display: flex; flex-wrap: wrap; gap: 8px; }
.chip {
  padding: 6px 16px; border-radius: var(--r-pill);
  background: #fff; border: 1px solid var(--line); color: var(--ink-600); font-size: 13px;
}
.chip:hover { border-color: var(--brand-300); color: var(--brand-600); }
.chip.is-active { background: var(--brand-600); border-color: var(--brand-600); color: #fff; }

.company-list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.company-card { padding: 20px; display: flex; flex-direction: column; gap: 14px; }
.company-card__head { display: flex; align-items: center; gap: 12px; }
.company-card__name { font-size: 15px; font-weight: 600; color: var(--ink-900); display: block; }
.company-card__name:hover { color: var(--brand-600); }
.company-card__meta { font-size: 12px; color: var(--ink-400); margin-top: 3px; }
.company-card__jobs { display: flex; flex-direction: column; gap: 2px; }
.company-card__job {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  padding: 8px 10px; border-radius: var(--r-sm); font-size: 13px; color: var(--ink-700);
}
.company-card__job:hover { background: var(--brand-50); }
.company-card__job .sal { color: var(--accent); white-space: nowrap; }

/* 公司详情 */
.company-banner {
  background: linear-gradient(135deg, #1e3a8a 0%, #2563eb 100%);
  color: #fff; border-radius: var(--r-xl); padding: 32px;
  display: flex; gap: 24px; align-items: flex-start;
}
.company-banner .logo-ph {
  width: 84px; height: 84px; font-size: 32px;
  background: rgba(255, 255, 255, .18); color: #fff;
}
.company-banner__name { font-size: 26px; font-weight: 600; color: #fff; }
.company-banner__tags { margin-top: 14px; display: flex; flex-wrap: wrap; gap: 8px; }
.company-banner__tags .tag { background: rgba(255, 255, 255, .16); color: #fff; }
.company-banner__desc { margin-top: 16px; font-size: 14px; color: rgba(255, 255, 255, .82); max-width: 760px; }

.info-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }
.info-item { padding: 18px 20px; }
.info-item__label { font-size: 12px; color: var(--ink-400); }
.info-item__value { margin-top: 6px; font-size: 15px; font-weight: 500; color: var(--ink-900); word-break: break-all; }

/* ==========================================================================
   14. 职位详情
   ========================================================================== */
.detail-grid { display: grid; grid-template-columns: 1fr 340px; gap: 24px; align-items: start; }
.detail-main { display: flex; flex-direction: column; gap: 16px; }
.detail-aside { display: flex; flex-direction: column; gap: 16px; position: sticky; top: calc(var(--header-h) + 20px); }

.job-head { padding: 26px 28px; }
.job-head__title { display: flex; align-items: baseline; gap: 14px; flex-wrap: wrap; }
.job-head__name { font-size: 24px; font-weight: 600; }
.job-head__salary { color: var(--accent); font-size: 22px; font-weight: 600; }
.job-head__tags { margin-top: 16px; display: flex; flex-wrap: wrap; gap: 8px; }
.job-head__stats { margin-top: 18px; display: flex; gap: 24px; font-size: 13px; color: var(--ink-400); }

.block { padding: 24px 28px; }
.block__title { font-size: 16px; font-weight: 600; margin-bottom: 16px; padding-left: 12px; position: relative; }
.block__title::before {
  content: ""; position: absolute; left: 0; top: 50%; transform: translateY(-50%);
  width: 4px; height: 16px; border-radius: 2px; background: var(--brand-600);
}
.rich-text { font-size: 14px; line-height: 1.9; color: var(--ink-700); word-break: break-word; }
.rich-text br { line-height: 1.9; }

.map-box { height: 260px; border-radius: var(--r-md); overflow: hidden; background: var(--bg); border: 1px solid var(--line); }

/* ---- 地图（Leaflet + 高德瓦片，无需任何 key）----
   下面是 Leaflet 的经典踩坑：站点第 77 行的全局 `img { max-width: 100%; display: block }`
   会把瓦片与标记图标压变形，必须对地图容器内的 img 复位（Leaflet 自己按内联宽高定位）。 */
.leaflet-container img { max-width: none !important; }
.leaflet-container { font: inherit; background: #e9eef5; }
.leaflet-container .leaflet-control-attribution { font-size: 11px; background: rgba(255, 255, 255, .78); }
.leaflet-popup-content { margin: 10px 12px; font-size: 13px; line-height: 1.7; }
.leaflet-popup-content .map-popup__meta { color: var(--ink-400); font-size: 12px; margin-top: 4px; }

/* 地图不可用时的降级卡片（无坐标 / Leaflet 未加载 / 瓦片全部失败） */
.map-fallback {
  height: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 12px;
  padding: 16px;
  text-align: center;
  color: var(--ink-400);
  font-size: 14px;
}
.map-fallback p { margin: 0; }

.aside-company { padding: 24px; }
.aside-company__head { display: flex; align-items: center; gap: 14px; }
.aside-company__name { font-size: 16px; font-weight: 600; }
.aside-company__meta { font-size: 12px; color: var(--ink-400); margin-top: 4px; }
.aside-actions { margin-top: 20px; display: flex; flex-direction: column; gap: 10px; }
.btn-collect.is-collected, .btn-collect-text.collected { color: var(--brand-600); border-color: var(--brand-500); background: var(--brand-50); }

.related-list { display: flex; flex-direction: column; }
.related-item {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  padding: 12px 14px; border-radius: var(--r-sm); font-size: 14px;
}
.related-item + .related-item { border-top: 1px solid var(--line-soft); border-radius: 0; }
.related-item:hover { background: var(--brand-50); }
.related-item .name { color: var(--ink-800); }
.related-item .sal { color: var(--accent); white-space: nowrap; font-weight: 500; }

/* ==========================================================================
   15. 校园页
   ========================================================================== */
.campus-hero {
  border-radius: var(--r-xl); padding: 40px;
  background: linear-gradient(135deg, #1e3a8a 0%, #2563eb 55%, #6366f1 100%);
  color: #fff;
}
.campus-hero h1 { color: #fff; font-size: 30px; }
.campus-hero p { margin-top: 12px; color: rgba(255, 255, 255, .84); font-size: 15px; max-width: 640px; }

.rec-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }
.rec-card { padding: 20px; display: flex; flex-direction: column; gap: 12px; }
.rec-card__title { font-size: 15px; font-weight: 600; color: var(--ink-900); line-height: 1.5; }
.rec-card__meta { display: flex; align-items: center; justify-content: space-between; font-size: 12px; color: var(--ink-400); }

/* ==========================================================================
   16. 登录 / 注册
   ========================================================================== */
.auth-page {
  min-height: 100vh; display: grid; grid-template-columns: 1fr 1fr;
}
.auth-visual {
  background: linear-gradient(150deg, #1e3a8a 0%, #2563eb 55%, #3b82f6 100%);
  color: #fff; padding: 56px 60px; display: flex; flex-direction: column;
  position: relative; overflow: hidden;
}
.auth-visual::after {
  content: ""; position: absolute; right: -140px; bottom: -140px;
  width: 460px; height: 460px; border-radius: 50%; background: rgba(255, 255, 255, .07);
}
.auth-visual__brand { display: flex; align-items: center; gap: 12px; position: relative; z-index: 1; }
.auth-visual__brand .brand__mark { background: rgba(255, 255, 255, .2); box-shadow: none; width: 42px; height: 42px; font-size: 20px; }
.auth-visual__brand .brand__name { color: #fff; font-size: 20px; }
.auth-visual__brand .brand__sub { color: rgba(255, 255, 255, .7); }
.auth-visual__hero { margin-top: auto; position: relative; z-index: 1; }
.auth-visual__hero h2 { color: #fff; font-size: 30px; line-height: 1.35; }
.auth-visual__hero p { margin-top: 14px; color: rgba(255, 255, 255, .8); font-size: 15px; }
.auth-visual__points { margin-top: 28px; display: flex; flex-direction: column; gap: 14px; }
.auth-point { display: flex; gap: 12px; align-items: flex-start; }
.auth-point__ico {
  width: 32px; height: 32px; flex: 0 0 auto; border-radius: 9px;
  background: rgba(255, 255, 255, .18); display: flex; align-items: center; justify-content: center; font-size: 15px;
}
.auth-point b { display: block; font-size: 14px; font-weight: 500; }
.auth-point span { font-size: 12px; color: rgba(255, 255, 255, .72); }

.auth-panel {
  display: flex; align-items: center; justify-content: center;
  padding: 40px 24px; background: var(--surface);
}
.auth-card { width: 100%; max-width: 400px; }
.auth-card__title { font-size: 24px; font-weight: 600; }
.auth-card__sub { margin-top: 8px; font-size: 14px; color: var(--ink-500); }
.qr-frame {
  margin-top: 26px; padding: 26px; border: 1px solid var(--line);
  border-radius: var(--r-lg); background: var(--surface); text-align: center;
}
.qr-frame__loading { padding: 56px 20px; color: var(--ink-400); font-size: 13px; }
.qrcode-img { border-radius: var(--r-md); }
.qrcode-status { margin-top: 14px; font-size: 13px; color: var(--ink-500); }
.qrcode-status .expire-tip { color: var(--ink-400); font-size: 12px; margin-top: 4px; }
.auth-tips { margin-top: 20px; display: flex; flex-direction: column; gap: 6px; font-size: 13px; color: var(--ink-400); }
.auth-tips li { display: flex; align-items: center; gap: 8px; }
.auth-foot { margin-top: 26px; padding-top: 20px; border-top: 1px solid var(--line); font-size: 12px; color: var(--ink-400); line-height: 1.9; }

/* 身份切换（统一登录页：求职者 / 企业招聘） */
.role-switch {
  display: flex; gap: 4px; padding: 4px; margin-bottom: 22px;
  background: var(--bg); border: 1px solid var(--line); border-radius: var(--r-md);
}
.role-switch__btn {
  flex: 1; padding: 10px 12px; border: none; background: transparent;
  border-radius: var(--r-sm); font-size: 14px; color: var(--ink-600);
  font-family: inherit; cursor: pointer; transition: all .18s ease;
}
.role-switch__btn:hover { color: var(--ink-900); }
.role-switch__btn.is-active {
  background: var(--surface); color: var(--brand-600); font-weight: 600;
  box-shadow: var(--sh-xs);
}
.role-switch__btn:focus-visible { outline: 2px solid var(--brand-500); outline-offset: 1px; }

/* 企业后台账号登录（手机号验证码，仅企业身份下展示） */
.account-login { margin-top: 18px; }
.account-login__toggle {
  width: 100%; padding: 6px; border: none; background: transparent;
  font-size: 13px; color: var(--brand-600); font-family: inherit;
  cursor: pointer; text-decoration: underline; text-underline-offset: 3px;
}
.account-login__toggle:hover { color: var(--brand-700); }
.account-login__form { margin-top: 16px; padding-top: 18px; border-top: 1px dashed var(--line); }
.account-login__form .btn--block { margin-top: 6px; }

/* ==========================================================================
   17. 错误页
   ========================================================================== */
.error-page { min-height: 100vh; display: flex; flex-direction: column; background: var(--bg); }
.error-head { height: 60px; display: flex; align-items: center; background: #fff; border-bottom: 1px solid var(--line); }
.error-body { flex: 1; display: flex; align-items: center; justify-content: center; padding: 48px 24px; }
.error-box { text-align: center; max-width: 520px; }
.error-code {
  font-size: 108px; font-weight: 700; line-height: 1; letter-spacing: -.04em;
  background: linear-gradient(135deg, var(--brand-500), var(--brand-800));
  -webkit-background-clip: text; background-clip: text;
  -webkit-text-fill-color: transparent; opacity: .28;
}
.error-title { font-size: 22px; margin-top: -14px; }
.error-desc { margin-top: 12px; color: var(--ink-500); font-size: 15px; }
.error-actions { margin-top: 32px; display: flex; gap: 14px; justify-content: center; }
.error-note {
  margin-top: 40px; padding: 16px 20px; background: #fff; border: 1px solid var(--line);
  border-radius: var(--r-md); font-size: 13px; color: var(--ink-400); line-height: 1.9; text-align: left;
}
.error-note b { color: var(--ink-600); }

/* ==========================================================================
   18. 页脚
   ========================================================================== */
/* margin-top:auto = sticky footer：短内容页页脚贴住视口底；长内容页自然排在内容后 */
.site-footer { margin-top: auto; background: #0f172a; color: var(--ink-400); }
.footer-grid {
  display: grid; grid-template-columns: 1.6fr 1fr 1fr 1fr; gap: 40px;
  padding: 52px 0 40px;
}
.footer-brand .brand__name { color: #fff; }
.footer-brand .brand__sub { color: rgba(255, 255, 255, .4); }
.footer-brand .brand__mark { box-shadow: none; }
.footer-desc { margin-top: 18px; font-size: 13px; line-height: 1.9; color: var(--ink-500); max-width: 320px; }
.footer-contact { margin-top: 20px; font-size: 13px; color: var(--ink-500); }
.footer-contact b { display: block; color: #fff; font-size: 20px; font-weight: 600; margin-top: 4px; }
.footer-col h4 { color: #fff; font-size: 14px; font-weight: 500; margin-bottom: 18px; }
.footer-col li { margin-bottom: 12px; }
.footer-col a { font-size: 13px; color: var(--ink-500); }
.footer-col a:hover { color: #fff; }
.footer-bottom {
  border-top: 1px solid rgba(255, 255, 255, .08);
  padding: 22px 0; display: flex; flex-wrap: wrap; gap: 8px 20px;
  font-size: 12px; color: var(--ink-500);
}
.footer-bottom a:hover { color: #fff; }

/* ==========================================================================
   19. 内容页（关于我们 / 用户协议 / 隐私政策 / 联系我们）
   ========================================================================== */
.page-wrap { padding: 44px 0 8px; max-width: 920px; }
.page-head { padding-bottom: 24px; border-bottom: 1px solid var(--line); margin-bottom: 34px; }
.page-head h1 { font-size: 30px; font-weight: 600; color: var(--ink-900); letter-spacing: -.02em; line-height: 1.3; }
.page-head p { margin-top: 12px; font-size: 14px; color: var(--ink-500); line-height: 1.85; }
.page-meta { margin-top: 14px; font-size: 12px; color: var(--ink-400); }

.prose { font-size: 14px; line-height: 2; color: var(--ink-700); }
.prose section { margin-bottom: 36px; }
.prose section:last-child { margin-bottom: 0; }
.prose h2 {
  font-size: 17px; font-weight: 600; color: var(--ink-900); line-height: 1.5;
  margin-bottom: 14px; padding-left: 12px; border-left: 3px solid var(--brand-600);
}
.prose h3 { font-size: 15px; font-weight: 500; color: var(--ink-800); margin: 20px 0 8px; }
.prose p { margin-bottom: 10px; }
.prose ul, .prose ol { margin: 10px 0 16px; padding-left: 22px; }
.prose li { margin-bottom: 8px; list-style: disc; }
.prose a { color: var(--brand-600); }
.prose a:hover { text-decoration: underline; }
.prose strong { color: var(--ink-800); font-weight: 600; }

.contact-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; margin-bottom: 34px; }
.contact-card {
  background: var(--surface); border: 1px solid var(--line);
  border-radius: var(--r-md); padding: 20px 22px; box-shadow: var(--sh-xs);
}
.contact-card h3 { font-size: 13px; font-weight: 500; color: var(--ink-500); margin-bottom: 10px; }
.contact-card b { display: block; font-size: 20px; font-weight: 600; color: var(--ink-900); letter-spacing: -.01em; word-break: break-all; }
.contact-card p { margin-top: 10px; font-size: 13px; color: var(--ink-500); line-height: 1.8; }

@media (max-width: 720px) {
  .page-wrap { padding: 28px 0 4px; }
  .page-head h1 { font-size: 24px; }
  .contact-grid { grid-template-columns: 1fr; }
}

/* ==========================================================================
   20. 表单 / 输入框 / 轻提示
   ========================================================================== */
.field { margin-bottom: 18px; }
.field__label { display: block; font-size: 13px; font-weight: 500; color: var(--ink-700); margin-bottom: 8px; }
.field__wrap { position: relative; }
.field__ico {
  position: absolute; left: 14px; top: 50%; transform: translateY(-50%);
  font-size: 15px; color: var(--ink-400); pointer-events: none;
}
.input {
  width: 100%; height: 46px; padding: 0 14px;
  border: 1px solid var(--ink-300); border-radius: var(--r-sm);
  background: var(--surface); font-size: 14px; color: var(--ink-900);
  outline: none; transition: border-color .18s ease, box-shadow .18s ease;
}
.input::placeholder { color: var(--ink-400); }
.input:focus { border-color: var(--brand-600); box-shadow: 0 0 0 3px rgba(37, 99, 235, .12); }
.input--ico { padding-left: 42px; }
.form-row { display: flex; gap: 12px; }
.form-row .field__wrap { flex: 1; }
.btn--block { width: 100%; height: 46px; }
.btn--code { height: 46px; padding: 0 16px; white-space: nowrap; }
.btn--ghost {
  background: var(--bg); color: var(--ink-600); border: 1px solid var(--ink-300);
  box-shadow: none; font-weight: 400;
}
.btn--ghost:hover:not(:disabled) { background: var(--line-soft); color: var(--ink-800); }
.btn:disabled { opacity: .6; cursor: not-allowed; }
.form-note { margin-top: 14px; font-size: 12px; color: var(--ink-400); line-height: 1.9; }
.form-note a { color: var(--brand-600); }

/* 轻提示 */
.toast {
  position: fixed; top: 24px; left: 50%; z-index: 9999;
  transform: translateX(-50%) translateY(-16px);
  background: var(--ink-900); color: #fff;
  padding: 12px 24px; border-radius: var(--r-sm); font-size: 14px;
  box-shadow: var(--sh-lg); opacity: 0; pointer-events: none;
  transition: opacity .25s ease, transform .25s ease; max-width: 80vw;
}
.toast.is-show { opacity: 1; transform: translateX(-50%) translateY(0); }
.toast--success { background: var(--success); }
.toast--error { background: var(--danger); }

/* ==========================================================================
   21. 响应式
   ========================================================================== */
@media (max-width: 1080px) {
  .home-grid { grid-template-columns: 1fr; }
  .cat-panel { position: static; }
  .cat-list { display: grid; grid-template-columns: repeat(3, 1fr); }
  .detail-grid { grid-template-columns: 1fr; }
  .detail-aside { position: static; }
  .company-list, .company-grid, .rec-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .footer-grid { grid-template-columns: 1fr 1fr; gap: 28px; }
  .auth-page { grid-template-columns: 1fr; }
  .auth-visual { display: none; }
  .quick-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .cta-band { flex-direction: column; align-items: flex-start; padding: 28px 30px; }
}
@media (max-width: 720px) {
  .container { padding: 0 16px; }
  .site-header__inner { gap: 14px; }
  .main-nav { display: none; }
  .brand__sub { display: none; }
  .hero { padding: 40px 0 48px; }
  .hero h1 { font-size: 26px; }
  .hero-search { flex-direction: column; }
  .hero-search .btn { width: 100%; }
  .hero-stats { gap: 12px; flex-wrap: wrap; }
  .hero-stat { flex: 1 1 100px; min-width: 0; padding: 12px 16px; }
  .quick-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .cta-band { padding: 24px; }
  .cta-band__actions { width: 100%; flex-direction: column; }
  .cta-band__actions .btn { width: 100%; }
  .section--band { padding: 18px; }
  .section-more { padding: 5px 10px; font-size: 12px; }
  .job-grid, .company-list, .company-grid, .rec-grid { grid-template-columns: 1fr; }
  .cat-list { grid-template-columns: repeat(2, 1fr); }
  .info-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .company-banner { flex-direction: column; padding: 24px; }
  .footer-grid { grid-template-columns: 1fr; }
  .job-row { flex-direction: column; align-items: stretch; }
  .job-row__side { flex-direction: row; align-items: center; justify-content: space-between; }
}

/* ==========================================================================
   个人中心下拉菜单（components/header.ejs）
   —— 把「我的简历 / 我的投递 / 我的收藏 / 消息 / 退出」收进头像下拉，
      避免主导航项过多。.user-chip 由 <a> 改为 <button>，故需重置按钮默认样式。
   ========================================================================== */
.user-menu { position: relative; }
.user-menu .user-chip {
  background: none; border: 0; font: inherit; cursor: pointer;
  color: inherit; line-height: 1;
}
.user-menu__caret { font-size: 10px; color: var(--ink-400); margin-left: -2px; }
.user-menu[aria-expanded="true"] .user-menu__caret,
.user-menu .user-chip[aria-expanded="true"] .user-menu__caret { color: var(--brand-600); }

.user-menu__panel {
  position: absolute; right: 0; top: calc(100% + 8px);
  min-width: 148px; padding: 6px;
  background: var(--surface); border: 1px solid var(--line);
  border-radius: var(--r-md); box-shadow: var(--sh-md, 0 8px 24px rgba(15, 23, 42, .12));
  z-index: 60; display: flex; flex-direction: column; gap: 2px;
}
.user-menu__panel[hidden] { display: none; }
.user-menu__item {
  display: block; width: 100%; text-align: left;
  padding: 9px 12px; border-radius: var(--r-sm);
  font-size: 14px; color: var(--ink-700);
  background: none; border: 0; font-family: inherit; cursor: pointer;
}
.user-menu__item:hover { background: var(--brand-50); color: var(--brand-700); }
.user-menu__item--danger { color: var(--danger); }
.user-menu__item--danger:hover { background: #fef2f2; color: var(--danger); }
.user-menu__item--danger:disabled { opacity: .6; cursor: not-allowed; }

/* 个人中心列表页（/my/applications、/my/favorites） */
.my-tabs { display: flex; gap: 8px; margin-bottom: 18px; }
.my-tabs a {
  padding: 8px 16px; border-radius: var(--r-pill);
  font-size: 14px; color: var(--ink-600); background: var(--surface);
  border: 1px solid var(--line);
}
.my-tabs a:hover { color: var(--brand-600); border-color: var(--brand-200, #bfdbfe); }
.my-tabs a.is-active { color: #fff; background: var(--brand-600); border-color: var(--brand-600); font-weight: 500; }

.my-card {
  display: flex; align-items: center; gap: 16px;
  padding: 18px 20px; margin-bottom: 12px;
  background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-md);
  transition: box-shadow .18s, border-color .18s;
}
.my-card:hover { box-shadow: var(--sh-sm); border-color: var(--brand-100, #dbeafe); }
.my-card__main { flex: 1; min-width: 0; }
.my-card__title-line { display: flex; align-items: baseline; gap: 12px; flex-wrap: wrap; }
.my-card__name { font-size: 16px; font-weight: 600; color: var(--ink-900); }
.my-card__name:hover { color: var(--brand-600); }
.my-card__salary { font-size: 15px; font-weight: 600; color: var(--accent); }
.my-card__meta { display: flex; align-items: center; gap: 10px; margin-top: 8px; font-size: 13px; color: var(--ink-500); flex-wrap: wrap; }
.my-card__side { display: flex; flex-direction: column; align-items: flex-end; gap: 10px; flex-shrink: 0; }
.my-card__time { font-size: 12px; color: var(--ink-400); }
.my-card__ops { display: flex; gap: 8px; }
.status-pill {
  display: inline-block; padding: 2px 10px; border-radius: var(--r-pill);
  font-size: 12px; line-height: 20px;
}
.status-pill--pending  { background: #fff7e6; color: #d48806; }
.status-pill--viewed   { background: #e6f7ff; color: #096dd9; }
.status-pill--interview{ background: #f9f0ff; color: #722ed1; }
.status-pill--rejected { background: #fef2f2; color: var(--danger); }

@media (max-width: 640px) {
  .my-card { flex-direction: column; align-items: stretch; }
  .my-card__side { flex-direction: row; align-items: center; justify-content: space-between; }
  .my-tabs { overflow-x: auto; }
}

/* 职位详情页「投递简历」的已完成态：默认 .btn:disabled 只是变淡，
   看起来仍像可点的主按钮，这里改成明确的"已完成"外观 */
.btn-apply.is-applied,
.btn-apply:disabled {
  background: var(--line-soft, #f1f5f9);
  color: var(--ink-500);
  border: 1px solid var(--line);
  box-shadow: none;
  opacity: 1;
  cursor: default;
}