.carousel-container {
  width: 324px;
  overflow: visible; /* changed from hidden to visible */
  position: relative;
  margin: 0 auto 32px auto;
}

.carousel-track-wrapper {
  overflow: hidden; /* hides overflow of the carousel */
  width: 324px;
}

.carousel-track {
  display: flex;
  transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1);
  will-change: transform;
}

.carousel-tile {
  width: 75px;
  flex: 0 0 75px;
  margin: 0 2px;
  text-align: center;
}

.carousel-tile img {
  width: 70px;
  height: 70px;
  -o-object-fit: contain;
     object-fit: contain;
  border-radius: 8px;
  display: block;
  margin: 0 auto 4px auto;
}

.carousel-title {
  font-size: 11px;
  margin-top: 2px;
}

.carousel-btn {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 22px; /* smaller width */
  height: 36px; /* smaller height */
  background: rgba(128, 128, 128, 0.4); /* transparent gray */
  border: none;
  cursor: pointer;
  z-index: 2;
  font-size: 18px; /* smaller icon */
  color: #fff; /* white icon */
  border-radius: 6px;
  transition: background 0.2s;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.12);
  display: flex;
  align-items: center;
  justify-content: center;
}

.carousel-btn.left {
  left: -28px;
} /* adjust for new size */
.carousel-btn.right {
  right: -28px;
}

.carousel-btn:active {
  background: rgba(128, 128, 128, 0.35);
}/*# sourceMappingURL=channel-carousel.css.map */