.yiang-carousel { touch-action: pan-y pinch-zoom; }
.yiang-carousel-multiple { cursor: grab; }
.yiang-carousel.is-dragging { cursor: grabbing; user-select: none; }
.yiang-carousel img { -webkit-user-drag: none; }
.yiang-carousel-dots { display: flex; align-items: center; gap: 0; padding: 1px 4px; border: 1px solid transparent; border-radius: 999px; background: transparent; box-shadow: none; max-width: min(320px, calc(100% - 40px)); flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; cursor: default; touch-action: pan-x; }
.yiang-carousel-dots::-webkit-scrollbar { display: none; }
.yiang-carousel-dots[hidden] { display: none !important; }
.yiang-carousel-dot { position: relative; flex: 0 0 28px; width: 28px; height: 32px; padding: 0; border: 0; border-radius: 50%; background: transparent; display: grid; place-items: center; cursor: pointer; }
.yiang-carousel-dot[hidden] { display: none !important; }
.yiang-carousel-dot::before { content: ""; display: block; width: 8px; height: 8px; border-radius: 50%; background: rgba(255,255,255,.88); box-shadow: 0 0 1px rgba(7,31,66,.65), 0 1px 3px rgba(7,31,66,.3); transition: background .18s ease, box-shadow .18s ease; }
.yiang-carousel-dot.is-active::before { background: #ff7a18; }
.yiang-carousel-dot:not(.is-active):hover::before { background: #fff; }
.yiang-carousel-dot:focus-visible { outline: 2px solid #fff; outline-offset: -3px; }
[data-storefront-interactions] .yiang-carousel .yiang-carousel-dots .yiang-carousel-dot:is(:hover, :active) { border-color: transparent; background: transparent; box-shadow: none; transform: none !important; }
.campaign-carousel .yiang-carousel-dots,.product-visual > .yiang-carousel-dots { position: absolute; right: 20px; bottom: 20px; z-index: 3; }
.campaign-carousel .campaign-slide a { display: block; width: 100%; height: 100%; }
.campaign-carousel.is-dragging .campaign-slide.is-active { transform: translateX(var(--carousel-drag-x,0)); transition: none; }
@media(max-width:767px) { .yiang-carousel-dot { width: 44px; height: 44px; flex-basis: 44px; } .yiang-carousel-dots { max-width: min(320px, calc(100% - 24px)); } .campaign-carousel .yiang-carousel-dots,.product-visual > .yiang-carousel-dots { right: 12px; bottom: 12px; } }
@media(prefers-reduced-motion:reduce) { .yiang-carousel-dot::before,.yiang-carousel .campaign-slide { transition: none !important; } }