.mobile-swiper-trackbar,
.mobile-swiper-nav{display:none}

.mobile-swiper-count{
  font-family:'Inter',sans-serif;
  font-size:12px;
  color:var(--muted);
  letter-spacing:.03em;
}

.mobile-swiper-btns{display:flex;align-items:center;gap:8px}

.mobile-swiper-btn{
  display:inline-flex;
  align-items:center;
  gap:6px;
  min-height:38px;
  padding:0 12px;
  border-radius:10px;
  border:1px solid var(--bdr);
  background:var(--card-bg);
  color:var(--head);
  font-size:12px;
  font-weight:600;
  transition:border-color .2s ease,transform .2s ease,background .2s ease;
}

.mobile-swiper-btn:hover{transform:translateY(-1px);border-color:color-mix(in srgb,var(--pri) 25%,var(--bdr))}
.mobile-swiper-btn:disabled{opacity:.45;cursor:not-allowed;transform:none}

@media (max-width:760px){
  .mobile-swiper-track{
    display:flex !important;
    gap:14px;
    overflow-x:auto;
    scroll-snap-type:x mandatory;
    -webkit-overflow-scrolling:touch;
    scrollbar-width:none;
  }

  .mobile-swiper-track::-webkit-scrollbar{display:none}

  .mobile-swiper-track > [data-swiper-card]{
    flex:0 0 100%;
    min-width:100%;
    scroll-snap-align:start;
    min-height:100%;
  }

  .mobile-swiper-trackbar{
    display:flex;
    height:4px;
    border-radius:999px;
    background:var(--bdr);
    overflow:hidden;
    margin-top:10px;
  }

  .mobile-swiper-fill{
    width:0;
    height:100%;
    background:var(--pri);
    transition:width .25s ease;
  }

  .mobile-swiper-nav{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:12px;
    margin-top:10px;
  }
}
