:root{
  --paper:#FCFCFA; --ink:#15171C; --muted:#6D7480;
  --rule:#E4E6EA; --rule-soft:#EFF1F3;
  --accent:#4B3F72; --accent-soft:#ECE9F3; --accent-fg:#FFFFFF;
  --mark:#F6E7BE; --code-bg:#F3F4F6; --code-fg:#242A33;
  --nav-fg:#3A4049; --nav-n:#A6ACB6; --hover-bg:#FAFAF9;
  --note-bg:#F7F7F5; --note-fg:#4A5058;
  --id-line:#D6DAE0; --id-hover:#E7EAEE;
  --input-bg:#FFFFFF; --placeholder:#A6ACB6; --dot:#C3C8D0;
  --bad-fg:#9A4B3C; --bad-bg:#F7E5E1; --bad-line:#E8C8C1;
  --sans:"PingFang SC","Hiragino Sans GB","Microsoft YaHei",-apple-system,BlinkMacSystemFont,"Segoe UI",system-ui,sans-serif;
  --serif:"Songti SC","Noto Serif SC",Charter,Georgia,serif;
  --mono:"SF Mono",ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  color-scheme:light;
}
html[data-theme="dark"]{
  --paper:#131519; --ink:#E4E6EA; --muted:#8B93A0;
  --rule:#272B32; --rule-soft:#1D2128;
  --accent:#A99BD8; --accent-soft:#241F33; --accent-fg:#1B1726;
  --mark:#6A5420; --code-bg:#1E222A; --code-fg:#D5D9E0;
  --nav-fg:#B8BFC9; --nav-n:#6B7280; --hover-bg:#1B1F26;
  --note-bg:#1B1F26; --note-fg:#A8AFBA;
  --id-line:#333941; --id-hover:#252A32;
  --input-bg:#191D24; --placeholder:#6B7280; --dot:#3E444D;
  --bad-fg:#E8A79A; --bad-bg:#3A211C; --bad-line:#5A3229;
  color-scheme:dark;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;background:var(--paper);color:var(--ink);
  font:400 16px/1.75 var(--sans);
  -webkit-font-smoothing:antialiased;
}
a{color:var(--accent)}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:2px}

.wrap{display:grid;grid-template-columns:272px minmax(0,1fr)}

/* ---------- 左侧脊 ---------- */
.rail{
  position:sticky;top:0;align-self:start;height:100vh;overflow-y:auto;
  border-right:1px solid var(--rule);
  padding:20px 16px 40px;display:flex;flex-direction:column;gap:18px;
}
.brand{font:600 15px/1.4 var(--sans);letter-spacing:.01em;padding:0 6px}
.brand small{display:block;font:400 12px/1.5 var(--sans);color:var(--muted);margin-top:3px;letter-spacing:0}

.searchbox{position:relative}
.searchbox input{
  width:100%;padding:9px 34px 9px 32px;font:400 14px/1.4 var(--sans);
  color:var(--ink);background:var(--input-bg);border:1px solid var(--rule);border-radius:5px;
  transition:border-color .12s,box-shadow .12s;
}
.searchbox input::placeholder{color:var(--placeholder)}
.searchbox input:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}
.searchbox .mag{position:absolute;left:10px;top:9px;width:15px;height:15px;stroke:var(--muted);fill:none;stroke-width:1.8}
.searchbox kbd{
  position:absolute;right:7px;top:7px;font:400 11px/1 var(--mono);color:var(--muted);
  background:var(--code-bg);border:1px solid var(--rule);border-radius:3px;padding:3px 4px;
}
.searchbox input:focus + kbd{opacity:0}

.chips{display:flex;flex-wrap:wrap;gap:4px}
.chips button{
  display:inline-flex;align-items:center;gap:5px;
  font:400 12.5px/1 var(--sans);color:var(--muted);background:none;
  border:1px solid var(--rule);border-radius:999px;padding:5px 10px;cursor:pointer;
  transition:color .12s,border-color .12s,background .12s;
}
.chips button:hover{color:var(--ink);border-color:var(--muted)}
.chips button.on{background:var(--accent);color:var(--accent-fg);border-color:var(--accent)}
.chips button .c{font:400 11px/1 var(--mono);opacity:.55;font-variant-numeric:tabular-nums}

