/* ===================== 基础变量 ===================== */
:root{
  --ink:#1f2733;
  --muted:#5b6675;
  --line:#e3e8ef;
  --bg:#eef1f6;
  --card:#ffffff;
  --side-bg:#eef3fb;
  --accent:#2f5fb0;
  --accent-soft:#eaf1fb;
  --radius:10px;
  --font:"PingFang SC","Microsoft YaHei","Hiragino Sans GB",-apple-system,system-ui,sans-serif;
}

/* 三套模板：仅切换主题色与侧栏底色，布局统一由下方控制 */
[data-tpl="classic"]{ --accent:#2f5fb0; --side-bg:#eef3fb; --accent-soft:#eaf1fb; }
[data-tpl="modern"] { --accent:#0f9b8e; --side-bg:#f1fbfa; --accent-soft:#e2f5f3; }
[data-tpl="minimal"]{ --accent:#333a45; --side-bg:#fafafa; --accent-soft:#f0f0f0; }

*{box-sizing:border-box;}
html,body{margin:0;padding:0;}
body{
  font-family:var(--font);
  color:var(--ink);
  background:var(--bg);
  line-height:1.7;
  -webkit-font-smoothing:antialiased;
}

/* ===================== 顶部工具栏（仅屏幕） ===================== */
.toolbar{
  position:sticky;top:0;z-index:20;
  display:flex;align-items:center;justify-content:space-between;
  gap:12px;flex-wrap:wrap;
  padding:10px 18px;
  background:var(--card);
  border-bottom:1px solid var(--line);
  box-shadow:0 1px 6px rgba(20,30,50,.05);
}
.tb-left{font-weight:700;font-size:15px;display:flex;align-items:baseline;gap:8px;}
.tb-sub{font-weight:400;font-size:12px;color:var(--muted);}
.tb-right{display:flex;align-items:center;gap:8px;flex-wrap:wrap;}
.tb-label{font-size:12px;color:var(--muted);}
.tpl-btn,.print-btn{
  font-family:inherit;font-size:13px;cursor:pointer;
  border:1px solid var(--line);background:#fff;color:var(--ink);
  padding:6px 12px;border-radius:8px;transition:.15s;
}
.tpl-btn:hover,.print-btn:hover{border-color:var(--accent);color:var(--accent);}
.tpl-btn.is-on{background:var(--accent);border-color:var(--accent);color:#fff;}
.print-btn{background:var(--accent);border-color:var(--accent);color:#fff;font-weight:600;}
.print-btn:hover{filter:brightness(.94);color:#fff;}

/* ===================== 页面容器 ===================== */
.page{padding:24px 16px 48px;}

.resume{
  max-width:940px;margin:0 auto;background:var(--card);
  border:1px solid var(--line);border-radius:var(--radius);
  overflow:hidden;
}

/* 经典：左右两栏 */
[data-tpl="classic"] .resume{
  display:grid;grid-template-columns:34% 1fr;
}
/* 现代 / 极简：单栏（侧栏置顶） */
[data-tpl="modern"] .resume,
[data-tpl="minimal"] .resume{
  display:block;
}

/* ===================== 侧栏 ===================== */
.r-side{
  background:var(--side-bg);
  padding:28px 22px;
  border-right:1px solid var(--line);
}
.avatar{
  width:64px;height:64px;border-radius:50%;
  background:var(--accent);color:#fff;
  display:flex;align-items:center;justify-content:center;
  font-size:26px;font-weight:700;margin-bottom:14px;
}
.name{font-size:24px;margin:0 0 2px;letter-spacing:1px;}
.role{margin:0 0 18px;color:var(--accent);font-weight:600;font-size:14px;}
.blk{margin-bottom:20px;}
.blk-t{
  font-size:14px;margin:0 0 10px;padding-bottom:6px;
  border-bottom:2px solid var(--accent);display:inline-block;
}
.contact{list-style:none;margin:0;padding:0;font-size:13px;}
.contact li{margin-bottom:6px;color:var(--muted);}
.contact span{display:inline-block;width:42px;color:var(--ink);font-weight:600;}
.skills{list-style:none;margin:0;padding:0;font-size:13px;}
.skills li{margin-bottom:10px;}
.skills li span{display:block;margin-bottom:4px;color:var(--muted);}
.bar{display:block;height:6px;background:var(--line);border-radius:4px;overflow:hidden;}
.bar b{display:block;height:100%;background:var(--accent);border-radius:4px;}
.edu{font-size:13px;color:var(--muted);margin:0;line-height:1.6;}
.edu b{color:var(--ink);}
.honors{margin:0;padding-left:18px;font-size:13px;color:var(--muted);}
.honors li{margin-bottom:5px;}

/* ===================== 主栏 ===================== */
.r-main{padding:28px 26px;}
.r-main .blk-t{
  font-size:16px;color:var(--ink);
  border-bottom:2px solid var(--accent);
}
.summary{margin:0;font-size:14px;color:var(--muted);}
.exp{margin-bottom:16px;}
.exp-h{display:flex;justify-content:space-between;align-items:baseline;gap:10px;flex-wrap:wrap;}
.exp-co{font-weight:700;font-size:15px;}
.exp-date{font-size:12px;color:var(--muted);white-space:nowrap;}
.exp-tech{font-size:12px;color:var(--accent);background:var(--accent-soft);display:inline-block;padding:2px 8px;border-radius:6px;margin:4px 0 8px;}
.exp ul{margin:6px 0 0;padding-left:18px;font-size:13.5px;color:var(--muted);}
.exp ul li{margin-bottom:5px;}

/* 现代：主栏标题加左侧色条 */
[data-tpl="modern"] .blk-t{
  border-left:4px solid var(--accent);border-bottom:none;
  padding-left:10px;line-height:1.3;
}
[data-tpl="modern"] .r-side{border-right:none;}

/* 极简：发丝线分隔、无侧栏底色 */
[data-tpl="minimal"] .r-side{background:transparent;border-right:none;}
[data-tpl="minimal"] .blk-t{border-bottom:1px solid var(--line);font-weight:600;}
[data-tpl="minimal"] .avatar{background:transparent;color:var(--accent);border:2px solid var(--accent);}
[data-tpl="minimal"] .name{font-family:Georgia,"Times New Roman",serif;}

/* ===================== 响应式：平板断点（关键） ===================== */
/* 平板及以内：所有模板强制单栏，避免双栏在窄屏挤压 */
@media (max-width:1024px){
  [data-tpl="classic"] .resume{grid-template-columns:1fr;}
  .r-side{border-right:none;border-bottom:1px solid var(--line);}
}

/* 手机：缩小间距与字号，联系方式换行更友好 */
@media (max-width:600px){
  .page{padding:16px 10px 36px;}
  .r-side,.r-main{padding:20px 16px;}
  .name{font-size:21px;}
  .contact span{width:auto;margin-right:6px;}
  .toolbar{padding:8px 12px;}
  .tb-left{font-size:14px;}
  .tpl-btn,.print-btn{padding:5px 9px;font-size:12px;}
}

/* ===================== 打印 / 导出 PDF ===================== */
@media print{
  @page{size:A4;margin:14mm;}
  body{background:#fff;}
  .toolbar{display:none !important;}
  .page{padding:0;}
  .resume{max-width:none;border:none;border-radius:0;}
  [data-tpl="classic"] .resume{grid-template-columns:34% 1fr;}
  .r-side{background:var(--side-bg) !important;-webkit-print-color-adjust:exact;print-color-adjust:exact;}
  .blk-t,.avatar,.bar b,.exp-tech{-webkit-print-color-adjust:exact;print-color-adjust:exact;}
  .exp{page-break-inside:avoid;}
}