/* ============================================================
   人类能源史 · 站点样式
   零外部依赖，相对路径，可放根目录或任意子目录
   ============================================================ */

:root{
  --bg:#070b16;
  --bg2:#0a1020;
  --panel:rgba(255,255,255,.042);
  --panel2:rgba(255,255,255,.075);
  --panel3:rgba(255,255,255,.10);
  --line:rgba(255,255,255,.115);
  --line2:rgba(255,255,255,.22);
  --txt:#e9eff9;
  --sub:#9aabc6;
  --dim:#68799a;
  --amber:#f0b429;
  --rose:#fb7185;
  --blue:#38bdf8;
  --green:#34d399;
  --purple:#a78bfa;
  --slate:#94a3b8;

  --c-origin:var(--amber);
  --c-history:var(--rose);
  --c-now:var(--blue);
  --c-future:var(--green);
  --c-spec:var(--purple);
}

*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{
  background:var(--bg);color:var(--txt);
  font-family:"Microsoft YaHei","PingFang SC","Noto Sans CJK SC","Hiragino Sans GB",sans-serif;
  line-height:1.78;font-size:15px;-webkit-font-smoothing:antialiased;
  overflow-x:hidden;
  background-image:
    radial-gradient(1px 1px at 15% 8%, rgba(255,255,255,.35) 50%, transparent 51%),
    radial-gradient(1px 1px at 78% 4%, rgba(255,255,255,.28) 50%, transparent 51%),
    radial-gradient(1px 1px at 42% 14%, rgba(255,255,255,.2) 50%, transparent 51%);
  background-repeat:no-repeat;
  background-size:100% 900px;
}
a{color:var(--blue);text-decoration:none;transition:color .15s}
a:hover{color:#7dd3fc}
.wrap{max-width:1120px;margin:0 auto;padding:0 22px}
.wrap-narrow{max-width:820px;margin:0 auto;padding:0 22px}

/* ---------- 顶栏 ---------- */
.topbar{
  position:sticky;top:0;z-index:80;
  background:rgba(7,11,22,.88);
  -webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);
  border-bottom:1px solid var(--line);
}
.topbar-in{
  max-width:1120px;margin:0 auto;padding:0 22px;
  display:flex;align-items:center;gap:4px;height:56px;
  overflow-x:auto;scrollbar-width:none;
}
.topbar-in::-webkit-scrollbar{display:none}
.brand{
  display:flex;align-items:center;gap:9px;
  font-weight:900;font-size:14px;color:var(--txt);
  white-space:nowrap;margin-right:16px;letter-spacing:.02em;
}
.brand svg{width:20px;height:20px;flex:0 0 auto}
.brand em{font-style:normal;color:var(--amber)}
.tnav{
  font-size:12.8px;color:var(--sub);padding:5px 10px;border-radius:6px;
  white-space:nowrap;transition:.15s;
}
.tnav:hover{color:var(--txt);background:var(--panel2)}
.tnav.on{color:var(--amber);background:rgba(240,180,41,.12);font-weight:700}

/* ---------- Hero ---------- */
.hero{position:relative;padding:76px 0 56px;overflow:hidden}
.hero::before{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:
    radial-gradient(900px 480px at 82% -12%, rgba(52,211,153,.15), transparent 62%),
    radial-gradient(760px 420px at 2% 106%, rgba(240,180,41,.12), transparent 62%);
}
.hero .wrap{position:relative;z-index:1}
.kicker{
  font-size:11.5px;letter-spacing:.3em;color:var(--amber);
  font-weight:800;text-transform:uppercase;margin-bottom:14px;
}
.hero h1{
  font-size:clamp(30px,5vw,50px);line-height:1.2;font-weight:900;
  letter-spacing:-.005em;margin:0 0 16px;
}
.hero h1 .g{
  background:linear-gradient(96deg,var(--amber) 0%,#ffd977 38%,var(--green) 92%);
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;
}
.hero .lead{color:var(--sub);font-size:16.5px;max-width:760px;line-height:1.8}
.hero-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:26px}
.btn{
  display:inline-flex;align-items:center;gap:7px;
  padding:10px 20px;border-radius:9px;font-size:14px;font-weight:700;
  border:1px solid var(--line2);color:var(--txt);background:var(--panel);
  transition:.16s;cursor:pointer;font-family:inherit;
}
.btn:hover{background:var(--panel2);border-color:rgba(255,255,255,.34);color:var(--txt)}
.btn.primary{
  background:linear-gradient(96deg,rgba(240,180,41,.9),rgba(52,211,153,.85));
  border-color:transparent;color:#0a1020;
}
.btn.primary:hover{filter:brightness(1.08);color:#0a1020}

.anchors{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));
  gap:11px;margin-top:34px;
}
.anchor{
  background:var(--panel);border:1px solid var(--line);
  border-radius:10px;padding:14px 16px;
}
.anchor .num{
  font-size:25px;font-weight:900;color:var(--amber);
  font-variant-numeric:tabular-nums;line-height:1.15;letter-spacing:-.01em;
}
.anchor .lbl{font-size:11px;color:var(--dim);letter-spacing:.07em;margin-top:2px}
.anchor .desc{font-size:12.6px;color:var(--sub);margin-top:7px;line-height:1.62}

