/* Canonical site-wide navigation styling. */
.skip-link {
  position: fixed;
  top: .5rem;
  left: .5rem;
  z-index: 2000;
  padding: .7rem 1rem;
  border: 2px solid #fff;
  border-radius: .65rem;
  color: #06111f;
  background: var(--cyan, #31e6ff);
  font-family: var(--heading-font, sans-serif);
  font-weight: 900;
  text-decoration: none;
  box-shadow: 0 0 0 4px rgba(3, 9, 24, .9), 0 0 22px rgba(49, 230, 255, .65);
  transform: translateY(-160%);
  transition: transform .18s ease;
}

.skip-link:focus,
.skip-link:focus-visible {
  color: #06111f;
  outline: none;
  transform: translateY(0);
}

:where(a, button, input, select, textarea, [tabindex]):focus-visible {
  outline: 3px solid var(--cyan, #31e6ff);
  outline-offset: 3px;
}

#main-content:focus { outline: none; }

.navbar {
  background: rgba(3, 9, 24, .92) !important;
  border-bottom: 1px solid rgba(49, 230, 255, .26);
  box-shadow: 0 12px 30px rgba(0, 0, 0, .32), 0 0 24px rgba(49, 230, 255, .07);
  backdrop-filter: blur(14px);
}

.brand-lockup {
  display: inline-flex;
  align-items: center;
  gap: .48rem;
  letter-spacing: .02em;
  text-transform: uppercase;
}

.brand-lockup img { filter: drop-shadow(0 0 7px rgba(49, 230, 255, .8)); }
.brand-lockup em { color: var(--cyan); font-style: normal; text-shadow: 0 0 11px rgba(49, 230, 255, .72); }

.navbar .nav-link {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  border-radius: .72rem;
  color: #d9e8fb;
  font-family: var(--heading-font);
  font-weight: 650;
  transition: color .18s ease, text-shadow .18s ease, filter .18s ease, transform .18s ease;
}

.navbar .nav-link::after {
  content: "";
  position: absolute;
  right: .5rem;
  bottom: .2rem;
  left: .5rem;
  height: 2px;
  background: linear-gradient(90deg, var(--cyan), var(--violet));
  transform: scaleX(0);
  transition: transform .2s ease;
}

.navbar .nav-link::before {
  content: "";
  position: absolute;
  inset: -.4rem -.65rem;
  z-index: -1;
  opacity: 0;
  border-radius: inherit;
  background:
    radial-gradient(circle at 22% 50%, rgba(49, 230, 255, .75), transparent 34%),
    radial-gradient(circle at 78% 50%, rgba(255, 90, 185, .72), transparent 34%),
    linear-gradient(90deg, rgba(49, 230, 255, .18), rgba(155, 131, 255, .2), rgba(255, 90, 185, .18));
  filter: blur(.4px) saturate(1.35);
  transform: scaleX(.2) translateY(8px);
  transition: opacity .18s ease, transform .18s ease;
}

.navbar .nav-link:hover,
.navbar .nav-link:focus-visible,
.navbar .nav-link.active,
.navbar .nav-link.nav-link--flare-click {
  color: #fff !important;
  text-shadow: 0 0 5px #fff, 0 0 13px rgba(49, 230, 255, .9), 0 0 24px rgba(255, 90, 185, .66);
  filter: saturate(1.22) brightness(1.12);
  transform: translateY(-1px);
}

.navbar .nav-link:hover::before,
.navbar .nav-link:focus-visible::before,
.navbar .nav-link.active::before,
.navbar .nav-link.nav-link--flare-click::before {
  opacity: 1;
  transform: scaleX(1) translateY(0);
}

.navbar .nav-link:hover::after,
.navbar .nav-link:focus-visible::after,
.navbar .nav-link.active::after { transform: scaleX(1); }

.navbar-toggler {
  border-color: rgba(49, 230, 255, .55);
  box-shadow: 0 5px 0 rgba(0, 83, 111, .75), 0 0 14px rgba(49, 230, 255, .2);
}
.navbar-toggler:focus { box-shadow: 0 0 0 .2rem rgba(49, 230, 255, .28); }

.shynetyme-build-menu,
.shynetyme-language-menu { position: relative; }

.shynetyme-build-menu > .nav-link,
.shynetyme-language-menu > .nav-link {
  display: inline-flex;
  align-items: center;
  gap: .35rem;
  border: 0;
  background: transparent;
}

.shynetyme-build-menu .dropdown-menu,
.shynetyme-language-menu .dropdown-menu {
  min-width: 13.5rem;
  margin-top: .55rem;
  padding: .48rem;
  overflow: hidden;
  border: 1px solid rgba(49, 230, 255, .46);
  border-radius: .85rem;
  background: radial-gradient(circle at 15% 10%, rgba(49, 230, 255, .12), transparent 9rem), linear-gradient(155deg, rgba(6, 21, 47, .99), rgba(18, 12, 48, .99));
  box-shadow: 0 18px 38px rgba(0, 0, 0, .48), 0 0 20px rgba(49, 230, 255, .14), inset 0 1px 0 rgba(255, 255, 255, .08);
}

.shynetyme-language-menu .dropdown-menu { min-width: 10.5rem; }

.shynetyme-build-menu .dropdown-item,
.shynetyme-language-menu .dropdown-item {
  position: relative;
  padding: .72rem .82rem;
  border-radius: .62rem;
  color: #dcecff;
  font-family: var(--heading-font);
  font-weight: 750;
  letter-spacing: .015em;
  transition: color .18s ease, background-color .18s ease, transform .18s ease, text-shadow .18s ease;
}

.shynetyme-build-menu li + li .dropdown-item,
.shynetyme-language-menu li + li .dropdown-item { margin-top: .18rem; }

.shynetyme-build-menu .dropdown-item:hover,
.shynetyme-build-menu .dropdown-item:focus,
.shynetyme-build-menu .dropdown-item.active,
.shynetyme-language-menu .dropdown-item:hover,
.shynetyme-language-menu .dropdown-item:focus,
.shynetyme-language-menu .dropdown-item.active {
  color: #fff;
  background: linear-gradient(90deg, rgba(49, 230, 255, .2), rgba(155, 131, 255, .24));
  text-shadow: 0 0 12px rgba(49, 230, 255, .72);
  transform: translateX(3px);
}

.shynetyme-build-menu .dropdown-item.active,
.shynetyme-language-menu .dropdown-item.active { box-shadow: inset 3px 0 0 var(--cyan); }

.nav-link--flare-click { animation: shynetyme-nav-flare .56s ease-out both; }
.nav-link--flare-click::after { animation: shynetyme-nav-line-flare .56s ease-out both !important; }
.dropdown-item.nav-link--flare-click { animation: shynetyme-dropdown-flare .56s ease-out both; }

@keyframes shynetyme-nav-flare {
  0% { color: #fff; text-shadow: 0 0 0 rgba(49, 230, 255, 0); filter: brightness(1); }
  38% { color: #fff; text-shadow: 0 0 8px #fff, 0 0 18px rgba(49, 230, 255, .95), 0 0 28px rgba(155, 131, 255, .72); filter: brightness(1.28); }
  100% { filter: brightness(1); }
}
@keyframes shynetyme-nav-line-flare {
  0% { transform: scaleX(0); opacity: .2; }
  45% { transform: scaleX(1.22); opacity: 1; box-shadow: 0 0 14px var(--cyan); }
  100% { transform: scaleX(1); opacity: .85; box-shadow: 0 0 0 transparent; }
}
@keyframes shynetyme-dropdown-flare {
  0% { transform: translateX(0); filter: brightness(1); }
  42% { transform: translateX(5px); filter: brightness(1.3); box-shadow: 0 0 16px rgba(49, 230, 255, .28); }
  100% { transform: translateX(3px); filter: brightness(1); }
}

@media (prefers-reduced-motion: reduce) {
  .skip-link,
  .navbar .nav-link,
  .navbar .nav-link::before,
  .navbar .nav-link::after,
  .dropdown-item {
    animation: none !important;
    transition: none !important;
  }
}

@media (max-width: 991.98px) {
  .navbar-collapse { padding: .7rem 0 1rem; }
  .navbar .nav-link { padding: .68rem .5rem; }
  .shynetyme-build-menu > .nav-link,
  .shynetyme-language-menu > .nav-link { width: 100%; justify-content: space-between; text-align: left; }
  .shynetyme-build-menu .dropdown-menu,
  .shynetyme-language-menu .dropdown-menu { margin: .25rem 0 .45rem .55rem; border-radius: .72rem; box-shadow: inset 0 0 18px rgba(49, 230, 255, .06); }
}