/* ============ 智能名片 共享样式 ============ */
/* 默认 = 日间模式（浅色） */
:root {
  --bg: #f4f6fb; --bg-2: #eaeef7; --card: #ffffff; --card-2: #eef2f9;
  --border: #d8e0ee; --text: #1c2536; --text-sub: #5c6b85;
  --accent: #2f6bff; --accent-2: #0fb894; --accent-3: #e08a00; --danger: #e5484d;
  --nav-bg: rgba(244,246,251,.88);
  --nav-border: rgba(216,224,238,.7);
  --footer-text: #7c8aa5;
  --shadow: 0 14px 40px rgba(30,50,90,.16);
  --shadow-soft: 0 8px 24px rgba(30,50,90,.12);
  --glow-accent: rgba(47,107,255,.10);
  --glow-green: rgba(15,184,148,.07);
  --glow-orange: rgba(224,138,0,.05);
  --chip-bg: rgba(47,107,255,.06);
  --tl-glow: rgba(47,107,255,.16);
  --num-color: rgba(47,107,255,.25);
  --num-color-hover: rgba(47,107,255,.55);
}
/* 夜间模式（暗色，原配色） */
html[data-theme="dark"] {
  --bg: #0b1220; --bg-2: #101a30; --card: #16213a; --card-2: #1b2947;
  --border: #26365c; --text: #e8eefc; --text-sub: #93a4c7;
  --accent: #4f8cff; --accent-2: #38d9a9; --accent-3: #ffb454; --danger: #ff6b6b;
  --nav-bg: rgba(11,18,32,.85);
  --nav-border: rgba(38,54,92,.4);
  --footer-text: #5a6b8c;
  --shadow: 0 14px 40px rgba(0,0,0,.35);
  --shadow-soft: 0 8px 24px rgba(0,0,0,.3);
  --glow-accent: rgba(79,140,255,.12);
  --glow-green: rgba(56,217,169,.08);
  --glow-orange: rgba(255,180,84,.06);
  --chip-bg: rgba(79,140,255,.12);
  --tl-glow: rgba(79,140,255,.2);
  --num-color: rgba(79,140,255,.45);
  --num-color-hover: rgba(79,140,255,.85);
}
* { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; }
body {
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif;
  background:var(--bg); color:var(--text); line-height:1.7; overflow-x:hidden;
  transition:background .35s, color .35s;
}
.bg-glow { position:fixed; inset:0; z-index:-1; pointer-events:none;
  background:
    radial-gradient(600px 400px at 15% 10%, var(--glow-accent), transparent 60%),
    radial-gradient(500px 400px at 85% 20%, var(--glow-green), transparent 60%),
    radial-gradient(700px 500px at 50% 100%, var(--glow-orange), transparent 60%);
}
.container { max-width:860px; margin:0 auto; padding:0 20px; }

/* 顶部导航（含二级页返回） */
nav { position:sticky; top:0; z-index:100; backdrop-filter:blur(12px); background:var(--nav-bg); border-bottom:1px solid var(--nav-border); transition:background .35s, border-color .35s; }
.nav-inner { max-width:860px; margin:0 auto; padding:14px 20px; display:flex; align-items:center; justify-content:space-between; }
.nav-logo { font-weight:800; font-size:18px; }
.nav-logo a { color:var(--text); text-decoration:none; }
.nav-logo span { color:var(--accent); }
.nav-links { display:flex; gap:18px; font-size:14px; flex-wrap:wrap; align-items:center; }
.nav-links a { color:var(--text-sub); text-decoration:none; transition:color .2s; }
.nav-links a:hover { color:var(--text); }
.nav-links a.active { color:var(--accent); font-weight:600; }
.theme-toggle { background:none; border:1px solid var(--border); color:var(--text-sub); cursor:pointer;
  width:34px; height:34px; border-radius:50%; font-size:15px; display:inline-flex; align-items:center; justify-content:center;
  transition:all .25s; margin-left:6px; }
