/* Ashlar Garden — docs aesthetic */
:root{
  --bg:#fafafa; --content:#ffffff; --fg:#24292f; --muted:#57606a;
  --border:#d0d7de; --border-soft:#eaeef2;
  --accent:#2d5a3d; --accent-soft:#eef3ef; --link:#2d5a3d; --linkv:#1e3f2a;
  --box-bg:#f6f8fa; --answer-bg:#eef3ef; --answer-bd:#c4d5c9;
  --code-bg:#f0f2f4;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif;
     background:var(--bg);color:var(--fg);font-size:15.5px;line-height:1.7}
a{color:var(--link);text-decoration:none}
a:hover{text-decoration:underline}
img{max-width:100%}
h1,h2,h3{line-height:1.25;color:var(--fg)}
.wrap{max-width:1200px;margin:0 auto;padding:0 20px}

/* ===== header ===== */
.site-header{background:var(--content);border-bottom:1px solid var(--border);position:sticky;top:0;z-index:50}
.site-header .wrap{display:flex;align-items:center;gap:22px;height:60px}
.logo{display:flex;align-items:center;gap:10px}
.logo .mark{width:34px;height:34px;border-radius:8px;background:var(--accent);color:#fff;
  display:flex;align-items:center;justify-content:center;font-weight:700;font-size:18px;font-family:Georgia,serif}
.logo strong{font-size:17px;color:var(--fg);display:block;line-height:1.1}
.logo small{font-size:11px;color:var(--muted)}
.top-nav{display:flex;gap:2px}
.top-nav a{padding:6px 11px;border-radius:6px;font-size:14px;color:var(--fg)}
.top-nav a:hover{background:var(--accent-soft);text-decoration:none;color:var(--accent)}
.top-nav a.on{background:var(--accent-soft);color:var(--accent);font-weight:600}
.site-search{margin-left:auto;display:flex;border:1px solid var(--border);border-radius:8px;overflow:hidden;background:var(--bg)}
.site-search input{border:0;padding:7px 12px;font-size:14px;width:230px;outline:none;background:transparent;color:var(--fg)}
.site-search input::placeholder{color:var(--muted)}
.site-search button{border:0;border-left:1px solid var(--border);background:var(--content);color:var(--accent);
  padding:7px 15px;cursor:pointer;font-size:13.5px}
.site-search button:hover{background:var(--accent-soft)}

/* ===== layout ===== */
.layout{max-width:1200px;margin:0 auto;padding:26px 20px 60px;display:grid;
  grid-template-columns:240px minmax(0,1fr);gap:34px;align-items:start}
.sidebar{position:sticky;top:86px;max-height:calc(100vh - 110px);overflow-y:auto;
  border:1px solid var(--border-soft);border-radius:10px;background:var(--content);padding:14px 6px;font-size:13.5px}
.sidebar .sb-h{font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.6px;
  padding:12px 12px 5px}
.sidebar ul{list-style:none}
.sidebar ul li{margin:0}
.sidebar ul a{display:block;padding:4px 12px;border-radius:6px;color:var(--fg)}
.sidebar ul a:hover{background:var(--accent-soft);text-decoration:none}
.sidebar .cat-tree .cat-h{font-weight:600;color:var(--accent)}
.sidebar .cnt{color:var(--muted);font-size:11px}
.sidebar .cat-tree ul{padding-left:8px;margin:2px 0 8px}
.main{min-width:0;background:var(--content);border:1px solid var(--border-soft);
  border-radius:10px;padding:34px 42px 44px}

/* ===== article ===== */
.crumb{font-size:13px;color:var(--muted);margin-bottom:14px}
.crumb a{color:var(--muted)}
.crumb a:hover{color:var(--accent)}
.doc-head h1{font-size:30px;margin-bottom:6px}
.doc-meta{font-size:13px;color:var(--muted);margin-bottom:18px}
.answer{background:var(--answer-bg);border:1px solid var(--answer-bd);border-left:4px solid var(--accent);
  border-radius:8px;padding:14px 18px;font-size:15.5px;margin-bottom:22px}
