:root{--nav-width:260px;--nav-collapsed:70px;--icon-size:18px;--logo-size:120px;--nav-bg:linear-gradient(180deg, #0f172a 0%, #1e293b 100%);--nav-hover:rgba(51, 65, 85, 0.6);--nav-active:rgba(59, 130, 246, 0.1);--primary:#3b82f6;--primary-light:#60a5fa;--text-primary:#f1f5f9;--text-secondary:#cbd5e1;--text-muted:#94a3b8;--border:rgba(148, 163, 184, 0.1);--shadow:0 4px 12px rgba(0, 0, 0, 0.15);--shadow-lg:0 10px 30px rgba(0, 0, 0, 0.2);--transition:all 0.2s cubic-bezier(0.4, 0, 0.2, 1);--space-xs:0.25rem;--space-sm:0.5rem;--space-md:0.75rem;--space-lg:1rem;--space-xl:1.5rem;--z-nav:1000;--z-toggle:1001}*{box-sizing:border-box;margin:0;padding:0}html{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{font-family:-apple-system,BlinkMacSystemFont,'Segoe UI','Roboto',sans-serif;color:var(--text-primary);background:#fff;overflow-x:hidden}.main-nav{position:fixed;top:0;left:0;width:var(--nav-width);height:100vh;z-index:var(--z-nav);background:var(--nav-bg);border-right:1px solid var(--border);box-shadow:var(--shadow-lg);transition:width 0.25s cubic-bezier(.4,0,.2,1);overflow-y:auto;overflow-x:hidden}.main-nav::-webkit-scrollbar{width:4px}.main-nav::-webkit-scrollbar-track{background:#fff0}.main-nav::-webkit-scrollbar-thumb{background:rgb(148 163 184 / .2);border-radius:10px}.main-nav::-webkit-scrollbar-thumb:hover{background:rgb(148 163 184 / .4)}.main-nav.collapsed{width:var(--nav-collapsed)}.main-nav::before{content:"";position:absolute;top:0;left:0;right:0;height:2px;background:linear-gradient(90deg,var(--primary) 0%,transparent 100%)}.nav-inner{padding:var(--space-xl) 0;min-height:100vh}.nav-branding{display:flex;align-items:center;justify-content:center;padding:0 var(--space-lg) var(--space-xl);margin-bottom:var(--space-lg)}.nav-branding .logo-img{width:var(--logo-size);height:auto;object-fit:contain;transition:var(--transition)}.main-nav.collapsed .nav-branding .logo-img{width:40px}.nav-list{list-style:none;padding:0 var(--space-md)}.nav-list>li{margin-bottom:var(--space-xs)}.nav-list a{display:flex;align-items:center;gap:var(--space-md);padding:.625rem var(--space-lg);color:var(--text-secondary);text-decoration:none;font-size:.875rem;font-weight:500;border-radius:.5rem;transition:var(--transition);position:relative;white-space:nowrap}.nav-list a:hover{background:var(--nav-hover);color:var(--text-primary);transform:translateX(2px)}.nav-list a .icon{width:var(--icon-size);height:var(--icon-size);object-fit:contain;flex-shrink:0;opacity:.85;transition:var(--transition)}.nav-list a:hover .icon{opacity:1;transform:scale(1.1)}.nav-list a .label{flex:1;opacity:1;transition:opacity 0.2s}.main-nav.collapsed .nav-list a .label{opacity:0;width:0;overflow:hidden}.nav-list a.active{background:var(--nav-active);color:var(--text-primary);border-left:3px solid var(--primary);padding-left:calc(var(--space-lg) - 3px)}.nav-list a.active .icon{opacity:1;filter:drop-shadow(0 0 4px rgb(59 130 246 / .5))}.has-submenu>a{position:relative}.has-submenu>a::after{content:"";position:absolute;right:var(--space-lg);top:50%;transform:translateY(-50%);width:6px;height:6px;border-right:2px solid var(--text-muted);border-bottom:2px solid var(--text-muted);transform:translateY(-50%) rotate(45deg);transition:var(--transition)}.has-submenu.open>a::after{transform:translateY(-50%) rotate(-135deg)}.main-nav.collapsed .has-submenu>a::after{display:none}.submenu{list-style:none;max-height:0;overflow:hidden;padding-left:calc(var(--icon-size) + var(--space-lg) + var(--space-md));transition:max-height 0.25s cubic-bezier(.4,0,.2,1)}.has-submenu.open>.submenu{max-height:500px;padding-top:var(--space-xs);padding-bottom:var(--space-sm)}.main-nav.collapsed .submenu{display:none}.submenu li{margin-bottom:var(--space-xs)}.submenu a{padding:.5rem var(--space-md);font-size:.8125rem;gap:var(--space-sm)}.submenu a .icon{width:14px;height:14px}.submenu a.active{background:rgb(59 130 246 / .15);border-left:2px solid var(--primary);padding-left:calc(var(--space-md) - 2px)}#nav-toggle{position:fixed;top:var(--space-xl);left:calc(var(--nav-width) - 20px);z-index:var(--z-toggle);width:40px;height:40px;display:flex;align-items:center;justify-content:center;background:var(--nav-bg);border:1px solid var(--border);border-radius:50%;box-shadow:var(--shadow);cursor:pointer;transition:var(--transition)}.main-nav.collapsed+#nav-toggle{left:calc(var(--nav-collapsed) - 20px)}#nav-toggle:hover{background:rgb(59 130 246 / .1);border-color:var(--primary);box-shadow:0 0 12px rgb(59 130 246 / .3)}#nav-toggle .icon{width:20px;height:20px;object-fit:contain;transition:var(--transition)}#nav-toggle:hover .icon{transform:scale(1.1)}@media (max-width:768px){.main-nav{transform:translateX(-100%)}.main-nav.open{transform:translateX(0)}#nav-toggle{left:var(--space-lg);background:var(--primary)}.main-nav.open+#nav-toggle{left:calc(var(--nav-width) - 20px);background:var(--nav-bg)}}.nav-overlay{display:none;position:fixed;inset:0;background:rgb(0 0 0 / .5);backdrop-filter:blur(4px);z-index:calc(var(--z-nav) - 1);opacity:0;transition:opacity 0.25s}.nav-overlay.active{display:block;opacity:1}@media (min-width:769px){.nav-overlay{display:none!important}}@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:0.01ms!important;animation-iteration-count:1!important;transition-duration:0.01ms!important}}a:focus-visible,button:focus-visible{outline:2px solid var(--primary);outline-offset:2px}.no-transition{transition:none!important}.hidden{display:none!important}