
:root{ --bg:#f6f4ef; --card:#fffdf9; --ink:#23252a; --muted:#6b6f76;
  --accent:#96323f; --info:#3d6285; --border:#e3ded4; --code:#efece4; }
@media (prefers-color-scheme: dark){
  :root{ --bg:#16181c; --card:#1e2126; --ink:#d9d7d2; --muted:#8f939a;
    --accent:#d07683; --info:#82abd1; --border:#2c3038; --code:#262a30; } }
*{box-sizing:border-box}
body{ margin:0; background:var(--bg); color:var(--ink); line-height:1.8;
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Hiragino Sans GB","Microsoft YaHei",serif; }
main{ max-width:860px; margin:0 auto; padding:1.8rem 1.1rem 4rem; }
a{ color:var(--accent); text-decoration:none } a:hover{ text-decoration:underline }
.kicker{ color:var(--accent); font-size:.75rem; letter-spacing:.16em; text-transform:uppercase; font-weight:600; }
.crumbs{ font-size:.82rem; color:var(--muted); margin:.2rem 0 .6rem; }
h1{ font-size:1.55rem; line-height:1.35; margin:.2rem 0 .3rem; }
h2{ font-size:1.02rem; margin:1.8rem 0 .5rem; padding-top:.8rem; border-top:1px solid var(--border); }
h3{ font-size:.9rem; color:var(--muted); margin:1.1rem 0 .3rem; font-weight:600; }
p{ margin:0 0 .85rem; text-align:start; }
.infobox{ background:var(--card); border:1px solid var(--border); border-radius:10px;
  padding:.7rem .95rem; margin:.9rem 0 1.2rem; font-size:.88rem; }
.infobox dl{ margin:0; display:grid; grid-template-columns:auto 1fr; gap:.15rem .8rem; }
.infobox dt{ color:var(--muted); white-space:nowrap; }
.infobox dd{ margin:0; }
.panel{ background:var(--card); border:1px solid var(--border); border-radius:10px;
  padding:.7rem .95rem; font-size:.88rem; }
.panel ul{ margin:.2rem 0 .2rem 1.05rem; padding:0; }
.panel li{ margin:.18rem 0; }
ul.rows{ list-style:none; margin:.3rem 0; padding:0; }
ul.rows li{ margin:.35rem 0; padding-left:.7rem; border-left:2px solid var(--border); }
.tchip{ display:inline-block; font-size:.7rem; border:1px solid var(--border); border-radius:6px;
  padding:.02rem .38rem; color:var(--muted); background:var(--code); margin-right:.3rem; }
.cite{ font-size:.78rem; color:var(--muted); }
.cite code{ background:var(--code); padding:.05em .3em; border-radius:4px; }
.quote{ color:var(--muted); font-size:.82rem; }
.muted{ color:var(--muted); font-size:.85rem; }
.tag-backfill{ opacity:.72; font-style:italic; }
.nolink{ color:var(--muted); }
.src{ display:inline-block; font-size:.72rem; color:var(--info); border:1px solid var(--border);
  border-radius:6px; padding:.02rem .38rem; margin-right:.3rem; }
table{ border-collapse:collapse; width:100%; font-size:.86rem; }
th,td{ border-bottom:1px solid var(--border); padding:.3rem .45rem; text-align:left; vertical-align:top; }
th{ color:var(--muted); font-weight:600; }
footer{ margin-top:2.4rem; color:var(--muted); font-size:.76rem;
  border-top:1px solid var(--border); padding-top:.9rem; }

.cite.compact{ font-size:.7rem; vertical-align:.35em; margin-left:.15rem;
  white-space:nowrap; }
.cite.compact a{ color:var(--muted); }
.cite.compact a:hover{ color:var(--accent); }
.cmore{ cursor:help; border-bottom:1px dotted var(--border); }
.lede{ font-size:1.02rem; }
h3.phase{ color:var(--ink); font-size:1rem; margin:1.2rem 0 .35rem; }
h3.phase .muted{ font-weight:400; }
h3.book{ color:var(--ink); font-size:1.12rem; font-weight:700;
  margin:1.9rem 0 .2rem; }
.aspect{ color:var(--accent); }
ul.bullets{ margin:.3rem 0 .3rem 1.1rem; padding:0; }
ul.bullets li{ margin:.3rem 0; }
.hl{ border-left:3px solid var(--border); padding:.15rem 0 .15rem .8rem;
  margin:.7rem 0; }
.hl .cap{ margin:0 0 .2rem; font-weight:600; }
.hl blockquote{ margin:0; color:var(--muted); font-size:.9rem; }
.editorial{ background:var(--card); border:1px solid var(--border);
  border-left:4px solid var(--accent); border-radius:10px; padding:.75rem 1rem; }
.editorial .tag{ font-size:.72rem; color:var(--accent); font-weight:600;
  letter-spacing:.06em; display:block; margin-bottom:.35rem; }
.seq td.n{ white-space:nowrap; color:var(--muted); width:5.5rem; }
.archive-link{ display:block; background:var(--card); border:1px solid var(--border);
  border-radius:10px; padding:.6rem .95rem; margin:1.4rem 0 .4rem; }
.rel .name{ font-weight:600; }

.vh{ position:absolute!important; width:1px; height:1px; overflow:hidden;
  clip:rect(0 0 0 0); white-space:nowrap; }
.sbox{ position:relative; margin:.35rem 0 .7rem; }
.sbox[hidden],.sres[hidden]{ display:none; }
.sbox input{ display:block; width:100%; min-height:42px; padding:.4rem .75rem;
  font:inherit; font-size:16px; color:var(--ink); background:var(--card);
  border:1px solid var(--border); border-radius:9px; -webkit-appearance:none; appearance:none; }
.sbox input:focus{ outline:2px solid var(--info); outline-offset:0; }
.sres{ position:absolute; left:0; right:0; top:100%; z-index:30; margin:.25rem 0 0;
  padding:.2rem 0; list-style:none; background:var(--card); border:1px solid var(--border);
  border-radius:9px; box-shadow:0 8px 22px rgba(0,0,0,.2); max-height:70vh; overflow-y:auto; }
.sres li{ margin:0; }
.sres a{ display:flex; flex-wrap:wrap; align-items:center; gap:.1rem .35rem; min-height:44px;
  padding:.35rem .8rem; color:var(--ink); line-height:1.35; text-decoration:none; }
.sres li[aria-selected="true"] a,.sres a:hover{ background:var(--code); text-decoration:none; }
.sres .sn{ font-weight:600; overflow-wrap:anywhere; }
.sres .tchip{ margin:0; }
.sres .sa{ flex-basis:100%; font-size:.78rem; color:var(--muted); overflow-wrap:anywhere; }
.sres .sm{ padding:.6rem .8rem; color:var(--muted); font-size:.85rem; }
.t-e{ --tc:#a0522d } .t-p{ --tc:#96323f } .t-h{ --tc:#7a6a2a } .t-l{ --tc:#2f6f52 }
.t-s{ --tc:#5b4b8f } .t-i{ --tc:#8a5a14 } .t-o{ --tc:#3d6285 } .t-w{ --tc:#7d3a6e }
@media (prefers-color-scheme: dark){
  .t-e{ --tc:#c2754d } .t-p{ --tc:#c0606d } .t-h{ --tc:#a8954a } .t-l{ --tc:#4f9a76 }
  .t-s{ --tc:#8676c0 } .t-i{ --tc:#b98a3c } .t-o{ --tc:#6a93bd } .t-w{ --tc:#ad6a9d } }
.home h1{ font-size:1.5rem; }
.hgrid{ list-style:none; margin:.5rem 0; padding:0; display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr)); gap:.8rem .6rem; }
.hgrid a{ display:block; text-align:center; color:var(--ink); font-size:.85rem; line-height:1.3; }
.hgrid img,.hgrid .ntile{ display:flex; align-items:center; justify-content:center; width:100%;
  aspect-ratio:3/4; height:auto; object-fit:cover; object-position:top; margin:0 0 .3rem;
  border:1px solid var(--border); border-radius:9px; background:var(--tc,var(--code)); }
.hgrid .ntile{ color:#fff; font-size:1.7rem; font-weight:700; }
.hgrid .nm{ display:block; overflow-wrap:anywhere; }
.hgrid img.epi{ object-position:center; }
.tcards{ list-style:none; margin:.4rem 0; padding:0; display:grid;
  grid-template-columns:minmax(0,1fr); gap:.6rem; }
.tcard{ background:var(--card); border:1px solid var(--border); border-left:4px solid var(--tc);
  border-radius:10px; padding:.55rem .85rem; font-size:.88rem; line-height:1.6; }
.tcard .th{ display:inline-block; min-height:30px; font-weight:700; font-size:1rem; }
.tcard .top a{ display:inline-block; padding:.1rem 0; }
.eras{ list-style:none; margin:.4rem 0; padding:0; display:flex; flex-wrap:wrap; gap:.5rem; }
.eras a{ display:inline-flex; align-items:center; min-height:42px; padding:.2rem .9rem;
  background:var(--card); border:1px solid var(--border); border-left:4px solid var(--tc);
  border-radius:9px; }
details.hsec{ margin:1.8rem 0 .5rem; padding-top:.8rem; border-top:1px solid var(--border); }
details.hsec>summary,details.about>summary{ cursor:pointer; min-height:40px; line-height:40px; }
details.hsec>summary{ font-weight:600; font-size:1.02rem; }
details.about dl{ display:grid; grid-template-columns:auto 1fr; gap:.1rem .8rem; margin:.3rem 0 .6rem; }
details.about dt{ white-space:nowrap; }
details.about dd{ margin:0; overflow-wrap:anywhere; }
@media (min-width:600px){
  .hgrid{ grid-template-columns:repeat(6,minmax(0,1fr)); }
  .tcards{ grid-template-columns:repeat(2,minmax(0,1fr)); } }
.hhead{ display:flex; flex-wrap:wrap; align-items:baseline; justify-content:space-between;
  gap:.3rem .8rem; margin:1.8rem 0 .5rem; padding-top:.8rem; border-top:1px solid var(--border); }
.hhead h2{ margin:0; padding:0; border:0; }
.hhead .more{ font-size:.85rem; white-space:nowrap; }
.hgrid .ty{ display:block; font-size:.72rem; color:var(--muted); }
.hgrid.hrow{ grid-auto-flow:column; grid-template-columns:none;
  grid-auto-columns:calc((100% - 1.8rem) / 3.3); overflow-x:auto; overflow-y:hidden;
  overscroll-behavior-x:contain; scroll-snap-type:x proximity; padding-bottom:.35rem; }
.hgrid.hrow li{ scroll-snap-align:start; min-width:0; }
.rbtn{ font:inherit; font-size:.9rem; min-height:40px; padding:.3rem 1rem; color:var(--ink);
  background:var(--card); border:1px solid var(--border); border-radius:9px; cursor:pointer; }
.rbtn:hover{ border-color:var(--info); }
.rbtn[hidden]{ display:none; }
@media (max-width:599.98px){
  .rgrid li:nth-child(n+7){ display:none; } }
@media (min-width:600px){
  .hgrid.hrow{ grid-auto-flow:row; grid-template-columns:repeat(6,minmax(0,1fr));
    grid-auto-columns:auto; overflow:visible; padding-bottom:0; } }
.bline[hidden],.bsec[hidden]{ display:none; }
.blab{ margin:.5rem 0 .1rem; }
.home:not([data-book]) .bline li:nth-child(n+7){ display:none; }
.home[data-book] .blab{ display:none; }
.home[data-book="lotm"] .bline[data-book="coi"],.home[data-book="coi"] .bline[data-book="lotm"],
.home[data-book="lotm"] .bsec:not([data-has~="lotm"]),
.home[data-book="coi"] .bsec:not([data-has~="coi"]){ display:none; }
@media (max-width:600px){
  td .cite.compact{ white-space:normal; }
  td{ overflow-wrap:anywhere; }
  table.idx,table.idx tbody{ display:block; }
  table.idx tr:first-child{ display:none; }
  table.idx tr{ display:block; padding:.5rem 0; border-bottom:1px solid var(--border); }
  table.idx td{ display:inline; padding:0; border:0; font-size:.8rem; color:var(--muted); }
  table.idx td:first-child{ display:block; font-size:.9rem; color:var(--ink); margin-bottom:.15rem; }
  table.idx td:nth-child(2)::after{ content:" 章 · "; }
  table.idx td:nth-child(3)::after{ content:" 条事实 · 首次登场 "; } }

.snav{ display:none; }
.snav h4{ margin:.9rem 0 .3rem; font-size:.72rem; letter-spacing:.12em; color:var(--muted);
  font-weight:600; text-align:left; }
.snav ul,.snav ol{ list-style:none; margin:0; padding:0; }
.snav li{ margin:0; }
.snav a{ display:block; padding:.22rem .55rem; border-radius:7px; color:var(--ink);
  overflow-wrap:anywhere; text-decoration:none; }
.snav .sl li{ display:flex; align-items:baseline; gap:.4rem; }
.snav .sl a{ flex:1; }
.snav .sl span{ color:var(--muted); font-size:.75rem; padding-right:.4rem; }
.snav a:hover{ background:var(--code); }
.snav a.cur{ color:var(--accent); font-weight:600; }
.snav .toc a{ border-left:2px solid transparent; border-radius:0 7px 7px 0; }
.snav .toc a.on{ border-left-color:var(--accent); background:var(--code); color:var(--accent); }
.navbtn{ position:fixed; right:max(14px,env(safe-area-inset-right)); bottom:max(14px,env(safe-area-inset-bottom));
  z-index:40; min-width:56px; min-height:44px; padding:.3rem .95rem; font:inherit; font-size:.9rem;
  color:var(--ink); background:var(--card); border:1px solid var(--border); border-radius:22px;
  box-shadow:0 4px 14px rgba(0,0,0,.18); cursor:pointer; }
.navbg{ position:fixed; inset:0; z-index:45; background:rgba(0,0,0,.38); }
html.navlock{ overflow:hidden; }
details.tocd{ margin:.4rem 0 .6rem; font-size:.88rem; }
details.tocd>summary{ cursor:pointer; min-height:40px; line-height:40px; color:var(--muted); }
details.tocd ol{ margin:0 0 .4rem 1.2rem; padding:0; }
details.tocd li{ margin:.15rem 0; }
@media (max-width:999.98px){
  .snav.open{ display:flex; flex-direction:column; position:fixed; top:0; bottom:0; left:0; z-index:50;
    width:min(20rem,86vw); padding:.6rem .8rem 2rem; overflow-y:auto; overscroll-behavior:contain;
    background:var(--card); border-right:1px solid var(--border); box-shadow:4px 0 24px rgba(0,0,0,.25);
    font-size:.92rem; line-height:1.45; }
  .snav.open a{ padding:.5rem .6rem; } }
@media (min-width:1000px){
  body.wnav{ padding-left:15rem; }
  .snav{ display:flex; flex-direction:column; position:fixed; top:0; bottom:0; left:0; width:15rem;
    padding:.8rem .8rem 2rem; overflow-y:auto; border-right:1px solid var(--border);
    background:var(--bg); font-size:.84rem; line-height:1.45; }
  .snav .sl{ order:-1; }
  .navbtn,.navbg{ display:none; } }
