/* =========================================================================
   DROPDOWN NAV — click-to-toggle, 2 lightweight dropdowns
   No hover. No timers. No flicker. Bulletproof.
   ========================================================================= */

.nav-drop{position:relative}

/* Panel */
.drop{position:absolute;top:calc(100% + 6px);left:50%;transform:translateX(-50%);min-width:240px;background:var(--white);border:1px solid var(--line);border-radius:var(--radius);box-shadow:0 12px 32px rgba(10,15,28,0.12),0 2px 6px rgba(10,15,28,0.06);padding:8px;display:none;z-index:999}
.drop[data-open="true"]{display:block}

/* Items */
.drop__item{display:flex;align-items:center;gap:12px;padding:10px 14px;border-radius:8px;font-size:14px;font-weight:600;color:var(--ink-soft);text-decoration:none;transition:background 0.12s,color 0.12s;line-height:1.3}
.drop__item:hover,.drop__item:focus-visible{background:var(--surface);color:var(--ink)}
.drop__item svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0;opacity:0.6}
.drop__item:hover svg{opacity:1}
.drop__item small{display:block;font-size:12px;font-weight:400;color:var(--mute);margin-top:2px}

.drop__muted{padding:10px 14px 6px;font-size:11px;font-weight:600;letter-spacing:0.12em;text-transform:uppercase;color:var(--faint)}
.drop__div{height:1px;background:var(--line);margin:6px 8px}
.drop__live{font-size:9px;font-weight:700;letter-spacing:0.12em;text-transform:uppercase;background:var(--lime-soft);color:#3D5C0E;padding:2px 7px;border-radius:100px;line-height:1;margin-left:auto}

/* Caret rotates when open */
.nav-link[aria-expanded="true"] .nav-caret{transform:rotate(180deg)}

@media(max-width:860px){
  .drop{display:none!important}
}