/* MHQ Network chrome v1 — shared page accent, progress bar, active nav and back-to-top. */

/* One accent vocabulary for the whole network. */
body{
  --network-accent:#00bdf2;
  --network-accent-soft:#55d9ff;
  --network-accent-ink:#071318;
}
body[data-theme="mhq"]{--network-accent:#00bdf2;--network-accent-soft:#55d9ff;--network-accent-ink:#071318;}
body[data-theme="mrhoid"]{--network-accent:#ffb70a;--network-accent-soft:#ffd05c;--network-accent-ink:#171006;}
body[data-theme="snackalot"]{--network-accent:#0588ff;--network-accent-soft:#45a9ff;--network-accent-ink:#061321;}
body[data-theme="melody"]{--network-accent:#d9789c;--network-accent-soft:#f1a8c0;--network-accent-ink:#1a0c12;}
body[data-theme="minecraft"]{--network-accent:#35c785;--network-accent-soft:#7fe6ac;--network-accent-ink:#06160f;}
body[data-theme="coaching"]{--network-accent:#9b6cff;--network-accent-soft:#cbb8ff;--network-accent-ink:#10091c;}
body.page-arcade{--network-accent:#ff886f;--network-accent-soft:#ffad9c;--network-accent-ink:#1b0b08;}
body.mlbb-data-site{--network-accent:#f0c46b;--network-accent-soft:#ffe19b;--network-accent-ink:#181107;}

/* Retire the older per-site progress/back-top visuals; shared JS supplies one of each. */
.site-scroll-progress,
.back-to-top,
#arcade-backtop,
.arcade-backtop{
  display:none!important;
}

.network-scroll-progress{
  position:fixed;
  z-index:250;
  top:0;
  left:0;
  width:100%;
  height:2px;
  pointer-events:none;
  transform:scaleX(var(--network-scroll-progress,0));
  transform-origin:left center;
  background:linear-gradient(90deg,var(--network-accent),var(--network-accent-soft));
  box-shadow:0 0 12px color-mix(in srgb,var(--network-accent) 54%,transparent);
  will-change:transform;
}

/* Current local page follows the page's own accent, not the generic Squad teal. */
.nh-bar:is([data-site="squad"],[data-site="lab"]) .nh-local-links a[aria-current="page"],
.nh-bar:is([data-site="squad"],[data-site="lab"]) .nh-menu nav a[aria-current="page"]{
  color:var(--network-accent)!important;
}

@media(min-width:900px){
  .nh-bar:is([data-site="squad"],[data-site="lab"]) .nh-local-links a[aria-current="page"]{
    background:color-mix(in srgb,var(--network-accent) 12%,#171b20)!important;
    border-color:color-mix(in srgb,var(--network-accent) 44%,#343b45)!important;
    box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--network-accent) 9%,transparent)!important;
  }
  /* The active pill itself is enough; do not draw an extra underline below it. */
  .nh-bar:is([data-site="squad"],[data-site="lab"]) .nh-local-links a[aria-current="page"]::after{
    display:none!important;
    content:none!important;
  }
}

/* Coaching remains the gold commercial CTA, but gets a page-accent focus ring when it is current. */
.nh-bar[data-site="squad"] .nh-local-links a[href="/coaching"][aria-current="page"],
.nh-bar[data-site="squad"] .nh-menu nav a[href="/coaching"][aria-current="page"]{
  box-shadow:0 0 0 2px color-mix(in srgb,var(--network-accent) 68%,transparent),0 5px 15px #0003!important;
}

/* One back-to-top control everywhere. */
.network-backtop{
  position:fixed;
  z-index:90;
  right:max(16px,env(safe-area-inset-right));
  bottom:max(18px,env(safe-area-inset-bottom));
  width:46px;
  height:46px;
  min-width:46px;
  min-height:46px;
  padding:0;
  display:grid;
  place-items:center;
  border:1px solid #414a55;
  border-top:2px solid var(--network-accent);
  border-radius:6px;
  background:#11161dF2;
  color:var(--network-accent-soft);
  box-shadow:0 12px 28px #0007;
  backdrop-filter:blur(10px);
  cursor:pointer;
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transform:translateY(8px);
  transition:opacity .16s ease,transform .16s ease,visibility .16s ease,background-color .16s ease,border-color .16s ease,color .16s ease;
}
.network-backtop.is-visible{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
  transform:translateY(0);
}
.network-backtop svg{
  width:21px;
  height:21px;
  fill:none;
  stroke:currentColor;
  stroke-width:2;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.network-backtop:is(:hover,:focus-visible){
  color:var(--network-accent-ink);
  background:var(--network-accent);
  border-color:var(--network-accent);
  transform:translateY(-2px);
}
.network-backtop:focus-visible{
  outline:2px solid var(--network-accent-soft);
  outline-offset:3px;
}

@media(max-width:720px){
  .network-backtop{
    right:max(12px,env(safe-area-inset-right));
    bottom:max(12px,env(safe-area-inset-bottom));
    width:44px;
    height:44px;
    min-width:44px;
    min-height:44px;
  }
  /* Keep the game viewport clear while typing/playing. */
  body.page-arcade[data-arcade-surface="room"] .network-backtop{display:none!important;}
}

@media(prefers-reduced-motion:reduce){
  .network-backtop{transition:none!important;}
}