.awb-comment-ticker {
  width: 100%;
  overflow: hidden;
  background: #ffffff;
  border-top: 1px solid #ddd;
  border-bottom: 1px solid #ddd;
  padding: 10px 0;
  box-sizing: border-box;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial;
}

.awb-comment-track-wrap {
  display: flex;
  align-items: center;
  white-space: nowrap;
  /* duration will be applied via inline style from JS for better responsiveness */
}

.awb-comment-track {
  display: inline-flex;
  align-items: center;
  gap: 48px;
  /* allow the two tracks to flow inline */
}

.awb-comment-item {
  display: inline-block;
  text-decoration: none;
  color: #000;
  font-style: normal;
  font-size: 15px;
  line-height: 1.2;
  opacity: 0.95;
}

.awb-comment-item:hover {
  text-decoration: underline;
  opacity: 1;
}

.awb-comment-author {
  font-weight: 600;
  margin-left: 8px;
  font-size: 13px;
  color: #333;
}

/* Animation: we'll animate the wrapper by translating it to the left */
.awb-scrolling {
  display: inline-block;
  animation-name: awb-scroll;
  animation-timing-function: linear;
  animation-iteration-count: infinite;
}

.awb-paused {
  animation-play-state: paused !important;
}

/* keyframes defined but actual duration set inline */
@keyframes awb-scroll {
  0% { transform: translateX(0); }
  100% { transform: translateX(-50%); } /* move left by half (one track width) */
}

/* Responsive adjustments */
@media (max-width: 600px) {
  .awb-comment-item { font-size: 14px; }
}
