.ml-opsn-nav,
.ml-opsn-nav * {
  box-sizing: border-box;
}

.ml-opsn-nav {
  position: fixed;
  top: var(--ml-opsn-top, 50%);
  z-index: var(--ml-opsn-z, 9999);
  transform: translateY(-50%);
  line-height: 1;
  pointer-events: none;
}

.ml-opsn-left {
  left: var(--ml-opsn-side-offset, 18px);
}

.ml-opsn-right {
  right: var(--ml-opsn-side-offset, 18px);
}

.ml-opsn-list {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: var(--ml-opsn-gap, 42px);
  width: max(var(--ml-opsn-dot, 7px), var(--ml-opsn-active-w, 6px));
  margin: 0;
  padding: 0;
  list-style: none;
  pointer-events: auto;
}

.ml-opsn-list-item {
  display: flex;
  align-items: center;
  justify-content: center;
  width: max(var(--ml-opsn-dot, 7px), var(--ml-opsn-active-w, 6px));
  min-height: var(--ml-opsn-dot, 7px);
  margin: 0;
  padding: 0;
}

.ml-opsn-link {
  display: block;
  width: var(--ml-opsn-dot, 7px);
  height: var(--ml-opsn-dot, 7px);
  min-width: var(--ml-opsn-dot, 7px);
  min-height: var(--ml-opsn-dot, 7px);
  border: 0;
  border-radius: 999px;
  background: var(--ml-opsn-inactive, #d7d7d7);
  box-shadow: none;
  outline: none;
  text-decoration: none;
  transform-origin: center center;
  transition: width .22s ease, height .22s ease, background-color .22s ease, opacity .22s ease;
}

.ml-opsn-link:hover,
.ml-opsn-link:focus-visible {
  background: var(--ml-opsn-hover, #ffffff);
}

.ml-opsn-link.is-active {
  width: var(--ml-opsn-active-w, 6px);
  height: var(--ml-opsn-active-h, 46px);
  min-width: var(--ml-opsn-active-w, 6px);
  min-height: var(--ml-opsn-active-h, 46px);
  background: var(--ml-opsn-active, #12b7ff);
}

.ml-opsn-link:focus-visible {
  outline: 2px solid currentColor;
  outline-offset: 4px;
}

.ml-opsn-link .screen-reader-text {
  border: 0;
  clip: rect(1px, 1px, 1px, 1px);
  clip-path: inset(50%);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  width: 1px;
  word-wrap: normal !important;
}

@media (max-width: 500px) {
  .ml-opsn-mobile-hide {
    display: none !important;
  }
}
