*{box-sizing:border-box}
:root{--bg:#f6f8fb;--card:#fff;--ink:#0f172a;--muted:#64748b;--line:#e2e8f0;--brand:#2f6bff;--brand-ink:#10204f}
html,body{margin:0;padding:0;background:var(--bg);color:var(--ink);font:16px/1.55 system-ui,Segoe UI,Arial,sans-serif}
.topbar{position:sticky;top:0;z-index:20;display:flex;gap:.75rem;align-items:center;padding:.65rem 1rem;background:var(--brand-ink);color:#fff}
.brand{color:#fff;font-weight:700;text-decoration:none;letter-spacing:.02em}
.topbar input{flex:1;min-width:8rem;max-width:28rem;border:0;border-radius:8px;padding:.45rem .7rem;font:inherit}
.ext{color:#d9e6ff;text-decoration:none;font-size:.9rem;white-space:nowrap}
.ext:hover{color:#fff}
.menu-btn{display:none;background:#1a4ff0;color:#fff;border:0;border-radius:8px;padding:.35rem .55rem;font-size:1.1rem}
.shell{display:grid;grid-template-columns:280px 1fr;min-height:calc(100vh - 52px)}
aside{border-right:1px solid var(--line);background:#fff;padding:.75rem 0 2rem;overflow:auto;max-height:calc(100vh - 52px);position:sticky;top:52px}
.side-nav{display:flex;flex-direction:column;padding:0 .75rem}
.side-nav a{color:#334155;text-decoration:none;padding:.28rem .5rem;border-radius:6px;font-size:.9rem}
.side-nav a:hover,.side-nav a.active{background:#eef4ff;color:var(--brand)}
.side-label{margin:.4rem .5rem .2rem;font-size:.72rem;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.06em}
.side-nav details{margin-top:.4rem}
.side-nav summary{cursor:pointer;font-size:.85rem;font-weight:650;color:var(--brand-ink);padding:.25rem .5rem}
.markdown-body{max-width:960px;margin:0 auto;padding:1.25rem 1.5rem 4rem;background:var(--card);min-height:calc(100vh - 52px)}
.markdown-body h1,.markdown-body h2,.markdown-body h3{color:var(--brand-ink);line-height:1.25}
.markdown-body h1{font-size:1.7rem;margin-top:0}
.markdown-body a{color:var(--brand)}
.markdown-body table{border-collapse:collapse;width:100%;display:block;overflow-x:auto;margin:1rem 0}
.markdown-body th,.markdown-body td{border:1px solid var(--line);padding:.4rem .55rem;text-align:left;vertical-align:top;font-size:.92rem}
.markdown-body th{background:#eef4ff}
.markdown-body pre{background:#0f172a;color:#e2e8f0;padding:1rem;border-radius:10px;overflow:auto}
.markdown-body code{font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:.9em}
.markdown-body :not(pre)>code{background:#eef4ff;padding:.1rem .28rem;border-radius:4px}
.markdown-body blockquote{margin:1rem 0;padding:.2rem .9rem;border-left:4px solid var(--brand);background:#eef4ff;color:#334155}
.markdown-body img{max-width:100%}
#hits{position:fixed;top:52px;left:50%;transform:translateX(-50%);width:min(640px,92vw);max-height:60vh;overflow:auto;background:#fff;border:1px solid var(--line);border-radius:10px;box-shadow:0 12px 40px rgba(15,23,42,.18);z-index:30;padding:.5rem}
#hits a{display:block;padding:.45rem .6rem;color:var(--ink);text-decoration:none;border-radius:6px}
#hits a:hover{background:#eef4ff}
#hits small{display:block;color:var(--muted);font-size:.8rem}
@media (max-width:900px){
  .ext{display:none}
  .menu-btn{display:inline-block}
  .shell{grid-template-columns:1fr}
  aside{display:none;position:fixed;inset:52px 0 0 auto;width:min(320px,90vw);z-index:25;box-shadow:-8px 0 24px rgba(15,23,42,.12)}
  aside.open{display:block}
}
