/* Header navigation + dropdown menu styles (extracted from style.css) */

.nav{display:flex; gap:18px; flex:1; justify-content:center}
.nav a{color:var(--muted); position:relative; padding:6px 2px}
.nav a:hover{color:var(--text)}
.nav a::after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  height:2px;
  background:transparent;
  border-radius:999px;
  transition: background .2s ease;
}
.nav a:hover::after{background:rgba(138,180,248,.55)}

.nav-dd{position:relative; display:inline-flex; align-items:center}
.nav-dd summary{
  list-style:none;
  cursor:pointer;
  color:var(--muted);
  padding:6px 2px;
  display:inline-flex;
  align-items:center;
  gap:8px;
}
.nav-dd summary::-webkit-details-marker{display:none}
.nav-dd summary::after{
  content:"▾";
  font-size:12px;
  opacity:.75;
  transform: translateY(-1px);
  transition: transform .18s ease, opacity .18s ease;
}
.nav-dd[open] summary::after{transform: translateY(-1px) rotate(180deg)}
.nav-dd[open] summary{color:var(--text)}

.nav-dd-panel{
  position:absolute;
  top:calc(100% + 10px);
  left:50%;
  transform:translateX(-50%);
  width:min(860px, calc(100vw - 32px));
  max-width:860px;
  max-height:70vh;
  overflow:auto;
  padding:14px;
  border-radius:16px;
  background:linear-gradient(180deg, rgba(15,27,45,.94), rgba(12,20,34,.92));
  border:1px solid rgba(255,255,255,.12);
  box-shadow: 0 0 0 1px rgba(138,180,248,.10), 0 18px 46px rgba(0,0,0,.55);
  backdrop-filter: blur(10px);
}
.nav-dd-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:2px 2px 12px;
  border-bottom:1px solid rgba(255,255,255,.08);
  margin-bottom:12px;
}
.nav-dd-title{font-size:12px; color:rgba(170,183,207,.92); letter-spacing:.2px}
.nav-dd-all{
  font-size:12px;
  color:var(--blue);
  padding:6px 10px;
  border-radius:999px;
  border:1px solid rgba(138,180,248,.28);
  background:rgba(138,180,248,.10);
}
.nav-dd-all:hover{color:var(--text); border-color:rgba(138,180,248,.45); background:rgba(138,180,248,.14)}

.nav-dd-grid{display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:14px}
.nav-dd-sec{padding:10px; border-radius:14px; border:1px solid rgba(255,255,255,.08); background:rgba(255,255,255,.02)}
.nav-dd-sec-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding:8px 10px;
  border-radius:12px;
  color:var(--text);
  background:rgba(138,180,248,.08);
  border:1px solid rgba(138,180,248,.16);
}
.nav-dd-sec-head:hover{background:rgba(138,180,248,.12); border-color:rgba(138,180,248,.28)}
.nav-dd-sec-name{font-weight:700}
.nav-dd-count{font-size:12px; color:rgba(170,183,207,.92); border:1px solid rgba(255,255,255,.12); background:rgba(255,255,255,.03); padding:2px 8px; border-radius:999px}

.nav-dd-sec-list{margin-top:10px; display:flex; flex-direction:column; gap:6px}
.nav-dd-subgrp{padding-left:2px}
.nav-dd-subhead{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding:7px 8px;
  border-radius:12px;
  color:rgba(230,238,252,.92);
}
.nav-dd-subhead:hover{background:rgba(255,255,255,.03); color:var(--text)}
.nav-dd-sublist{margin-left:10px; padding-left:10px; border-left:1px solid rgba(255,255,255,.10); display:flex; flex-direction:column; gap:6px}
.nav-dd-sublink{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding:7px 8px;
  border-radius:12px;
  color:rgba(230,238,252,.92);
}
.nav-dd-sublink:hover{background:rgba(255,255,255,.03); color:var(--text)}
.nav-dd-mini{font-size:12px; color:rgba(170,183,207,.86); border:1px solid rgba(255,255,255,.10); background:rgba(255,255,255,.03); padding:1px 7px; border-radius:999px}

@media (max-width:900px){
  .nav-dd-panel{left:0; transform:none}
  .nav-dd-grid{grid-template-columns:1fr}
}