/* Light collapsible navigation inspired by compact productivity tools */
.app-shell{grid-template-columns:248px minmax(0,1fr);transition:grid-template-columns .24s ease}.sidebar{width:248px;background:#fff;color:#667085;border-right:1px solid #e8ebf0;padding:22px 14px 14px;transition:width .24s ease,transform .24s ease;box-shadow:2px 0 12px rgba(18,29,52,.025)}.brand{height:44px;padding:0 8px 18px;gap:10px}.brand-mark{width:31px;height:31px;border-radius:8px;background:#6d4aff;box-shadow:0 5px 14px rgba(109,74,255,.23)}.brand-mark svg{width:17px;color:white}.brand strong{color:#151923;font-size:15px;letter-spacing:.4px}.brand span{color:#98a1b0;font-size:7px;letter-spacing:.15px;margin-top:1px}.collapse-btn{margin-left:auto;width:30px;height:30px;display:grid;place-items:center;border:1px solid #e2e6ec;border-radius:7px;background:#fff;color:#7c8594}.collapse-btn:hover{background:#f5f6f8;color:#111827}.collapse-btn svg{width:15px}.side-search{height:36px;width:100%;display:flex;align-items:center;gap:9px;border:1px solid #dfe3e9;background:#fff;border-radius:8px;padding:0 10px;margin:9px 0 17px;color:#778293;font:500 10px 'Plus Jakarta Sans';box-shadow:0 1px 3px rgba(20,30,50,.03)}.side-search svg{width:15px}.side-search span{flex:1;text-align:left}.side-search kbd{border:0;background:#f4f5f7;border-radius:4px;padding:2px 5px;color:#9099a7}.workspace{order:4;margin-top:12px;margin-bottom:0;background:#f7f8fa;border-color:#eceef2;color:#3e4755}.workspace>span{background:#e7e3ff;color:#6741e9}.workspace b{color:#303846}.workspace small{color:#98a0ad}.workspace svg{color:#8993a1}.sidebar nav{order:3}.sidebar .workspace{order:2}.sidebar nav{order:3}.sidebar-footer{order:4;border-color:#eceef2}.sidebar-footer b{color:#465064}.sidebar-footer small{color:#98a1af}.sidebar-footer>svg{color:#7c8593}.nav-label{color:#a2a9b5;font-size:8px;letter-spacing:.8px;margin:18px 10px 7px}.sidebar nav a{height:38px;color:#687383;border-radius:8px;padding:0 10px;font-size:10px;gap:10px;position:relative}.sidebar nav a>svg{width:15px;height:15px}.sidebar nav a:hover{background:#f5f6f8;color:#1d2430}.sidebar nav a.active{background:#f0f1f3;color:#151923;box-shadow:none;font-weight:700}.sidebar nav a.active>svg:first-child{color:#111827;fill:#111827;fill-opacity:.12}.sidebar nav a em{background:#eee9ff;color:#6741e9}.sidebar nav a svg:last-child{color:#a2a9b5}.sync-dot{background:#16b77d!important}.topbar{padding-left:24px}.menu-btn{display:none}
body.sidebar-collapsed .app-shell{grid-template-columns:76px minmax(0,1fr)}body.sidebar-collapsed .sidebar{width:76px;padding-left:12px;padding-right:12px}body.sidebar-collapsed .brand{padding-left:10px;padding-right:10px;justify-content:center}body.sidebar-collapsed .brand>div:last-of-type,body.sidebar-collapsed .collapse-btn,body.sidebar-collapsed .side-search span,body.sidebar-collapsed .side-search kbd,body.sidebar-collapsed .workspace div,body.sidebar-collapsed .workspace>svg,body.sidebar-collapsed .nav-label,body.sidebar-collapsed nav a span,body.sidebar-collapsed nav a em,body.sidebar-collapsed nav a>svg:last-child,body.sidebar-collapsed .sidebar-footer div:nth-child(2),body.sidebar-collapsed .sidebar-footer>svg{display:none}body.sidebar-collapsed .side-search{width:36px;padding:0;justify-content:center;margin-left:auto;margin-right:auto}body.sidebar-collapsed .workspace{padding:5px;justify-content:center;background:transparent;border:0}body.sidebar-collapsed .sidebar nav a{justify-content:center;padding:0}body.sidebar-collapsed .sidebar-footer{justify-content:center}body.sidebar-collapsed nav a:after{content:attr(data-label);position:absolute;left:52px;top:50%;transform:translateY(-50%) translateX(-4px);background:#7047eb;color:#fff;padding:7px 10px;border-radius:5px;font-size:9px;font-weight:600;white-space:nowrap;opacity:0;pointer-events:none;transition:.15s;box-shadow:0 5px 15px rgba(69,42,148,.22)}body.sidebar-collapsed nav a:before{content:"";position:absolute;left:47px;top:50%;transform:translateY(-50%);border:5px solid transparent;border-right-color:#7047eb;opacity:0;transition:.15s}body.sidebar-collapsed nav a:hover:after,body.sidebar-collapsed nav a:hover:before{opacity:1;transform:translateY(-50%) translateX(0)}body.sidebar-collapsed nav a:hover:before{transform:translateY(-50%)}
@media(max-width:1100px) and (min-width:761px){.app-shell{grid-template-columns:248px minmax(0,1fr)}.sidebar{width:248px}.brand>div:last-child,.workspace div,.workspace>svg,nav a span,nav a>svg:last-child,nav a em,.nav-label,.sidebar-footer div:nth-child(2),.sidebar-footer>svg{display:block}.workspace{justify-content:flex-start}.sidebar nav a{justify-content:flex-start}.sidebar-footer{justify-content:flex-start}body.sidebar-collapsed .app-shell{grid-template-columns:76px minmax(0,1fr)}body.sidebar-collapsed .sidebar{width:76px}}
@media(max-width:760px){.app-shell{display:block}.sidebar{width:248px;box-shadow:12px 0 40px rgba(20,28,45,.16)}.menu-btn{display:grid}.collapse-btn{display:none}.sidebar.open{width:248px}.sidebar.open .brand>div:last-of-type{display:block}.sidebar.open .side-search span,.sidebar.open .side-search kbd{display:block}.sidebar.open .side-search span{flex:1}.sidebar.open .workspace{background:#f7f8fa;border:1px solid #eceef2;padding:10px}.sidebar.open .workspace div,.sidebar.open .workspace>svg,.sidebar.open .nav-label,.sidebar.open nav a span,.sidebar.open nav a em,.sidebar.open nav a>svg:last-child,.sidebar.open .sidebar-footer div:nth-child(2),.sidebar.open .sidebar-footer>svg{display:block}.sidebar.open nav a{justify-content:flex-start;padding:0 10px}.sidebar.open .sidebar-footer{justify-content:flex-start}body.sidebar-collapsed .sidebar{width:248px}body.sidebar-collapsed .sidebar.open .brand{justify-content:flex-start;padding-left:8px;padding-right:8px}}
