:root{
  --ink:#141a38;
  --indigo:#29336d;
  --indigo-soft:#6b74a8;
  --vermilion:#bf3b24;
  --gold:#b8903a;
  --paper:#f8f5ed;
  --card:#fffefa;
  --rule:#ddd6c6;
  --rule-soft:#ebe5d8;
  --font:"Songti SC","STSong","Noto Serif CJK SC",serif;
  --mono:"SFMono-Regular",Menlo,Consolas,monospace;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  background:var(--paper);
  color:var(--ink);
  font-family:var(--font);
  font-size:16px;
  line-height:1.85;
  -webkit-text-size-adjust:100%;
}
.wrap{max-width:980px;margin:0 auto;padding:0 20px}
a{color:var(--indigo)}

/* ── 顶栏 ───────────────────────────── */
.topbar{border-bottom:2px solid var(--ink);background:var(--card)}
.topbar .wrap{display:flex;align-items:center;gap:12px;padding-top:14px;padding-bottom:14px;flex-wrap:wrap}
.mark{width:34px;height:34px;flex:0 0 auto}
.topname{font-size:17px;letter-spacing:.06em;font-weight:700}
.topnav{margin-left:auto;display:flex;gap:16px;flex-wrap:wrap}
.topnav a{text-decoration:none;font-size:14px;color:var(--indigo-soft);border-bottom:1px solid transparent}
.topnav a:hover,.topnav a:focus{color:var(--vermilion);border-bottom-color:var(--vermilion)}

/* ── 首屏 ───────────────────────────── */
.hero{padding:44px 0 30px;border-bottom:1px solid var(--rule)}
h1{margin:0;font-weight:700;letter-spacing:.02em}
.h1-brand{display:block;font-size:clamp(26px,6.4vw,46px);line-height:1.25;color:var(--ink)}
.h1-sub{display:block;font-size:clamp(14px,3vw,18px);line-height:1.6;color:var(--indigo);font-weight:400;margin-top:8px}
.lead{margin:20px 0 0;font-size:16px;max-width:62ch}
.statement{
  margin-top:22px;border-left:4px solid var(--vermilion);
  background:var(--card);padding:14px 16px;font-size:14.5px;line-height:1.8;
}
.statement b{color:var(--vermilion)}

