/* A translucent frosted-gray selection pill, with no enclosing frame. */
@container (max-width: 600px) {
  .site-header .gooey-nav-container {
    position: relative;
    isolation: isolate;
  }
  .gooey-nav-container ul {
    position: relative;
    width: 100%;
    z-index: 2;
  }
  .gooey-nav-container li {
    position: relative;
    flex: 1;
    min-width: 0;
  }
  .site-header .gooey-nav-container a {
    justify-content: center;
    padding: 0 6px;
    min-height: 44px;
    font-size: clamp(13px, 3.4cqw, 15px);
    border-radius: 100vw;
    white-space: nowrap;
    -webkit-tap-highlight-color: transparent;
    transition: color 0.2s ease;
  }
  .site-header .gooey-nav-container a::after {
    display: none;
  }
  .site-header .gooey-nav-container a:focus-visible {
    outline-offset: 2px;
  }
  .site-header .gooey-nav-container.is-ready li.active a {
    color: #fff;
    text-shadow: 0 1px 3px #0003;
  }
  .site-header .gooey-nav-container .effect {
    position: absolute;
    left: 0;
    top: 0;
    width: 0;
    height: 0;
    opacity: 0;
    pointer-events: none;
    display: block;
    background: rgba(100, 104, 108, 0.42);
    border: 1px solid rgba(255, 255, 255, 0.24);
    -webkit-backdrop-filter: blur(16px) saturate(0.8);
    backdrop-filter: blur(16px) saturate(0.8);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.12);
    border-radius: 100vw;
    z-index: 1;
  }
  .site-header .gooey-nav-container.is-ready .effect {
    opacity: 1;
    transition:
      transform 0.25s ease,
      width 0.25s ease;
  }
}
@media (prefers-reduced-motion: reduce) {
  .gooey-nav-container .effect,
  .gooey-nav-container a {
    transition: none !important;
  }
}
html[data-reduce-motion] .gooey-nav-container .effect,
html[data-reduce-motion] .gooey-nav-container a {
  transition: none !important;
}