:root{
  --bg:#ffffff;
  --text:#1a1a1a;
  --muted:#5a5a5a;
  --accent:#2f6fed;
  --border:#e3e6ea;
  --maxw:840px;
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,"PingFang SC","Microsoft YaHei",sans-serif;
  color:var(--text);
  background:var(--bg);
  line-height:1.78;
  font-size:16px;
}
.site-nav{
  border-bottom:1px solid var(--border);
  background:#fafbfc;
  position:sticky;
  top:0;
  z-index:10;
}
.site-nav .inner{
  max-width:var(--maxw);
  margin:0 auto;
  padding:13px 24px;
  display:flex;
  gap:22px;
  flex-wrap:wrap;
  align-items:center;
}
.site-nav a{
  color:var(--muted);
  text-decoration:none;
  font-size:14px;
  font-weight:500;
}
.site-nav a:hover{color:var(--accent);}
.site-nav .brand{
  font-weight:700;
  color:var(--text);
  margin-right:auto;
  font-size:15px;
}
.site-nav a.active{color:var(--accent);font-weight:700;}
.container{
  max-width:var(--maxw);
  margin:0 auto;
  padding:48px 24px 40px;
}
h1{font-size:30px;line-height:1.3;margin:0 0 6px;letter-spacing:-0.01em;}
.update{color:var(--muted);font-size:14px;margin:0 0 34px;}
h2{font-size:20px;margin:38px 0 12px;padding-top:18px;border-top:1px solid var(--border);}
h2:first-of-type{border-top:none;padding-top:0;}
h3{font-size:16px;margin:22px 0 8px;}
p{margin:0 0 16px;}
ul,ol{margin:0 0 16px;padding-left:26px;}
li{margin:7px 0;}
a.inline{color:var(--accent);text-decoration:none;}
a.inline:hover{text-decoration:underline;}
.placeholder-note{
  background:#fff8e6;
  border:1px solid #f1d99a;
  color:#7a5b00;
  padding:12px 16px;
  border-radius:8px;
  font-size:13px;
  margin-bottom:34px;
  line-height:1.6;
}
.placeholder-note strong{color:#5e4400;}
.footer{
  border-top:1px solid var(--border);
  margin-top:56px;
  padding:26px 0 40px;
}
.footer .inner{
  max-width:var(--maxw);
  margin:0 auto;
  padding:0 24px;
  color:var(--muted);
  font-size:13px;
  line-height:1.7;
}
.footer a{color:var(--accent);text-decoration:none;}
.footer a:hover{text-decoration:underline;}
.toc{
  background:#f7f9fc;
  border:1px solid var(--border);
  border-radius:10px;
  padding:18px 22px;
  margin:0 0 38px;
}
.toc h2{border:none;margin:0 0 10px;padding:0;font-size:16px;}
.toc ol{margin:0;columns:2;column-gap:32px;}
.toc li{margin:5px 0;break-inside:avoid;}
.toc a{color:var(--accent);text-decoration:none;}
.toc a:hover{text-decoration:underline;}
@media (max-width:600px){
  .toc ol{columns:1;}
  .container{padding:32px 18px 30px;}
}
