:root{--bg:#0d1117;--panel:#161b22;--border:#30363d;--fg:#e6edf3;--muted:#8b949e;--accent:#58a6ff;--accent2:#3fb950;--code:#24292f;--code-fg:#e6edf3}
*{box-sizing:border-box}html,body{margin:0;padding:0}
body{background:var(--bg);color:var(--fg);font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;line-height:1.6;display:flex;flex-direction:column;min-height:100vh}
header{position:sticky;top:0;z-index:10;background:rgba(13,17,23,.92);backdrop-filter:blur(6px);border-bottom:1px solid var(--border)}
.header-inner{max-width:1080px;margin:0 auto;padding:14px 20px;display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:10px}
.logo{font-weight:700;color:var(--fg);text-decoration:none;font-size:1.15rem;letter-spacing:.3px}
.logo span{color:var(--muted);font-weight:400}
.nav{display:flex;gap:6px}
.nav a{padding:6px 12px;border-radius:6px;color:var(--muted);text-decoration:none;font-size:.95rem;transition:.15s}
.nav a:hover{color:var(--fg);background:var(--panel)}
.nav a.selected{color:var(--fg);background:var(--panel);box-shadow:inset 0 -2px 0 var(--accent)}
main.content{flex:1;width:100%;max-width:1080px;margin:0 auto;padding:28px 20px 40px}
h1{font-size:1.9rem;margin:.2em 0 .6em} h2{margin:1.2em 0 .5em} h2.subtitle{color:var(--muted);font-weight:400;font-size:1.05rem;margin-top:-.4em}
a{color:var(--accent);text-decoration:none} a:hover{text-decoration:underline}
.hero{text-align:center;padding:34px 0 10px}.hero h1{font-size:2.6rem;margin-bottom:.2em}.hero p{color:var(--muted);font-size:1.1rem;max-width:640px;margin:0 auto 22px}
.hero-actions{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}
.button{display:inline-block;background:var(--accent);color:#0d1117;font-weight:600;padding:10px 22px;border-radius:8px;text-decoration:none}
.button:hover{filter:brightness(1.1);text-decoration:none}.button-alt{background:var(--panel);color:var(--fg);border:1px solid var(--border)}
.section-title{margin-top:40px;color:var(--muted);font-size:1.05rem;text-transform:uppercase;letter-spacing:1px}
.grid-container{list-style:none;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:12px;margin:16px 0 0}
.grid-item a{display:flex;flex-direction:column;align-items:center;gap:10px;padding:18px 12px;background:var(--panel);border:1px solid var(--border);border-radius:10px;text-align:center;color:var(--fg);transition:.15s}
.grid-item a:hover{border-color:var(--accent);text-decoration:none;transform:translateY(-2px)}
.grid-item h3{margin:0;font-size:.98rem;font-weight:600}
.cat-icon{display:flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:10px;background:#1f6feb22;color:var(--accent);font-weight:700;font-size:1.05rem;border:1px solid #1f6feb44}
.cat-icon img{width:26px;height:26px;display:block}
#search-wrapper{position:sticky;top:74px;z-index:5;background:var(--bg);padding:10px 0 14px}
#search{width:100%;padding:12px 16px;border-radius:8px;border:1px solid var(--border);background:var(--panel);color:var(--fg);font-size:1rem}
#search:focus{outline:none;border-color:var(--accent)}
#commandlist{column-width:240px;column-gap:28px;column-rule:1px solid var(--border)}
#commandlist .headline{column-span:all;color:var(--muted);font-weight:700;margin:18px 0 6px;border-bottom:1px solid var(--border);padding-bottom:4px}
#commandlist a{display:block;padding:3px 0;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:.92rem;break-inside:avoid}
#commandlist a:hover{color:var(--accent2)}
.masonry{column-width:400px;column-gap:24px}
.code-group{display:inline-block;width:100%;break-inside:avoid;margin-bottom:20px}
.code-group h2{font-size:1.05rem;border-left:3px solid var(--accent);padding-left:10px}
.code-wrapper{display:flex;align-items:flex-start;gap:8px;background:var(--code);border:1px solid var(--border);border-radius:6px;padding:8px 10px;margin:6px 0;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:.9rem;overflow-wrap:anywhere}
.code-wrapper .code{flex:1}
.code-wrapper a{color:#79c0ff}
.code-wrapper a:hover{text-decoration:underline}
.copy-button{flex-shrink:0;width:18px;height:18px;cursor:pointer;opacity:.6;background:transparent;border:none;position:relative}
.copy-button::after{content:"⧉";color:var(--muted);font-size:16px;line-height:18px}
.copy-button:hover{opacity:1}
.code-preview{background:var(--code);border:1px solid var(--border);border-radius:6px;padding:10px 12px;overflow-x:auto;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:.9rem;white-space:pre}
span,p,blockquote{overflow-wrap:break-word}
blockquote{margin:8px 0;padding:6px 14px;border-left:3px solid var(--muted);color:var(--muted);background:var(--panel);border-radius:0 6px 6px 0}
table{border-collapse:collapse;margin:10px 0;width:100%;font-size:.92rem;display:block;overflow-x:auto}
th,td{border:1px solid var(--border);padding:7px 10px;text-align:left;vertical-align:top}
th{background:var(--panel);color:var(--muted)}
.accordion-button{cursor:pointer;background:var(--panel);border:1px solid var(--border);border-radius:8px;padding:10px 14px;margin:8px 0 0;font-size:1rem;display:flex;align-items:center;gap:8px;user-select:none}
.accordion-button a{color:var(--fg);flex:1}
.accordion-button.active::before{content:"▾";color:var(--accent)}
.accordion-button::before{content:"▸";color:var(--muted)}
.panel{padding:6px 4px}
.accordion-button:not(.active)+.panel{display:none}
.toggle-all-button{margin:18px 0;padding:8px 16px;border-radius:6px;border:1px solid var(--border);background:var(--panel);color:var(--fg);cursor:pointer;font-weight:600;letter-spacing:1px}
.toggle-all-button:hover{border-color:var(--accent)}
.install-row{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}
.install-command{white-space:pre-wrap}
.notfound{text-align:center;padding:80px 0}
footer{border-top:1px solid var(--border);margin-top:auto}
.footer-inner{max-width:1080px;margin:0 auto;padding:24px 20px;color:var(--muted);font-size:.9rem}
.footer-links a{color:var(--muted);margin-right:4px}
.footer-app{display:flex;align-items:center;gap:10px;margin:10px 0 0;flex-wrap:wrap}
.footer-app a{display:inline-block;line-height:0}
.footer-app img{display:block;height:40px;width:auto;border-radius:8px}

.copyright{margin:8px 0 0;font-size:.82rem}
.post-meta{color:var(--muted);font-size:.85rem;margin:-.25em 0 1.25em}
.inline-code{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;background:var(--panel);border:1px solid var(--border);padding:1px 5px;border-radius:4px;font-size:.92em;color:var(--accent2)}
.blog-grid{grid-template-columns:repeat(auto-fill,minmax(300px,1fr))}
.blog-card{padding:16px 18px;background:var(--panel);border:1px solid var(--border);border-radius:10px}
.blog-card:hover{border-color:var(--accent)}
.blog-card h2{font-size:1.05rem;margin:0 0 .3em}
.blog-card p{margin:0;color:var(--muted);font-size:.92rem}
@media(max-width:640px){.masonry{column-width:100%}.hero h1{font-size:2rem}.nav{gap:2px}.nav a{padding:6px 8px;font-size:.85rem}}