/* ── 区块 ───────────────────────────── */
section{padding:34px 0;border-bottom:1px solid var(--rule)}
h2{
  margin:0 0 6px;font-size:clamp(19px,4.2vw,25px);font-weight:700;
  display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;
}
h2 .num{font-family:var(--mono);font-size:13px;color:var(--gold);letter-spacing:.14em}
h3{margin:22px 0 8px;font-size:17px;font-weight:700;color:var(--indigo)}
.note{font-size:13.5px;color:#5d6072;line-height:1.75}

/* ── 换算器 ─────────────────────────── */
.conv{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:18px}
@media (max-width:760px){.conv{grid-template-columns:1fr}}
.panel{background:var(--card);border:1px solid var(--rule);padding:16px}
.panel h3{margin-top:0}
.field{display:block;margin:12px 0}
.field span{display:block;font-size:13px;color:var(--indigo-soft);margin-bottom:5px;letter-spacing:.04em}
select,input[type=number],input[type=text]{
  width:100%;padding:9px 10px;font-size:15px;font-family:var(--font);
  border:1px solid var(--indigo-soft);background:#fff;color:var(--ink);border-radius:0;
}
select:focus,input:focus{outline:2px solid var(--vermilion);outline-offset:1px}
.result{
  margin-top:14px;border-top:2px solid var(--ink);padding-top:12px;
}
.result .big{font-family:var(--mono);font-size:clamp(22px,5.2vw,30px);color:var(--vermilion);line-height:1.3;display:block}
.result .exp{font-size:13.5px;color:#4a4d60;margin-top:6px;line-height:1.7}
.bad{color:var(--vermilion);font-weight:700}
ul.rev{list-style:none;margin:10px 0 0;padding:0}
ul.rev li{border-bottom:1px dotted var(--rule);padding:6px 0;font-size:14.5px}
ul.rev li:last-child{border-bottom:0}
ul.rev .ry{font-family:var(--mono);color:var(--gold);font-size:12.5px;margin-left:6px}

/* ── 年表 ───────────────────────────── */
.filters{display:flex;gap:12px;flex-wrap:wrap;margin:16px 0 4px;align-items:flex-end}
.filters .field{margin:0;min-width:150px;flex:1 1 150px}
.tally{font-family:var(--mono);font-size:13px;color:var(--indigo);padding-bottom:9px}
.rail{position:relative;margin-top:18px;padding-left:92px}
.rail::before{content:"";position:absolute;left:78px;top:0;bottom:0;width:2px;background:var(--rule)}
@media (max-width:600px){
  .rail{padding-left:0}
  .rail::before{display:none}
}
.node{position:relative;margin-bottom:16px;background:var(--card);border:1px solid var(--rule);padding:12px 14px}
.node .yr{
  position:absolute;left:-92px;top:12px;width:70px;text-align:right;
  font-family:var(--mono);font-size:13px;color:var(--indigo);line-height:1.5;
}
.node .yr::after{
  content:"";position:absolute;right:-18px;top:7px;width:9px;height:9px;
  background:var(--paper);border:2px solid var(--vermilion);transform:rotate(45deg);
}
@media (max-width:600px){
  .node .yr{position:static;width:auto;text-align:left;margin-bottom:4px;color:var(--vermilion)}
  .node .yr::after{display:none}
}
.node .nm{font-size:17px;font-weight:700}
.node .nm .kana{font-family:var(--mono);font-size:12px;color:var(--indigo-soft);margin-left:8px;letter-spacing:.06em}
.node .role{
  display:inline-block;font-size:12px;padding:1px 8px;margin-left:8px;
  border:1px solid var(--indigo);color:var(--indigo);vertical-align:2px;
}
.node .role.ren{border-color:var(--gold);color:var(--gold)}
.node p{margin:6px 0 0;font-size:14.5px;line-height:1.75}
.empty{padding:18px;text-align:center;color:var(--vermilion);background:var(--card);border:1px dashed var(--rule)}

/* ── 大事 ───────────────────────────── */
.events{margin:16px 0 0;padding:0;list-style:none}
.events li{display:flex;gap:14px;padding:10px 0;border-bottom:1px dotted var(--rule);font-size:15px;align-items:baseline}
.events li:last-child{border-bottom:0}
.events .e-y{font-family:var(--mono);color:var(--vermilion);flex:0 0 76px;font-size:14px}
@media (max-width:520px){
  .events li{flex-direction:column;gap:2px}
  .events .e-y{flex:none}
}

/* ── 术语 ───────────────────────────── */
.terms{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:14px;margin-top:16px}
.term{border-top:3px solid var(--indigo);background:var(--card);padding:12px 14px}
.term dt{font-weight:700;font-size:16px;margin-bottom:4px}
.term dd{margin:0;font-size:14px;line-height:1.75;color:#3d4055}

/* ── 页脚 ───────────────────────────── */
footer{padding:26px 0 44px;font-size:13.5px;color:#5d6072}
footer p{margin:0 0 8px}
.srcs{margin:0;padding-left:20px}
.srcs li{margin-bottom:4px}

/* ── 404 ────────────────────────────── */
.e404{padding:60px 0 40px}
.e404 .code{font-family:var(--mono);font-size:clamp(50px,16vw,110px);color:var(--vermilion);line-height:1;margin:0}
.e404 .e404-line{display:block;font-size:clamp(22px,5.4vw,34px);line-height:1.3}
.e404 .e404-kw{display:block;font-size:clamp(22px,5.4vw,34px);line-height:1.3;color:var(--indigo)}
.e404 ul{margin:18px 0 0;padding-left:20px}
.e404 li{margin-bottom:6px}

/* 防溢出兜底 */
.result .big,.node p,.events li span{overflow-wrap:anywhere}