.navbar{position:fixed;top:0;left:0;right:0;background:#000;padding:15px 30px;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid silver;z-index:100}.logo{color:silver;font-size:1.5rem;font-weight:700}.nav-links{display:flex;gap:8px;justify-content:center;flex:1;margin:0 20px}.nav-links a{color:silver;text-decoration:none;font-size:1rem;padding:8px 16px;border:1px solid silver;border-radius:10px;transition:all .3s;white-space:nowrap}.nav-links a:hover{background:silver;color:#000}.nav-right{display:flex;align-items:center;gap:15px}.menu-btn{display:none;background:none;border:1px solid silver;border-radius:8px;color:silver;font-size:19px;cursor:pointer;padding:4px 10px}.user-circle{width:40px;height:40px;border-radius:50%;border:1px solid silver;overflow:hidden;cursor:pointer;flex-shrink:0}.user-avatar{width:100%;height:100%;object-fit:cover}@media (max-width: 768px){.navbar{padding:12px 20px}.logo{font-size:1.2rem}.nav-links{display:none}.menu-btn{display:block}.user-circle{width:35px;height:35px}}.mobile-menu{position:fixed;top:0;right:-100%;width:80%;max-width:350px;height:100vh;background:#0f0f0f;z-index:1000;transition:right .3s ease-in-out;box-shadow:-5px 0 25px #00000080}.mobile-menu.active{right:0}.mobile-menu-header{display:flex;justify-content:space-between;align-items:center;padding:20px;border-bottom:1px solid silver;background:#000}.mobile-menu-header .logo{font-size:1.2rem}.close-btn{background:none;border:1px solid silver;border-radius:50%;width:35px;height:35px;color:silver;font-size:20px;cursor:pointer;display:flex;align-items:center;justify-content:center}.mobile-menu-items{display:flex;flex-direction:column;padding:20px;gap:15px}.mobile-menu-items a{color:silver;text-decoration:none;font-size:1.1rem;padding:12px 15px;border-radius:10px;transition:all .3s;display:flex;align-items:center;gap:12px;border:1px solid silver}.mobile-menu-items a:hover{background:silver;color:#000}.mobile-menu-items a span{font-size:1.3rem}.mobile-menu.active:before{content:"";position:fixed;top:0;left:0;right:0;bottom:0;background:#000000b3;z-index:-1}@media (max-width: 480px){.mobile-menu{width:100%;max-width:100%}.logo{font-size:1rem}.user-circle{width:30px;height:30px}}.nav-links a.active,.mobile-menu-items a.active{background:silver;color:#000;border-color:silver}.mobile-menu-items a.active span{color:#000}