/* ---------- 通用 section ---------- */
.section{padding:58px 0;border-top:1px solid var(--line)}
.section-head{margin-bottom:26px}
h2.sec{
  font-size:clamp(21px,2.9vw,28px);font-weight:900;
  line-height:1.3;margin-bottom:8px;letter-spacing:-.01em;
}
.sec-sub{color:var(--sub);font-size:14.4px;max-width:800px;line-height:1.78}

/* ---------- 泳道脉络图 ---------- */
.lanes{
  position:relative;background:var(--panel);
  border:1px solid var(--line);border-radius:14px;
  padding:20px 18px 14px;overflow-x:auto;
}
.lanes-inner{min-width:940px;position:relative}
.lane-axis{
  display:grid;grid-template-columns:120px 1fr;
  gap:0;margin-bottom:6px;
}
.axis-row{
  position:relative;height:26px;
  border-bottom:1px dashed rgba(255,255,255,.09);
}
.axis-tick{
  position:absolute;top:0;font-size:10.5px;color:var(--dim);
  transform:translateX(-50%);white-space:nowrap;
  font-variant-numeric:tabular-nums;
}
.axis-tick::after{
  content:"";position:absolute;left:50%;top:16px;
  width:1px;height:520px;background:rgba(255,255,255,.055);
}
.lane{display:grid;grid-template-columns:120px 1fr;gap:0;align-items:stretch}
.lane-label{
  display:flex;flex-direction:column;justify-content:center;gap:2px;
  padding:10px 10px 10px 0;border-right:1px solid var(--line);
  position:sticky;left:0;background:var(--bg2);z-index:2;
}
.lane-label .ln{font-size:13.5px;font-weight:800;color:var(--lc);line-height:1.3}
.lane-label .lc{font-size:10.5px;color:var(--dim);line-height:1.4}
.lane-track{
  position:relative;min-height:58px;
  border-bottom:1px solid rgba(255,255,255,.055);
}
.node{
  position:absolute;transform:translate(-50%,-50%);
  top:50%;cursor:pointer;text-decoration:none;color:inherit;
  display:flex;flex-direction:column;align-items:center;gap:0;
  z-index:3;
}
.node .dot{
  width:11px;height:11px;border-radius:50%;
  border:2px solid var(--bg);
  box-shadow:0 0 0 1px var(--nc);
  background:var(--nc);
  transition:transform .18s,box-shadow .18s;
}
.node:hover .dot{
  transform:scale(1.55);
  box-shadow:0 0 0 1px var(--nc),0 0 14px var(--nc);
}
.node .nm{
  position:absolute;top:15px;left:50%;transform:translateX(-50%);
  font-size:10.8px;color:var(--sub);white-space:nowrap;
  max-width:104px;overflow:hidden;text-overflow:ellipsis;
  transition:color .15s;
  background:linear-gradient(180deg,rgba(7,11,22,.0),rgba(7,11,22,.85) 40%);
  padding:1px 3px;border-radius:3px;
}
.node:hover .nm{color:var(--txt);z-index:9}
.node.up .nm{top:auto;bottom:15px}
/* 密集簇放不下的标签：默认隐藏，悬停显示（防叠压） */
.node.nolabel .nm{visibility:hidden}
.node.nolabel:hover .nm{visibility:visible;color:var(--txt);z-index:9}

.lane-legend{
  display:flex;flex-wrap:wrap;gap:14px 22px;
  margin-top:14px;padding-top:13px;border-top:1px solid var(--line);
  font-size:11.8px;color:var(--dim);
}
.lane-legend span{display:inline-flex;align-items:center;gap:6px}
.legend-dot{width:9px;height:9px;border-radius:50%;display:inline-block}

