:root{--bg:#000;--primary:#33FF88;--text:#EAEAEA}
*{box-sizing:border-box}html,body{margin:0;background:var(--bg);color:var(--text);font-family:Inter,sans-serif}
.topbar{position:sticky;top:0;display:flex;gap:14px;align-items:center;padding:12px 16px;border-bottom:1px solid #1b1b1b;background:#050505;z-index:2}
.brand{font-weight:800;color:var(--primary)} .menu{display:flex;gap:12px;text-transform:capitalize}
.menu a{color:var(--text);text-decoration:none;border:1px solid #1f1f1f;padding:4px 8px}
#search{margin-left:auto;background:#0d0d0d;color:var(--text);border:1px solid #222;padding:8px}
main{display:grid;grid-template-columns:280px 1fr;min-height:calc(100vh - 56px)}
#sidebar{border-right:1px solid #1b1b1b;padding:16px;overflow:auto} #content{padding:24px;max-width:960px}
.hero h1{font-size:42px;color:var(--primary)} .grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px}
.card{border:1px solid #1f1f1f;padding:12px} a{color:var(--primary)} pre{background:#0f0f0f;padding:12px;overflow:auto}
code{font-family:'JetBrains Mono',monospace}.anchor{display:none}.copy-btn{margin:8px 0;background:#101010;color:var(--primary);border:1px solid var(--primary)}
@media (max-width:950px){.menu{display:none}main{grid-template-columns:1fr}#sidebar{order:2;border-right:none;border-top:1px solid #1b1b1b}}