*,:after,:before{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth}:root{--bg:#0d1117;--surface:#161b22;--border:#30363d;--border-sub:#21262d;--text:#e6edf3;--text-sec:#c9d1d9;--muted:#8b949e;--accent:#58a6ff;--green:#3fb950;--warn-bg:#161009;--warn-bdr:#9e6a03;--warn-text:#d29922;--note-bg:#0d1926;--note-bdr:#58a6ff;--note-text:#79c0ff;--code-bg:#161b22;--code-text:#c9d1d9;--inline-bg:hsla(215,8%,47%,.4);--out-bg:#0d1117;--sidebar-w:258px;--topbar-h:52px;--font-sans:"Source Sans 3",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;--font-serif:"Slabo 27px",Georgia,serif;--font-mono:"Source Code Pro",ui-monospace,SFMono-Regular,"SF Mono",Menlo,Consolas,monospace}body{background:var(--bg);color:var(--text);font-family:var(--font-sans);font-size:15px;line-height:1.7;-webkit-font-smoothing:antialiased}a{color:var(--accent);text-decoration:none}a:hover{text-decoration:underline}.page-layout{display:flex;min-height:100vh}.sidebar{width:var(--sidebar-w);flex-shrink:0;background:var(--surface);border-right:1px solid var(--border);position:-webkit-sticky;position:sticky;top:0;height:100vh;overflow-y:auto;scrollbar-width:thin;scrollbar-color:#30363d transparent;display:flex;flex-direction:column;z-index:100}.sidebar::-webkit-scrollbar{width:3px}.sidebar::-webkit-scrollbar-thumb{background:#30363d;border-radius:2px}.sb-brand{padding:16px 16px 14px;border-bottom:1px solid var(--border);position:-webkit-sticky;position:sticky;top:0;background:var(--surface);z-index:1}.sb-brand strong{display:block;font-family:var(--font-serif);font-size:13px;font-weight:400;color:var(--text);line-height:1.3}.sb-brand span{display:block;font-family:var(--font-mono);font-size:10px;color:var(--muted);margin-top:3px;letter-spacing:.06em;text-transform:uppercase}.sidebar nav{padding:6px 0 24px}.sidebar nav ul{list-style:none;padding:0 8px}.sidebar nav ul li{margin:1px 0}.sidebar nav ul li a{display:block;padding:5px 10px;border-radius:6px;color:var(--muted);text-decoration:none;font-size:12.5px;line-height:1.5;transition:background .1s,color .1s}.sidebar nav ul li a:hover{background:var(--border-sub);color:var(--text-sec);text-decoration:none}.sidebar nav ul li a.active{background:var(--border-sub);color:var(--accent);font-weight:600}.lang-toggle{display:inline-flex;gap:2px;background:var(--border-sub);border:1px solid var(--border);border-radius:6px;padding:2px;margin-top:10px}.lang-toggle button{background:transparent;border:none;color:var(--muted);font-family:var(--font-mono);font-size:11px;font-weight:700;padding:3px 12px;border-radius:4px;cursor:pointer;letter-spacing:.06em;transition:background .12s,color .12s,box-shadow .12s;line-height:1.6}.lang-toggle button.active{background:var(--surface);color:var(--accent);box-shadow:0 1px 3px rgba(0,0,0,.4)}.lang-toggle button:not(.active):hover{color:var(--text-sec)}.topbar{display:none;position:fixed;top:0;left:0;right:0;height:var(--topbar-h);background:var(--surface);border-bottom:1px solid var(--border);align-items:center;padding:0 12px;gap:10px;z-index:300}.topbar-title{font-family:var(--font-serif);font-size:13px;color:var(--text);flex:1 1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.menu-btn{background:none;border:1px solid var(--border);color:var(--muted);width:34px;height:34px;border-radius:6px;cursor:pointer;font-size:16px;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:color .12s,border-color .12s}.menu-btn:hover{color:var(--text);border-color:var(--muted)}.overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,.65);z-index:200}.overlay.show{display:block}.main-wrapper{flex:1 1;min-width:0;display:flex;justify-content:center}.main{width:100%;max-width:820px;padding:48px 56px 96px}.hero{padding-bottom:28px;border-bottom:1px solid var(--border);margin-bottom:40px}.hero h1{font-family:var(--font-serif);font-size:2rem;font-weight:400;color:var(--text);line-height:1.2;margin-bottom:8px}.hero-desc{color:var(--muted);font-size:14px}.badges{display:flex;flex-wrap:wrap;gap:6px;margin-top:14px}.badge{background:var(--code-bg);border:1px solid var(--border);color:var(--muted);font-family:var(--font-mono);font-size:10.5px;padding:2px 9px;border-radius:20px}#content h2{font-family:var(--font-serif);font-size:1.5em;font-weight:400;color:var(--text);margin:48px 0 14px;padding-bottom:8px;border-bottom:1px solid var(--border);scroll-margin-top:24px;line-height:1.3}#content h3{font-family:var(--font-sans);font-size:.975rem;font-weight:700;color:var(--text-sec);margin:24px 0 10px;scroll-margin-top:24px}#content h4{font-size:.875rem;font-weight:600;color:var(--muted);margin:16px 0 8px}#content p{margin-bottom:12px;color:var(--text-sec);font-size:15px}#content ol,#content ul{padding-left:24px;margin-bottom:12px}#content li{font-size:15px;margin:4px 0;color:var(--text-sec)}#content li strong,#content strong{color:var(--text)}#content hr{border:none;border-top:1px solid var(--border);margin:24px 0}#content code{font-family:var(--font-mono);font-size:.82em;background:var(--inline-bg);border-radius:4px;padding:2px 5px;color:var(--code-text)}.code-wrap{position:relative;margin:12px 0}#content pre{background:var(--code-bg);border:1px solid var(--border);border-radius:6px;padding:16px 20px;overflow-x:auto;scrollbar-width:thin;scrollbar-color:#30363d transparent}#content pre::-webkit-scrollbar{height:3px}#content pre::-webkit-scrollbar-thumb{background:#30363d}#content pre code{font-family:var(--font-mono);font-size:.82em;font-weight:400;line-height:1.65;background:none;border:none;padding:0;border-radius:0;color:var(--code-text)}.output-block pre{background:var(--out-bg);border:1px dashed #30363d}.output-block pre code{color:var(--muted)}.output-block:before{content:"output";display:block;font-family:var(--font-mono);font-size:10px;color:#444c56;text-transform:uppercase;letter-spacing:.08em;margin-bottom:4px}.copy-btn{position:absolute;top:8px;right:8px;background:#1c2128;border:1px solid var(--border);color:var(--muted);font-family:var(--font-mono);font-size:11px;padding:3px 10px;border-radius:4px;cursor:pointer;transition:background .15s,color .15s,border-color .15s;z-index:2}.copy-btn:hover{background:var(--border);color:var(--text)}.copy-btn.copied{color:var(--green);border-color:var(--green)}#content blockquote{border-left:3px solid var(--warn-bdr);background:var(--warn-bg);color:var(--warn-text);padding:10px 16px;border-radius:0 6px 6px 0;margin:14px 0;font-size:13.5px}#content blockquote p{color:inherit;margin:0;font-size:inherit}#content blockquote.note{border-left-color:var(--note-bdr);background:var(--note-bg);color:var(--note-text)}#content blockquote.note p{color:inherit}#content ol.steps{padding-left:22px}#content ol.steps>li{margin:12px 0;color:var(--text-sec);line-height:1.6}#content ol.steps>li strong{color:var(--text)}#content ol.steps>li .code-wrap{margin:8px 0 4px}#content ol.steps>li>ul{margin:4px 0;padding-left:18px;list-style:disc}@media (max-width:1100px){.main{padding:40px 36px 80px}}@media (max-width:900px){.main{padding:36px 24px 80px}}@media (max-width:768px){.page-layout{display:block}.topbar{display:flex}.sidebar{position:fixed;top:0;left:0;height:100vh;transform:translateX(-100%);transition:transform .24s ease;z-index:250;width:min(var(--sidebar-w),82vw)}.sidebar.open{transform:translateX(0)}.main-wrapper{display:block}.main{margin-top:var(--topbar-h);padding:24px 16px 72px;max-width:100%}#content h2{font-size:1.2rem;margin-top:36px}#content h2,#content h3{scroll-margin-top:calc(var(--topbar-h) + 16px)}.hero h1{font-size:1.5rem}}