html,body{height:100%;overflow:hidden}
body{display:flex;width:100%;background:var(--bg);color:var(--text);font-family:var(--sans)}

/* SIDEBAR */
.sb{width:var(--sidebar-width);flex-shrink:0;background:var(--bg2);border-right:1px solid var(--border);display:flex;flex-direction:column;overflow:hidden}
.sb-head{padding:16px;border-bottom:1px solid var(--border);display:flex;align-items:center;gap:10px;flex-shrink:0}
.sb-logo{width:28px;height:28px;border-radius:6px;background:var(--accent);display:flex;align-items:center;justify-content:center;font-size:15px;flex-shrink:0;color:#0d0d0d}
.sb-t{font-size:14px;font-weight:600}
.sb-s{font-size:10px;color:var(--text3)}
.sb-body{flex:1;overflow-y:auto;padding:6px 0}
.sb-body::-webkit-scrollbar{width:3px}
.sb-body::-webkit-scrollbar-thumb{background:var(--bg4)}
.sb-body::-webkit-scrollbar-track{background:transparent}

/* NAV */
.cat{font-size:10px;font-weight:600;color:var(--text3);letter-spacing:.1em;text-transform:uppercase;padding:14px 14px 4px}
.nb{display:flex;align-items:center;gap:8px;width:100%;padding:8px 14px;font-size:13px;color:var(--text2);background:none;border:none;border-left:2px solid transparent;cursor:pointer;font-family:var(--sans);text-align:left;transition:all .12s}
.nb:hover{background:var(--bg3);color:var(--text)}
.nb.on{background:var(--accent-bg);color:var(--accent);border-left-color:var(--accent);font-weight:500}
.ni{font-size:13px;flex-shrink:0;width:18px;text-align:center}
.ntag{margin-left:auto;font-size:9px;padding:1px 6px;border-radius:99px;font-weight:600;flex-shrink:0}
.ntag.js{background:var(--green-bg);color:var(--green);border:1px solid var(--green-bd)}
.ntag.be{background:rgba(251,146,60,.1);color:var(--orange);border:1px solid rgba(251,146,60,.25)}

/* MAIN */
.main{flex:1;display:flex;flex-direction:column;overflow:hidden;min-width:0}
.topbar{height:var(--topbar-height);background:var(--bg2);border-bottom:1px solid var(--border);padding:0 20px;display:flex;align-items:center;gap:12px;flex-shrink:0}
.tb-t{font-size:14px;font-weight:500}
.tb-d{font-size:12px;color:var(--text3)}
.tb-tag{font-size:10px;font-weight:600;padding:3px 10px;border-radius:99px;display:none}
.tb-right{margin-left:auto;display:flex;gap:8px;align-items:center}
.tb-right #home-btn{display:none;text-decoration:none}
.content{flex:1;overflow-y:auto;padding:24px}
.content::-webkit-scrollbar{width:5px}
.content::-webkit-scrollbar-thumb{background:var(--bg4);border-radius:3px}
.content::-webkit-scrollbar-track{background:transparent}

/* PANELS */
.pn{display:none}
.pn.on{display:block}

.sb-scrim{display:none}
.sb-brand{text-decoration:none;color:inherit;outline-offset:2px}

/* ACCESSIBILITY */
#skip-link{position:absolute;top:-999px;left:-999px;z-index:9999;padding:8px 16px;background:var(--accent);color:#0d0d0d;font-weight:600;font-size:13px;border-radius:var(--r)}
#skip-link:focus{top:8px;left:8px}

/* EMBED MODE — strip chrome when ?embed=1 (use as iframe) */
body.embed .sb,body.embed .topbar,body.embed .sb-scrim,body.embed #skip-link{display:none!important}
body.embed{overflow:auto}
body.embed .main{width:100%}
body.embed .content{padding:14px}
body.embed .seo-content,body.embed .crumbs{display:none}