/* ---------- 分区入口 ---------- */
.track-grid{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));
  gap:12px;margin-top:6px;
}
.track-card{
  display:block;background:var(--panel);border:1px solid var(--line);
  border-radius:12px;padding:18px 18px 16px;
  position:relative;overflow:hidden;transition:.18s;color:inherit;
}
.track-card::before{
  content:"";position:absolute;left:0;top:0;bottom:0;width:3px;
  background:var(--tc);
}
.track-card:hover{
  background:var(--panel2);border-color:var(--line2);
  transform:translateY(-2px);
}
.track-card .tc-n{font-size:11px;color:var(--dim);letter-spacing:.12em;font-weight:800}
.track-card h3{font-size:17px;font-weight:900;color:var(--tc);margin:4px 0 6px}
.track-card p{font-size:12.8px;color:var(--sub);line-height:1.66}
.track-card .tc-c{
  margin-top:11px;font-size:11.5px;color:var(--dim);
  border-top:1px dashed var(--line);padding-top:8px;
  display:flex;justify-content:space-between;
}

/* ---------- 节点卡片（列表） ---------- */
.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:12px}
.card{
  display:block;background:var(--panel);border:1px solid var(--line);
  border-radius:12px;padding:17px 18px;
  transition:.18s;color:inherit;position:relative;
}
.card:hover{background:var(--panel2);border-color:var(--line2);transform:translateY(-2px)}
.card-top{display:flex;align-items:center;gap:8px;margin-bottom:7px}
.card-era{
  font-size:11px;color:var(--dim);font-variant-numeric:tabular-nums;
  white-space:nowrap;
}
.card h3{font-size:16.5px;font-weight:900;line-height:1.35;margin-bottom:6px}
.card .tagline{font-size:12.5px;color:var(--tc);margin-bottom:8px;line-height:1.6}
.card p{font-size:13px;color:var(--sub);line-height:1.72}

/* ---------- 严谨度徽章 ---------- */
.badge{
  display:inline-block;font-size:10.5px;font-weight:800;
  padding:1px 8px;border-radius:20px;border:1px solid;
  white-space:nowrap;line-height:1.75;letter-spacing:.02em;
}
.badge.solid{color:var(--slate);border-color:rgba(148,163,184,.55);background:rgba(148,163,184,.08)}
.badge.fact{color:var(--green);border-color:rgba(52,211,153,.55);background:rgba(52,211,153,.08)}
.badge.active{color:var(--blue);border-color:rgba(56,189,248,.55);background:rgba(56,189,248,.08)}
.badge.proj{color:var(--amber);border-color:rgba(240,180,41,.55);background:rgba(240,180,41,.08)}
.badge.spec{color:var(--purple);border-color:rgba(167,139,250,.55);background:rgba(167,139,250,.08)}

/* ---------- 节点详情 ---------- */
.crumb{
  font-size:12.5px;color:var(--dim);padding:18px 0 0;
  display:flex;align-items:center;gap:8px;flex-wrap:wrap;
}
.crumb a{color:var(--sub)}
.crumb .sep{color:var(--dim);opacity:.5}

.node-hero{padding:26px 0 30px;border-bottom:1px solid var(--line)}
.node-hero .nh-meta{
  display:flex;flex-wrap:wrap;align-items:center;gap:9px;margin-bottom:12px;
}
.node-hero h1{
  font-size:clamp(26px,4vw,38px);font-weight:900;line-height:1.24;
  margin-bottom:10px;letter-spacing:-.01em;
}
.node-hero .nh-tag{
  font-size:16px;color:var(--nc);font-weight:700;
  margin-bottom:14px;line-height:1.6;
}
.node-hero .nh-sum{font-size:15.5px;color:var(--sub);max-width:800px;line-height:1.82}
.factbar{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));
  gap:10px;margin-top:24px;
}
.fact{
  background:var(--panel);border:1px solid var(--line);
  border-radius:9px;padding:11px 14px;
}
.fact .fk{font-size:10.8px;color:var(--dim);letter-spacing:.05em;line-height:1.5}
.fact .fv{
  font-size:14.5px;font-weight:800;color:var(--txt);margin-top:3px;
  font-variant-numeric:tabular-nums;line-height:1.4;
}

.prose{padding:34px 0 10px}
.prose .blk{margin-bottom:26px}
.prose .blk h2{
  font-size:17.5px;font-weight:900;margin-bottom:9px;
  padding-left:12px;border-left:3px solid var(--nc);
  line-height:1.4;
}
.prose .blk p{
  font-size:14.8px;color:#c3cfe2;line-height:1.92;
  max-width:820px;
}
.prose .blk p b{color:var(--txt);font-weight:800}
.prose .blk p em{font-style:normal;color:var(--amber);font-weight:700}

