:root { --bg:#0f1117; --panel:#151924; --text:#e6e8ee; --muted:#a7b0c0; --accent:#5b9cff; }
*{ box-sizing:border-box; }
html,body{ margin:0; padding:0; background:var(--bg); color:var(--text); font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,"Helvetica Neue",Arial; }
header{ padding:16px 20px; border-bottom:1px solid #222838; background:linear-gradient(180deg,#131726,#0f1117); }
header h1{ margin:0 0 4px 0; font-size:20px; }
header p{ margin:0; color:var(--muted); }
.layout{ display:grid; grid-template-columns:280px 1fr; min-height:calc(100vh - 100px); }
aside{ border-right:1px solid #20263a; background:var(--panel); padding:12px; }
#search{ width:100%; padding:8px 10px; border-radius:8px; border:1px solid #28334a; background:#0e1320; color:var(--text); margin-bottom:12px; }
#nav h3{ font-size:13px; color:var(--muted); margin:12px 0 6px; }
#nav a{ display:block; padding:6px 8px; border-radius:6px; color:var(--text); text-decoration:none; }
#nav a:hover{ background:#1b2235; color:#fff; }
#content{ padding:20px; }
#md h1,#md h2,#md h3{ margin-top:20px; }
#md pre{ background:#0e1320; padding:12px; border-radius:10px; overflow:auto; border:1px solid #28334a; }
#md code{ font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; }
footer{ border-top:1px solid #222838; color:var(--muted); padding:12px 16px; display:flex; gap:12px; }
footer a{ color:var(--accent); text-decoration:none; }
footer a:hover{ text-decoration:underline; }
@media (max-width: 900px){ .layout{ grid-template-columns:1fr; } aside{ order:2; } }