/* =========================================================
   ST7D v7.7.3 - SPACIOUS DISCOVERY NAVBAR
   Uses the reclaimed utility space instead of crushing the main nav.
   The sticky header keeps one stable geometry while scrolling.
   ========================================================= */

@media (min-width:1281px){
  /* Stop the header visibly shrinking/moving on scroll. */
  .header,
  .header.header-scrolled{
    height:80px!important;
    gap:14px!important;
    padding-left:clamp(20px,2vw,36px)!important;
    padding-right:clamp(20px,2vw,36px)!important;
    background:linear-gradient(180deg,rgba(7,7,9,.955),rgba(7,7,9,.86))!important;
    box-shadow:0 14px 40px rgba(0,0,0,.24),inset 0 -1px rgba(235,43,43,.04)!important;
    transition:background .18s ease,box-shadow .18s ease!important;
  }
  .header:after,
  .header.header-scrolled:after{
    left:clamp(20px,2vw,36px)!important;
    right:clamp(20px,2vw,36px)!important;
  }
  .header .logo-wrap,
  .header.header-scrolled .logo-wrap{
    width:96px!important;
    height:54px!important;
    flex:0 0 96px!important;
  }

  /* Let the destination cluster breathe. v7.7.1 was intentionally too compressed. */
  .header .primary-nav{
    flex:1 1 auto!important;
    justify-content:flex-start!important;
    gap:clamp(8px,.58vw,12px)!important;
    min-width:0!important;
  }
  .header .primary-nav>.nav-primary-link,
  .header .nav-menu-toggle,
  .header.header-scrolled .primary-nav>.nav-primary-link,
  .header.header-scrolled .nav-menu-toggle{
    min-height:36px!important;
    padding-left:5px!important;
    padding-right:5px!important;
    font-size:10.9px!important;
    letter-spacing:.18px!important;
    white-space:nowrap!important;
  }
  .header .nav-menu-toggle{gap:3px!important}
  .header .nav-menu-toggle svg{width:8px!important;height:8px!important}

  .header .primary-nav>a[href="vote.html"],
  .header .primary-nav>.nav-donor-link,
  .header.header-scrolled .primary-nav>a[href="vote.html"],
  .header.header-scrolled .primary-nav>.nav-donor-link{
    min-height:34px!important;
    padding-left:10px!important;
    padding-right:10px!important;
  }

  /* Promoted destinations are visible on genuinely wide desktop. */
  .header .nav-wide-direct{display:inline-flex!important}

  /* Promoted pages remain in their logical dropdowns as well.
     Top-level visibility improves discovery; dropdown copies preserve context and responsive access. */

  /* Right utility cluster stays compact so the centre can actually use the space. */
  .header-account-mount{
    flex:0 0 auto!important;
    gap:6px!important;
    margin-left:auto!important;
    padding-left:10px!important;
  }
  .portal-staff-hq-shortcut{
    height:40px!important;
    min-width:70px!important;
    padding:0 10px!important;
    font-size:10px!important;
  }
  .portal-theme-toggle,
  .portal-notification-button{
    width:38px!important;
    height:38px!important;
    min-width:38px!important;
  }
  .portal-account-button{
    height:40px!important;
    min-width:114px!important;
    max-width:132px!important;
    padding-left:5px!important;
    padding-right:7px!important;
    gap:7px!important;
  }
  .portal-account-button img,
  .portal-account-button .portal-avatar-fallback{
    width:30px!important;
    height:30px!important;
    flex-basis:30px!important;
  }
  .portal-account-copy>strong{max-width:62px!important;font-size:10.5px!important}
  .portal-role{font-size:9.5px!important}

  /* CHAT keeps its green live status but drops the wasted "LIVE" word. */
  .portal-chat-shortcut{
    height:38px!important;
    min-width:64px!important;
    padding:0 9px!important;
    gap:6px!important;
  }
  .portal-chat-shortcut span{
    display:inline!important;
    font-size:9.6px!important;
    letter-spacing:.36px!important;
  }
  .portal-chat-shortcut svg{width:15px!important;height:15px!important}
  .portal-chat-shortcut i{
    display:block!important;
    width:6px!important;
    height:6px!important;
    border-radius:50%!important;
    background:#4df58b!important;
    box-shadow:0 0 8px rgba(77,245,139,.75)!important;
  }

  /* User-supplied ST7D Discord emblem: icon-only but deliberately distinctive. */
  .portal-discord-shortcut{
    position:relative!important;
    width:42px!important;
    height:42px!important;
    min-width:42px!important;
    padding:0!important;
    display:grid!important;
    place-items:center!important;
    border-radius:11px!important;
    overflow:visible!important;
    border:1px solid rgba(126,136,255,.42)!important;
    background:
      radial-gradient(circle at 50% 45%,rgba(104,115,255,.18),rgba(22,22,31,.80) 64%,rgba(10,10,13,.96))!important;
    box-shadow:0 0 0 1px rgba(88,101,242,.06),0 0 16px rgba(88,101,242,.14)!important;
  }
  .portal-discord-shortcut span,
  .portal-discord-shortcut svg{display:none!important}
  .portal-discord-shortcut .portal-discord-mark{
    display:block!important;
    width:32px!important;
    height:32px!important;
    object-fit:contain!important;
    filter:drop-shadow(0 0 5px rgba(255,50,50,.20)) drop-shadow(0 0 5px rgba(106,116,255,.18));
    transform:translateZ(0);
  }
  .portal-discord-shortcut:after{
    content:""!important;
    position:absolute!important;
    right:3px!important;
    top:3px!important;
    width:5px!important;
    height:5px!important;
    border-radius:50%!important;
    background:#8e98ff!important;
    box-shadow:0 0 8px rgba(142,152,255,.95)!important;
  }
  .portal-discord-shortcut:hover,
  .portal-discord-shortcut:focus-visible{
    border-color:rgba(142,152,255,.78)!important;
    box-shadow:0 0 0 1px rgba(88,101,242,.14),0 0 22px rgba(88,101,242,.28)!important;
  }
  .portal-discord-shortcut:hover .portal-discord-mark,
  .portal-discord-shortcut:focus-visible .portal-discord-mark{
    transform:scale(1.06)!important;
  }

  /* The new direct links should read as normal navigation, not extra action buttons. */
  .header .nav-progression-link,
  .header .nav-achievements-link,
  .header .nav-profiles-link,
  .header .nav-gallery-link{color:#c7c1bd!important}
  .header .nav-progression-link.active-nav,
  .header .nav-achievements-link.active-nav,
  .header .nav-profiles-link.active-nav,
  .header .nav-gallery-link.active-nav{color:#fff!important}
}

/* 1600+ gets the full discovery bar. */
@media (min-width:1600px){
  .header .primary-nav{gap:clamp(9px,.62vw,13px)!important}
  .header .primary-nav>.nav-primary-link,
  .header .nav-menu-toggle{font-size:11.05px!important}
}

/* Medium desktop still keeps the important direct links, but gives back the two widest extras. */
@media (min-width:1450px) and (max-width:1599px){
  .header{gap:10px!important;padding-left:14px!important;padding-right:14px!important}
  .header .logo-wrap,.header.header-scrolled .logo-wrap{width:88px!important;flex-basis:88px!important}
  .header .primary-nav{gap:5px!important}
  .header .primary-nav>.nav-primary-link,.header .nav-menu-toggle{font-size:10.1px!important;padding-left:3px!important;padding-right:3px!important}
  .header .nav-gallery-link,
  .header .nav-achievements-link{display:none!important}
  .portal-staff-hq-full{display:none!important}
  .portal-staff-hq-short{display:inline!important}
  .portal-staff-hq-shortcut{min-width:46px!important}
}

/* Narrow desktop falls back to the dropdown copies rather than squeezing labels into dust. */
@media (min-width:1281px) and (max-width:1449px){
  .header{gap:8px!important;padding-left:10px!important;padding-right:10px!important}
  .header .logo-wrap,.header.header-scrolled .logo-wrap{width:80px!important;flex-basis:80px!important}
  .header .primary-nav{gap:3px!important}
  .header .primary-nav>.nav-primary-link,.header .nav-menu-toggle{font-size:9.8px!important;padding-left:2px!important;padding-right:2px!important}
  .header .nav-progression-link,
  .header .nav-achievements-link,
  .header .nav-profiles-link,
  .header .nav-gallery-link{display:none!important}
  .portal-staff-hq-full{display:none!important}
  .portal-staff-hq-short{display:inline!important}
  .portal-staff-hq-shortcut{min-width:44px!important;padding:0 7px!important}
  .portal-account-button{min-width:98px!important;max-width:108px!important}
  .portal-account-copy>strong{max-width:46px!important}
  .portal-chat-shortcut{min-width:58px!important;padding:0 7px!important}
}

/* Mobile keeps the established hamburger hierarchy; promoted desktop items stay inside their menus. */
@media (max-width:1280px){
  .header .nav-wide-direct{display:none!important}
  .portal-chat-shortcut span{font-size:0!important}
  .portal-chat-shortcut span:after{content:"Chat";font-size:10px}
  .portal-discord-shortcut span,.portal-discord-shortcut svg{display:none!important}
  .portal-discord-shortcut .portal-discord-mark{display:block!important;width:30px!important;height:30px!important;object-fit:contain!important}
}

/* Light theme keeps the custom emblem legible. */
html[data-site-theme="light"] .portal-discord-shortcut{
  background:radial-gradient(circle at 50% 45%,rgba(88,101,242,.12),rgba(248,248,255,.98) 70%)!important;
  border-color:rgba(88,101,242,.34)!important;
}