﻿/* ===== 简历 A4 页面基准 ===== */
.resume-page{
  font-family:"Microsoft YaHei","PingFang SC","Helvetica Neue",Arial,sans-serif;
  font-size:var(--tpl-fs, 14px);
  line-height:1.62;
  --tpl-line-width:2px;
}
.resume-page *{ box-sizing:border-box; }
.resume-page ul{ margin:4px 0; padding-left:0; list-style:none; }
.resume-page li{ margin:3px 0; }
.resume-page img{ max-width:100%; }
.tpl-section{ margin-bottom:14px; }
.tpl-h2{
  font-size:calc(var(--tpl-fs, 14px) + 2px);
  color:var(--tpl-title-color, #111); margin:16px 0 8px; padding-left:8px;
  border-left:4px solid var(--tpl-title-color, var(--tpl-accent, #2563eb)); letter-spacing:.5px;
}
.tpl-item{ margin-bottom:10px; }
.tpl-item-head{ display:flex; justify-content:space-between; align-items:baseline; gap:12px; }
.tpl-item-title{ font-weight:700; }
.tpl-item-date{ color:#667; font-size:calc(var(--tpl-fs, 14px) - 1px); white-space:nowrap; }
.tpl-item-sub{ color:#444; font-size:calc(var(--tpl-fs, 14px) - 1px); margin:1px 0 3px; }
.tpl-skill{ display:flex; gap:10px; margin:3px 0; }
.tpl-skill-cat{ font-weight:700; min-width:76px; flex:0 0 auto; }
.tpl-summary{ margin:6px 0 0; color:#333; }
.tpl-target{ margin-top:2px; }
.tpl-extra{ white-space:pre-wrap; margin:4px 0; }
.tpl-profile{ white-space:pre-wrap; margin:4px 0; color:#333; }

/* ===== 简洁单栏 ===== */
.tpl-clean{ --tpl-accent:#1f3a5f; }
.tpl-clean .tpl-header{ text-align:center; padding-bottom:14px; margin-bottom:10px; }
.tpl-clean .tpl-name{ font-size:calc(var(--tpl-fs, 14px) + 10px); margin:0 0 2px; letter-spacing:2px; color:#111; }
.tpl-clean .tpl-target{ color:#444; font-size:calc(var(--tpl-fs, 14px) + 1px); }
.tpl-clean .tpl-contact{ color:#555; font-size:calc(var(--tpl-fs, 14px) - 1px); margin-top:4px; }
.tpl-clean .tpl-summary{ max-width:620px; margin:8px auto 0; text-align:center; }
.tpl-photo-rect{ width:105px; height:135px; border-radius:0; overflow:hidden; border:1px solid #d5dbe3; }
.tpl-photo-rect img{ width:100%; height:100%; object-fit:cover; display:block; }
.tpl-photo-round{ width:88px; height:88px; border-radius:50%; overflow:hidden; margin:0 auto 8px; border:2px solid var(--tpl-accent, #2563eb); }
.tpl-photo-round img{ width:100%; height:100%; object-fit:cover; display:block; }
.tpl-clean .tpl-photo-rect{ margin:0 auto 8px; }
.tpl-clean .tpl-photo-round{ margin:0 auto 8px; }

/* ===== 经典两栏 ===== */
.tpl-classic{ --tpl-accent:#2c3e50; }
.tpl-classic-grid{ display:grid; grid-template-columns:33% 67%; }
.tpl-classic-side{ background:#f2f4f7; padding:20px 16px; }
.tpl-classic-main{ padding:20px 22px; }
.tpl-classic .tpl-name{ font-size:calc(var(--tpl-fs, 14px) + 8px); margin:0 0 2px; color:#111; }
.tpl-classic .tpl-target{ color:#444; }
.tpl-classic .tpl-summary{ color:#333; margin-top:6px; }
.tpl-classic-side .tpl-photo-rect{ margin:0 auto 12px; }
.tpl-classic-side .tpl-photo-round{ margin:0 auto 12px; }
.side-section{ margin-bottom:18px; }
.side-h{
  font-size:calc(var(--tpl-fs, 14px) + 1px); font-weight:700; color:#111;
  border-bottom:var(--tpl-line-width, 2px) solid var(--tpl-line-color, #cbd2dc); padding-bottom:4px; margin:0 0 8px;
}
.side-contact div{ margin:4px 0; font-size:calc(var(--tpl-fs, 14px) - 1px); word-break:break-all; }
.side-line{ font-size:calc(var(--tpl-fs, 14px) - 1px); margin:4px 0; line-height:1.6; }

.tpl-classic-side .side-edu-item{ margin:0 0 12px; }
.tpl-classic-side .side-edu-school{ font-weight:700; color:#111; font-size:calc(var(--tpl-fs, 14px) + 1px); }
.tpl-classic-side .side-edu-major{ font-size:calc(var(--tpl-fs, 14px) - 1px); color:#333; margin:1px 0 0; }
.tpl-classic-side .side-edu-date{ font-size:calc(var(--tpl-fs, 14px) - 2px); color:#667; margin:1px 0 0; }
.tpl-classic-side ul{ color:#444; }

/* ===== 现代简约 ===== */
.tpl-modern{ --tpl-accent:#2563eb; }
.tpl-modern .tpl-header{
  background:var(--tpl-title-color, var(--tpl-accent)); color:#fff; padding:22px 24px;
  display:flex; justify-content:space-between; align-items:center; gap:16px;
}
.tpl-modern .tpl-header .tpl-name{ font-size:calc(var(--tpl-fs, 14px) + 10px); margin:0; color:#fff; letter-spacing:1px; }
.tpl-modern .tpl-target{ color:rgba(255,255,255,.92); margin-top:2px; }
.tpl-modern .tpl-contact{ color:rgba(255,255,255,.92); font-size:calc(var(--tpl-fs, 14px) - 1px); margin-top:4px; }
.tpl-modern .tpl-photo-rect{ margin:0; width:84px; height:108px; border:2px solid #fff; }
.tpl-modern .tpl-photo-round{ width:84px; height:84px; border:2px solid #fff; margin:0; }
.tpl-modern .tpl-body{ padding:18px 24px; }
.tpl-modern .tpl-h2{ border:none; border-bottom:var(--tpl-line-width, 2px) solid var(--tpl-line-color, var(--tpl-accent)); color:var(--tpl-title-color, var(--tpl-accent)); padding:0 0 4px; }
.tpl-modern .tpl-item{ position:relative; padding-left:0; }


/* ===== 优雅知性 ===== */
.tpl-elegant{ --tpl-accent:#8a7f6f; }
.tpl-elegant .tpl-header{ text-align:center; padding-bottom:16px; margin-bottom:8px; }
.tpl-elegant .tpl-name{ font-size:calc(var(--tpl-fs, 14px) + 12px); letter-spacing:6px; color:#333; margin:0 0 4px; }
.tpl-elegant .tpl-target{ color:#666; }
.tpl-elegant .tpl-contact{ color:#777; font-size:calc(var(--tpl-fs, 14px) - 1px); margin-top:4px; }
.tpl-elegant .tpl-summary{ max-width:620px; margin:8px auto 0; text-align:center; }
.tpl-elegant .tpl-h2{ text-align:center; border-left:none; border-bottom:var(--tpl-line-width, 2px) solid var(--tpl-line-color, #cfc9bd); padding:0 0 6px; letter-spacing:2px; }
.tpl-elegant .tpl-photo-rect, .tpl-elegant .tpl-photo-round{ margin:0 auto 10px; }

/* ===== 紧凑实用 ===== */
.tpl-compact{ --tpl-accent:#5b6b7b; font-size:calc(var(--tpl-fs, 14px) - 1px); }
.tpl-compact .tpl-header{ padding-bottom:8px; border-bottom:var(--tpl-line-width, 2px) solid var(--tpl-line-color, #b9c2cc); margin-bottom:6px; display:flex; justify-content:space-between; align-items:baseline; gap:10px; flex-wrap:wrap; }
.tpl-compact .tpl-name{ font-size:calc(var(--tpl-fs, 14px) + 8px); margin:0 0 2px; }
.tpl-compact .tpl-target{ color:#444; }
.tpl-compact .tpl-contact{ color:#555; font-size:calc(var(--tpl-fs, 14px) - 2px); }
.tpl-compact .tpl-summary{ margin-top:4px; }
.tpl-compact .tpl-section{ margin-bottom:8px; }
.tpl-compact .tpl-h2{ margin:10px 0 5px; padding-left:6px; font-size:calc(var(--tpl-fs, 14px) + 1px); }
.tpl-compact .tpl-item{ margin-bottom:6px; }
.tpl-compact .tpl-skill{ margin:2px 0; }

/* ===== 商务蓝 ===== */
.tpl-bizblue{ --tpl-accent:#1890FF; }
.tpl-bizblue .tpl-header{ display:flex; align-items:center; gap:24px; padding-bottom:4px; border-bottom:none; margin-bottom:10px; flex-wrap:wrap; }
.tpl-bizblue .bb-head-left{ display:flex; align-items:center; gap:14px; }
.tpl-bizblue .bb-head-text{ display:flex; flex-direction:column; }
.tpl-bizblue .tpl-name{ font-size:calc(var(--tpl-fs, 14px) + 10px); color:#111; margin:0 0 2px; }
.tpl-bizblue .tpl-target{ color:#666; margin-top:2px; }
.tpl-bizblue .bb-head-right{ flex:1; display:grid; grid-template-columns:1fr 1fr; gap:6px 18px; min-width:220px; }
.tpl-bizblue .bb-contact{ display:flex; align-items:center; gap:6px; font-size:calc(var(--tpl-fs, 14px) - 1px); color:#333; }
.tpl-bizblue .tpl-summary{ color:#444; margin:10px 0; }
.tpl-bizblue .bb-sec-head{ margin:18px 0 10px; }
.tpl-bizblue .bb-title{ display:block; color:var(--tpl-title-color, var(--tpl-accent)); font-weight:700; font-size:calc(var(--tpl-fs, 14px) + 2px); margin-bottom:2px; }
.tpl-bizblue .bb-line{ display:block; height:0; border-bottom:var(--tpl-line-width, 2px) solid var(--tpl-line-color, #d9e2ef); }



/* ===== 开放两栏 ===== */
.tpl-open{ --tpl-accent:#1890FF; }
.tpl-open-grid{ display:grid; grid-template-columns:33% 67%; min-height:297mm; }
.tpl-open-side{ background:var(--tpl-title-color, var(--tpl-accent)); color:#fff; padding:36px 18px 22px; }
.tpl-open-side .tpl-photo-rect{ width:84px; height:108px; border:2px solid #fff; margin:0 auto 12px; }
.tpl-open-side .tpl-photo-round{ width:96px; height:96px; border:2px solid #fff; margin:0 auto 12px; }
.tpl-open-side .tpl-name{ color:#fff; text-align:center; font-size:calc(var(--tpl-fs, 14px) + 8px); margin:0 0 2px; }
.tpl-open-side .tpl-target{ color:rgba(255,255,255,.92); text-align:center; margin-bottom:14px; }
.tpl-open-side .op-contact{ margin:8px 0; font-size:calc(var(--tpl-fs, 14px) - 1px); word-break:break-all; color:rgba(255,255,255,.95); }
.tpl-open-side .op-side-h{
  color:#fff; font-weight:700; font-size:calc(var(--tpl-fs, 14px) + 2px);
  margin:18px 0 8px; padding-bottom:4px; border-bottom:1px solid rgba(255,255,255,.45); letter-spacing:1px;
}
.tpl-open-side .tpl-item-title{ color:#fff; }
.tpl-open-side .tpl-item-date, .tpl-open-side .tpl-item-sub{ color:rgba(255,255,255,.85); }
.tpl-open-side ul{ color:rgba(255,255,255,.9); }
.tpl-open-side .op-edu-item{ margin:8px 0 14px; }
.tpl-open-side .op-edu-school{ font-weight:700; color:#fff; font-size:calc(var(--tpl-fs, 14px) + 2px); }
.tpl-open-side .op-edu-date{ font-size:calc(var(--tpl-fs, 14px) - 1px); color:rgba(255,255,255,.85); margin:2px 0 0; }
.tpl-open-side .op-edu-major{ font-size:calc(var(--tpl-fs, 14px) - 1px); color:rgba(255,255,255,.9); margin:1px 0 4px; }
.tpl-open-side .op-edu-list{ color:rgba(255,255,255,.9); }
.tpl-open-main{ background:#fff; padding:22px 24px; }
.tpl-open .tpl-summary{ color:#444; margin:0 0 6px; }
.tpl-open .op-sec-head{ margin:18px 0 10px; }
.tpl-open .op-title{ display:block; color:var(--tpl-title-color, var(--tpl-accent)); font-weight:700; font-size:calc(var(--tpl-fs, 14px) + 2px); margin-bottom:2px; }
.tpl-open .op-line{ display:block; height:0; border-bottom:var(--tpl-line-width, 2px) solid var(--tpl-title-color, var(--tpl-accent)); }



/* ===== 标题背景色 ===== */
.tpl-titlebg{ --tpl-accent:#1890FF; }
.tpl-titlebg .tpl-header, .tpl-titlebglight .tpl-header{ display:flex; align-items:center; gap:20px; padding-bottom:8px; margin-bottom:4px; flex-wrap:wrap; }
.tpl-titlebg .tb-head-left, .tpl-titlebglight .tb-head-left{ display:flex; align-items:center; gap:14px; }
.tpl-titlebg .tb-head-text, .tpl-titlebglight .tb-head-text{ display:flex; flex-direction:column; }
.tpl-titlebg .tpl-name, .tpl-titlebglight .tpl-name{ font-size:calc(var(--tpl-fs, 14px) + 10px); color:#111; margin:0 0 2px; }
.tpl-titlebg .tpl-target, .tpl-titlebglight .tpl-target{ color:#666; margin-top:2px; }
.tpl-titlebg .tb-head-right, .tpl-titlebglight .tb-head-right{ flex:1; display:grid; grid-template-columns:1fr 1fr; gap:6px 18px; min-width:220px; }
.tpl-titlebg .tb-contact, .tpl-titlebglight .tb-contact{ font-size:calc(var(--tpl-fs, 14px) - 1px); color:#333; }
.tpl-titlebg .tpl-summary, .tpl-titlebglight .tpl-summary{ color:#444; margin:8px 0; }
.tpl-titlebg .tb-sec-head{ background:var(--tpl-title-color, var(--tpl-accent)); padding:5px 14px; border-radius:4px; margin:12px 0 8px; }
.tpl-titlebg .tb-title{ display:block; color:#fff; font-weight:700; font-size:calc(var(--tpl-fs, 14px) + 2px); }


.tpl-titlebglight{ --tpl-accent:#1890FF; }
.tpl-titlebglight .tb-light-sec-head{
  background:color-mix(in srgb, var(--tpl-title-color, #1890FF) 12%, #ffffff);
  border-left:4px solid var(--tpl-title-color, var(--tpl-accent));
  padding:5px 12px; margin:12px 0 8px;
}
.tpl-titlebglight .tb-light-title{ display:block; color:#222; font-weight:700; font-size:calc(var(--tpl-fs, 14px) + 2px); }
.tpl-titlebg .tpl-photo-rect, .tpl-titlebglight .tpl-photo-rect{ width:70px; height:90px; }
.tpl-titlebg .tpl-photo-round, .tpl-titlebglight .tpl-photo-round{ width:70px; height:70px; }
.tpl-titlebg .tpl-section, .tpl-titlebglight .tpl-section{ margin-bottom:9px; }
.tpl-titlebg .tpl-item, .tpl-titlebglight .tpl-item{ margin-bottom:8px; }
.tpl-titlebg .tpl-summary, .tpl-titlebglight .tpl-summary{ margin:6px 0; }

/* ============================================================
   ===== 视觉增强层：渐变 / 时间轴 / 标签 / 装饰元素 =====
   ============================================================ */

/* ---- 共享：技能分类 → 主题色胶囊 ---- */
.resume-page .tpl-skill{ align-items:flex-start; }
.resume-page .tpl-skill-cat{
  min-width:0; padding:1px 12px; border-radius:20px; align-self:flex-start;
  background:color-mix(in srgb, var(--tpl-title-color, #1890FF) 12%, #ffffff);
  color:var(--tpl-title-color, #1890FF); font-weight:700;
  font-size:calc(var(--tpl-fs, 14px) - 1px); line-height:1.6;
}
/* ---- 共享：技能值 → 圆角标签 ---- */
.resume-page .tpl-skill-items{ display:flex; flex-wrap:wrap; gap:4px 0; }
.resume-page .tpl-skill-tag{
  display:inline-block; padding:0 9px; margin:1px 6px 1px 0; border-radius:12px;
  background:color-mix(in srgb, var(--tpl-title-color, #1890FF) 7%, #ffffff);
  border:1px solid color-mix(in srgb, var(--tpl-title-color, #1890FF) 22%, #ffffff);
  color:#333; font-size:calc(var(--tpl-fs, 14px) - 1.5px); line-height:1.7;
}
/* ---- 共享：条目标题 → 菱形标记 ---- */
.resume-page .tpl-item .tpl-item-title{ position:relative; padding-left:15px; }
.resume-page .tpl-item .tpl-item-title::before{
  content:''; position:absolute; left:0; top:.45em; width:7px; height:7px;
  background:var(--tpl-title-color, #1890FF); transform:rotate(45deg); border-radius:1.5px;
}
/* ---- 共享：日期 → 主题色小徽章 ---- */
.resume-page .tpl-item-date{
  color:var(--tpl-title-color, #1890FF); font-weight:600;
  background:color-mix(in srgb, var(--tpl-title-color, #1890FF) 8%, #ffffff);
  padding:0 9px; border-radius:12px; font-size:calc(var(--tpl-fs, 14px) - 2px);
}
/* 时间轴类模板不重复加菱形 */
.tpl-modern .tpl-item .tpl-item-title, .tpl-vivid .tpl-item .tpl-item-title{ padding-left:0; }
.tpl-modern .tpl-item .tpl-item-title::before, .tpl-vivid .tpl-item .tpl-item-title::before{ display:none; }
/* 深色侧栏内的日期徽章改反色 */
.tpl-open-side .tpl-item-date{ background:rgba(255,255,255,.16); color:#fff; }
.tpl-noir-side .tpl-item-date{ background:rgba(255,255,255,.16); color:#fff; }

/* ===== 简洁单栏：姓名渐变下划线 ===== */
.tpl-clean .tpl-name{ position:relative; display:inline-block; padding-bottom:8px; }
.tpl-clean .tpl-name::after{
  content:''; position:absolute; left:50%; bottom:0; transform:translateX(-50%);
  width:58px; height:4px; border-radius:2px;
  background:linear-gradient(90deg, var(--tpl-title-color, #1f3a5f), color-mix(in srgb, var(--tpl-title-color, #1f3a5f) 35%, #ffffff));
}
.tpl-clean .tpl-contact{ letter-spacing:.3px; }

/* ===== 经典两栏：侧栏渐变 + 主题色边 ===== */
.tpl-classic-side{
  background:linear-gradient(180deg, color-mix(in srgb, var(--tpl-title-color, #2c3e50) 10%, #f2f4f7), #f2f4f7 38%, color-mix(in srgb, var(--tpl-title-color, #2c3e50) 6%, #f7f9fc));
  border-right:4px solid var(--tpl-title-color, #2c3e50);
}
.tpl-classic .side-h{ color:var(--tpl-title-color, #2c3e50); }
.tpl-classic .side-h{ border-bottom:none; background:linear-gradient(90deg, var(--tpl-line-color, #cbd2dc), transparent); height:2px; position:relative; }
.tpl-classic .side-h{ line-height:2.2; }

/* ===== 现代简约：渐变头部 + 时间轴圆点 ===== */
.tpl-modern .tpl-header{
  background:linear-gradient(115deg, var(--tpl-title-color, #2563eb) 0%, color-mix(in srgb, var(--tpl-title-color, #2563eb) 55%, #12264f) 100%);
}
.tpl-modern .tpl-item{ position:relative; padding-left:20px; }
.tpl-modern .tpl-item::before{
  content:''; position:absolute; left:0; top:6px; width:10px; height:10px; border-radius:50%;
  background:var(--tpl-title-color, #2563eb);
  box-shadow:0 0 0 3px color-mix(in srgb, var(--tpl-title-color, #2563eb) 16%, #ffffff);
}
.tpl-modern .tpl-item:not(:last-child)::after{
  content:''; position:absolute; left:4.5px; top:20px; bottom:-9px; width:2px;
  background:color-mix(in srgb, var(--tpl-title-color, #2563eb) 22%, #ffffff);
}
.tpl-modern .tpl-h2{ border:none; border-bottom:var(--tpl-line-width, 2px) solid var(--tpl-line-color, #d9e2ef); }

/* ===== 优雅知性：衬线字体 + 双线标题 ===== */
.tpl-elegant{ font-family:Georgia, "Times New Roman", "STZhongsong", "SimSun", serif; }
.tpl-elegant .tpl-h2{ border-bottom:3px double var(--tpl-line-color, #cfc9bd); }
.tpl-elegant .tpl-item-title::before{ border-radius:50%; transform:none; width:6px; height:6px; top:.55em; }

/* ===== 紧凑实用：条目左侧浅色竖条 ===== */
.tpl-compact .tpl-item{
  border-left:3px solid color-mix(in srgb, var(--tpl-title-color, #5b6b7b) 32%, #ffffff);
  padding-left:10px;
}

/* ===== 商务蓝：渐变标题线 + 菱形标题 ===== */
.tpl-bizblue .bb-line{
  border-bottom:none; height:var(--tpl-line-width, 2px);
  background:linear-gradient(90deg, var(--tpl-title-color, #1890FF), color-mix(in srgb, var(--tpl-title-color, #1890FF) 8%, #ffffff) 85%, transparent);
}
.tpl-bizblue .bb-title{ display:flex; align-items:center; gap:8px; }
.tpl-bizblue .bb-title::before{
  content:''; width:8px; height:8px; background:var(--tpl-title-color, #1890FF);
  transform:rotate(45deg); border-radius:1.5px; flex:0 0 auto;
}
.tpl-bizblue .tpl-name{
  background:linear-gradient(100deg, #111 30%, var(--tpl-title-color, #1890FF));
  -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent;
}

/* ===== 开放两栏：侧栏渐变 + 装饰圆环 ===== */
.tpl-open-side{
  background:var(--tpl-title-color, #1890FF); position:relative; overflow:hidden;
}
.tpl-open-side::before{
  content:''; position:absolute; inset:0;
  background:linear-gradient(170deg, rgba(255,255,255,.12) 0%, rgba(0,0,0,.10) 75%);
  pointer-events:none;
}
.tpl-open-side::after{
  content:''; position:absolute; right:-64px; top:110px; width:170px; height:170px;
  border-radius:50%; border:24px solid rgba(255,255,255,.07); pointer-events:none;
}
.tpl-open .op-title{ display:flex; align-items:center; gap:8px; }
.tpl-open .op-title::before{
  content:''; width:8px; height:8px; background:currentColor;
  transform:rotate(45deg); border-radius:1.5px; flex:0 0 auto;
}
.tpl-open .op-line{
  border-bottom:none; height:var(--tpl-line-width, 2px);
  background:linear-gradient(90deg, var(--tpl-title-color, #1890FF), color-mix(in srgb, var(--tpl-title-color, #1890FF) 10%, #ffffff) 80%, transparent);
}

/* ===== 标题背景色：渐变胶囊标题 ===== */
.tpl-titlebg .tb-sec-head{
  background:linear-gradient(100deg, var(--tpl-title-color, #1890FF), color-mix(in srgb, var(--tpl-title-color, #1890FF) 68%, #ffffff));
  border-radius:20px 6px 20px 6px; padding:5px 18px;
  box-shadow:0 2px 8px color-mix(in srgb, var(--tpl-title-color, #1890FF) 25%, transparent);
}
/* ===== 标题背景浅色：渐变小方块 ===== */
.tpl-titlebglight .tb-light-title{ display:flex; align-items:center; gap:9px; }
.tpl-titlebglight .tb-light-title::before{
  content:''; width:10px; height:10px; flex:0 0 auto;
  background:linear-gradient(135deg, var(--tpl-title-color, #1890FF), color-mix(in srgb, var(--tpl-title-color, #1890FF) 55%, #ffffff));
  border-radius:3px; transform:rotate(45deg);
}

/* ============================================================
   ===== 新模板一：渐变时间轴（vivid） =====
   ============================================================ */
.tpl-vivid{ --tpl-accent:#2563eb; }
.tpl-vivid .vv-header{
  background:linear-gradient(115deg, var(--tpl-title-color, #2563eb) 0%, color-mix(in srgb, var(--tpl-title-color, #2563eb) 52%, #7c3aed) 100%);
  color:#fff; padding:24px 26px; border-radius:14px; margin-bottom:16px;
  display:flex; align-items:center; gap:20px;
  box-shadow:0 6px 20px color-mix(in srgb, var(--tpl-title-color, #2563eb) 32%, transparent);
}
.tpl-vivid .vv-header .tpl-name{ color:#fff; font-size:calc(var(--tpl-fs, 14px) + 10px); margin:0; letter-spacing:1.5px; }
.tpl-vivid .vv-target{ color:rgba(255,255,255,.93); margin-top:3px; font-size:calc(var(--tpl-fs, 14px) + 1px); }
.tpl-vivid .vv-contacts{ margin-top:8px; display:flex; flex-wrap:wrap; }
.tpl-vivid .vv-chip{
  display:inline-block; background:rgba(255,255,255,.16); border:1px solid rgba(255,255,255,.28);
  border-radius:20px; padding:1px 11px; margin:3px 6px 0 0;
  font-size:calc(var(--tpl-fs, 14px) - 1px); color:#fff;
}
.tpl-vivid .tpl-photo-rect{ width:86px; height:110px; border:2px solid rgba(255,255,255,.9); margin:0; box-shadow:0 4px 12px rgba(0,0,0,.18); }
.tpl-vivid .tpl-photo-round{ width:92px; height:92px; border:2px solid rgba(255,255,255,.9); margin:0; box-shadow:0 4px 12px rgba(0,0,0,.18); }
.tpl-vivid .vivid-h2{ display:flex; align-items:center; gap:10px; border-left:none; padding-left:0; margin:18px 0 10px; }
.tpl-vivid .vivid-h2-bar{
  width:24px; height:12px; border-radius:3px; flex:0 0 auto; position:relative;
  background:linear-gradient(120deg, var(--tpl-title-color, #2563eb), color-mix(in srgb, var(--tpl-title-color, #2563eb) 50%, #7c3aed));
}
.tpl-vivid .vivid-h2-bar::after{
  content:''; position:absolute; right:-9px; top:3px; width:6px; height:6px; border-radius:50%;
  background:color-mix(in srgb, var(--tpl-title-color, #2563eb) 65%, #7c3aed);
}
.tpl-vivid .tpl-item{ position:relative; padding-left:22px; margin-bottom:11px; }
.tpl-vivid .tpl-item::before{
  content:''; position:absolute; left:0; top:6px; width:10px; height:10px; border-radius:50%;
  background:linear-gradient(135deg, var(--tpl-title-color, #2563eb), color-mix(in srgb, var(--tpl-title-color, #2563eb) 50%, #7c3aed));
  box-shadow:0 0 0 3px color-mix(in srgb, var(--tpl-title-color, #2563eb) 15%, #ffffff);
}
.tpl-vivid .tpl-item:not(:last-child)::after{
  content:''; position:absolute; left:4.5px; top:20px; bottom:-9px; width:2px;
  background:linear-gradient(180deg, color-mix(in srgb, var(--tpl-title-color, #2563eb) 30%, #ffffff), transparent);
}
.tpl-vivid .tpl-item-date{ background:none; padding:0; }

/* ============================================================
   ===== 新模板二：深邃侧栏（noir） =====
   ============================================================ */
.tpl-noir{ --tpl-accent:#1e293b; }
.tpl-noir-grid{ display:grid; grid-template-columns:34% 66%; min-height:297mm; }
.tpl-noir-side{
  background:linear-gradient(172deg, #2a3a54 0%, #141d2e 55%, #0e1524 100%);
  color:#fff; padding:34px 20px 26px; position:relative; overflow:hidden;
}
.tpl-noir-side::before{
  content:''; position:absolute; top:-70px; right:-70px; width:200px; height:200px;
  border-radius:50%; border:26px solid rgba(255,255,255,.06); pointer-events:none;
}
.tpl-noir-side::after{
  content:''; position:absolute; bottom:-60px; left:-60px; width:170px; height:170px;
  border-radius:50%; border:20px solid color-mix(in srgb, var(--tpl-title-color, #1890FF) 35%, transparent); pointer-events:none;
}
.tpl-noir-side .nn-side-top{ text-align:center; margin-bottom:14px; }
.tpl-noir-side .tpl-photo-rect{ width:86px; height:110px; border:2px solid rgba(255,255,255,.85); margin:0 auto; }
.tpl-noir-side .tpl-photo-round{ width:94px; height:94px; border:2px solid rgba(255,255,255,.85); margin:0 auto; }
.tpl-noir-side .tpl-name{ color:#fff; text-align:center; font-size:calc(var(--tpl-fs, 14px) + 9px); margin:0 0 4px; letter-spacing:2px; }
.tpl-noir-side .nn-target{ color:rgba(255,255,255,.85); text-align:center; font-size:calc(var(--tpl-fs, 14px) - 1px); }
.tpl-noir-side .nn-contacts{ margin-top:14px; padding-top:12px; border-top:1px solid rgba(255,255,255,.18); }
.tpl-noir-side .nn-contact{ display:flex; align-items:baseline; gap:7px; margin:7px 0; font-size:calc(var(--tpl-fs, 14px) - 1px); color:rgba(255,255,255,.92); word-break:break-all; }
.tpl-noir-side .nn-dot{
  width:6px; height:6px; flex:0 0 auto; align-self:center; border-radius:2px;
  background:linear-gradient(135deg, var(--tpl-title-color, #1890FF), color-mix(in srgb, var(--tpl-title-color, #1890FF) 50%, #ffffff));
  transform:rotate(45deg);
}
.tpl-noir-side .nn-side-h{
  margin:20px 0 8px; color:#fff; font-weight:700; font-size:calc(var(--tpl-fs, 14px) + 1px);
  letter-spacing:1px; padding-bottom:5px; border-bottom:1px solid rgba(255,255,255,.25);
}
.tpl-noir-side .nn-edu-item{ margin:0 0 14px; }
.tpl-noir-side .nn-edu-school{ font-weight:700; color:#fff; font-size:calc(var(--tpl-fs, 14px) + 1px); }
.tpl-noir-side .nn-edu-major{ font-size:calc(var(--tpl-fs, 14px) - 1px); color:rgba(255,255,255,.85); margin:1px 0 0; }
.tpl-noir-side .nn-edu-date{ display:inline-block; margin-top:4px; font-size:calc(var(--tpl-fs, 14px) - 2px); color:#fff; background:rgba(255,255,255,.16); border-radius:12px; padding:0 9px; }
.tpl-noir-side ul, .tpl-noir-side .nn-edu-list{ color:rgba(255,255,255,.82); }
.tpl-noir-main{ background:#fff; padding:24px 26px; }
.tpl-noir .nn-sec-head{ display:flex; align-items:center; gap:12px; margin:17px 0 10px; }
.tpl-noir .nn-title{
  color:var(--tpl-title-color, #1890FF); font-weight:800; letter-spacing:1.5px;
  font-size:calc(var(--tpl-fs, 14px) + 2px);
}
.tpl-noir .nn-line{
  flex:1; height:var(--tpl-line-width, 2px);
  background:linear-gradient(90deg, var(--tpl-title-color, #1890FF), color-mix(in srgb, var(--tpl-title-color, #1890FF) 12%, #ffffff) 80%, transparent);
}
.tpl-noir .tpl-item-date{ background:color-mix(in srgb, var(--tpl-title-color, #1890FF) 9%, #ffffff); }
.tpl-noir .tpl-skill-cat{ background:color-mix(in srgb, var(--tpl-title-color, #1890FF) 12%, #ffffff); }

/* ============================================================
   ===== 新模板三：原版经典（original）—— 复刻原简历版式 =====
   ============================================================ */
.tpl-original{
  font-weight:600; color:#333;
  font-size:calc(var(--tpl-fs, 14px) - 2.5px);
  line-height:1.3;
}
/* 头部 */
.tpl-original .og-header{
  display:flex; justify-content:space-between; align-items:flex-end;
  border-bottom:1.5px solid var(--tpl-title-color, #2b4f63);
  padding-bottom:5px; margin-bottom:4px;
}
.tpl-original .og-header-left{ display:flex; align-items:center; }
.tpl-original .og-h1{
  font-size:calc(var(--tpl-fs, 14px) + 10px); color:var(--tpl-title-color, #2b4f63);
  font-weight:bold; margin-right:10px; letter-spacing:1px; margin-bottom:0;
}
.tpl-original .og-sub{ border-left:1px solid #ccc; padding-left:10px; color:#777; }
.tpl-original .og-sub p:first-child{ font-size:calc(var(--tpl-fs, 14px) - 3px); }
.tpl-original .og-sub p:last-child{ font-size:calc(var(--tpl-fs, 14px) - 1.5px); font-family:Arial, sans-serif; }
.tpl-original .og-icons{ display:flex; gap:7px; }
.tpl-original .og-icon{
  width:26px; height:26px; border-radius:50%;
  background:color-mix(in srgb, var(--tpl-title-color, #2b4f63) 75%, #ffffff);
  display:flex; justify-content:center; align-items:center; color:#fff;
}
.tpl-original .og-icon svg{ width:14px; height:14px; fill:currentColor; }

/* 渐变徽章小标题 */
.tpl-original .og-title{
  display:flex; align-items:center;
  margin-top:10px; margin-bottom:5px;
  border-bottom:1.5px solid color-mix(in srgb, var(--tpl-title-color, #2b4f63) 70%, #ffffff);
  padding-bottom:2px;
}
.tpl-original .og-badge{
  display:flex; align-items:center;
  background:linear-gradient(90deg, var(--tpl-title-color, #2b4f63), color-mix(in srgb, var(--tpl-title-color, #2b4f63) 62%, #ffffff));
  color:#fff; padding:2px 16px 2px 7px;
  font-size:calc(var(--tpl-fs, 14px) - 1.5px); font-weight:bold; letter-spacing:.5px;
  position:relative; border-radius:3px 0 0 3px;
}
.tpl-original .og-badge::after{
  content:''; position:absolute; top:0; right:-9px;
  border-top:21px solid color-mix(in srgb, var(--tpl-title-color, #2b4f63) 62%, #ffffff);
  border-right:9px solid transparent;
}
.tpl-original .og-badge svg{ width:12px; height:12px; margin-right:4px; fill:currentColor; flex:0 0 auto; }

/* 基本信息网格 */
.tpl-original .og-basic{ display:flex; justify-content:space-between; margin-bottom:3px; }
.tpl-original .og-grid{ display:grid; grid-template-columns:1fr 1fr; gap:2px 14px; flex:1; padding-top:3px; }
.tpl-original .og-item{ display:flex; white-space:nowrap; overflow:hidden; padding:2px 0; }
.tpl-original .og-item .og-label{ width:64px; color:#555; flex-shrink:0; font-weight:bold; }
.tpl-original .og-photo{ margin-left:14px; flex-shrink:0; }
.tpl-original .og-photo img{ width:84px; height:113px; object-fit:cover; border:1px solid #ddd; border-radius:2px; display:block; }

/* 经历条目：日期 | 标题居中 | 职位右对齐 */
.tpl-original .og-entry-head{
  display:flex; justify-content:space-between; align-items:center;
  font-weight:bold; font-size:calc(var(--tpl-fs, 14px) - 2px); margin-bottom:2px;
  white-space:nowrap; overflow:hidden;
}
.tpl-original .og-date{ width:105px; color:#555; font-weight:bold; font-size:calc(var(--tpl-fs, 14px) - 3px); flex-shrink:0; }
.tpl-original .og-ename{ flex:1; text-align:center; color:#222; overflow:hidden; text-overflow:ellipsis; }
.tpl-original .og-role{ width:105px; text-align:right; color:#222; flex-shrink:0; }
.tpl-original .og-left .og-ename{ text-align:left; padding-left:4px; }

/* 列表 */
.tpl-original .og-list{
  padding-left:15px; color:#555; list-style:disc;
  font-size:calc(var(--tpl-fs, 14px) - 3px); line-height:1.35; margin:1px 0 3px;
}
.tpl-original .og-list li{ margin:1px 0; }
.tpl-original .og-nolist{ list-style:none; }
.tpl-original .og-courses{ padding-left:105px; }

/* 双栏网格（项目 / 荣誉） */
.tpl-original .og-grid2{ display:grid; grid-template-columns:1fr 1fr; gap:3px 18px; }
.tpl-original .og-proj-item{ margin-bottom:3px; }
.tpl-original .og-proj-item .og-entry-head{ font-size:calc(var(--tpl-fs, 14px) - 3.5px); margin-bottom:1px; }
.tpl-original .og-proj-item .og-date{ width:68px; font-size:calc(var(--tpl-fs, 14px) - 4.5px); }
.tpl-original .og-proj-item .og-role{ width:60px; font-size:calc(var(--tpl-fs, 14px) - 4.5px); }
.tpl-original .og-proj-item .og-list{ font-size:calc(var(--tpl-fs, 14px) - 4px); padding-left:9px; line-height:1.3; }
.tpl-original .og-honor{ display:flex; align-items:center; padding:1px 0; color:#555; }
.tpl-original .og-honor::before{ content:'•'; color:var(--tpl-title-color, #2b4f63); font-weight:bold; margin-right:5px; }

/* 校园经历：标题左对齐 */
.tpl-original .og-campus .og-entry-head{ justify-content:flex-start; gap:14px; }
.tpl-original .og-campus .og-ename{ flex:none; text-align:left; }
.tpl-original .og-campus .og-role{ width:auto; text-align:left; }

.tpl-original .og-profile{ white-space:pre-wrap; margin:3px 0; color:#444; }

/* ============================================================
   ===== 新模板四：学术素雅（academic） =====
   ============================================================ */
.tpl-academic{ font-family:"Songti SC","STSong","SimSun",Georgia,serif; }
.tpl-academic .ac-header{ text-align:center; border-top:2.5px solid #222; border-bottom:1px solid #999; padding:16px 0 12px; margin-bottom:14px; }
.tpl-academic .tpl-name{ font-size:calc(var(--tpl-fs, 14px) + 12px); letter-spacing:8px; color:#111; margin:0 0 4px; }
.tpl-academic .ac-target{ color:#444; letter-spacing:2px; }
.tpl-academic .ac-contact{ color:#555; font-size:calc(var(--tpl-fs, 14px) - 1px); margin-top:4px; }
.tpl-academic .ac-h2{ border-left:none; padding-left:0; letter-spacing:4px; color:#111; border-bottom:1px solid #222; padding-bottom:5px; margin:18px 0 10px; }
.tpl-academic .tpl-item-date{ background:none; padding:0; color:#555; }
.tpl-academic .tpl-item .tpl-item-title{ padding-left:0; }
.tpl-academic .tpl-item .tpl-item-title::before{ display:none; }
.tpl-academic .tpl-photo-rect, .tpl-academic .tpl-photo-round{ margin:0 auto 10px; }

/* ============================================================
   ===== 新模板五：瑞士极简（swiss） =====
   ============================================================ */
.tpl-swiss{ font-family:"Helvetica Neue",Helvetica,"Microsoft YaHei",Arial,sans-serif; }
.tpl-swiss .sw-header{ position:relative; padding:26px 0 18px; border-bottom:4px solid var(--tpl-title-color, #d92b2b); margin-bottom:16px; }
.tpl-swiss .sw-square{
  position:absolute; right:0; top:24px; width:34px; height:34px;
  background:var(--tpl-title-color, #d92b2b);
}
.tpl-swiss .tpl-name{ font-size:calc(var(--tpl-fs, 14px) + 16px); font-weight:800; color:#111; margin:0 0 6px; letter-spacing:2px; line-height:1.15; }
.tpl-swiss .sw-target{ font-size:calc(var(--tpl-fs, 14px) + 2px); color:var(--tpl-title-color, #d92b2b); font-weight:700; margin-bottom:4px; }
.tpl-swiss .sw-contact{ color:#666; font-size:calc(var(--tpl-fs, 14px) - 1px); }
.tpl-swiss .sw-h2{ display:flex; align-items:baseline; gap:12px; border-left:none; padding-left:0; margin:22px 0 10px; font-size:calc(var(--tpl-fs, 14px) + 5px); font-weight:800; color:#111; letter-spacing:1px; }
.tpl-swiss .sw-num{ color:var(--tpl-title-color, #d92b2b); font-weight:800; }
.tpl-swiss .tpl-item-date{ background:none; padding:0; color:#777; }
.tpl-swiss .tpl-item .tpl-item-title{ padding-left:0; }
.tpl-swiss .tpl-item .tpl-item-title::before{ display:none; }

/* ============================================================
   ===== 新模板六：水墨书卷（ink） =====
   ============================================================ */
.tpl-ink{ font-family:"Kaiti SC","STKaiti","KaiTi","SimSun",serif; }
.tpl-ink .ik-header{ text-align:center; padding:14px 0 12px; margin-bottom:10px; border-bottom:2px solid #2b2b2b; position:relative; }
.tpl-ink .ik-name-row{ display:flex; align-items:center; justify-content:center; gap:12px; }
.tpl-ink .tpl-name{ font-size:calc(var(--tpl-fs, 14px) + 14px); color:#1c1c1c; letter-spacing:6px; margin:0; font-weight:700; }
.tpl-ink .ik-seal{
  display:inline-flex; align-items:center; justify-content:center;
  width:30px; height:30px; border-radius:4px; color:#fff; font-size:calc(var(--tpl-fs, 14px) + 2px);
  background:#b03a2e; box-shadow:inset 0 0 0 2px rgba(255,255,255,.35);
}
.tpl-ink .ik-target{ color:#4a4a4a; letter-spacing:2px; margin-top:3px; }
.tpl-ink .ik-contact{ color:#666; font-size:calc(var(--tpl-fs, 14px) - 1px); margin-top:4px; }
.tpl-ink .ik-h2{ border-left:none; padding-left:0; color:#2b2b2b; letter-spacing:3px; margin:18px 0 10px;
  background:linear-gradient(90deg, #2b2b2b 0 22px, rgba(43,43,43,.25) 22px 100%) no-repeat left bottom / 100% 2px; padding-bottom:6px; border-bottom:none; }
.tpl-ink .tpl-item-date{ background:none; padding:0; color:#666; }
.tpl-ink .tpl-item .tpl-item-title{ padding-left:0; }
.tpl-ink .tpl-item .tpl-item-title::before{ display:none; }
.tpl-ink .tpl-photo-rect, .tpl-ink .tpl-photo-round{ margin:0 auto 10px; }

/* ============================================================
   ===== 新模板七：新闻报刊（press） =====
   ============================================================ */
.tpl-press{ font-family:Georgia,"Times New Roman","STZhongsong","SimSun",serif; }
.tpl-press .pr-header{ text-align:center; padding-bottom:10px; margin-bottom:10px; }
.tpl-press .pr-rule-thick{ border-top:3.5px solid #1a1a1a; margin-bottom:12px; }
.tpl-press .tpl-name{ font-size:calc(var(--tpl-fs, 14px) + 14px); color:#1a1a1a; letter-spacing:4px; margin:0 0 4px; font-weight:700; }
.tpl-press .pr-target{ color:#333; letter-spacing:1px; font-style:italic; }
.tpl-press .pr-contact{ color:#555; font-size:calc(var(--tpl-fs, 14px) - 1px); margin-top:5px; }
.tpl-press .pr-rule-thin{ border-top:1px solid #1a1a1a; border-bottom:1px solid #1a1a1a; height:4px; margin-top:10px; }
.tpl-press .pr-h2{ border-left:none; padding-left:0; text-align:center; color:#1a1a1a; letter-spacing:5px;
  border-top:1.5px solid #1a1a1a; border-bottom:1px solid #1a1a1a; padding:6px 0; margin:18px 0 10px; font-weight:700; }
.tpl-press .tpl-item-date{ background:none; padding:0; color:#555; font-style:italic; }
.tpl-press .tpl-item .tpl-item-title{ padding-left:0; }
.tpl-press .tpl-item .tpl-item-title::before{ display:none; }

/* ============================================================
   ===== 新模板八：清雅侧栏（colorside） =====
   ============================================================ */
.tpl-colorside{ --tpl-accent:#0f9d8f; }
.tpl-cs-grid{ display:grid; grid-template-columns:32% 68%; min-height:297mm; }
.tpl-cs-side{
  background:color-mix(in srgb, var(--tpl-title-color, #0f9d8f) 9%, #ffffff);
  border-right:8px solid var(--tpl-title-color, #0f9d8f);
  padding:30px 18px 22px;
}
.tpl-colorside .tpl-photo-rect{ width:88px; height:112px; margin:0 auto 14px; border:3px solid var(--tpl-title-color, #0f9d8f); }
.tpl-colorside .tpl-photo-round{ width:96px; height:96px; margin:0 auto 14px; border:3px solid var(--tpl-title-color, #0f9d8f); }
.tpl-cs-side .tpl-name{ font-size:calc(var(--tpl-fs, 14px) + 8px); color:#111; text-align:center; margin:0 0 4px; }
.tpl-colorside .cs-target{ color:var(--tpl-title-color, #0f9d8f); text-align:center; font-weight:600; margin-bottom:14px; }
.tpl-colorside .cs-contacts{ padding-top:12px; border-top:1px dashed color-mix(in srgb, var(--tpl-title-color, #0f9d8f) 40%, #ffffff); }
.tpl-colorside .cs-contact{ display:flex; align-items:baseline; gap:8px; margin:8px 0; font-size:calc(var(--tpl-fs, 14px) - 1px); color:#444; word-break:break-all; }
.tpl-colorside .cs-dot{ width:7px; height:7px; flex:0 0 auto; align-self:center; background:var(--tpl-title-color, #0f9d8f); transform:rotate(45deg); border-radius:1.5px; }
.tpl-cs-main{ padding:24px 26px; }
.tpl-colorside .cs-sec-head{ display:flex; align-items:center; gap:10px; margin:17px 0 10px; }
.tpl-colorside .cs-title{ color:var(--tpl-title-color, #0f9d8f); font-weight:800; font-size:calc(var(--tpl-fs, 14px) + 2px); letter-spacing:2px; }
.tpl-colorside .cs-line{ flex:1; height:3px; border-radius:2px; background:linear-gradient(90deg, var(--tpl-title-color, #0f9d8f), color-mix(in srgb, var(--tpl-title-color, #0f9d8f) 15%, #ffffff)); }
.tpl-colorside .tpl-item-date{ background:color-mix(in srgb, var(--tpl-title-color, #0f9d8f) 9%, #ffffff); }

/* ============================================================
   ===== 新模板九：包豪斯几何（bauhaus） =====
   ============================================================ */
.tpl-bauhaus{ font-family:"Futura","Avenir Next","Century Gothic","Microsoft YaHei",sans-serif; }
.tpl-bauhaus .bh-header{ padding:18px 0 16px; border-bottom:3px solid #1c1c1c; margin-bottom:14px; }
.tpl-bauhaus .bh-shapes{ display:flex; gap:8px; margin-bottom:12px; }
.tpl-bauhaus .bh-s1{ width:22px; height:22px; background:#e05252; border-radius:50%; }
.tpl-bauhaus .bh-s2{ width:22px; height:22px; background:#4a7fd4; transform:rotate(45deg); border-radius:3px; }
.tpl-bauhaus .bh-s3{ width:22px; height:22px; background:#eebd4c; border-radius:0; }
.tpl-bauhaus .tpl-name{ font-size:calc(var(--tpl-fs, 14px) + 13px); color:#1c1c1c; margin:0 0 4px; letter-spacing:2px; font-weight:800; text-transform:none; }
.tpl-bauhaus .bh-target{ color:#1c1c1c; font-weight:700; }
.tpl-bauhaus .bh-contact{ color:#555; font-size:calc(var(--tpl-fs, 14px) - 1px); margin-top:4px; }
.tpl-bauhaus .bh-h2{ display:flex; align-items:center; gap:10px; border-left:none; padding-left:0; color:#1c1c1c; font-weight:800; letter-spacing:2px; margin:20px 0 10px; border-bottom:2px solid #1c1c1c; padding-bottom:6px; }
.tpl-bauhaus .bh-mark{ width:14px; height:14px; flex:0 0 auto; border-radius:3px; }
.tpl-bauhaus .tpl-item-date{ background:none; padding:0; color:#666; }
.tpl-bauhaus .tpl-item .tpl-item-title{ padding-left:0; }
.tpl-bauhaus .tpl-item .tpl-item-title::before{ display:none; }
