/* Compact screenshot slider — [web_portfolio_small] — no chrome, progress only, hidden on small screens */

.tt-web-portfolio.tt-web-portfolio-small.tt-wps-bare {
  --ttwps-radius: 10px;
  max-width: min(100%, var(--ttwp-max-width, 18rem));
  margin-block: 0.5rem;
  margin-inline: auto;
  padding: 0 !important;
  background: none !important;
  border: none !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  border-radius: 0;
}

.tt-wps-bare .ttwp-shell {
  position: relative;
  padding: 0;
  overflow: hidden;
  isolation: isolate;
  border-radius: var(--ttwps-radius);
}

.tt-wps-bare .ttwp-viewport {
  perspective: none;
  position: relative;
  z-index: 0;
  overflow: hidden;
  border-radius: var(--ttwps-radius);
  background: rgba(0, 0, 0, 0.22);
}

.tt-wps-bare .ttwp-slide {
  transition: none;
}

.tt-wps-bare .ttwp-card.ttwp-card--shotsOnly {
  border: none;
  border-radius: var(--ttwps-radius);
  overflow: hidden;
  isolation: isolate;
}

.tt-wps-bare .ttwp-card.ttwp-card--shotsOnly:hover {
  transform: none;
  box-shadow: none;
}

.tt-wps-bare .ttwp-shot {
  border-bottom: none;
  --ttwp-shot-ratio: 16 / 10;
}

/* Timer progress (uses same animation class as full portfolio JS) */
.tt-wps-bare .ttwp-progress.ttwp-progress--wps-bare {
  margin-top: 10px;
  padding: 0;
}

.tt-wps-bare .ttwp-progress-timer {
  height: 3px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.08);
  overflow: hidden;
}

.tt-wps-bare .ttwp-progress-timer-fill {
  height: 100%;
  width: 100%;
  transform-origin: left center;
  transform: scaleX(0);
  background: rgba(125, 211, 252, 0.45);
}

.tt-wps-bare .ttwp-progress-timer-fill--animate {
  animation: ttwp-progress-timer 4s linear forwards;
}

/* Hide entire block on phone / small tablet */
@media (max-width: 767px) {
  .tt-web-portfolio.tt-web-portfolio-small.tt-wps-bare {
    display: none !important;
  }
}