nav{display:flex;flex-direction:column;gap:2px}
.navgroup{display:flex;flex-direction:column;gap:1px}
.navrow{display:flex;align-items:center;gap:1px}
.navrow a{
  display:flex;gap:10px;align-items:baseline;flex:1;min-width:0;
  padding:6px 8px;border-radius:4px;text-decoration:none;color:var(--nav-fg);
  font-size:14px;border-left:2px solid transparent;margin-left:-2px;
}
.navrow a .n{font:400 11px/1 var(--mono);color:var(--nav-n);min-width:14px;padding-top:3px}
.navrow a:hover{background:var(--rule-soft);color:var(--ink)}
.navrow a.on{color:var(--accent);background:var(--accent-soft);border-left-color:var(--accent);font-weight:500}
.navrow a.on .n{color:var(--accent)}

.navchev{
  flex:none;align-self:stretch;width:17px;
  display:flex;align-items:center;justify-content:center;
  background:none;border:0;padding:0;border-radius:3px;
  color:var(--nav-n);cursor:pointer;
}
.navchev.pad{pointer-events:none}
.navchev:hover{color:var(--ink);background:var(--rule-soft)}
.navchev svg{
  width:9px;height:9px;fill:none;stroke:currentColor;
  stroke-width:2;stroke-linecap:round;stroke-linejoin:round;
  transition:transform .15s ease;
}
.navchev[aria-expanded="false"] svg{transform:rotate(-90deg)}

