/* 中华历史馆 · 朝代专页公共样式（由 tang.html 模板抽取） */
:root{
  --paper:#f6f1e6;--paper2:#efe8d8;--ink:#26241f;--ink2:#5a554a;
  --seal:#a63a2b;--gold:#9c7c38;--line:#d8cfba;
  --c:#a63a2b;--c-soft:rgba(166,58,43,.08);
  --kai:"KaiTi","STKaiti","DFKai-SB","BiauKai",serif;
  --song:"SimSun","STSong","NSimSun",serif;
  --hei:"Microsoft YaHei","PingFang SC","Hiragino Sans GB",sans-serif;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  background:var(--paper);color:var(--ink);font-family:var(--hei);line-height:1.75;
  background-image:
    radial-gradient(ellipse at 20% -10%, rgba(156,124,56,.08), transparent 55%),
    radial-gradient(ellipse at 90% 30%, rgba(166,58,43,.05), transparent 45%);
}
::selection{background:var(--c-soft)}
a{text-decoration:none;color:inherit}

/* ---------- 顶栏 ---------- */
.topbar{
  position:fixed;top:0;left:0;right:0;z-index:100;
  display:flex;align-items:center;justify-content:space-between;
  padding:0 clamp(14px,3.5vw,44px);height:56px;
  background:rgba(246,241,230,.93);backdrop-filter:blur(8px);
  border-bottom:1px solid var(--line);
}
.topbar .brand{display:flex;align-items:center;gap:9px;font-family:var(--kai);font-size:1.02rem;letter-spacing:.16em;color:var(--seal);font-weight:700;white-space:nowrap}
.topbar .brand .mini{
  width:30px;height:30px;line-height:30px;text-align:center;flex-shrink:0;
  background:var(--seal);color:#f6f1e6;font-size:15px;border-radius:6px;letter-spacing:0;
}
.topbar .trail{display:flex;gap:clamp(8px,1.8vw,18px);align-items:center;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none}
.topbar .trail::-webkit-scrollbar{display:none}
.topbar .trail a{color:var(--ink2);font-size:.84rem;letter-spacing:.08em;white-space:nowrap;padding:3px 1px;border-bottom:2px solid transparent;transition:.25s}
.topbar .trail a:hover{color:var(--c);border-bottom-color:var(--c)}
.topbar .trail a.dyn-now{color:var(--c);font-weight:700}

