/* ==========================================================
   续历 · A4 纸面（印刷契约）
   pt / mm 数值由原始 PDF 1:1 校准，不要为了「好看」取整。
   颜色全部来自主题变量：--ink --muted --accent --accent-ink --accent-tint --line --rail --bg
   （resume/themes.js 把它们写到 .resume 元素上；这里只给一套兜底）
   ========================================================== */
.resume {
  --ink: #202124; --muted: #61656d; --accent: #1f4d7a; --accent-ink: #1a4268; --accent-tint: rgba(31, 77, 122, .08);
  --line: #d9dde3; --rail: #f4f6f9; --bg: #ffffff;
  --edit-line: #c4c9d0; --edit-focus-bg: var(--accent-tint);
  --font-cjk: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", "Source Han Sans SC", "Hiragino Sans GB", system-ui, sans-serif;
  --font-latin: "Inter", "Segoe UI", Roboto, system-ui, sans-serif;
  --font-cjk-serif: "Noto Serif SC", "Source Han Serif SC", "Songti SC", "STSong", "SimSun", serif;
  --fs-name: 22pt; --fs-name-sm: 18pt; --fs-tagline: 12pt; --fs-h2: 13pt; --fs-role: 11pt; --fs-h3: 11pt;
  --fs-summary: 10.5pt; --fs-bullet: 10.5pt; --fs-meta: 9.5pt; --fs-contact: 9.5pt; --fs-kv: 10pt; --fs-keyword: 9pt; --fs-pos: 10pt;

  position: relative; width: 210mm; min-height: 297mm; margin: 0 auto; padding: 12mm 14mm;
  background: var(--bg); color: var(--ink); font-family: var(--font-cjk-serif);
  /* 纸面自给自足：导出的 PDF 只带 paper/templates/print 三份 CSS，不能依赖外壳 base.css。
     这里显式给出盒模型、根字号与行高，屏幕、离屏测量、PDF 三处排版才是同一份。 */
  box-sizing: border-box; font-size: 10.5pt; line-height: 1.55;
  -webkit-text-size-adjust: 100%; text-size-adjust: 100%;
}
:where(.resume) *, :where(.resume) *::before, :where(.resume) *::after { box-sizing: border-box; }
:where(.resume) :where(h1, h2, h3, h4, p) { margin: 0; font-weight: inherit; }
.resume .r-id .nm, .resume .left-id .nm, .resume .block h2, .resume .r-sec > h2, .resume .entry-head h3 { font-family: var(--font-cjk); }
.body { position: relative; display: grid; grid-template-columns: 32% 1fr; align-items: start; }
.body::after { content: ""; position: absolute; left: 32%; top: 0; bottom: 0; width: .7pt; background: var(--line); }
.left { padding-right: 9mm; }
.right { padding-left: 10mm; }
.photo { width: 42mm; height: 42mm; object-fit: cover; object-position: 50% 30%; border-radius: 4px; display: block; margin: 0 0 4mm -3.5mm; background: #eee; }
.photo-empty { display: flex; align-items: center; justify-content: center; font-family: var(--font-cjk); font-size: 7.5pt; line-height: 1.5; color: var(--muted); background: var(--accent-tint); border: 1px dashed var(--line); text-align: center; cursor: pointer; }
.left-id { margin-bottom: 2mm; padding-bottom: 2mm; border-bottom: 1.5pt solid var(--accent); }
.left-id .nm { margin: 0; font-size: var(--fs-name-sm); font-weight: 700; letter-spacing: .04em; }
.left-id .role { margin: 1mm 0 0; font-size: var(--fs-role); font-weight: 600; color: var(--accent); }
.left-id .dir { margin: 1mm 0 0; font-size: var(--fs-bullet); color: var(--muted); }
.block { margin-bottom: 3mm; }
.block:last-child { margin-bottom: 0; }
.block h2 { margin: 0 0 1.5mm; font-size: var(--fs-h2); font-weight: 700; color: var(--accent); display: flex; align-items: center; gap: 5px; letter-spacing: .02em; }
.block h2 .ico { width: 3.2mm; height: 3.2mm; color: var(--accent); }
.left dl.contact { margin: 0; }
.left dl.contact .row { display: flex; gap: 1.5mm; margin-bottom: .8mm; font-size: var(--fs-contact); line-height: 1.67; }
.left dl.contact dt { color: var(--muted); flex: none; }
.left dl.contact dd { margin: 0; color: var(--ink); display: flex; align-items: center; gap: 1mm; word-break: break-all; }
.left dl.contact .ico { width: 2.8mm; height: 2.8mm; color: var(--accent); }
.left dl.kv { margin: 0; }
.left dl.kv dt { font-size: var(--fs-keyword); color: var(--muted); margin-top: 1.2mm; }
.left dl.kv dt:first-child { margin-top: 0; }
.left dl.kv dd { margin: 0; font-size: var(--fs-kv); color: var(--ink); line-height: 1.7; }
.left ul.list { list-style: none; margin: 0; padding: 0; }
.left ul.list li { position: relative; padding-left: 3mm; margin-bottom: .8mm; font-size: var(--fs-bullet); color: var(--ink); line-height: 1.7; }
.left ul.list li:last-child { margin-bottom: 0; }
.left ul.list li::before { content: ""; position: absolute; left: 0; top: .5em; width: 1mm; height: 1mm; border-radius: 50%; background: var(--accent); }
ul.chips { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 1mm; }
ul.chips .chip { font-size: var(--fs-keyword); padding: .3mm 1.5mm; border-radius: 2px; background: var(--accent-tint); color: var(--accent-ink); line-height: 1.5; }
.r-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 4mm; }
.r-id .nm { margin: 0; font-size: var(--fs-name); font-weight: 700; letter-spacing: .06em; }
.r-id .tagline { margin: 1mm 0 0; font-size: var(--fs-tagline); font-weight: 600; color: var(--accent); }
.r-id .pos { margin: 1mm 0 0; font-size: var(--fs-pos); color: var(--muted); }
.summary { margin: 2mm 0 0; padding: 1.5mm 0 0; border-top: .7pt solid var(--line); font-size: var(--fs-summary); line-height: 1.69; color: var(--ink); text-align: justify; }
.r-sec { margin-top: 2mm; padding-top: 1.5mm; border-top: .7pt solid var(--line); }
.r-sec > h2 { margin: 0 0 1.5mm; font-size: var(--fs-h2); font-weight: 700; color: var(--accent); letter-spacing: .02em; }
.entry { margin-bottom: 2mm; }
.entry:last-child { margin-bottom: 0; }
.entry-head { display: flex; flex-wrap: wrap; align-items: baseline; gap: 1mm 2mm; margin-bottom: .8mm; }
.entry-head h3 { margin: 0; font-size: var(--fs-h3); font-weight: 700; }
.entry-head .sub { margin: 0; font-size: var(--fs-bullet); color: var(--accent); }
.entry-head .meta { margin: 0 0 0 auto; font-size: var(--fs-meta); color: var(--muted); font-family: var(--font-latin); white-space: nowrap; }
.entry-head .meta time { font: inherit; }
ul.bullets { list-style: none; margin: 0; padding: 0; }
ul.bullets li { position: relative; padding-left: 3mm; margin-bottom: .5mm; font-size: var(--fs-bullet); color: var(--ink); line-height: 1.86; }
ul.bullets li:last-child { margin-bottom: 0; }
ul.bullets li::before { content: ""; position: absolute; left: 0; top: .45em; width: 1mm; height: 1mm; border-radius: 1px; background: var(--accent); opacity: .7; }
.resume a { color: inherit; }