.navsub{display:flex;flex-direction:column;gap:1px;margin:1px 0 3px 26px}
.navsub.collapsed{display:none}
.navsub a{
  padding:4px 8px;border-radius:4px;text-decoration:none;
  font-size:12.5px;line-height:1.5;color:var(--muted);
  border-left:2px solid transparent;margin-left:-2px;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
.navsub a:hover{background:var(--rule-soft);color:var(--ink)}
.navsub a.on{color:var(--accent);border-left-color:var(--accent);background:var(--accent-soft)}

.railfoot{
  margin-top:auto;padding:14px 6px 0;border-top:1px solid var(--rule);
  font-size:12.5px;line-height:1.85;color:var(--muted);
}
.railfoot b{color:var(--ink);font-weight:600;font-variant-numeric:tabular-nums}
.themebtn{
  display:flex;align-items:center;gap:7px;width:100%;margin-top:10px;
  font:400 13px/1 var(--sans);color:var(--muted);background:none;border:0;
  padding:7px 8px;border-radius:4px;cursor:pointer;text-align:left;
}
.themebtn:hover{background:var(--rule-soft);color:var(--ink)}
.themebtn svg{width:14px;height:14px;flex:none;fill:none;stroke:currentColor;stroke-width:1.6}

/* ---------- 主区 ---------- */
.main{padding:52px 60px 140px;max-width:1160px}
.lede{max-width:44em;color:var(--muted);font-size:15px;margin:0 0 6px}
.lede b{color:var(--ink);font-weight:600}

h2{
  font:700 28px/1.35 var(--serif);letter-spacing:-.01em;margin:0 0 6px;
  padding:46px 0 0;border-top:1px solid var(--rule);
  scroll-margin-top:24px;display:flex;align-items:baseline;gap:13px;
}
h2 .num{font:400 12px/1 var(--mono);color:var(--accent);letter-spacing:.08em;flex:none}
section:first-of-type h2{border-top:0;padding-top:8px}
h3{
  font:700 17.5px/1.5 var(--sans);margin:36px 0 10px;position:relative;
  padding-bottom:9px;scroll-margin-top:24px;
}
h3::after{content:"";position:absolute;left:0;bottom:0;width:34px;height:2px;background:var(--accent)}
p{max-width:44em;margin:10px 0}
.hint{max-width:44em;color:var(--muted);font-size:14.5px;margin:10px 0}

code,.id{
  font-family:var(--mono);font-size:.875em;background:var(--code-bg);
  padding:.12em .42em;border-radius:3px;color:var(--code-fg);
}
.id{cursor:copy;border-bottom:1px solid var(--id-line)}
.id:hover{background:var(--id-hover)}
.id:active{background:var(--accent-soft)}

/* 斜杠命令 */
.cmd{
  font-family:var(--mono);font-size:.875em;cursor:copy;
  color:var(--accent);background:var(--accent-soft);
  padding:.12em .42em;border-radius:3px;
}
.cmd:hover{background:var(--accent);color:var(--accent-fg)}
/* 路径与文件名 */
.path{
  font-family:var(--mono);font-size:.875em;cursor:copy;color:var(--ink);
  padding:.1em 0;border-bottom:1px dashed var(--muted);
}
.path:hover{color:var(--accent);border-bottom-color:var(--accent);border-bottom-style:solid}

table{width:100%;border-collapse:collapse;margin:12px 0 8px;font-size:14.5px}
th{
  text-align:left;font:600 12.5px/1.5 var(--sans);color:var(--muted);
  border-bottom:1px solid var(--ink);padding:6px 16px 7px 0;white-space:nowrap;
}
td{padding:9px 16px 9px 0;border-bottom:1px solid var(--rule-soft);vertical-align:top}
td:last-child,th:last-child{padding-right:0}
tbody tr:hover{background:var(--hover-bg)}
td.name{font-weight:600}
td.wide{color:var(--muted)}

ul.plain{list-style:none;padding:0;margin:10px 0;max-width:44em}
ul.plain li{position:relative;padding-left:16px;margin:5px 0;font-size:15px}
ul.plain li::before{content:"";position:absolute;left:2px;top:.68em;width:4px;height:4px;border-radius:50%;background:var(--dot)}

.note{
  max-width:44em;background:var(--note-bg);border-left:2px solid var(--accent);
  padding:11px 16px;margin:16px 0;font-size:14.5px;color:var(--note-fg);border-radius:0 4px 4px 0;
}
.note b{color:var(--ink)}

/* ---------- 搜索结果 ---------- */
#results{display:none}
#results .rsum{font-size:14px;color:var(--muted);margin:0 0 18px}
#results .rsum b{color:var(--ink)}
.rlist{list-style:none;padding:0;margin:0;max-width:60em}
.rlist li{margin:0 0 1px}
.rlist button{
  display:block;width:100%;text-align:left;background:none;border:0;border-radius:4px;
  padding:9px 11px;font:inherit;color:inherit;cursor:pointer;
}
.rlist button:hover,.rlist button.cursor{background:var(--accent-soft)}
.rlist .rsec{font:400 11px/1 var(--mono);color:var(--accent);letter-spacing:.06em}
.rlist .rtxt{font-size:14.5px;margin-top:4px;color:var(--nav-fg)}
.rempty{color:var(--muted);font-size:14.5px;max-width:44em}
mark{background:var(--mark);color:inherit;padding:.05em .1em;border-radius:2px}

/* ---------- 命中闪烁 ---------- */
@keyframes flash{from{background:var(--mark)}to{background:transparent}}
.flash{animation:flash 1.1s ease-out}

/* ---------- 详情抽屉 ---------- */
.drawer{
  position:fixed;top:0;right:0;height:100vh;width:min(450px,94vw);z-index:25;
  background:var(--paper);border-left:1px solid var(--rule);
  transform:translateX(101%);visibility:hidden;
  transition:transform .2s ease,visibility 0s linear .2s;
  display:flex;flex-direction:column;
  box-shadow:-10px 0 30px rgba(0,0,0,.10);
}
.drawer.open{transform:none;visibility:visible;transition:transform .2s ease,visibility 0s}
.dhead{
  display:flex;align-items:flex-start;gap:12px;flex:none;
  padding:18px 20px 14px;border-bottom:1px solid var(--rule);
}
.dtitle{font:700 19px/1.4 var(--serif);word-break:break-word}
.dmeta{font-size:12.5px;color:var(--muted);margin-top:4px}
.dclose{
  flex:none;background:none;border:0;cursor:pointer;color:var(--muted);
  font:400 17px/1 var(--sans);padding:2px 5px;border-radius:4px;
}
.dclose:hover{background:var(--rule-soft);color:var(--ink)}
.dbody{flex:1;overflow-y:auto;padding:18px 20px 26px}
.dlead{margin:0;font-size:15px;line-height:1.7;color:var(--ink)}
.dfield{margin-top:22px}
.dfield h4{font:700 13px/1.4 var(--sans);color:var(--nav-fg);margin:0 0 9px}
.dfield p{margin:0;font-size:14.5px;line-height:1.7;color:var(--nav-fg)}
.dhow{display:flex;flex-direction:column;gap:7px}
.dhow .row{display:flex;align-items:baseline;gap:9px;flex-wrap:wrap}
.dhow .lbl{font-size:13px;color:var(--muted);flex:none}
.dhow .howtext{font-size:14px;color:var(--nav-fg)}
.dlinks{display:flex;flex-wrap:wrap;gap:5px}
.dlinks button{
  font:400 13px/1.5 var(--sans);color:var(--accent);
  background:var(--accent-soft);border:0;border-radius:4px;
  padding:5px 9px;cursor:pointer;text-align:left;
}
.dlinks button:hover{background:var(--accent);color:var(--accent-fg)}
.dlinks button em{font-style:normal;color:var(--muted);font-size:12px;margin-left:5px}
.dlinks button:hover em{color:inherit;opacity:.85}
.dfoot{
  flex:none;padding:12px 20px;border-top:1px solid var(--rule);display:flex;gap:8px;
}
.dfoot button{
  font:400 13.5px/1 var(--sans);padding:10px 12px;border-radius:5px;cursor:pointer;
  background:none;border:1px solid var(--rule);color:var(--nav-fg);
}
.dfoot button:hover{border-color:var(--muted);color:var(--ink)}
.dfoot button.primary{flex:1;background:var(--accent);border-color:var(--accent);color:var(--accent-fg)}
.dfoot button.primary:hover{opacity:.9;color:var(--accent-fg)}
.drepodesc{margin:0 0 9px;font-size:14px;line-height:1.6;color:var(--nav-fg)}
.dstats{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:9px}
.dstats span{
  font:400 12px/1.5 var(--mono);color:var(--muted);
  background:var(--code-bg);border-radius:3px;padding:3px 7px;
}
.dlink{font-size:13px;color:var(--accent);text-decoration:none;word-break:break-all}
.dlink:hover{text-decoration:underline}

/* ---------- 运行状态 ---------- */
.sbadge{
  display:inline-block;margin-left:7px;vertical-align:1px;
  font:400 11px/1.6 var(--sans);padding:1px 6px;border-radius:3px;
  color:var(--bad-fg);background:var(--bad-bg);border:1px solid var(--bad-line);
  white-space:nowrap;
}
.sbad{color:var(--bad-fg)}
.sok{color:var(--muted)}
tr[data-key]{cursor:pointer}
tr[data-key]:hover td.name{color:var(--accent)}

/* ---------- 折叠 ---------- */
.foldbtn{
  display:flex;align-items:baseline;gap:13px;width:100%;
  font:inherit;color:inherit;background:none;border:0;padding:0;
  text-align:left;cursor:pointer;
}
.foldbtn:hover{color:var(--accent)}
.chev{
  width:11px;height:11px;flex:none;align-self:center;
  fill:none;stroke:currentColor;stroke-width:2;
  stroke-linecap:round;stroke-linejoin:round;
  transition:transform .15s ease;
}
.foldbtn[aria-expanded="false"] .chev{transform:rotate(-90deg)}
.foldbody.collapsed{display:none}

.foldall{display:flex;gap:6px}
.foldall button{
  flex:1;font:400 12.5px/1 var(--sans);color:var(--muted);
  background:none;border:1px solid var(--rule);border-radius:4px;
  padding:6px 4px;cursor:pointer;
}
.foldall button:hover{color:var(--ink);border-color:var(--muted)}

/* ---------- 响应式 ---------- */
.railtoggle{
  display:none;position:fixed;right:16px;bottom:16px;z-index:30;
  background:var(--accent);color:var(--accent-fg);border:0;border-radius:999px;
  padding:11px 17px;font:500 14px/1 var(--sans);cursor:pointer;
  box-shadow:0 2px 10px rgba(0,0,0,.18);
}
@media (max-width:900px){
  .wrap{grid-template-columns:1fr}
  .rail{
    position:fixed;inset:0 auto 0 0;width:282px;z-index:20;
    background:var(--paper);transform:translateX(-100%);transition:transform .18s ease;
    box-shadow:0 0 0 100vmax rgba(0,0,0,.25);
  }
  .rail.open{transform:none}
  .main{padding:34px 22px 120px}
  .railtoggle{display:block}
  h2{font-size:23px}
}
@media (prefers-reduced-motion:reduce){
  *{animation:none!important;transition:none!important}
}
