/* SIO — Layout */

#sidebar{position:fixed;left:0;top:0;bottom:0;width:240px;background:var(--surface);border-right:1px solid var(--border);display:flex;flex-direction:column;z-index:200;transition:transform .25s cubic-bezier(.4,0,.2,1)}
.sb-logo{padding:28px 24px 20px;border-bottom:1px solid var(--border)}
.sb-logo-mark{width:36px;height:36px;border-radius:10px;background:linear-gradient(135deg,#2563EB,#1D4ED8);display:flex;align-items:center;justify-content:center;font-size:18px;margin-bottom:12px;box-shadow:0 0 20px rgba(37,99,235,.35)}
.sb-logo h1{font-size:15px;font-weight:700;letter-spacing:-.01em;color:var(--text)}
.sb-logo p{font-size:11px;color:var(--text3);margin-top:2px}
.sb-section{padding:20px 16px 6px;font-size:10px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--text3)}
.nav-item{display:flex;align-items:center;gap:10px;margin:2px 10px;padding:9px 14px;border-radius:8px;border:none;background:none;color:var(--text2);font-family:inherit;font-size:13px;font-weight:500;cursor:pointer;text-align:left;width:calc(100% - 20px);transition:all .15s;position:relative}
.nav-item:hover{background:var(--surface2);color:var(--text)}
.nav-item.active{background:var(--accent-dim);color:var(--accent)}
.nav-item.active::before{content:'';position:absolute;left:-10px;top:50%;transform:translateY(-50%);width:3px;height:18px;background:var(--accent);border-radius:0 2px 2px 0}
.sb-footer{margin-top:auto;padding:16px 20px;border-top:1px solid var(--border);font-size:11px;color:var(--text3);display:flex;align-items:center;gap:8px}
.sb-footer-dot{width:6px;height:6px;border-radius:50%;background:var(--accent);flex-shrink:0;box-shadow:0 0 6px var(--accent)}
#main{margin-left:240px;min-height:100vh}
.topbar{background:var(--surface);opacity:1;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border-bottom:1px solid var(--border);padding:0 32px;height:60px;display:flex;align-items:center;justify-content:space-between;position:sticky;top:0;z-index:100}
.topbar-left{display:flex;align-items:center;gap:16px}
.topbar-left h2{font-size:15px;font-weight:600;letter-spacing:-.02em}
.topbar-actions{display:flex;gap:8px;align-items:center}
#mob-toggle{display:none;position:fixed;top:14px;left:14px;z-index:400;background:var(--surface);border:1px solid var(--border);border-radius:8px;width:38px;height:38px;align-items:center;justify-content:center;cursor:pointer;font-size:18px}