/* clib-skin-jobs-v1.css —— 人才招聘页（#page-jobs）· 苹果语言 · 2026-10-15（第二版：整份重写，清掉上一版三段猜错的选择器与疑似语法断点）
   实况（work/_audit/_jobs-grid-diag.js 实测）：#page-jobs > .jobs-wrap > #jp-openings.jpanel.active > #jobsList > .fde-job-card（10 张）
   HIG 依据（本仓是 Web 应用 ⇒ 取原则 + 基础篇，不吃 Apple 平台惯例）：
     · lists-and-tables.md › 行密度：列表靠层级/对齐区分，不靠大留白堆高
     · layout.md › 留白节奏与可点区域：卡间距 10、卡内 14，可点目标 ≥44（390 档）
     · typography.md › 层级：标题 15/600 · 正文 13 · 次要 12 三级分明
     · accessibility.md › 对比度与命中区 · color.md：一律用规格值（ink #1D1D1F · muted #8E8E93 · line #E8E8ED · indigo #3D55D4 · 浅底 #F2F4FF）
   回退：删 index.html 里那一行 <link> 即回到原样。DOM 与按钮零改动。 */

/* ① 容器：单列窄化，读起来不散 */
/* 2026-10-15 撤回内容宽那一刀（实测 + 查源后定的）：
   `pro-css/site-unify.css:37-45` 用 `max-width: var(--page-max) !important` 把招聘/成长统一成 **1400**
   （注释写明"招聘 1120→1400 · 成长 1200→1400"是站点统一层的设计决定）⇒ clib-ui 的「内容宽 980/1024」是给**营销/表单页**的，
   应用页由统一层说了算。我这一刀既赢不了（对方 `!important`）也不该赢 ⇒ **撤掉，不设宽度**，交给统一层。 */

/* ② 页头层级 */
#page-jobs .jobs-head { padding: 4px 0 16px; border-bottom: 1px solid #E8E8ED; margin-bottom: 16px; }
#page-jobs .jobs-head h1, #page-jobs .jobs-head h2 { font-size: 22px; line-height: 1.3; font-weight: 600; color: #1D1D1F; margin: 0 0 6px; letter-spacing: .2px; }
#page-jobs .jobs-head p { font-size: 13px; line-height: 1.6; color: #8E8E93; margin: 0; }

/* ③ 分段（岗位列表 / 发布 / 核验）：胶囊组，选中态主色实底 */
#page-jobs .jt-seg { display: inline-flex; margin: 0 0 16px; }   /* 2026-10-15 收口：14 不在阶梯（4/8/12/16/24/32/48/64）⇒ 16 */
#page-jobs .jt-seg-inner { display: inline-flex; gap: 4px; background: #F2F4FF; border: 1px solid #E8E8ED; border-radius: 999px; padding: 3px; }
#page-jobs .jt-seg-inner > * { display: inline-flex; align-items: center; height: 32px; padding: 0 16px; border: 0; border-radius: 999px; background: transparent; font-size: 13px; font-weight: 500; color: #1D1D1F; cursor: pointer; }
#page-jobs .jt-seg-inner > .active { background: #3D55D4; color: #fff; font-weight: 600; }

/* ④ 岗位列表（#jobsList）：1440 两列网格 —— 这一条是本次的关键（前三版用 :has() 猜父层，全空转） */
#page-jobs #jobsList { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
/* 2026-10-15 收口：去掉 `align-items: start` ⇒ 同一行的两张卡**等高**（截图自审见"两列卡高参差、短卡下方留白大"）。
   依据 clib-ui 三、留白规范 + apple-design（craft：对齐与节奏是"做完了"的标志）。 */
#page-jobs #jobsList > .fde-job-card { margin: 0; padding: 16px 14px; border-radius: 14px; background: #fff; border: 1px solid #E8E8ED; transition: border-color .15s ease, box-shadow .15s ease; }
#page-jobs #jobsList > .fde-job-card:hover { border-color: #C9D4FF; }
/* 卡内三级层级 */
#page-jobs .fde-jc-top { margin-bottom: 6px; }
#page-jobs .fde-jc-sec { font-size: 13px; line-height: 1.5; margin-bottom: 4px; color: #1D1D1F; }
#page-jobs .fde-jc-tag { font-size: 12px; line-height: 1.4; }

/* ⑤ 发布/核验面板的表单控件 */
#page-jobs .jp-form input, #page-jobs .jp-form select, #page-jobs .jp-form textarea { height: 40px; padding: 0 12px; border: 1px solid #E8E8ED; border-radius: 14px; font-size: 13px; color: #1D1D1F; background: #fff; }
#page-jobs .jp-form textarea { height: auto; min-height: 96px; padding: 10px 12px; line-height: 1.6; }
#page-jobs .jp-form input:focus, #page-jobs .jp-form select:focus, #page-jobs .jp-form textarea:focus { outline: 0; border-color: #3D55D4; }

/* ⑥ 按钮 / 空态 */
#page-jobs .pj-btn { display: inline-flex; align-items: center; justify-content: center; height: 32px; padding: 0 18px; border-radius: 999px; border: 1px solid #E8E8ED; background: #fff; font-size: 13px; font-weight: 500; color: #1D1D1F; cursor: pointer; }
#page-jobs .pj-btn.primary { background: #3D55D4; border-color: #3D55D4; color: #fff; font-weight: 600; }
#page-jobs .qa-empty { padding: 32px 16px; text-align: center; color: #8E8E93; font-size: 13px; background: #fff; border: 1px dashed #E8E8ED; border-radius: 14px; }

/* ⑦ 390 档：单列 + 可点目标 ≥44 + 不横溢 */
@media (max-width: 900px) {
  #page-jobs .jobs-wrap { max-width: 100%; }
  #page-jobs .jobs-head h1, #page-jobs .jobs-head h2 { font-size: 22px; }
  #page-jobs #jobsList { grid-template-columns: 1fr; gap: 12px; }
  #page-jobs .jt-seg-inner > * { height: 44px; padding: 0 14px; }
  #page-jobs .pj-btn { height: 44px; }
  #page-jobs .jp-form input, #page-jobs .jp-form select { height: 44px; }
}

/* ⚠️ 修 bug（2026-10-15 19:3x，**顶层**，不嵌套）：1024 宽下双列把卡压窄 ⇒ 岗位描述 `<p>` 被 `span.fde-jc-tag`
   **100% 压住**（实测 54 对重叠 · `work/_audit/_mobile-overlap-probe.js`）。修法＝双列门槛抬到 1100，窄于此一律单列。
   教训：上一版我把它插进了 900 的媒体查询里（嵌套 + 括号失衡）⇒ 差点又把整片规则弄哑，当笔改回顶层。 */
@media (max-width: 1100px) {
  #page-jobs #jobsList { grid-template-columns: 1fr; }
}
