/* 通用轮播：自动播放 + 手指拖动 + 循环 */
.carousel{
  position:relative;overflow:hidden;border-radius:var(--radius-lg,#22px);
  background:#0d1526;touch-action:pan-y;user-select:none;-webkit-user-select:none;
}
.carousel-track{display:flex;will-change:transform;transform:translate3d(0,0,0)}
.carousel-track.anim{transition:transform .52s cubic-bezier(.22,.61,.36,1)}
.carousel-slide{flex:0 0 100%;min-width:100%;position:relative}

/* 圆点 */
.carousel-dots{
  position:absolute;left:0;right:0;bottom:16px;display:flex;justify-content:center;gap:8px;z-index:3;
}
.carousel-dots button{
  width:8px;height:8px;padding:0;border:0;border-radius:50%;cursor:pointer;
  background:rgba(255,255,255,.38);transition:width .25s var(--ease,ease),background .25s;
}
.carousel-dots button.on{width:22px;border-radius:5px;background:#fff}

/* 左右箭头 */
.carousel-arrow{
  position:absolute;top:50%;transform:translateY(-50%);z-index:3;
  width:38px;height:38px;border-radius:50%;border:1px solid rgba(255,255,255,.28);
  background:rgba(7,13,27,.35);color:#fff;display:flex;align-items:center;justify-content:center;
  cursor:pointer;opacity:0;transition:opacity .25s,background .25s;
  backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);
}
.carousel:hover .carousel-arrow,.carousel:focus-within .carousel-arrow{opacity:1}
.carousel-arrow:hover{background:rgba(7,13,27,.62)}
.carousel-arrow svg{width:17px;height:17px}
.carousel-arrow.prev{left:12px}
.carousel-arrow.next{right:12px}

/* 进度条（自动播放时显示） */
.carousel-progress{
  position:absolute;left:0;bottom:0;height:2px;width:100%;
  background:rgba(255,255,255,.14);overflow:hidden;z-index:3;
}
.carousel-progress i{
  display:block;height:100%;width:0;background:linear-gradient(90deg,#2f5cff,#00d9c0);
}
.carousel.playing .carousel-progress i{animation:cbar 4.8s linear forwards}
@keyframes cbar{from{width:0}to{width:100%}}
.carousel.paused .carousel-progress{opacity:0}

@media (hover:none){
  .carousel-arrow{display:none}
}
@media (max-width:600px){
  .carousel-dots{bottom:12px}
  .carousel-dots button{width:7px;height:7px}
}
@media (prefers-reduced-motion:reduce){
  .carousel-track.anim{transition:none}
  .carousel.playing .carousel-progress i{animation:none}
}