:root{
  --serif:Georgia,"Palatino Linotype","Songti SC","Noto Serif CJK SC",SimSun,serif;
  --kai:"KaiTi","STKaiti","Kaiti SC","Songti SC",SimSun,serif;
  --sans:"Segoe UI","Helvetica Neue",Arial,"Microsoft YaHei",sans-serif;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{font-family:var(--serif);background:#12100C;color:#E8DFD0;line-height:1.78}
#app{min-height:100vh;transition:background-color .6s ease,color .6s ease;background-color:var(--bg);color:var(--ink)}
@media(prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}

/* ── 七朝代主题 ── */
:is(#app,#dlg,#intro,#artdlg)[data-ep=yuangu]{--bg:#141A15;--panel:#1C2620;--ink:#DCE3CC;--mut:#93A28C;--acc:#6FA287;--acc2:#C9A227;--line:#33413A;--dfont:var(--kai)}
:is(#app,#dlg,#intro,#artdlg)[data-ep=qinhan]{--bg:#1F1411;--panel:#2A1B15;--ink:#E9D9BF;--mut:#AB9074;--acc:#C4432F;--acc2:#93763F;--line:#483226;--dfont:var(--kai)}
:is(#app,#dlg,#intro,#artdlg)[data-ep=weijin]{--bg:#E7E3D4;--panel:#F1EEE2;--ink:#30342B;--mut:#6E7465;--acc:#59784F;--acc2:#7A6A8C;--line:#C4C0AB;--dfont:var(--kai)}
:is(#app,#dlg,#intro,#artdlg)[data-ep=suitang]{--bg:#31211A;--panel:#3D2B20;--ink:#F2E2C4;--mut:#BC9D79;--acc:#D98E2B;--acc2:#3E6B8E;--line:#584130;--dfont:var(--kai)}
:is(#app,#dlg,#intro,#artdlg)[data-ep=songyuan]{--bg:#DFE5DF;--panel:#ECF1EA;--ink:#2B332F;--mut:#65756D;--acc:#42807E;--acc2:#8C5A50;--line:#BAC6BC;--dfont:var(--kai)}
:is(#app,#dlg,#intro,#artdlg)[data-ep=mingqing]{--bg:#F2F1E9;--panel:#FBFAF4;--ink:#212939;--mut:#5E6877;--acc:#2C4C8A;--acc2:#A63C2E;--line:#D2D2C5;--dfont:var(--kai)}
:is(#app,#dlg,#intro,#artdlg)[data-ep=xiandai]{--bg:#EFEBE0;--panel:#F9F6ED;--ink:#22201B;--mut:#5E5A51;--acc:#C7202F;--acc2:#29426B;--line:#CCC6B6;--dfont:var(--sans)}
:is(#app,#dlg,#intro,#artdlg)[data-ep=atlas]{--bg:#E9E0C9;--panel:#F2EBD8;--ink:#38301F;--mut:#787050;--acc:#7A2E1D;--acc2:#3E5C4B;--line:#C7BB93;--dfont:var(--kai)}
#app[data-ep=xiandai]{font-family:var(--sans)}

/* ── 骨架 ── */
header.mast{padding:24px 4vw 13px;border-bottom:1px solid var(--line);display:flex;flex-wrap:wrap;align-items:center;gap:8px 22px}
.mast .tblock h1{font-family:var(--dfont);font-size:clamp(21px,3vw,32px);margin:0;letter-spacing:.14em;font-weight:600}
.mast .lat{font-style:italic;color:var(--mut);font-size:13px;letter-spacing:.12em}
.mast .stats{font:11px var(--sans);letter-spacing:.14em;color:var(--mut);margin-top:3px}
nav.views{margin-left:auto;display:flex;gap:6px;flex-wrap:wrap}
nav.views button{font:600 13px/1 var(--sans);letter-spacing:.1em;padding:9px 13px;background:none;border:1px solid var(--line);color:var(--mut);cursor:pointer}
nav.views button.on{background:var(--acc);border-color:var(--acc);color:var(--bg)}
nav.views button:focus-visible,.epnav button:focus-visible,.chip:focus-visible,.search input:focus-visible{outline:2px solid var(--acc);outline-offset:2px}

.search{position:relative}
.search input{font:13px var(--sans);background:var(--panel);border:1px solid var(--line);color:var(--ink);padding:9px 13px;width:200px}
.search input::placeholder{color:var(--mut)}
.sres{position:absolute;top:112%;right:0;width:340px;max-height:420px;overflow:auto;background:var(--panel);border:1px solid var(--line);z-index:60;box-shadow:0 10px 34px rgba(10,8,4,.3)}
.sres>div{display:flex;gap:11px;align-items:center;padding:8px 12px;cursor:pointer;border-bottom:1px solid var(--line)}
.sres>div:hover{background:var(--bg)}
.sres .sm{flex:none}
.sres .sn{font-size:14px}.sres small{display:block;color:var(--mut);font-size:11px;font-family:var(--sans)}

.epnav{display:flex;flex-wrap:wrap;gap:0;border-bottom:1px solid var(--line)}
.epnav button{flex:1 1 110px;font-family:var(--kai);background:none;border:none;border-right:1px solid var(--line);color:var(--mut);padding:12px 6px 10px;cursor:pointer;text-align:center}
.epnav button:last-child{border-right:none}
.epnav b{display:block;font-size:16px;font-weight:600;letter-spacing:.2em}
.epnav i{display:block;font-style:normal;font-size:10.5px;letter-spacing:.08em;margin-top:3px;opacity:.75;font-family:var(--sans)}
.epnav button.on{color:var(--ink);background:var(--panel);box-shadow:inset 0 -3px 0 var(--acc)}

main{padding:0 4vw 90px;max-width:1560px;margin:0 auto}
section.view{display:none}section.view.on{display:block}
h3.rub{font-family:var(--dfont);font-size:24px;letter-spacing:.3em;margin:40px 0 6px;font-weight:600}
.rubsub{color:var(--mut);font-size:13px;margin:0 0 22px;font-family:var(--sans);letter-spacing:.05em}

/* ── 时代篇章头 ── */
.hero{position:relative;margin-top:26px;border:1px solid var(--line);background:var(--panel);overflow:hidden}
.heroinner{padding:46px 44px 40px;position:relative;z-index:2}
.hero .span{font-size:13px;letter-spacing:.28em;color:var(--acc);font-family:var(--sans);font-weight:600}
.herolat{font-family:var(--kai);font-size:15px;letter-spacing:.55em;color:var(--mut);margin:10px 0 2px}
.hero h2{font-family:var(--dfont);font-size:clamp(34px,4.6vw,56px);margin:2px 0 0;line-height:1.15;letter-spacing:.12em;font-weight:600}
.artcredit{position:absolute;right:12px;bottom:8px;font:10.5px var(--sans);color:var(--mut);letter-spacing:.06em;z-index:2}
.heroart{position:absolute;inset:0;background-size:cover;background-position:center;opacity:.34;z-index:1}
.heroph{position:absolute;inset:0;z-index:1;display:flex;align-items:center;justify-content:flex-end;padding-right:6%;
  font-family:var(--kai);font-size:130px;color:var(--acc);opacity:.09;letter-spacing:.1em}
.ephead{display:grid;grid-template-columns:minmax(300px,1.12fr) minmax(280px,.88fr);gap:44px;padding:36px 0 24px;align-items:start}
@media(max-width:900px){.ephead{grid-template-columns:1fr}}
.ephead .intro{font-size:16.5px;text-align:justify}
.theme{font:12px var(--sans);color:var(--mut);letter-spacing:.06em;margin-top:14px}
.theme b{color:var(--acc2)}
.quotebox{border-left:3px solid var(--acc);padding:8px 0 8px 20px;margin-top:6px}
.quotebox p{font-family:var(--kai);font-size:19px;margin:0;line-height:1.7}
.quotebox span{display:block;font:11.5px var(--sans);color:var(--mut);margin-top:8px;letter-spacing:.1em}
.subs{margin-top:16px;display:flex;flex-wrap:wrap;gap:8px}
.subs em{font-style:normal;font:12.5px var(--sans);border:1px solid var(--line);color:var(--mut);padding:4px 10px;letter-spacing:.05em}
.events{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:1px;background:var(--line);border:1px solid var(--line);margin:8px 0 26px}
.events>div{background:var(--panel);padding:13px 15px}
.events b{font-family:var(--sans);font-size:12.5px;color:var(--acc);display:block;letter-spacing:.08em}
.events span{font-size:13.5px;color:var(--ink);opacity:.92}
.scholbox{border:1px solid var(--line);background:var(--panel);padding:24px 28px;margin:0 0 26px}
.scholbox h4{font-family:var(--dfont);letter-spacing:.25em;margin:0 0 10px;font-size:16px;color:var(--acc2)}
.scholbox p{margin:0;font-size:15px;text-align:justify;color:var(--ink)}
.debates{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:14px;margin:0 0 34px}
.debate{border:1px solid var(--line);border-top:3px solid var(--acc2);background:var(--panel);padding:16px 18px}
.debate h4{margin:0 0 8px;font-family:var(--dfont);font-size:16px;letter-spacing:.08em}
.debate p{margin:0;font-size:13.5px;color:var(--ink);opacity:.92;text-align:justify}
.debate .ref{display:block;margin-top:9px;font:11px var(--sans);color:var(--mut)}

/* ── 名录卡片 ── */
.typechips{display:flex;gap:6px;flex-wrap:wrap;margin:0 0 16px}
.chip{font:600 12px var(--sans);letter-spacing:.14em;border:1px solid var(--line);background:none;color:var(--mut);padding:6px 12px;cursor:pointer}
.chip.on{background:var(--acc);border-color:var(--acc);color:var(--bg)}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(255px,1fr));gap:14px}
@keyframes cardin{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
.card{border:1px solid var(--line);background:var(--panel);padding:17px 17px 15px;cursor:pointer;position:relative;transition:transform .25s ease,box-shadow .25s ease;transform-style:preserve-3d;opacity:1;animation:cardin .5s ease both}
@media(prefers-reduced-motion:reduce){.card{animation:none}}
.card:hover{box-shadow:0 12px 30px rgba(8,6,2,.22);z-index:3}
.card .cbadge{position:absolute;top:13px;right:13px;font-family:var(--kai);font-size:12px;width:22px;height:22px;line-height:22px;text-align:center;border:1px solid var(--acc2);color:var(--acc2)}
.card .chead{display:flex;gap:13px;align-items:center;margin-bottom:9px}
.card h4{margin:0;font-family:var(--dfont);font-size:19px;font-weight:600;letter-spacing:.05em}
.card .orig{font-size:11.5px;color:var(--mut);font-family:var(--sans);letter-spacing:.03em;margin-top:1px}
.card .dts{font:11px var(--sans);color:var(--acc);letter-spacing:.06em;margin-top:2px}
.card .k{font-size:13px;color:var(--ink);opacity:.9;margin:0;text-align:justify}
.card .s{font:10.5px var(--sans);color:var(--mut);margin-top:9px;letter-spacing:.05em;border-top:1px dashed var(--line);padding-top:7px}
.med{flex:none;display:flex;align-items:center;justify-content:center;background:var(--bg);border:1px solid var(--line);color:var(--acc);font-family:var(--kai);overflow:hidden}
.med img{width:100%;height:100%;object-fit:cover}
.med.y人{border-radius:50%}
.med.y曲{border-radius:14px 2px 14px 2px}
.med.y器{border-radius:2px;border-color:var(--acc2)}
.med.y书{border-radius:0;border-style:double;border-width:3px}
.med.y制{border-radius:6px;border-style:dashed}

/* ── 详情 ── */
dialog{border:1px solid var(--line);background:var(--panel);color:var(--ink);max-width:980px;width:min(94vw,980px);padding:0;box-shadow:0 30px 90px rgba(5,4,2,.5)}
dialog::backdrop{background:rgba(8,6,3,.62);backdrop-filter:blur(3px)}
.dwrap{padding:30px 34px 34px;max-height:86vh;overflow:auto}
.dhead{display:flex;align-items:start;gap:18px;border-bottom:2px solid var(--acc);padding-bottom:14px;margin-bottom:18px}
.dhead h4{font-family:var(--dfont);font-size:30px;margin:0;letter-spacing:.08em;font-weight:600}
.dhead .orig{color:var(--mut);font-size:13px;font-family:var(--sans);margin-top:3px}
.dhead .meta{font:12px var(--sans);color:var(--acc);letter-spacing:.08em;margin-top:7px}
.dnav{margin-left:auto;display:flex;gap:6px}
.dnav button{font:12px var(--sans);background:none;border:1px solid var(--line);color:var(--mut);padding:7px 11px;cursor:pointer}
.dnav button:hover{color:var(--ink);border-color:var(--acc)}
.dclose{background:none;border:none;color:var(--mut);font-size:19px;cursor:pointer;padding:4px 8px}
.dclose:hover{color:var(--acc)}
.dcols{display:grid;grid-template-columns:1.55fr .95fr;gap:30px}
@media(max-width:760px){.dcols{grid-template-columns:1fr}}
.dcols h5{font-family:var(--sans);font-size:11.5px;letter-spacing:.3em;color:var(--acc2);margin:20px 0 7px;font-weight:700}
.dcols h5:first-child{margin-top:0}
.dcols p{margin:0;font-size:14.5px;text-align:justify}
.dcols .works{margin:2px 0 0;padding-left:20px;font-size:14px}
.dcols .works li{margin-bottom:3px}
.citeline,.nortonline{font:11.5px var(--sans);color:var(--mut);border-top:1px dashed var(--line);padding-top:9px;margin-top:18px!important;letter-spacing:.03em}
.pfig{margin:0 0 16px}
.pfig img{width:100%;display:block;border:1px solid var(--line)}
.pfig figcaption{font:10.5px var(--sans);color:var(--mut);margin-top:6px;letter-spacing:.03em}
.bigmed{margin:0 auto 16px}
.conn{list-style:none;margin:0;padding:0}
.conn li{padding:7px 0;border-bottom:1px dashed var(--line);font-size:13.5px}
.conn b{color:var(--acc2);font-family:var(--sans);font-size:11px;letter-spacing:.1em}
.conn a{color:var(--acc);cursor:pointer;text-decoration:none;border-bottom:1px dotted var(--acc)}
.routebox{border:1px solid var(--line);background:#e9e0c9;margin-bottom:6px}
.routebox .land{fill:#f2ebd8;stroke:#a98f5e;stroke-width:1.4}
.routebox .river{stroke:#7a2e1d;opacity:.5}
.routebox .cdot{fill:#7a2e1d;stroke:#f2ebd8}
.routebox .clab{fill:#38301f;stroke:#f2ebd8;stroke-width:2.5px}
.routebox .route{stroke:#3e5c4b}
.routebox svg{display:block;width:100%}
.xl{color:var(--acc);cursor:pointer;text-decoration:none;border-bottom:1px dotted var(--acc)}

/* ── 舆图 ── */
.maplay{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:18px}
@media(max-width:980px){.maplay{grid-template-columns:1fr}}
.mapbox{border:1px solid var(--line);background:var(--panel);position:relative}
.mapbox svg{display:block;width:100%;height:auto;cursor:grab}
.mapbox svg.panning{cursor:grabbing}
.mapbtns{position:absolute;right:10px;top:10px;display:flex;flex-direction:column;gap:5px;z-index:5}
.mapbtns button{width:32px;height:32px;font-size:17px;background:var(--panel);border:1px solid var(--line);color:var(--ink);cursor:pointer}
.land{fill:var(--panel);stroke:var(--acc2);stroke-width:1.6;filter:drop-shadow(0 3px 8px rgba(30,20,5,.14))}
.gwall{fill:none;stroke:var(--acc2);stroke-width:1.6;stroke-dasharray:7 4;opacity:.6}
.river{fill:none;stroke:var(--acc);stroke-width:1.5;opacity:.55}
.canal{fill:none;stroke:var(--acc);stroke-width:1.5;stroke-dasharray:2 5;opacity:.7}
.regionlab{font-family:var(--kai);fill:var(--mut);opacity:.55;letter-spacing:.5em;text-anchor:middle}
.sealab{font-family:var(--kai);font-style:normal;fill:var(--acc2);opacity:.5;letter-spacing:.3em;text-anchor:middle}
.cdot{fill:var(--acc);stroke:var(--bg);stroke-width:1.4;cursor:pointer}
.cdot.dim{opacity:.25}
.clab{font-family:var(--sans);fill:var(--ink);paint-order:stroke;stroke:var(--panel);stroke-width:3px;cursor:pointer}
.route{fill:none;stroke:var(--acc2);stroke-width:2.2;stroke-dasharray:6 5;opacity:.85;marker-end:none}
.mappanel{border:1px solid var(--line);background:var(--panel);padding:18px 20px;max-height:720px;overflow:auto}
.mappanel h4{font-family:var(--dfont);margin:0 0 4px;font-size:20px;letter-spacing:.1em}
.mappanel .cnote{font-size:13px;color:var(--mut);margin:0 0 12px;text-align:justify}
.mappanel .mrow{display:flex;gap:10px;align-items:center;padding:7px 0;border-bottom:1px dashed var(--line);cursor:pointer}
.mappanel .mrow:hover{background:var(--bg)}
.mappanel .mrow .sn{font-size:14px}
.mappanel .mrow small{display:block;color:var(--mut);font-size:11px;font-family:var(--sans)}
.mappanel .ccoord{font:11px var(--sans);letter-spacing:.14em;color:var(--acc);margin:0 0 10px}
.bldcard{border:1px solid var(--line);border-left:3px solid var(--acc2);background:var(--bg);margin:0 0 16px;overflow:hidden}
.bldgallery{position:relative;background:var(--panel);border-bottom:1px solid var(--line)}
.bldslide{margin:0}
.bldslide[hidden]{display:none}
.bldslide img{display:block;width:100%;aspect-ratio:4 / 3;max-height:260px;object-fit:cover;object-position:center}
.bldslide figcaption{padding:7px 10px 8px;font:10.5px/1.55 var(--sans);color:var(--mut)}
.bldslide figcaption b{color:var(--ink);font-weight:600}
.bldph{min-height:150px;display:flex;align-items:center;justify-content:center;font-size:48px;background:var(--panel);color:var(--acc2);opacity:.5}
.bldmeta{padding:12px 14px 14px}
.bldlab{font:700 9.5px/1.3 var(--sans);letter-spacing:.3em;color:var(--acc2)}
.bldname{font-family:var(--dfont);font-size:17px;margin:4px 0 5px;letter-spacing:.05em}
.bldmeta p{margin:0;font-size:12.5px;color:var(--mut);text-align:justify;line-height:1.6}
.bldgalnav{position:absolute;z-index:2;top:calc(50% - 18px);width:34px;height:48px;border:1px solid rgba(255,255,255,.32);background:rgba(20,15,10,.58);color:#fff;font:24px/1 var(--sans);cursor:pointer}
.bldgalnav:hover{background:rgba(20,15,10,.82)}
.bldgalnav:focus-visible,.bldgaldot:focus-visible{outline:2px solid var(--acc);outline-offset:2px}
.bldgalprev{left:8px}.bldgalnext{right:8px}
.bldgalcount{position:absolute;z-index:2;top:9px;right:9px;padding:2px 8px;border-radius:10px;background:rgba(20,15,10,.66);color:#fff;font:600 10.5px/1.5 var(--sans);letter-spacing:.05em}
.bldgaldots{display:flex;justify-content:center;gap:4px;padding:8px 8px 9px}
.bldgaldot{width:24px;height:24px;padding:0;border:0;background:transparent;cursor:pointer;position:relative}
.bldgaldot::after{content:"";position:absolute;left:50%;top:50%;width:7px;height:7px;border-radius:50%;background:var(--line);transform:translate(-50%,-50%)}
.bldgaldot[aria-current="true"]::after{background:var(--acc)}
.sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
@media(max-width:560px){.bldslide img{max-height:none}}
@media(prefers-reduced-motion:reduce){.bldslide img,.bldgalnav,.bldgaldot{transition:none!important}}
.cgrp{margin:0 0 12px}
.cgt{font:700 10px var(--sans);letter-spacing:.28em;color:var(--acc2);border-bottom:1px solid var(--line);padding-bottom:5px;margin-bottom:4px}
.cev{display:flex;gap:10px;padding:6px 0;border-bottom:1px dashed var(--line);font-size:12.5px}
.cev b{color:var(--acc);font-family:var(--sans);font-size:11px;white-space:nowrap;flex:none}
.chips{display:flex;gap:6px;flex-wrap:wrap;margin:0 0 14px}

/* ── 长河 ── */
.tlbox{border:1px solid var(--line);background:var(--panel);overflow:auto;position:relative}
.tlbox svg{display:block}
.tlname{font:12.5px var(--sans);fill:var(--ink);cursor:pointer}
.tlbar{cursor:pointer}
.tltip{position:fixed;pointer-events:none;background:var(--panel);border:1px solid var(--acc);color:var(--ink);font:12.5px var(--sans);padding:8px 11px;z-index:99;display:none;max-width:300px;box-shadow:0 8px 24px rgba(5,4,2,.4)}

/* ── 关系之网 ── */
.nettog{display:flex;gap:6px;margin:0 0 12px}
.netbox{position:relative;border:1px solid var(--line);background:var(--panel)}
#netwrap2d svg{display:block;width:100%}
#net3d{display:none;position:relative}
.hint3d{position:absolute;left:12px;top:10px;font:11px var(--sans);color:var(--mut);z-index:4;letter-spacing:.05em}
.legend{display:flex;flex-wrap:wrap;gap:5px 16px;padding:10px 14px;border-top:1px solid var(--line);font:11.5px var(--sans);color:var(--mut)}
.legend i{display:inline-block;width:10px;height:10px;border-radius:50%;margin-right:6px;font-style:normal}

/* ── 谱系 ── */
.lintrail{border:1px solid var(--line);background:var(--panel);margin-bottom:18px;padding:20px 24px;border-left:4px solid var(--tc,var(--acc))}
.linhead h4{font-family:var(--dfont);font-size:21px;margin:0;letter-spacing:.12em}
.linhead p{margin:4px 0 14px;color:var(--mut);font-size:13px}
.linflow{display:flex;flex-wrap:wrap;align-items:center;gap:4px 2px}
.linnode{display:flex;flex-direction:column;align-items:center;gap:6px;cursor:pointer;padding:8px 10px;min-width:86px}
.linnode:hover{background:var(--bg)}
.linnode span{font-size:13.5px;font-family:var(--dfont);letter-spacing:.04em}
.linnode small{font:10px var(--sans);color:var(--mut)}
.linarr{display:flex;flex-direction:column;align-items:center;color:var(--tc,var(--acc));font-size:17px;padding:0 3px}
.linarr small{font:9.5px var(--sans);color:var(--mut);letter-spacing:.05em;max-width:74px;text-align:center}

/* ── 器物志 ── */
.bayinhero{border:1px solid var(--line);background:var(--panel);padding:40px 44px;margin-top:26px;position:relative;overflow:hidden}
.bayinhero h2{font-family:var(--dfont);font-size:clamp(30px,4vw,48px);margin:0;letter-spacing:.3em}
.bayinhero .mlat{font:11.5px var(--sans);letter-spacing:.4em;color:var(--acc);margin-bottom:12px}
.bayinhero .essay{max-width:820px;font-size:15.5px;text-align:justify;margin-top:14px}
.bacat{margin:34px 0 8px;display:flex;align-items:baseline;gap:18px;border-bottom:1px solid var(--line);padding-bottom:8px}
.bacat .bch{font-family:var(--kai);font-size:44px;color:var(--acc2);line-height:1}
.bacat .bnote{font-size:13.5px;color:var(--mut)}
.bagrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(255px,1fr));gap:14px;margin-top:14px}

/* ── 史境 ── */
.histline{position:relative;margin:30px 0 0;padding-left:0}
.hrow{display:grid;grid-template-columns:1fr 46px 1fr;gap:0;margin-bottom:26px}
.hrow .hcard{border:1px solid var(--line);background:var(--panel);padding:15px 18px;cursor:default}
.hrow .hcard.deep{cursor:pointer}
.hrow .hcard.deep:hover{border-color:var(--acc)}
.hrow.left .hcard{grid-column:1}.hrow.right .hcard{grid-column:3}
.hmid{grid-column:2;grid-row:1;display:flex;flex-direction:column;align-items:center}
.hdot{width:11px;height:11px;border-radius:50%;background:var(--hc,var(--acc));margin-top:6px;flex:none}
.hstem{width:1px;flex:1;background:var(--line)}
.hyear{font:600 12px var(--sans);color:var(--hc,var(--acc));letter-spacing:.06em;white-space:nowrap;margin-top:4px}
.hmeta{font:11px var(--sans);color:var(--mut);letter-spacing:.06em;margin-bottom:6px}
.hmeta .hep{color:var(--hc,var(--acc));font-weight:700}
.hcard h4{font-family:var(--dfont);font-size:17.5px;margin:0 0 6px;letter-spacing:.05em}
.hcard p{margin:0;font-size:13.5px;text-align:justify;opacity:.92}
.hfaces{display:flex;gap:6px;margin-top:10px}
.hfaces .med{cursor:pointer}
.hmore{font:10.5px var(--sans);color:var(--acc);margin-top:8px;letter-spacing:.1em}
.histdeep{--ec:var(--acc)}
.hseg{border-left:3px solid var(--ec);padding:4px 0 4px 16px;margin-bottom:16px}
.hseg h5{margin:0 0 5px;font:700 11px var(--sans);letter-spacing:.3em;color:var(--ec)}
.hseg p{margin:0;font-size:14px;text-align:justify}
.hdmeta{font:12px var(--sans);letter-spacing:.1em}

/* ── 乐学 ── */
.musiohero{border:1px solid var(--line);background:var(--panel);padding:40px 44px;margin-top:26px}
.musiohero h2{font-family:var(--dfont);font-size:clamp(30px,4vw,46px);margin:0;letter-spacing:.2em}
.musiohero .mlat{font:11.5px var(--sans);letter-spacing:.4em;color:var(--acc);margin-bottom:12px}
.musiohero .msub{color:var(--mut);margin-top:10px;font-size:14.5px;max-width:760px}
.mintro{max-width:860px;margin:26px 0;font-size:15.5px}
.mintro p{text-align:justify}
.mthesis{border:1px solid var(--acc2);padding:16px 22px;margin:0 0 30px;background:var(--panel)}
.mthesis b{font:700 11px var(--sans);letter-spacing:.3em;color:var(--acc2)}
.mthesis p{margin:6px 0 0;font-family:var(--kai);font-size:16.5px}
.lvgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:14px;margin-bottom:30px}
.lvcard{border:1px solid var(--line);background:var(--panel);padding:16px 18px;border-top:3px solid var(--acc)}
.lvcard .lvy{font:600 11px var(--sans);color:var(--acc);letter-spacing:.1em}
.lvcard h4{margin:3px 0 2px;font-family:var(--dfont);font-size:18px}
.lvcard .lvt{font:11.5px var(--sans);color:var(--acc2);margin-bottom:7px}
.lvcard p{margin:0;font-size:13px;text-align:justify;opacity:.92}
.lvcard[data-m]{cursor:pointer}.lvcard[data-m]:hover{border-color:var(--acc)}
.mturns{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:1px;background:var(--line);border:1px solid var(--line);margin-bottom:30px}
.mturn{background:var(--panel);padding:14px 16px}
.mty{font-family:var(--dfont);font-size:15.5px;color:var(--acc2);margin-bottom:5px}
.mturn p{margin:0;font-size:13px;opacity:.9;text-align:justify}
.mfgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(290px,1fr));gap:12px;margin-bottom:30px}
.mfig{display:flex;gap:13px;border:1px solid var(--line);background:var(--panel);padding:13px 15px;cursor:pointer}
.mfig:hover{border-color:var(--acc)}
.mfbody h4{margin:0;font-family:var(--dfont);font-size:17px}
.mforig{font:11px var(--sans);color:var(--mut);margin:1px 0 5px}
.mfbody p{margin:0;font-size:12.5px;opacity:.9;text-align:justify}
.mtexts{border:1px solid var(--line);background:var(--panel);margin-bottom:30px}
.mtext{display:flex;gap:16px;padding:11px 18px;border-bottom:1px dashed var(--line)}
.mtext:last-child{border-bottom:none}
.mtyr{font:600 12px var(--sans);color:var(--acc);min-width:72px;letter-spacing:.04em}
.mtext b{font-family:var(--dfont);font-weight:600}
.mtext span{color:var(--mut);font-size:13px}
.mcn{border-top:2px solid var(--acc2);margin-top:4px;padding-top:8px}

/* ── 词表 ── */
.glossgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:13px}
.gcard{border:1px solid var(--line);background:var(--panel);padding:15px 17px}
.gcard h4{margin:0;font-family:var(--dfont);font-size:17.5px;letter-spacing:.05em}
.gcard .orig{font:11px var(--sans);color:var(--acc);margin:2px 0 7px;letter-spacing:.03em}
.gcard p{margin:0;font-size:13px;text-align:justify;opacity:.92}
.gcard .gep{font:10px var(--sans);color:var(--mut);margin-top:8px;letter-spacing:.1em}

/* ── 文献 ── */
ol.bib{max-width:900px;padding-left:22px}
ol.bib li{margin-bottom:12px;font-size:14.5px}
.zot{font:600 9.5px var(--sans);letter-spacing:.1em;background:var(--acc2);color:var(--bg);padding:2px 7px;margin-left:8px;vertical-align:2px}
.colophon{max-width:900px;color:var(--mut);font-size:13px;border-top:1px solid var(--line);padding-top:16px;margin-top:26px;text-align:justify}

footer{border-top:1px solid var(--line);color:var(--mut);font:11px var(--sans);letter-spacing:.18em;padding:22px 4vw 30px;text-align:center}

/* ── 开卷 ── */
#intro{max-width:860px}
.introwrap{padding:38px 42px;position:relative;max-height:88vh;overflow:auto}
.introlat{font:11.5px var(--sans);letter-spacing:.5em;color:var(--acc);margin-bottom:10px}
.introwrap h2{font-family:var(--dfont);font-size:clamp(30px,4.5vw,46px);margin:0 0 14px;letter-spacing:.22em}
.introlede{font-size:15.5px;text-align:justify;max-width:740px}
.introgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:1px;background:var(--line);border:1px solid var(--line);margin:20px 0}
.introgrid>div{background:var(--panel);padding:13px 16px}
.introgrid b{font-family:var(--dfont);display:block;font-size:15px;margin-bottom:4px;letter-spacing:.12em}
.introgrid span{font-size:12.5px;color:var(--mut)}
.introfoot{display:flex;align-items:center;gap:20px;flex-wrap:wrap}
.introcolo{flex:1;min-width:260px;font-size:12px;color:var(--mut);margin:0}
.introgo{font:600 14px var(--sans);letter-spacing:.2em;padding:13px 26px;background:var(--acc);color:var(--bg);border:none;cursor:pointer}
/* ── 第一模块：欧罗巴 / 华夏镜像双卷 ── */
@view-transition{navigation:auto}
#app{view-transition-name:yearbook-page}
.mirror-switch{view-transition-name:yearbook-switch;position:fixed;z-index:1000;left:50%;bottom:16px;transform:translateX(-50%);display:grid;grid-template-columns:1fr 34px 1fr;grid-template-rows:auto auto;align-items:center;width:min(390px,calc(100vw - 24px));min-height:52px;padding:6px 8px 5px;color:#eee4d1;background:#17130f;border:1px solid #806a42;box-shadow:0 8px 24px rgba(0,0,0,.24);text-decoration:none;font-family:var(--sans);letter-spacing:.08em;isolation:isolate;contain:layout paint;transform-origin:center;will-change:transform}
.mirror-switch::before{content:"";position:absolute;inset:5px;border:1px solid rgba(231,211,169,.2);pointer-events:none}
.mirror-word{position:relative;z-index:1;text-align:center;font-size:12px;padding:5px 3px;color:#a99b84;transition:color .18s ease,background .18s ease}
.mirror-word[aria-current="page"]{color:#fff7e6;background:#8c2b1f}
.mirror-axis{position:relative;z-index:1;text-align:center;color:#d3b36c;font-size:18px;line-height:1;transform:perspective(120px) rotateY(-18deg)}
.mirror-caption{grid-column:1/-1;text-align:center;font-size:9px;line-height:1.1;color:#9e9078;letter-spacing:.24em;padding-top:2px}
.mirror-switch:hover{border-color:#d3b36c}.mirror-switch:hover .mirror-word:not([aria-current="page"]){color:#fff7e6}
.mirror-switch:focus-visible{outline:3px solid #d3b36c;outline-offset:3px}
::view-transition-group(yearbook-page){animation-duration:.54s;perspective:1600px}
::view-transition-image-pair(yearbook-page){overflow:visible;background:#17130f}
html[data-mirror="to-sinica"]::view-transition-old(yearbook-page){transform-origin:left center;animation:yearbook-out-left .26s cubic-bezier(.55,.05,.9,.35) both}
html[data-mirror="to-sinica"]::view-transition-new(yearbook-page){transform-origin:right center;animation:yearbook-in-right .42s cubic-bezier(.16,1,.3,1) .1s both}
html[data-mirror="to-europa"]::view-transition-old(yearbook-page){transform-origin:right center;animation:yearbook-out-right .26s cubic-bezier(.55,.05,.9,.35) both}
html[data-mirror="to-europa"]::view-transition-new(yearbook-page){transform-origin:left center;animation:yearbook-in-left .42s cubic-bezier(.16,1,.3,1) .1s both}
@keyframes yearbook-out-left{to{opacity:.22;transform:translate3d(-3%,0,0) rotateY(72deg) scale(.985)}}
@keyframes yearbook-in-right{from{opacity:.18;transform:translate3d(3%,0,0) rotateY(-72deg) scale(.985)}to{opacity:1;transform:none}}
@keyframes yearbook-out-right{to{opacity:.22;transform:translate3d(3%,0,0) rotateY(-72deg) scale(.985)}}
@keyframes yearbook-in-left{from{opacity:.18;transform:translate3d(-3%,0,0) rotateY(72deg) scale(.985)}to{opacity:1;transform:none}}
.mirror-leaving[data-mirror="to-sinica"] #app{transform-origin:left center;animation:yearbook-out-left .2s cubic-bezier(.55,.05,.9,.35) both;will-change:transform,opacity}
.mirror-leaving[data-mirror="to-europa"] #app{transform-origin:right center;animation:yearbook-out-right .2s cubic-bezier(.55,.05,.9,.35) both;will-change:transform,opacity}
.mirror-enter[data-mirror="to-sinica"] #app{transform-origin:right center;animation:yearbook-in-right .36s cubic-bezier(.16,1,.3,1) both;will-change:transform,opacity}
.mirror-enter[data-mirror="to-europa"] #app{transform-origin:left center;animation:yearbook-in-left .36s cubic-bezier(.16,1,.3,1) both;will-change:transform,opacity}
@media(max-width:640px){.mirror-switch{bottom:9px;min-height:48px}.mirror-caption{display:none}}
@media(prefers-reduced-motion:reduce){.mirror-switch,#app{animation:none!important;transition:none!important}::view-transition-old(yearbook-page),::view-transition-new(yearbook-page){animation:none!important}}