/* 弹幕区域：高度 200px，背景透明 */
.barrage-container {
  position: relative;
  width: 100%;
  height: 200px;             /* 高度调整为 200px */
  background-color: transparent; /* 背景设为透明 */
  overflow: hidden;          /* 隐藏超出边界的弹幕 */
}

/* 单条弹幕样式 */
.barrage-item {
  position: absolute;
  left: 100%;            /* 初始位置在屏幕最右侧之外 */
  white-space: nowrap;   /* 确保文字不换行 */
  color: #fff;           /* 弹幕文字颜色 */
  font-size: 18px;       /* 稍微缩小字号以适应 200px 高度 */
  font-family: sans-serif;
  font-weight: bold;
  
  /* 重点：因为背景透明，强烈的描边/阴影能防止文字在复杂背景下看不清 */
  text-shadow: 1px 1px 2px #000, -1px -1px 2px #000, 1px -1px 2px #000, -1px 1px 2px #000; 
  
  /* 绑定动画：持续 7 秒（可自行调整速度），线性匀速，无限循环 */
  animation: moveBarrage 7s linear infinite;
}

/* 弹幕从右向左滚动的动画 */
@keyframes moveBarrage {
  0% {
    left: 100%;
    transform: translateX(0);
  }
  100% {
    left: 0;
    transform: translateX(-100%);
  }
}