/* 手机：非 A4 单栏适配（屏幕阅读，不影响打印） */
@media screen and (max-width: 880px) {
  .resume.is-fluid { width: 100%; min-height: auto; padding: 6mm; }
  .resume.is-fluid .body::after { display: none; }
  .resume.is-fluid .body { grid-template-columns: 1fr; }
  .resume.is-fluid .left { padding-right: 0; padding-bottom: 5mm; }
  .resume.is-fluid .right { padding-left: 0; }
  .resume.is-fluid .r-head { flex-direction: column; }
}

/* ---- 编辑图层（只在 .resume.is-editing 下出现，永不进打印） ---- */
.resume .struct { display: none !important; }
.resume.is-editing .photo { cursor: pointer; }
.resume.is-editing [data-bind] { outline: 1px dashed var(--edit-line); outline-offset: 1px; border-radius: 2px; transition: outline-color .15s, background .15s; }
.resume.is-editing [data-bind]:hover { outline-color: var(--accent); }
.resume.is-editing [data-bind]:focus { outline: 1px solid var(--accent); background: var(--edit-focus-bg); }
.resume.is-editing span[data-bind], .resume.is-editing time[data-bind] { display: inline-block; min-width: 1em; min-height: 1em; vertical-align: baseline; }
.resume.is-editing .struct {
  display: inline-flex !important; align-items: center; justify-content: center; width: 18px; height: 18px; margin: 0 2px; padding: 0;
  border: 1px solid var(--line); border-radius: 3px; background: #fff; color: var(--muted);
  font: 12px/1 var(--font-latin); cursor: pointer; vertical-align: middle; transition: border-color .14s, color .14s, background .14s;
}
.resume.is-editing .struct.add { width: auto; min-width: 18px; padding: 0 7px; font-size: 11px; background: var(--accent-tint); }
.resume.is-editing .struct:hover { border-color: var(--accent); color: var(--accent); }
.resume.is-editing .struct.del:hover { border-color: #c2311a; color: #c2311a; background: #fdf1ef; }
.resume.is-editing ul.bullets li, .resume.is-editing ul.list li { padding-right: 15px; }
.resume.is-editing ul.bullets li > .struct.del, .resume.is-editing ul.list li > .struct.del { position: absolute; right: 0; top: .15em; margin: 0; width: 15px; height: 15px; font-size: 11px; }
.resume.is-editing .sec-tools { margin-left: auto; display: inline-flex; gap: 3px; }
.resume.is-editing .struct.add-sec { margin: 2mm 0 0; padding: 0 8px; }
.resume.is-editing .r-sec > h2 { display: flex; align-items: center; gap: 5px; }

/* ---- 缩略图：整张 A4 真渲染后按容器缩放（scale 由 JS 写到 --s） ---- */
.sheet { position: relative; width: 100%; aspect-ratio: 210 / 297; overflow: hidden; background: #fff; }
.sheet > .resume { position: absolute; top: 0; left: 0; width: 210mm; height: 297mm; min-height: 297mm; overflow: hidden; transform: scale(var(--s, .25)); transform-origin: top left; pointer-events: none; }
.sheet::after { content: ""; position: absolute; inset: 0; box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .06); pointer-events: none; }

/* ---- 离屏测量台：永远用阅读态量 A4 栏高 ---- */
.measure-host { position: absolute; left: -20000px; top: 0; width: 210mm; visibility: hidden; pointer-events: none; }
