/* 手册页专用：左侧目录 + 右侧正文。基础调色与控件复用 style.css。 */

.g-hero{background:var(--soft);border-bottom:1px solid var(--rule-soft);
  padding:56px 0 48px}
.g-hero h1{font-size:40px;font-weight:700;letter-spacing:-.01em}
.g-hero p{color:var(--ink-mute);margin-top:12px;font-size:17px}

.g-body{display:grid;grid-template-columns:216px 1fr;gap:52px;
  padding-top:44px;padding-bottom:72px;align-items:start}

.toc{position:sticky;top:76px}
.toc nav{display:flex;flex-direction:column;gap:2px;
  border-left:2px solid var(--rule-soft);padding-left:2px}
.toc a{
  text-decoration:none;font-size:14px;color:var(--ink-mute);
  padding:7px 12px;border-left:2px solid transparent;margin-left:-2px;
}
.toc a:hover{color:var(--ink);background:var(--soft)}

.g-main{min-width:0}
.g-main section{margin-bottom:56px;scroll-margin-top:84px}
.g-main h2{
  font-size:25px;font-weight:700;padding-bottom:12px;margin-bottom:20px;
  border-bottom:1px solid var(--rule);
}
.g-main h3{font-size:18px;font-weight:500;margin:28px 0 12px}
.g-main h4{font-size:15.5px;font-weight:500;margin:20px 0 10px;color:var(--ink-mute)}
.g-main p{margin-bottom:13px;color:var(--ink-mute);font-size:15.5px}
.g-main p b,.g-main li b,.g-main td b{font-weight:500;color:var(--ink)}
.g-main ul,.g-main ol{margin:0 0 14px;padding-left:22px;color:var(--ink-mute);font-size:15.5px}
.g-main li{margin-bottom:8px}
.mut{color:var(--ink-faint)}

.bigsteps{counter-reset:s;list-style:none;padding:0}
.bigsteps li{
  counter-increment:s;position:relative;padding-left:40px;margin-bottom:13px;
  font-size:16px;
}
.bigsteps li::before{
  content:counter(s);position:absolute;left:0;top:1px;
  width:26px;height:26px;border-radius:50%;display:grid;place-items:center;
  background:var(--slate-bg);color:var(--slate);
  font-family:var(--f-mono);font-size:13px;
}

.t{width:100%;border-collapse:collapse;margin:0 0 16px;font-size:15px}
.t th,.t td{
  border:1px solid var(--rule-soft);padding:10px 13px;
  text-align:left;vertical-align:top;color:var(--ink-mute);
}
.t th{background:var(--soft);color:var(--ink);font-weight:500}
.t.kbd th{font-family:var(--f-mono);font-size:13.5px;white-space:nowrap}

.tip{
  background:var(--slate-bg);border-left:3px solid var(--slate);
  border-radius:0 6px 6px 0;padding:13px 16px;margin:18px 0;
  font-size:14.5px;line-height:1.75;color:var(--ink-mute);
}
.tip b{color:var(--ink);font-weight:500}

.warn-t{color:var(--cinnabar)}
.warn{
  background:var(--cinnabar-bg);border:1px solid var(--cinnabar);
  border-radius:8px;padding:16px 20px;margin:14px 0 0;
}
.warn p{margin-bottom:11px;font-size:15px}
.warn ul{margin-bottom:11px}
.warn p:last-child{margin-bottom:0}

.g-cta{
  background:var(--soft);border:1px solid var(--rule-soft);border-radius:10px;
  padding:34px;text-align:center;margin-top:48px;
}
.g-cta h3{font-size:21px;font-weight:700;margin-bottom:10px}
.g-cta p{color:var(--ink-mute);margin-bottom:20px}

@media (max-width:900px){
  .g-body{grid-template-columns:1fr;gap:26px}
  .toc{position:static;border-bottom:1px solid var(--rule-soft);padding-bottom:14px}
  .toc nav{flex-direction:row;flex-wrap:wrap;gap:4px;border-left:none;padding-left:0}
  .toc a{border:1px solid var(--rule-soft);border-radius:14px;padding:5px 11px;
    font-size:13px;margin-left:0}
  .g-hero h1{font-size:30px}
  .t{font-size:14px}
  .t th,.t td{padding:8px 10px}
}