:root{
--paper:#faf7f2;--panel:#ffffff;--ink:#26221c;--muted:#6f6759;--line:#e5ded2;
--green:#166534;--green-soft:#e7f3ea;--yellow:#ffd400;--yellow-soft:#fff7d6;
--warn-ink:#5c4a00;--code-bg:#f0ebe1;--topbar-h:56px;--radius:10px;
--mono:ui-monospace,"Cascadia Mono",Consolas,Menlo,monospace;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{background:var(--paper);color:var(--ink);font:16px/1.75 -apple-system,"PingFang SC","Microsoft YaHei","Segoe UI",sans-serif;
padding-top:var(--topbar-h)}
a{color:var(--green)}
img{max-width:100%;height:auto}
code{font-family:var(--mono);background:var(--code-bg);border-radius:4px;padding:.1em .4em;font-size:.92em}

/* ---------- 顶栏（fixed，全站唯一下载按钮） ---------- */
.topbar{position:fixed;top:0;left:0;right:0;height:var(--topbar-h);z-index:60;
display:flex;align-items:center;gap:12px;padding:0 16px;
background:var(--panel);border-bottom:1px solid var(--line)}
.site-name{font-weight:800;font-size:1.06rem;color:var(--ink);text-decoration:none;
white-space:nowrap;overflow:hidden;text-overflow:ellipsis;flex:1;min-width:0}
.site-name:hover{color:var(--green)}
.menu-toggle{display:none;background:none;border:1px solid var(--line);border-radius:8px;
width:38px;height:38px;font-size:1.15rem;line-height:1;color:var(--ink);flex:none;cursor:pointer}
.download-btn{flex:none;background:#ffd400;color:#000;font-weight:800;
text-decoration:none;border-radius:10px;padding:9px 22px;font-size:.95rem;white-space:nowrap;
box-shadow:0 2px 6px rgba(38,34,28,.18)}
.download-btn:hover{background:#e6bd00}

/* ---------- 布局 ---------- */
.layout{max-width:1200px;margin:0 auto;padding:0 16px}
.sidebar{position:fixed;top:var(--topbar-h);bottom:0;left:0;width:264px;z-index:50;
background:var(--panel);border-right:1px solid var(--line);
display:flex;flex-direction:column}
.content{margin-left:280px;padding:28px 8px 60px;max-width:820px}

/* ---------- 侧边栏：上段滚动 + min-height:0 是滚动条出现的钥匙 ---------- */
.nav-scroll{flex:1 1 auto;min-height:0;overflow-y:auto;padding:14px 12px 24px}
.search-wrap{position:relative;margin-bottom:12px}
.search-box{width:100%;padding:8px 10px;border:1px solid var(--line);border-radius:8px;
font-size:.92rem;background:var(--paper);color:var(--ink)}
.search-box:focus{outline:2px solid var(--green-soft);border-color:var(--green)}
.search-results{position:absolute;left:0;right:0;top:100%;margin-top:4px;background:var(--panel);
border:1px solid var(--line);border-radius:8px;box-shadow:0 6px 18px rgba(38,34,28,.12);
max-height:320px;overflow-y:auto;display:none;z-index:70}
.search-results a{display:block;padding:7px 10px;color:var(--ink);text-decoration:none;font-size:.88rem;border-bottom:1px solid var(--line)}
.search-results a:last-child{border-bottom:none}
.search-results a:hover{background:var(--green-soft)}
.search-results .sr-group{color:var(--muted);font-size:.78em;margin-left:6px}
.nav-home{display:block;padding:8px 10px;border-radius:8px;color:var(--ink);
text-decoration:none;font-weight:700;margin-bottom:6px}
.nav-home:hover{background:var(--green-soft)}
.nav-group{margin-bottom:4px;border:1px solid var(--line);border-radius:8px;background:var(--panel)}
.nav-group>summary{cursor:pointer;padding:8px 10px;font-weight:700;font-size:.93rem;
list-style:none;display:flex;align-items:center;justify-content:space-between;border-radius:8px}
.nav-group>summary::-webkit-details-marker{display:none}
.nav-group>summary::after{content:"+";color:var(--muted);font-weight:400}
.nav-group[open]>summary::after{content:"−"}
.nav-group>summary:hover{background:var(--green-soft)}
.nav-group .nav-link{display:block;padding:6px 10px 6px 22px;color:var(--ink);
text-decoration:none;font-size:.9rem;border-top:1px dashed var(--line)}
.nav-group .nav-link:hover{background:var(--green-soft)}
.nav-group .nav-link.active{background:var(--green-soft);color:var(--green);font-weight:700;
border-left:3px solid var(--green);padding-left:19px}

/* ---------- 内容 ---------- */
.breadcrumb{color:var(--muted);font-size:.85rem;margin-bottom:14px}
.breadcrumb a{color:var(--muted)}
.content h1{font-size:1.65rem;line-height:1.35;margin:6px 0 18px;padding-bottom:12px;
border-bottom:2px solid var(--line)}
.content h2{font-size:1.22rem;margin:30px 0 12px;padding-left:10px;border-left:4px solid var(--green)}
.content h3{font-size:1.05rem;margin:20px 0 8px}
.content p{margin:10px 0}
.content ul,.content ol{margin:10px 0 10px 22px}
.content li{margin:6px 0}
.steps li{margin:10px 0}
.hint{border-radius:var(--radius);padding:12px 14px;margin:16px 0;font-size:.95rem}
.hint strong{display:block;margin-bottom:4px}
.hint.tip{background:var(--green-soft)}
.hint.tip strong{color:var(--green)}
.hint.warn{background:var(--yellow-soft)}
.hint.warn strong{color:var(--warn-ink)}
figure.pic{margin:18px 0;border:1px solid var(--line);border-radius:var(--radius);
overflow:hidden;background:var(--panel)}
figure.pic img{display:block;width:100%}
figure.pic figcaption{padding:8px 12px;font-size:.85rem;color:var(--muted);
border-top:1px solid var(--line)}
.related{margin-top:34px;padding-top:16px;border-top:1px solid var(--line)}
.related ul{list-style:none;margin:8px 0 0}
.related li{display:inline-block;margin:4px 8px 4px 0}
.related a{display:inline-block;background:var(--panel);border:1px solid var(--line);
border-radius:999px;padding:4px 14px;text-decoration:none;font-size:.9rem}
.related a:hover{border-color:var(--green);background:var(--green-soft)}
.page-nav{display:flex;justify-content:space-between;gap:12px;margin-top:28px}
.page-nav a{flex:1;background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);
padding:12px 14px;text-decoration:none;color:var(--ink);font-size:.92rem}
.page-nav a:hover{border-color:var(--green)}
.page-nav .next{text-align:right}
.page-nav .dir{display:block;font-size:.78rem;color:var(--muted)}

/* ---------- 页脚 ---------- */
.footer{max-width:1200px;margin:0 auto;padding:18px 16px 30px;border-top:1px solid var(--line);
display:flex;justify-content:space-between;align-items:flex-start;gap:16px}
.foot-note{font-size:.8rem;color:var(--muted);max-width:640px}
.gh-anchor{flex:none;font-size:.85rem;color:var(--muted)}

/* ---------- 首页 ---------- */
.notice{background:var(--yellow-soft);border-radius:var(--radius);padding:12px 14px;margin:0 0 16px;font-size:.93rem}
.notice strong{display:block;color:var(--warn-ink);margin-bottom:4px}
.lead{font-size:1.02rem}
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:22px 0}
.stat{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);
padding:14px 10px;text-align:center}
.stat .num{display:block;font-weight:800;color:var(--green);font-size:1.02rem;white-space:nowrap}
.stat .lab{display:block;font-size:.8rem;color:var(--muted);margin-top:2px}
.pan-box{background:var(--panel);border:1px solid var(--line);border-left:5px solid var(--green);
border-radius:var(--radius);padding:16px;margin:20px 0}
.pan-box p{margin:0 0 12px;font-size:.95rem}
.pan-btn{display:inline-block;background:#ffd400;color:#000;font-weight:800;text-decoration:none;
border-radius:10px;padding:11px 26px;box-shadow:0 2px 6px rgba(38,34,28,.18)}
.pan-btn:hover{background:#e6bd00}
.loop{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:16px 0}
.loop-card{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);
padding:14px;text-decoration:none;color:var(--ink);display:block}
.loop-card:hover{border-color:var(--green)}
.loop-card .step-no{display:inline-flex;width:26px;height:26px;border-radius:50%;
background:var(--ink);color:var(--paper);align-items:center;justify-content:center;
font-weight:800;font-size:.9rem;margin-bottom:8px}
.loop-card h3{margin:0 0 6px;font-size:1rem}
.loop-card p{margin:0;font-size:.86rem;color:var(--muted)}
.groups{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:16px 0}
.group-card{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);padding:14px}
.group-card h3{margin:0 0 8px;font-size:1rem;padding-left:8px;border-left:4px solid var(--green)}
.group-links{display:flex;flex-direction:column;gap:2px}
.group-links a{color:var(--ink);text-decoration:none;font-size:.88rem;padding:3px 6px;border-radius:6px}
.group-links a:hover{background:var(--green-soft);color:var(--green)}
.more-apps{margin:30px 0 10px;padding:16px;background:var(--panel);border:1px solid var(--line);border-radius:var(--radius)}
.more-apps h2{margin-top:0}
.more-note{font-size:.88rem;color:var(--muted);margin-bottom:10px}
.tags{display:flex;flex-wrap:wrap;gap:8px}
.tag{display:inline-block;background:var(--paper);border:1px solid var(--line);border-radius:999px;
padding:4px 13px;color:var(--ink);text-decoration:none;font-size:.87rem}
.tag:hover{border-color:var(--green);color:var(--green)}

/* ---------- 遮罩（伪元素，不加节点） ---------- */
body.drawer-open::before{content:"";position:fixed;inset:0;background:rgba(38,34,28,.45);z-index:40}

/* ---------- 移动端 ---------- */
@media (max-width:900px){
:root{--topbar-h:50px}
.menu-toggle{display:flex;align-items:center;justify-content:center}
.site-name{font-size:.95rem}
.download-btn{padding:7px 14px;font-size:.85rem;border-radius:8px}
.sidebar{left:0;width:264px;transform:translateX(-100%);transition:transform .25s ease;
box-shadow:0 0 24px rgba(38,34,28,.2)}
body.drawer-open .sidebar{transform:translateX(0)}
.content{margin-left:0;padding:18px 4px 50px}
.layout{padding:0 10px}
.footer{flex-direction:column;gap:8px}
.stats{grid-template-columns:repeat(2,1fr)}
.loop{grid-template-columns:repeat(2,1fr)}
.groups{grid-template-columns:1fr}
.content h1{font-size:1.35rem}
.content h2{font-size:1.1rem}
}
@media (max-width:380px){
.site-name{font-size:.85rem}
.download-btn{padding:6px 10px;font-size:.78rem}
.stat .num{font-size:.9rem}
}