.toc{border:1px solid var(--border-soft);border-radius:8px;background:var(--box-bg);
  padding:12px 18px;margin-bottom:26px;font-size:14px}
.toc-h{font-weight:600;font-size:12px;text-transform:uppercase;letter-spacing:.5px;color:var(--muted);margin-bottom:6px}
.toc ol{margin-left:18px}
.toc a{color:var(--link)}
.doc-body h2{font-size:21px;margin:30px 0 10px;padding-bottom:6px;border-bottom:1px solid var(--border-soft)}
.doc-body p{margin:10px 0}
.doc-body ul,.doc-body ol{margin:10px 0 10px 24px}
.doc-body li{margin:4px 0}
.doc-body strong{color:var(--fg)}
.kp-box{background:var(--box-bg);border:1px solid var(--border-soft);border-radius:8px;
  padding:16px 20px;margin:26px 0}
.kp-box h2{border:0;margin:0 0 8px;font-size:16px}
.kp-box ul{margin:0 0 0 20px}
.faq-box{margin-top:28px}
.faq-box h2{font-size:19px;margin-bottom:10px}
.faq-item{border:1px solid var(--border-soft);border-radius:8px;margin:8px 0;background:var(--content)}
.faq-item summary{cursor:pointer;padding:11px 16px;font-weight:600;font-size:14.5px;list-style:none;
  display:flex;justify-content:space-between;align-items:center}
.faq-item summary::after{content:'+';color:var(--accent);font-size:18px}
.faq-item[open] summary::after{content:'–'}
.faq-item p{padding:0 16px 12px;color:var(--fg);font-size:14.5px}

/* prev/next */
.pn{display:flex;justify-content:space-between;gap:14px;margin-top:34px;padding-top:18px;
  border-top:1px solid var(--border-soft)}
.pn a{border:1px solid var(--border);border-radius:8px;padding:10px 14px;font-size:14px;
  background:var(--content);max-width:48%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pn a:hover{border-color:var(--accent);text-decoration:none;color:var(--accent)}
.pn-prev::before{content:'← ';color:var(--muted)}
.pn-next::after{content:' →';color:var(--muted)}

/* ===== cards / grids ===== */
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:16px;margin-top:18px}
.card{display:block;border:1px solid var(--border-soft);border-radius:10px;padding:18px 20px;
  background:var(--content);transition:border-color .12s}
.card h3{font-size:17px;color:var(--accent);margin-bottom:6px}
.card p{font-size:13.5px;color:var(--muted);line-height:1.55}
.card:hover{border-color:var(--accent);text-decoration:none}
.idx{list-style:none;margin-top:12px}
.idx li{padding:7px 0;border-bottom:1px solid var(--border-soft);font-size:15px;
  display:flex;justify-content:space-between;gap:12px;align-items:baseline}
.idx small{color:var(--muted);font-size:12px;white-space:nowrap}
.az-letter{font-size:22px;color:var(--accent);margin:28px 0 4px;border-bottom:2px solid var(--accent-soft);padding-bottom:4px}

/* ===== home ===== */
.hero{padding:34px 0 10px}
.hero h1{font-size:38px;color:var(--accent);margin-bottom:10px}
.hero .tag{font-size:17px;max-width:640px;color:var(--fg)}
.hero .stats{margin-top:12px;font-size:13.5px;color:var(--muted)}
.section{margin-top:34px}
.section h2{font-size:22px;border-bottom:1px solid var(--border-soft);padding-bottom:6px}

/* ===== footer ===== */
.site-foot{border-top:1px solid var(--border);background:var(--content);padding:20px 0;
  font-size:13px;color:var(--muted)}
.site-foot .wrap{display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap}

/* ===== responsive ===== */
@media (max-width:900px){
  .layout{grid-template-columns:1fr}
  .sidebar{position:static;max-height:none}
  .main{padding:22px 20px 30px}
  .site-search{display:none}
  .top-nav{overflow-x:auto}
}