/* EGYSHOW desktop navigation refinement — 2026-11-03 */
#topbar.stream-header{
  gap:18px;
  padding-inline:clamp(16px,2.15vw,36px);
  background:rgba(12,13,16,.96);
  border-bottom:1px solid rgba(255,255,255,.085);
  backdrop-filter:blur(16px);
  -webkit-backdrop-filter:blur(16px);
}
#topbar .brand{flex:0 0 auto}
#topbar .brand strong{font-size:15px;white-space:nowrap}
#topbar .desktop-nav,
body:has(#homeView:not(.hidden)) #topbar .desktop-nav{
  display:flex;
  flex:1 1 auto;
  align-items:center;
  gap:clamp(9px,1.0vw,17px);
  min-width:0;
  overflow:visible;
  scrollbar-width:auto;
}
#topbar .desktop-nav>a:not(.app-nav-link),
body:has(#homeView:not(.hidden)) #topbar .desktop-nav>a:not(.app-nav-link){
  flex:0 0 auto;
  white-space:nowrap;
  font-size:12px;
  font-weight:800;
  line-height:1.4;
  padding:10px 5px;
  color:#d7d9df;
  transition:color .18s;
}
#topbar .desktop-nav>a:not(.app-nav-link):hover{color:#fff}
#topbar .desktop-nav>.app-nav-link,
body:has(#homeView:not(.hidden)) #topbar .app-nav-link{
  flex:0 0 auto;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  margin-inline-start:auto;
  min-height:37px;
  padding:8px 13px;
  border-radius:10px;
  background:linear-gradient(120deg,#ec283b,#c20f23);
  box-shadow:0 5px 18px rgba(220,20,44,.17);
  color:white!important;
  white-space:nowrap;
  font-size:11.5px;
  font-weight:900;
}
#topbar .actions{flex:0 0 auto;margin-inline-start:0}
#topbar .header-more{position:relative;flex:0 0 auto}
#topbar .header-more>summary{
  display:flex;
  align-items:center;
  gap:7px;
  list-style:none;
  cursor:pointer;
  user-select:none;
  padding:11px 10px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:9px;
  background:rgba(255,255,255,.04);
  color:#e2e3e9;
  white-space:nowrap;
  font-size:12px;
  font-weight:800;
}
#topbar .header-more>summary::-webkit-details-marker{display:none}
#topbar .header-more>summary:after{
  content:"";
  width:6px;height:6px;
  border-inline-end:1.6px solid currentColor;
  border-bottom:1.6px solid currentColor;
  transform:translateY(-2px) rotate(45deg);
  transition:transform .18s ease;
}
#topbar .header-more[open]>summary:after{transform:translateY(1px) rotate(225deg)}
#topbar .header-more>summary:hover,
#topbar .header-more[open]>summary{background:rgba(255,255,255,.1)}
#topbar .header-more>summary:focus-visible{outline:2px solid white;outline-offset:2px}
#topbar .header-more-menu{
  position:absolute;
  top:calc(100% + 11px);
  inset-inline-end:0;
  z-index:90;
  width:max-content;
  min-width:225px;
  max-width:min(310px,calc(100vw - 24px));
  display:flex;
  flex-direction:column;
  gap:3px;
  padding:9px;
  border:1px solid rgba(255,255,255,.15);
  border-radius:13px;
  background:#1a1b20;
  box-shadow:0 20px 45px rgba(0,0,0,.55);
}
#topbar .header-more-menu>a,
body:has(#homeView:not(.hidden)) #topbar .header-more-menu>a{
  display:block;
  color:#e7e7eb;
  border-radius:8px;
  padding:10px 12px;
  font-size:12px;
  font-weight:700;
  text-decoration:none;
  white-space:nowrap;
}
#topbar .header-more-menu>a:hover,
#topbar .header-more-menu>a:focus-visible{background:rgba(255,255,255,.1);color:#fff}
@media(max-width:1260px){
  #topbar .desktop-nav,
  body:has(#homeView:not(.hidden)) #topbar .desktop-nav{display:none!important}
  #topbar .mobile-menu-btn{display:grid!important;place-items:center}
  #topbar .actions{margin-inline-start:auto}
}
@media(max-width:900px){
  #topbar.stream-header{gap:10px;padding-inline:14px}
  #topbar .brand strong{font-size:14px}
}
@media(max-width:640px){
  #topbar.stream-header{gap:7px;padding-inline:10px}
  #topbar .brand strong{font-size:12px}
}

/* Keep the native details popup invisible until opened. */
#topbar .header-more:not([open])>.header-more-menu{display:none!important}