.app{display:flex;min-height:100vh}
#sidebar{width:var(--sidebar-w);flex:none;background:var(--c-surface);border-right:1px solid var(--c-border);position:sticky;top:0;height:100vh;overflow-y:auto;transition:width .2s}
.main-col{flex:1;min-width:0;display:flex;flex-direction:column}
#header{height:var(--header-h);display:flex;align-items:center;gap:10px;padding:0 var(--gap);background:var(--c-surface);border-bottom:1px solid var(--c-border);position:sticky;top:0;z-index:5}
#main{flex:1;padding:20px var(--gap);max-width:1200px;width:100%;margin:0 auto}
#footer{padding:12px var(--gap);color:var(--c-muted);font-size:.8rem;text-align:center}
.brand{display:flex;align-items:center;gap:8px;padding:16px;font-weight:700;color:var(--c-text);text-decoration:none}
.nav details{padding:0 8px}.nav summary{cursor:pointer;padding:8px;font-size:.8rem;color:var(--c-muted);font-weight:600}
.nav a{display:flex;align-items:center;gap:10px;padding:7px 10px;border-radius:8px;color:var(--c-text);text-decoration:none}
.nav a:hover{background:var(--c-bg)}
.nav a[aria-current=page]{background:var(--c-primary);color:var(--c-on-primary);font-weight:600}
.nav .ic{width:22px;height:22px;border-radius:6px;border:1px solid currentColor;display:grid;place-items:center;font-size:.75rem;flex:none}
body.collapsed #sidebar{width:var(--sidebar-w-c)}body.collapsed .t,body.collapsed .nav summary{display:none}
.search{flex:1;max-width:420px}.search input{width:100%}