/* ---------- 朝代 Hero ---------- */
.hero{
  position:relative;overflow:hidden;
  padding:clamp(96px,14vh,140px) 20px clamp(40px,6vh,64px);
  text-align:center;
}
.hero .wm{
  position:absolute;left:50%;top:44%;transform:translate(-50%,-50%);
  font-family:var(--kai);font-size:clamp(280px,46vw,560px);line-height:1;
  color:var(--c);opacity:.055;user-select:none;pointer-events:none;
}
.hero .halo{
  position:absolute;left:50%;top:46%;transform:translate(-50%,-50%);
  width:clamp(230px,34vw,400px);aspect-ratio:1;border-radius:50%;
  background:radial-gradient(circle, var(--c), transparent 72%);opacity:.09;
}
.hero-inner{position:relative;z-index:2}
.hero .era{font-family:var(--song);font-size:.82rem;color:var(--gold);letter-spacing:.55em;text-indent:.55em;margin-bottom:14px}
.hero h1{
  font-family:var(--kai);font-weight:700;letter-spacing:.3em;text-indent:.3em;
  font-size:clamp(2.6rem,8vw,4.6rem);
  text-shadow:0 2px 0 rgba(255,255,255,.55);
}
.hero .alts{margin-top:10px;font-family:var(--kai);color:var(--ink2);letter-spacing:.3em;font-size:clamp(.9rem,2vw,1.08rem)}
.hero .quote{
  font-family:var(--kai);margin:24px auto 0;max-width:620px;
  font-size:clamp(.95rem,2.2vw,1.12rem);line-height:2;
  padding:12px 24px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);
}
.hero .quote b{color:var(--c)}
.facts{
  display:flex;justify-content:center;gap:clamp(10px,3vw,20px);flex-wrap:wrap;
  margin:30px auto 0;max-width:880px;
}
.fact{
  min-width:118px;padding:12px 16px 10px;text-align:center;
  background:linear-gradient(165deg,#fffdf6,var(--paper2));
  border:1px solid var(--line);border-radius:6px;
  box-shadow:0 2px 8px rgba(90,85,74,.07);
}
.fact b{display:block;font-family:var(--song);font-size:1.12rem;color:var(--c);letter-spacing:.06em}
.fact span{display:block;font-size:.7rem;color:var(--ink2);letter-spacing:.22em;margin-top:3px}

/* ---------- 主体 ---------- */
.wrap{max-width:1220px;margin:0 auto;padding:0 clamp(16px,4vw,40px)}
section{scroll-margin-top:76px;padding-top:clamp(34px,6vw,58px)}
.sec-head{display:flex;align-items:baseline;gap:13px;flex-wrap:wrap;margin-bottom:6px}
.sec-head h2{
  font-family:var(--kai);font-size:clamp(1.5rem,3.4vw,1.95rem);letter-spacing:.16em;font-weight:700;
  border-left:6px solid var(--c);padding-left:14px;
}
.sec-head .sub{font-family:var(--song);font-size:.78rem;color:var(--ink2);letter-spacing:.14em}
.prose{font-size:.98rem;line-height:2.05;letter-spacing:.02em;margin-top:14px;max-width:92ch}
.prose p{margin-bottom:10px}
.prose b{color:var(--c);font-weight:700}
.prose .motto{font-family:var(--kai);color:var(--ink2)}

/* ---------- 制度文化卡片 ---------- */
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:14px;margin-top:18px}
.card{
  position:relative;overflow:hidden;
  background:linear-gradient(165deg,#fffdf6,var(--paper2));
  border:1px solid var(--line);border-radius:6px;padding:18px 20px 16px;
  transition:transform .3s,box-shadow .3s,border-color .3s;
}
.card:hover{transform:translateY(-4px);border-color:var(--c);box-shadow:0 14px 28px -14px rgba(90,85,74,.3)}
.card h3{
  font-family:var(--kai);font-size:1.02rem;letter-spacing:.14em;color:var(--c);
  display:flex;align-items:center;gap:9px;margin-bottom:9px;font-weight:700;
}
.card h3::before{content:"";width:8px;height:8px;background:var(--c);transform:rotate(45deg);flex-shrink:0;opacity:.85}
.card p{font-size:.87rem;line-height:1.95;color:var(--ink)}
.card .cap{display:block;margin-top:8px;font-family:var(--song);font-size:.7rem;color:var(--ink2);letter-spacing:.12em}

/* ---------- 君主列表 ---------- */
.etab-wrap{overflow-x:auto;margin-top:16px;border:1px solid var(--line);border-radius:8px;box-shadow:0 4px 14px rgba(90,85,74,.08)}
table.etab{width:100%;border-collapse:collapse;min-width:640px;background:#fffdf8}
.etab th{
  font-family:var(--kai);font-size:.92rem;letter-spacing:.14em;color:#fdf6ea;
  background:var(--c);
  padding:10px 12px;text-align:left;white-space:nowrap;font-weight:700;
}
.etab td{
  padding:9px 12px;font-size:.86rem;border-bottom:1px solid #efe8d8;vertical-align:top;
}
.etab tr:nth-child(even) td{background:rgba(239,232,216,.35)}
.etab tr:hover td{background:var(--c-soft)}
.etab tr:last-child td{border-bottom:none}
.etab .tm{font-family:var(--kai);font-weight:700;font-size:.95rem;letter-spacing:.06em;white-space:nowrap}
.etab .tm em{font-style:normal;font-family:var(--song);font-size:.72rem;color:var(--ink2);display:block;letter-spacing:.05em}
.etab .nm{font-family:var(--kai);white-space:nowrap}
.etab .yr{font-family:var(--song);font-size:.8rem;color:var(--ink2);white-space:nowrap}
.etab .ds{color:var(--ink);line-height:1.8;min-width:280px}
.etab .ds b{color:var(--c);font-weight:700}
.etab .hz{color:var(--ink2)}
.etab-cap{font-family:var(--song);font-size:.72rem;color:var(--ink2);letter-spacing:.14em;margin-top:10px;text-align:center}

/* ---------- 大事年表 ---------- */
.tl{position:relative;margin-top:20px;padding-left:34px}
.tl::before{
  content:"";position:absolute;left:11px;top:6px;bottom:6px;width:2px;
  background:linear-gradient(180deg,var(--c),rgba(216,207,186,.6));
}
.tl-item{position:relative;padding:0 0 20px 6px}
.tl-item::before{
  content:"";position:absolute;left:-29px;top:9px;width:11px;height:11px;border-radius:50%;
  background:var(--paper);border:2.5px solid var(--c);
  box-shadow:0 0 0 3px rgba(90,85,74,.1);
}
.tl-item .yr{
  font-family:var(--song);font-size:.82rem;color:var(--c);letter-spacing:.08em;font-weight:700;
  background:var(--c-soft);border:1px solid var(--line);
  border-radius:20px;padding:2px 12px;display:inline-block;margin-bottom:6px;
}
.tl-item p{font-size:.9rem;line-height:1.95;max-width:76ch}
.tl-item p b{font-family:var(--kai);font-size:.98rem;letter-spacing:.05em;color:var(--ink)}

/* ---------- 人物 ---------- */
.people{display:flex;flex-wrap:wrap;gap:9px;margin-top:16px}
.chip{
  position:relative;display:inline-block;
  background:linear-gradient(165deg,#fffdf6,#f3ecdc);
  border:1px solid var(--line);border-radius:5px;
  padding:6px 12px 7px;transition:transform .22s,box-shadow .22s,border-color .22s;
}
.chip:hover{transform:translateY(-3px);box-shadow:0 8px 16px rgba(90,85,74,.14)}
.chip b{display:block;font-family:var(--kai);font-weight:700;font-size:.95rem;letter-spacing:.08em;color:var(--ink);line-height:1.4}
.chip i{display:block;font-style:normal;font-family:var(--song);font-size:.66rem;color:var(--ink-2,#5a554a);letter-spacing:.06em}
a.chip:hover{border-color:var(--c)}
a.chip:hover b{color:var(--c)}
.chip.sealed::after{
  content:attr(data-seal);position:absolute;top:-8px;right:-8px;
  min-width:19px;height:19px;line-height:19px;text-align:center;padding:0 3px;
  background:linear-gradient(160deg,#df8065,#c14c36);color:#fdf6ea;
  font-family:var(--kai);font-size:11px;border-radius:4px;
  border:1.5px solid rgba(255,251,240,.85);
  transform:rotate(8deg);box-shadow:0 2px 5px rgba(140,47,34,.25);
  transition:transform .22s;
}
a.chip.sealed:hover::after{transform:rotate(2deg) scale(1.1)}
a.chip.sealed b{color:var(--c)}
.people-cap{font-family:var(--song);font-size:.7rem;color:var(--ink2);letter-spacing:.15em;margin-top:12px}
.people-cap em{font-style:normal;color:var(--c)}

/* ---------- 上下朝导航 ---------- */
.pager{display:flex;gap:12px;margin:clamp(40px,7vw,64px) 0 10px}
.pager a{
  flex:1;display:flex;flex-direction:column;gap:3px;
  background:linear-gradient(165deg,#fffdf6,var(--paper2));
  border:1px solid var(--line);border-radius:8px;padding:14px 18px;
  transition:border-color .3s,transform .3s,box-shadow .3s;
}
.pager a:hover{border-color:var(--c);transform:translateY(-3px);box-shadow:0 12px 24px -12px rgba(90,85,74,.28)}
.pager a.next{text-align:right}
.pager .dir{font-family:var(--song);font-size:.68rem;color:var(--gold);letter-spacing:.3em}
.pager .pn{font-family:var(--kai);font-size:1.06rem;letter-spacing:.14em;color:var(--ink);font-weight:700}
.pager a:hover .pn{color:var(--c)}

/* ---------- 读史一言 ---------- */
.verdict{
  margin-top:26px;padding:18px 22px;
  background:linear-gradient(140deg,rgba(255,253,246,.9),rgba(239,232,216,.55));
  border:1px solid var(--line);border-left:4px solid var(--c);border-radius:0 8px 8px 0;
}
.verdict p{font-family:var(--kai);font-size:1rem;letter-spacing:.05em;line-height:2}
.verdict .who{display:block;margin-top:8px;font-family:var(--song);font-size:.72rem;color:var(--ink2);letter-spacing:.2em}

/* ---------- 页脚 / 回顶 ---------- */
footer{
  text-align:center;font-family:var(--song);font-size:12px;color:var(--ink2);
  padding:28px 16px 34px;letter-spacing:.2em;border-top:1px solid var(--line);margin-top:clamp(40px,7vw,70px);
  line-height:2.1;
}
footer a{border-bottom:1px dotted var(--line)}
footer a:hover{color:var(--seal)}
#toTop{
  position:fixed;right:20px;bottom:24px;z-index:99;
  width:44px;height:44px;border-radius:50%;border:1px solid var(--line);
  background:rgba(255,253,246,.94);color:var(--c);font-size:18px;cursor:pointer;
  box-shadow:0 6px 16px rgba(90,85,74,.18);opacity:0;pointer-events:none;transition:.3s;
}
#toTop.show{opacity:1;pointer-events:auto}
#toTop:hover{background:var(--c);color:#f6f1e6;border-color:var(--c)}

/* ---------- 动效 ---------- */
.anim .reveal{opacity:0;transform:translateY(22px);transition:opacity .7s ease,transform .7s ease}
.anim .reveal.visible{opacity:1;transform:none}
@media(max-width:680px){
  .topbar .brand span.bt{display:none}
  .hero .wm{font-size:70vw}
  .fact{min-width:104px;flex:1}
}