/* ---------- 关联 ---------- */
.related{padding:34px 0 44px;border-top:1px solid var(--line);margin-top:22px}
.rel-title{
  font-size:12px;letter-spacing:.16em;color:var(--dim);
  font-weight:800;margin-bottom:14px;text-transform:uppercase;
}
.rel-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:10px}
.rel{
  display:flex;align-items:flex-start;gap:11px;
  background:var(--panel);border:1px solid var(--line);
  border-radius:10px;padding:13px 15px;transition:.16s;color:inherit;
}
.rel:hover{background:var(--panel2);border-color:var(--line2)}
.rel .rd{
  width:8px;height:8px;border-radius:50%;margin-top:7px;flex:0 0 auto;
  background:var(--rc);
}
.rel .rt{font-size:13.8px;font-weight:800;line-height:1.4;margin-bottom:2px}
.rel .rs{font-size:11.5px;color:var(--dim);line-height:1.5}

.prevnext{
  display:flex;justify-content:space-between;gap:12px;
  padding:24px 0 50px;border-top:1px solid var(--line);margin-top:8px;
}
.pn{
  flex:1;background:var(--panel);border:1px solid var(--line);
  border-radius:10px;padding:12px 16px;color:inherit;transition:.16s;
}
.pn:hover{background:var(--panel2)}
.pn.next{text-align:right}
.pn .pk{font-size:10.5px;color:var(--dim);letter-spacing:.1em;margin-bottom:3px}
.pn .pv{font-size:14px;font-weight:800}

/* ---------- 提示块 ---------- */
.note{
  background:rgba(56,189,248,.055);border:1px solid rgba(56,189,248,.26);
  border-radius:10px;padding:14px 17px;font-size:13.6px;color:var(--sub);
  margin:20px 0;line-height:1.78;
}
.note b{color:var(--blue)}
.note.warn{background:rgba(251,113,133,.055);border-color:rgba(251,113,133,.26)}
.note.warn b{color:var(--rose)}
.note.gold{background:rgba(240,180,41,.055);border-color:rgba(240,180,41,.26)}
.note.gold b{color:var(--amber)}

/* ---------- 表格 ---------- */
.tbl-wrap{
  overflow-x:auto;border:1px solid var(--line);border-radius:12px;
  background:var(--panel);margin:20px 0;
}
table.tbl{width:100%;border-collapse:collapse;table-layout:fixed;min-width:700px}
.tbl th{
  font-size:12.3px;color:var(--sub);text-align:left;
  padding:11px 13px;border-bottom:1px solid var(--line);
  background:rgba(255,255,255,.035);font-weight:700;letter-spacing:.03em;
}
.tbl td{
  font-size:13.2px;padding:11px 13px;
  border-bottom:1px solid rgba(255,255,255,.06);
  vertical-align:top;line-height:1.68;
}
.tbl tr:last-child td{border-bottom:none}
.tbl .w{font-weight:800;color:var(--txt)}
.tbl .num{font-variant-numeric:tabular-nums;white-space:nowrap}

/* ---------- 筛选条 ---------- */
.filters{
  display:flex;flex-wrap:wrap;gap:7px;margin-bottom:20px;
  align-items:center;
}
.filters .fl{font-size:11.5px;color:var(--dim);margin-right:4px}
.chip{
  background:var(--panel);border:1px solid var(--line);
  border-radius:20px;padding:5px 13px;font-size:12.3px;
  color:var(--sub);cursor:pointer;font-family:inherit;transition:.15s;
}
.chip:hover{background:var(--panel2);color:var(--txt)}
.chip.on{background:rgba(240,180,41,.13);border-color:var(--amber);color:var(--amber);font-weight:700}

/* ---------- 页脚 ---------- */
footer{
  padding:44px 0 60px;border-top:1px solid var(--line);
  color:var(--dim);font-size:12.4px;line-height:1.75;
}
.foot-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:26px}
@media(max-width:760px){.foot-grid{grid-template-columns:1fr;gap:20px}}
.foot-grid h4{
  font-size:11.5px;letter-spacing:.14em;color:var(--sub);
  font-weight:800;margin-bottom:10px;text-transform:uppercase;
}
.foot-grid a{display:block;color:var(--dim);padding:2px 0;font-size:12.4px}
.foot-grid a:hover{color:var(--cyan)}
.copyright{
  margin-top:28px;padding-top:18px;border-top:1px solid rgba(255,255,255,.06);
  font-size:11.8px;color:#4d5c78;line-height:1.75;
}

