#features:has(> [data-manufacturer-scene^="xiaomi-smart-band-11__"]),
.ndovu-manufacturer-preview #features:has(> [data-manufacturer-scene^="xiaomi-smart-band-11__"]) {
  display: block;
  gap: 0;
  padding-inline: 0;
}

[data-manufacturer-scene^="xiaomi-smart-band-11__"] {
  margin: 0;
}

[data-manufacturer-scene^="xiaomi-smart-band-11__"] > .ndovu-canvas-mobile {
  display: none !important;
}

@media (width < 768px) {
  [data-manufacturer-scene^="xiaomi-smart-band-11__"] > .ndovu-canvas-desktop {
    display: none !important;
  }

  [data-manufacturer-scene^="xiaomi-smart-band-11__"] > .ndovu-canvas-mobile:not(:empty) {
    display: block !important;
  }
}

.ndovu-band11 {
  container-type: inline-size;
  width: 100%;
  color: #191919;
  background: #f5f5f5;
  font: 400 16px/1.2 'Band 11 MiSans', sans-serif;
}

.ndovu-band11 .overview-con > .band11-screen {
  max-width: 100%;
}

.ndovu-band11 img {
  display: block;
  margin: 0;
  border-radius: 0;
}

.ndovu-band11 .band11-heading {
  margin-block-end: 0;
  font-family: inherit;
  letter-spacing: normal;
}

.ndovu-band11 .band11-hidden-heading {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
}

.ndovu-band11 [data-band11-carousel] {
  position: relative;
  transform: none !important;
}

.ndovu-band11 [data-band11-viewport] {
  width: 100%;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  scrollbar-width: none;
  scroll-snap-type: x mandatory;
  overscroll-behavior-inline: contain;
  transform: none !important;
  padding: 0 !important;
}

.ndovu-band11 .band11-track {
  display: flex !important;
  width: 100% !important;
  height: 100%;
  margin: 0;
  overflow: visible !important;
  transform: none !important;
}

.ndovu-band11 .band11-slide {
  display: block !important;
  flex: 0 0 var(--band11-card-width, 100%) !important;
  width: var(--band11-card-width, 100%) !important;
  min-width: 0;
  height: 100%;
  scroll-snap-align: start;
}

.ndovu-band11 [data-band11-section="watch-faces"] .band11-track {
  gap: 1.1cqw;
}

.ndovu-band11 [data-band11-section="watch-faces"] .band11-slide {
  --band11-card-width: 10cqw;
}

.ndovu-band11--mobile [data-band11-section="watch-faces"] .band11-slide {
  --band11-card-width: 15cqw;
}

.ndovu-band11 [data-band11-carousel="fade"] [data-band11-viewport] {
  overflow: hidden !important;
  touch-action: pan-y;
}

.ndovu-band11 [data-band11-carousel="fade"] .band11-track {
  display: grid !important;
}

.ndovu-band11 [data-band11-carousel="fade"] .band11-slide {
  grid-area: 1 / 1;
  width: 100%;
}

.ndovu-band11 .band11-slide[hidden] {
  display: none !important;
}

.ndovu-band11 .band11-controls {
  position: absolute;
  z-index: 10;
  inset-inline-end: max(12px, 3cqw);
  inset-block-end: max(8px, 1cqw);
  display: flex;
  gap: 7px;
}

.ndovu-band11 .band11-controls button {
  display: grid;
  flex: 0 0 44px;
  width: 44px;
  height: 44px;
  min-height: 44px;
  padding: 0;
  margin: 0;
  place-items: center;
  border: 1px solid rgb(20 20 20 / 18%);
  border-radius: 50%;
  color: #191919;
  background: rgb(255 255 255 / 76%);
  backdrop-filter: blur(10px);
  cursor: pointer;
}

.ndovu-band11 .band11-controls button:hover { background: #fff; }
.ndovu-band11 .band11-controls button:focus-visible { outline: 2px solid #191919; outline-offset: 2px; }
.ndovu-band11 .band11-controls button:disabled { opacity: .35; cursor: default; }

.ndovu-band11 .band11-controls span {
  position: relative;
  display: grid;
  width: 20px;
  height: 20px;
  place-items: center;
}

.ndovu-band11 .band11-controls span::before {
  content: '';
  box-sizing: border-box;
}

.ndovu-band11 [data-band11-step] span::before {
  width: 8px;
  height: 8px;
  border: solid currentColor;
  border-width: 2px 2px 0 0;
  transform: translateX(-2px) rotate(45deg);
}

.ndovu-band11 [data-band11-step="-1"] span::before { transform: translateX(2px) rotate(-135deg); }
.ndovu-band11 [data-band11-play] span::before {
  border: 6px solid transparent;
  border-left: 9px solid currentColor;
  transform: translateX(4px);
}

.ndovu-band11 [data-band11-play][aria-pressed="true"] span::before {
  width: 9px;
  height: 12px;
  border: solid currentColor;
  border-width: 0 3px;
  transform: none;
}

@media (width < 768px) {
  .ndovu-band11 .band11-controls { inset-inline-end: 12px; }
  .ndovu-band11 [data-band11-section="watch-faces"] [data-band11-carousel] {
    width: 100cqw !important;
    inset-inline-start: -6.4cqw !important;
  }
}
