.app{flex-direction:column;min-height:100vh;display:flex}.nav{z-index:100;background:#1a2332;border-bottom:1px solid #2a3a4a;align-items:center;gap:20px;height:56px;padding:0 20px;display:flex;position:sticky;top:0}.nav-brand{color:#4fc3f7;font-size:18px;font-weight:700}.nav-links{gap:16px;display:flex}.nav-links a{color:#90a4ae;padding:4px 0;font-size:14px;text-decoration:none}.nav-links a.router-link-exact-active{color:#4fc3f7;border-bottom:2px solid #4fc3f7}.nav-right{align-items:center;gap:12px;margin-left:auto;display:flex}.search-box{position:relative}.search-box input{color:#e0e0e0;background:#0f1923;border:1px solid #2a3a4a;border-radius:6px;width:220px;padding:6px 12px;font-size:13px}.search-dropdown{z-index:200;background:#1a2332;border:1px solid #2a3a4a;border-radius:6px;max-height:300px;margin-top:4px;position:absolute;top:100%;left:0;right:0;overflow-y:auto}.search-item{cursor:pointer;padding:8px 12px;font-size:13px}.search-item:hover{background:#2a3a4a}.user-name{color:#90a4ae;font-size:13px}.btn-logout{color:#90a4ae;cursor:pointer;background:0 0;border:1px solid #546e7a;border-radius:4px;padding:4px 10px;font-size:12px}.main{flex:1;width:100%;max-width:1200px;margin:0 auto;padding:20px}@media (width<=768px){.nav{flex-wrap:wrap;gap:8px;height:auto;padding:8px 12px 10px}.nav-brand{font-size:15px}.nav-links{gap:10px}.nav-links a{font-size:12px}.nav-right{flex:100%;justify-content:flex-start;gap:8px;margin-left:0}.search-box input{width:140px;padding:5px 10px;font-size:12px}.user-name{text-overflow:ellipsis;white-space:nowrap;max-width:80px;font-size:11px;overflow:hidden}.btn-logout{padding:3px 8px;font-size:11px}.main{padding:12px}}