/* ---------- 空状态 ---------- */
.empty{
  padding:60px 20px;text-align:center;color:var(--dim);
  border:1px dashed var(--line);border-radius:12px;font-size:14px;
}

/* ---------- 响应式 ---------- */
@media(max-width:760px){
  .hero{padding:52px 0 40px}
  .section{padding:44px 0}
  .lanes{padding:16px 12px 10px}
  .lane-label{width:88px}
  .lane{grid-template-columns:88px 1fr}
  .lane-axis{grid-template-columns:88px 1fr}
  .cards{grid-template-columns:1fr}
  .factbar{grid-template-columns:1fr 1fr}
  .prose .blk p{font-size:14.3px;line-height:1.88}
  .prevnext{flex-direction:column}
}

/* 打印 */
@media print{
  body{background:#fff;color:#111}
  .topbar,.hero-actions,.prevnext,footer{display:none}
  .panel,.card,.fact{background:none;border-color:#ddd}
}

/* ============================================================
   图文版新增：卡片缩略图 / 图集 / 图鉴 / lightbox
   ============================================================ */
.card-fig{
  margin:10px 0 12px;
  border-radius:10px;overflow:hidden;
  border:1px solid rgba(255,255,255,.09);
  background:#0d1424;
}
.card-fig img{display:block;width:100%;height:auto}

/* 节点页图集 */
.figgrid{display:grid;grid-template-columns:1fr;gap:26px;margin:30px 0 6px}
.fig{
  cursor:zoom-in;border-radius:12px;overflow:hidden;
  border:1px solid rgba(255,255,255,.10);
  background:#0d1424;
  transition:border-color .18s;
}
.fig:hover{border-color:rgba(255,255,255,.28)}
.fig img{display:block;width:100%;height:auto}
.fig figcaption{
  padding:12px 16px 14px;font-size:12.8px;line-height:1.7;color:var(--sub);
  border-top:1px solid rgba(255,255,255,.08);
  background:rgba(255,255,255,.03);
}

/* 首页图鉴精选条 */
.atlas-strip{
  display:grid;grid-template-columns:repeat(3,1fr);gap:18px;
}
.atlas-card{
  border-radius:12px;overflow:hidden;
  border:1px solid rgba(255,255,255,.10);
  background:rgba(255,255,255,.035);
  transition:transform .16s,border-color .16s;
}
.atlas-card:hover{transform:translateY(-3px);border-color:var(--tc,rgba(255,255,255,.3))}
.atlas-card img{display:block;width:100%;height:auto;border-bottom:1px solid rgba(255,255,255,.08)}
.atlas-card .ac-t{padding:12px 14px 2px;font-weight:800;font-size:14.5px;color:var(--txt)}
.atlas-card .ac-s{padding:4px 14px 14px;font-size:11.5px;color:var(--dim)}

/* 图鉴页 */
.atlas-group{margin:34px 0 8px}
.ag-head{
  font-weight:900;font-size:15px;letter-spacing:.14em;
  padding-bottom:8px;border-bottom:2px solid currentColor;
  margin-bottom:18px;
}
.atlas-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px}
.atlas-fig{cursor:zoom-in;margin:0}
.atlas-fig figcaption a{color:var(--blue);font-weight:700}
.atlas-fig figcaption a:hover{color:#7dd3fc}

/* lightbox */
.lightbox{
  position:fixed;inset:0;z-index:300;
  background:rgba(4,7,14,.92);
  display:flex;align-items:center;justify-content:center;
  padding:28px;cursor:zoom-out;
  animation:lbIn .18s ease;
}
@keyframes lbIn{from{opacity:0}to{opacity:1}}
.lightbox img{
  max-width:100%;max-height:100%;
  border-radius:10px;
  box-shadow:0 20px 80px rgba(0,0,0,.6);
}

@media (max-width:900px){
  .atlas-strip{grid-template-columns:1fr}
  .atlas-grid{grid-template-columns:1fr}
}

/* ============================================================
   导航定位系统：位置条 / 返回条 / 放射关系图 / 回位高亮
   ============================================================ */

/* 位置条：五段泳道 + 第 N/M + 微缩刻度 */
.rail{
  display:flex;align-items:center;gap:8px;flex-wrap:wrap;
  max-width:1120px;margin:0 auto;padding:10px 24px 0;
}
.rail-k{font-size:11px;color:var(--dim);letter-spacing:.16em;margin-right:2px}
.rail-seg{
  position:relative;display:inline-flex;align-items:center;gap:7px;
  padding:5px 12px;border-radius:999px;font-size:12.2px;font-weight:700;
  color:#7f90aa;text-decoration:none;
  border:1px solid rgba(255,255,255,.08);background:rgba(255,255,255,.02);
  transition:.15s;
}
.rail-seg:hover{color:var(--txt);border-color:rgba(255,255,255,.26)}
.rail-dot{width:6px;height:6px;border-radius:50%;background:var(--rc,#64748b);opacity:.55;flex:none}
.rail-c{font-size:10.5px;color:var(--dim);font-weight:400}
.rail-seg.on{
  color:var(--rc);border-color:var(--rc);
  background:color-mix(in srgb, var(--rc) 14%, transparent);
}
.rail-seg.on .rail-dot{opacity:1;box-shadow:0 0 0 3px color-mix(in srgb, var(--rc) 22%, transparent)}
.rail-n{font-size:11px;color:var(--sub);font-weight:600;letter-spacing:.02em}
.rail-mini{
  position:relative;display:inline-block;width:44px;height:3px;border-radius:2px;
  background:rgba(255,255,255,.14);margin-left:2px;vertical-align:middle;
}
.rail-mini i{
  position:absolute;top:-3px;width:3px;height:9px;border-radius:2px;
  background:var(--rc);transform:translateX(-50%);
}

/* 返回条 */
.backbar{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin:16px 0 4px}
.btn-back{
  display:inline-flex;align-items:center;gap:6px;
  padding:8px 16px;border-radius:9px;font-size:13px;font-weight:700;text-decoration:none;
  color:#0a0f1a;background:var(--nc,#f0b429);border:1px solid transparent;
  transition:.15s;
}
.btn-back:hover{filter:brightness(1.1)}
.btn-ghost{
  padding:8px 15px;border-radius:9px;font-size:12.8px;text-decoration:none;
  color:var(--sub);border:1px solid rgba(255,255,255,.16);background:rgba(255,255,255,.03);
  transition:.15s;
}
.btn-ghost:hover{color:var(--txt);border-color:rgba(255,255,255,.34)}
.kbd-hint{margin-left:auto;font-size:11.5px;color:var(--dim)}
.kbd-hint b{
  display:inline-block;min-width:18px;padding:1px 5px;margin:0 2px;
  border-radius:4px;border:1px solid rgba(255,255,255,.18);
  background:rgba(255,255,255,.06);color:var(--sub);font-weight:600;text-align:center;
}
.crumb-n{
  font-size:11.5px;color:var(--dim);padding:1px 8px;border-radius:999px;
  background:rgba(255,255,255,.06);margin-left:2px;
}
.crumb .cur{color:var(--txt);font-weight:700}

/* 放射关系图 */
.ego-wrap{
  margin:34px 0 8px;padding:18px 18px 14px;
  border:1px solid rgba(255,255,255,.09);border-radius:16px;
  background:linear-gradient(180deg,rgba(255,255,255,.028),rgba(255,255,255,.008));
}
.ego-head h3{font-size:15px;font-weight:800;color:var(--txt);margin:0 0 5px}
.ego-head p{font-size:12.4px;color:var(--dim);margin:0 0 6px;line-height:1.6}
.ego{display:block;width:100%;height:auto;max-height:560px}
.ego text{font-family:inherit}
.egn:hover text{fill:#fff}
.ego-legend{display:flex;gap:16px;flex-wrap:wrap;align-items:center;
  padding-top:10px;border-top:1px solid rgba(255,255,255,.07);font-size:11.8px;color:var(--sub)}
.ego-legend i{display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:5px;vertical-align:middle}
.ego-tip{margin-left:auto;color:var(--dim)}

/* 卡片回位高亮 */
.card-flash{animation:cardFlash 1.6s ease}
@keyframes cardFlash{
  0%{box-shadow:0 0 0 0 rgba(240,180,41,.55);border-color:rgba(240,180,41,.9)}
  70%{box-shadow:0 0 0 12px rgba(240,180,41,0);border-color:rgba(240,180,41,.35)}
  100%{box-shadow:none}
}

@media (max-width:720px){
  .kbd-hint{display:none}
  .rail{overflow-x:auto;flex-wrap:nowrap;padding-bottom:4px}
  .rail-seg{flex:none}
  .ego{max-height:none}
}