.nav-menu{ position:relative; margin-left:6px }
.nav-menu-btn{
  width:36px; height:36px; border-radius:8px;
  border:1px solid var(--line,#2E2E33); background:transparent;
  display:grid; place-items:center; cursor:pointer; padding:0;
}
.nav-menu-btn:hover{ border-color:var(--amber,#FFB020) }
.nav-menu-btn .bars{ position:relative; width:16px; height:12px }
.nav-menu-btn .bars span{
  position:absolute; left:0; width:100%; height:2px;
  background:var(--ink,#F5F3EE); border-radius:2px;
  transition:transform .2s ease, opacity .15s ease, top .2s ease;
}
.nav-menu-btn .bars span:nth-child(1){ top:0 }
.nav-menu-btn .bars span:nth-child(2){ top:5px }
.nav-menu-btn .bars span:nth-child(3){ top:10px }
.nav-menu.open .nav-menu-btn .bars span:nth-child(1){ top:5px; transform:rotate(45deg) }
.nav-menu.open .nav-menu-btn .bars span:nth-child(2){ opacity:0 }
.nav-menu.open .nav-menu-btn .bars span:nth-child(3){ top:5px; transform:rotate(-45deg) }
.nav-menu-panel{
  position:absolute; top:calc(100% + 10px); right:0; min-width:220px;
  background:rgba(27,27,31,.72);
  backdrop-filter:blur(18px) saturate(1.4);
  -webkit-backdrop-filter:blur(18px) saturate(1.4);
  border:1px solid rgba(255,255,255,.09); border-radius:12px;
  box-shadow:0 20px 50px rgba(0,0,0,.5); padding:6px;
  opacity:0; transform:translateY(-6px) scale(.98); pointer-events:none;
  transition:opacity .15s ease, transform .15s ease; z-index:60;
}
.nav-menu.open .nav-menu-panel{ opacity:1; transform:translateY(0) scale(1); pointer-events:auto }
.nav-menu-panel a{
  display:flex; align-items:center; gap:10px; padding:10px 12px;
  border-radius:8px; color:var(--ink,#F5F3EE); text-decoration:none;
  font-size:14px; font-weight:500; transition:background .12s ease;
}
.nav-menu-panel a:hover{ background:rgba(255,255,255,.06) }
.nav-menu-panel a.active{ color:var(--amber,#FFB020) }
.nav-menu-panel a .ic{ width:18px; text-align:center; font-size:15px; opacity:.85 }
.nav-menu-panel .sep{ height:1px; background:var(--line,#2E2E33); margin:6px 4px }