.theme-toggle:hover { border-color:var(--accent); color:var(--accent); transform:rotate(20deg); }
.breadcrumb { max-width:860px; margin:0 auto; padding:20px 20px 0; font-size:13px; color:var(--text-sub); }
.breadcrumb a { color:var(--accent); text-decoration:none; }

/* 二级页头部 */
.page-head { max-width:860px; margin:0 auto; padding:44px 20px 10px; }
.page-head .icon { font-size:40px; }
.page-head h1 { font-size:32px; font-weight:800; margin-top:10px; }
.page-head p { color:var(--text-sub); font-size:15px; margin-top:8px; max-width:600px; }
.page-meta { margin-top:14px; display:flex; gap:8px; flex-wrap:wrap; }
.chip { font-size:12px; padding:4px 12px; border-radius:16px; border:1px solid var(--border); color:var(--text-sub); background:var(--chip-bg); }

/* 头部返回箭头 */
.back-bar { display:inline-flex; align-items:center; gap:6px; font-size:14px; color:var(--text-sub); text-decoration:none; margin-bottom:16px; transition:color .2s; }
.back-bar:hover { color:var(--accent); }

/* 卡片通用 */
.card { background:var(--card); border:1px solid var(--border); border-radius:14px; padding:22px; margin-bottom:16px; transition:background .35s, border-color .35s; }
.card-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:16px; }
.card:hover { transform:translateY(-2px); border-color:var(--accent); transition:all .25s; }
.card h3 { font-size:16px; margin-bottom:8px; display:flex; align-items:center; gap:8px; }
.card p { font-size:13.5px; color:var(--text-sub); }

/* 时间线 */
.timeline { position:relative; padding-left:28px; }
.timeline::before { content:''; position:absolute; left:7px; top:8px; bottom:8px; width:2px; background:linear-gradient(180deg,var(--accent),var(--border),transparent); }
.timeline-item { position:relative; margin-bottom:28px; }
.timeline-item::before { content:''; position:absolute; left:-25px; top:6px; width:12px; height:12px; border-radius:50%; background:var(--accent); box-shadow:0 0 0 4px var(--tl-glow); }
.timeline-item.highlight::before { background:var(--accent-2); box-shadow:0 0 0 4px rgba(15,184,148,.2); }
html[data-theme="dark"] .timeline-item.highlight::before { box-shadow:0 0 0 4px rgba(56,217,169,.2); }
.tl-period { font-size:13px; color:var(--accent); font-weight:600; }
.tl-company { font-size:17px; font-weight:700; margin-top:2px; }
.tl-role { font-size:14px; color:var(--text-sub); margin-top:2px; }
.tl-desc { font-size:13.5px; color:var(--text-sub); margin-top:10px; line-height:1.8; padding-left:0; list-style:none; }
.tl-desc li { margin-left:18px; margin-bottom:6px; }
.tl-note { display:inline-block; font-size:11px; color:var(--accent-3); border:1px solid rgba(224,138,0,.4); padding:2px 10px; border-radius:12px; margin-top:8px; }
html[data-theme="dark"] .tl-note { border-color:rgba(255,180,84,.4); }

/* 技能标签 */
.skill-tags { display:flex; flex-wrap:wrap; gap:6px; margin-top:12px; }
.tag { font-size:11px; padding:3px 10px; border-radius:12px; background:var(--chip-bg); color:var(--accent); }

/* 底部返回 */
.bottom-nav { max-width:860px; margin:0 auto; padding:20px; text-align:center; }

footer { text-align:center; padding:30px 20px 46px; color:var(--footer-text); font-size:12.5px; border-top:1px solid var(--nav-border); margin-top:20px; }
.fade-up { opacity:0; transform:translateY(24px); transition:opacity .7s ease, transform .7s ease; }
.fade-up.visible { opacity:1; transform:translateY(0); }
a.btn { padding:12px 30px; border-radius:50px; font-size:15px; font-weight:700; text-decoration:none; transition:all .25s; }
@media (max-width:680px){ .card-grid{grid-template-columns:1fr;} nav .nav-links{gap:10px;font-size:12px;} .page-head h1{font-size:26px;} .theme-toggle{margin-left:2px;} }
