.mnb-bar {
  display: flex; align-items: center; gap: 14px; box-sizing: border-box;
  width: 100%; max-width: var(--mnb-max-width, 100%); margin: 0 auto;
  min-height: var(--mnb-min-height, 44px); padding: var(--mnb-padding-y, 8px) var(--mnb-padding-x, 16px);
  color: var(--mnb-color, #fff); background: var(--mnb-background, #173f35);
  border: var(--mnb-border-width, 0px) solid var(--mnb-border-color, transparent);
  border-radius: var(--mnb-radius, 0px); font-family: inherit;
  font-size: var(--mnb-font-size, 14px); font-weight: var(--mnb-font-weight, 500);
  line-height: 1.5; overflow: hidden; direction: ltr;
}
.mnb-bar *, .mnb-bar *::before, .mnb-bar *::after { box-sizing: border-box; }
.mnb-bar[hidden], .mnb-bar [hidden] { display: none !important; }
.mnb-bar .mnb-label {
  flex: 0 0 auto; max-width: 35%; padding: 4px 10px; border-radius: 4px;
  color: var(--mnb-label-color, #173f35); background: var(--mnb-label-background, #dff7a4);
  font-size: .8em; font-weight: 700; line-height: 1.5; overflow-wrap: anywhere;
}
.mnb-bar .mnb-viewport { flex: 1 1 auto; min-width: 0; overflow: hidden; }
.mnb-bar .mnb-track { display: flex; width: max-content; }
.mnb-bar .mnb-group { display: flex; flex: 0 0 auto; align-items: center; }
.mnb-bar .mnb-item { display: inline-flex; flex: 0 0 auto; align-items: center; gap: var(--mnb-gap, 36px); padding-right: var(--mnb-gap, 36px); white-space: nowrap; }
.mnb-bar .mnb-link { color: var(--mnb-link-color, #fff); text-decoration: none; font: inherit; }
.mnb-bar .mnb-link:hover { color: var(--mnb-link-color, #fff); text-decoration: underline; }
.mnb-bar .mnb-separator { color: var(--mnb-separator-color, #b4d891); font-size: .9em; }
.mnb-bar .mnb-controls { display: flex; align-items: center; flex: 0 0 auto; gap: 4px; }
.mnb-bar .mnb-controls:empty { display: none; }
.mnb-bar .mnb-control {
  display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto;
  min-width: 28px; min-height: 28px; padding: 2px 6px; border: 1px solid currentColor;
  border-radius: 4px; background: transparent; color: inherit; font: inherit;
  cursor: pointer; line-height: 1; opacity: .9; box-shadow: none;
}
.mnb-bar .mnb-control:hover { opacity: 1; background: rgb(127 127 127 / 15%); }
.mnb-bar .mnb-control:focus-visible, .mnb-bar .mnb-link:focus-visible { outline: 2px solid currentColor; outline-offset: -2px; }
.mnb-bar.mnb-ready .mnb-track { animation: mnb-scroll var(--mnb-duration, 20s) linear infinite; will-change: transform; }
.mnb-bar[data-direction="right"] .mnb-track { animation-direction: reverse; }
.mnb-bar.mnb-paused .mnb-track, .mnb-bar.mnb-link-focused .mnb-track,
.mnb-bar.mnb-hover-pause:hover .mnb-track { animation-play-state: paused; }
@keyframes mnb-scroll { from { transform: translateX(0); } to { transform: translateX(calc(-1 * var(--mnb-distance, 0px))); } }
/* Readable fallback before initialization, when JS is unavailable, or animation is disabled. */
.mnb-bar:not(.mnb-ready) .mnb-track { width: 100%; transform: none; }
.mnb-bar:not(.mnb-ready) .mnb-group { flex-wrap: wrap; gap: 8px 0; width: 100%; }
.mnb-bar:not(.mnb-ready) .mnb-item { flex-shrink: 1; white-space: normal; overflow-wrap: anywhere; max-width: 100%; }
.mnb-bar:not(.mnb-ready) .mnb-link, .mnb-bar:not(.mnb-ready) .mnb-text { min-width: 0; }
.mnb-bar:not(.mnb-ready) [data-mnb-clone] { display: none; }
@media (max-width: 767.98px) {
  .mnb-bar { font-size: var(--mnb-mobile-font-size, 13px); gap: 8px; }
  .mnb-bar.mnb-device-desktop { display: none; }
  .mnb-bar .mnb-label { max-width: 30%; padding: 4px 6px; }
}
@media (min-width: 768px) { .mnb-bar.mnb-device-mobile { display: none; } }
@media (prefers-reduced-motion: reduce) {
  .mnb-bar.mnb-ready .mnb-track { animation: none; transform: none; width: 100%; }
  .mnb-bar .mnb-group { flex-wrap: wrap; width: 100%; gap: 8px 0; }
  .mnb-bar .mnb-item { white-space: normal; flex-shrink: 1; max-width: 100%; overflow-wrap: anywhere; }
  .mnb-bar [data-mnb-clone], .mnb-bar .mnb-pause { display: none !important; }
}