
:root{
  --paper:#faf9f6;      /* 展墙暖白 */
  --panel:#ffffff;
  --ink:#26221c;        /* 深墨 */
  --ink-2:#5c554a;      /* 次级文字 */
  --line:#e4ded2;       /* 细框线 */
  --frame:#d8d0bf;      /* 画框线 */
  --accent:#8f5a06;     /* 琥珀（深字浅底可读） */
  --amber-bg:#faf3e3;   /* 提示框底 */
  --gold:#ffd400;       /* CTA 固定色 */
  --gold-h:#e6bd00;
  --danger-bg:#fbeee9;
  --danger:#9a3412;
  --topbar-h:56px;
  --radius:10px;
  --mono:"Cascadia Mono",Consolas,"Courier New",monospace;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--ink);
  font:16px/1.85 "Segoe UI","PingFang SC","Microsoft YaHei",sans-serif}
a{color:var(--accent);text-decoration:none}
a:hover{text-decoration:underline}
img{max-width:100%;height:auto}
code{font-family:var(--mono);font-size:.88em;background:#f4f0e6;
  border:1px solid var(--line);border-radius:5px;padding:1px 6px}

/* ---------- 顶栏（固定，含补偿） ---------- */
.topbar{position:fixed;top:0;left:0;right:0;height:var(--topbar-h);z-index:40;
  display:flex;align-items:center;gap:12px;padding:0 16px;
  background:rgba(255,255,255,.94);border-bottom:1px solid var(--frame);
  backdrop-filter:blur(6px)}
.brand{display:flex;align-items:baseline;gap:8px;min-width:0;flex:0 1 auto;
  color:var(--ink);font-weight:700;font-size:1.02rem;white-space:nowrap;
  overflow:hidden;text-overflow:ellipsis}
.brand small{color:var(--ink-2);font-weight:400;font-size:.72rem;letter-spacing:.14em}
.menu-toggle{display:none;flex:0 0 auto;width:40px;height:40px;margin-left:-6px;
  border:1px solid var(--frame);border-radius:8px;background:var(--panel);
  cursor:pointer;padding:0}
.menu-toggle span{display:block;width:18px;height:2px;margin:4px auto;
  background:var(--ink);border-radius:2px}
.download-btn{flex:0 0 auto;margin-left:auto;display:inline-flex;align-items:center;
  justify-content:center;min-width:118px;height:38px;padding:0 22px;
  background:#ffd400;color:#000;font-weight:800;font-size:.95rem;
  border:none;border-radius:8px;box-shadow:0 2px 6px rgba(38,34,28,.16);
  white-space:nowrap}
.download-btn:hover{background:#e6bd00;text-decoration:none}

/* ---------- 布局骨架：侧栏 + 主区 ---------- */
.shell{padding-top:calc(var(--topbar-h) + 18px);min-height:100vh}
.layout{display:flex;max-width:1240px;margin:0 auto;gap:28px;padding:0 20px 40px}
.sidebar{position:fixed;top:var(--topbar-h);bottom:0;left:0;
  width:264px;z-index:60;display:flex;flex-direction:column;
  background:var(--panel);border-right:1px solid var(--frame);
  padding:14px 0 0}
.nav-scroll{flex:1 1 auto;min-height:0;overflow-y:auto;padding:4px 14px 18px}
.main{flex:1 1 auto;min-width:0;background:var(--panel);
  border:1px solid var(--frame);border-radius:var(--radius);
  padding:30px 36px 26px;margin-top:6px;margin-left:292px}

/* ---------- 侧栏导航树 ---------- */
.nav-search{flex:0 0 auto;padding:0 14px 12px}
.nav-search input{width:100%;height:36px;padding:0 12px;font-size:.92rem;
  color:var(--ink);background:#faf8f2;border:1px solid var(--frame);
  border-radius:8px;outline:none}
.nav-search input:focus{border-color:var(--accent)}
.nav-tree a{display:block;padding:5px 10px;margin:1px 0;border-radius:7px;
  color:var(--ink);font-size:.92rem;line-height:1.5}
.nav-tree a:hover{background:#f4efe2;text-decoration:none}
.nav-tree a.cur{background:var(--amber-bg);color:var(--accent);
  font-weight:700;border-left:3px solid var(--gold)}
.nav-tree a.home{font-weight:700;border-left:3px solid transparent}
.nav-tree details{margin:2px 0}
.nav-tree summary{cursor:pointer;list-style:none;padding:6px 10px;border-radius:7px;
  color:var(--ink);font-weight:700;font-size:.93rem;user-select:none}
.nav-tree summary::-webkit-details-marker{display:none}
.nav-tree summary::before{content:"▸";display:inline-block;margin-right:7px;
  color:var(--frame);transition:transform .15s}
.nav-tree details[open]>summary::before{transform:rotate(90deg)}
.nav-tree details[open]>summary{color:var(--accent)}
.nav-tree details .sub{padding-left:14px;border-left:1px dashed var(--line);
  margin-left:12px}
.no-hit{color:var(--ink-2);font-size:.85rem;padding:8px 10px;display:none}

/* ---------- 内容排版 ---------- */
.breadcrumb{color:var(--ink-2);font-size:.82rem;margin-bottom:6px}
.breadcrumb a{color:var(--ink-2)}
h1{font-size:1.62rem;line-height:1.4;margin:2px 0 6px;padding-left:14px;
  border-left:5px solid var(--gold);letter-spacing:.01em}
h2{font-size:1.18rem;margin:30px 0 10px;padding-left:10px;
  border-left:3px solid var(--frame)}
h3{font-size:1.02rem;margin:20px 0 8px}
p{margin:10px 0}
.lead{color:var(--ink);font-size:1.02rem}
ul,ol{padding-left:1.4em}
li{margin:5px 0}
.rel{margin-top:26px;padding-top:12px;border-top:1px dashed var(--line);
  color:var(--ink-2);font-size:.92rem}

/* 提示框 */
.note,.caution{border-radius:var(--radius);padding:12px 16px;margin:16px 0;
  font-size:.95rem;line-height:1.75}
.note{background:var(--amber-bg);border:1px solid #ecd9a8}
.caution{background:var(--danger-bg);border:1px solid #eccdbb;color:var(--danger)}

/* 图片（画框意象） */
.imgfig{margin:18px auto;text-align:center;max-width:340px}
.imgfig img{border:1px solid var(--frame);border-radius:8px;padding:6px;
  background:var(--panel);box-shadow:0 3px 14px rgba(38,34,28,.08)}
.imgfig figcaption{color:var(--ink-2);font-size:.83rem;margin-top:8px;line-height:1.6}

/* 步骤与导览 */
.steps li{margin:9px 0}
.formula{background:#f4f0e6;border:1px solid var(--line);border-radius:8px;
  padding:10px 16px;font-weight:700;letter-spacing:.02em}
.guide-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:14px;margin:14px 0}
.guide-card{background:var(--paper);border:1px solid var(--line);
  border-radius:var(--radius);padding:14px 16px}
.guide-card h3{margin:0 0 6px;font-size:1rem}
.guide-card p{margin:4px 0;color:var(--ink-2);font-size:.9rem;line-height:1.7}
.guide-links{color:var(--line)}
.cta-row{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin:18px 0 6px}
.pan-btn{display:inline-flex;align-items:center;justify-content:center;
  min-width:200px;height:44px;padding:0 26px;background:#ffd400;color:#000;
  font-weight:800;border-radius:8px;font-size:1rem;
  box-shadow:0 2px 6px rgba(38,34,28,.16)}
.pan-btn:hover{background:#e6bd00;text-decoration:none}
.cta-hint{color:var(--ink-2);font-size:.86rem}

/* 首页更多软件 */
.more-sites{margin-top:34px;padding-top:18px;border-top:1px solid var(--frame)}
.more-hint{color:var(--ink-2);font-size:.9rem}
.tag-cloud{display:flex;flex-wrap:wrap;gap:8px 10px;margin-top:10px}
.tag-cloud a{display:inline-block;padding:3px 12px;border:1px solid var(--line);
  border-radius:999px;background:var(--panel);color:var(--accent);
  font-size:.88rem}
.tag-cloud a:hover{border-color:var(--accent);text-decoration:none}

/* 表格 */
.table-wrap{overflow-x:auto;margin:12px 0}
table{border-collapse:collapse;width:100%;font-size:.93rem}
th,td{border:1px solid var(--line);padding:8px 12px;text-align:left;vertical-align:top}
th{background:#f4efe2;font-weight:700}
td code{white-space:nowrap}

/* 页眉翻页 */
.pager{display:flex;gap:12px;margin-top:30px}
.pager a{flex:1;padding:10px 14px;border:1px solid var(--line);border-radius:var(--radius);
  font-size:.92rem;line-height:1.5}
.pager a:hover{border-color:var(--accent);text-decoration:none}
.pager .dir{display:block;color:var(--ink-2);font-size:.78rem}
.pager .next{text-align:right}

/* 页脚 */
.site-footer{border-top:1px solid var(--frame);background:var(--panel)}
.foot-inner{max-width:1240px;margin:0 auto;padding:16px 20px;
  display:flex;align-items:center;justify-content:space-between;gap:16px}
.foot-legal{color:var(--ink-2);font-size:.8rem;line-height:1.7;margin:0}
.foot-github{flex:0 0 auto;color:var(--ink-2);font-size:.85rem;
  border:1px solid var(--line);border-radius:999px;padding:3px 14px}
.foot-github:hover{color:var(--accent);border-color:var(--accent);text-decoration:none}

/* ---------- 移动端 ---------- */
@media (max-width:960px){
  .menu-toggle{display:block}
  .brand{font-size:.95rem}
  .brand small{display:none}
  .download-btn{min-width:0;height:34px;padding:0 14px;font-size:.88rem;border-radius:7px}
  .shell{padding-top:calc(var(--topbar-h) + 12px)}
  .layout{display:block;padding:0 14px 32px}
  .sidebar{left:0;right:auto;transform:translateX(-105%);width:280px;
    transition:transform .22s ease;box-shadow:none}
  body.nav-open .sidebar{transform:translateX(0);
    box-shadow:6px 0 24px rgba(38,34,28,.18)}
  body.nav-open::after{content:"";position:fixed;inset:0;z-index:50;
    background:rgba(38,34,28,.45)}
  .main{padding:20px 18px;margin-top:0;margin-left:0;border-radius:0 0 var(--radius) var(--radius)}
  h1{font-size:1.34rem}
  .imgfig{max-width:270px}
  .foot-inner{flex-direction:column;align-items:flex-start;gap:8px}
}
@media (max-width:380px){
  .brand{font-size:.86rem}
  .download-btn{padding:0 10px;font-size:.82rem}
}
