.strip{
  --tile-h: clamp(180px, 30vw, 420px);
  --tile-w: calc(var(--tile-h) * 4 / 3);
  --gap:    16px;

  position:relative;
  overflow:hidden;
  cursor:grab;
  touch-action:pan-y;
  user-select:none;
  -webkit-user-select:none;
}
.strip.is-dragging{cursor:grabbing;}
.strip:focus-visible{outline:2px solid var(--tungsten);outline-offset:-3px;}
.strip--multi{--tile-h: clamp(130px, 21vw, 300px);}
@media (min-width:561px){
  .strip--single{
    --tile-w: min(86vw, 1024px);
    --tile-h: calc(var(--tile-w) / var(--tile-ar, 1.4222));
    --gap: 18px;
  }
}

.strip__row{height:var(--tile-h);overflow:hidden;}
.strip__row + .strip__row{margin-top:var(--gap);}
.strip__row--offset .strip__track{
  margin-left:calc((var(--tile-w) + var(--gap)) / -2);
}
.strip__track{
  display:flex;
  gap:var(--gap);
  height:100%;
  will-change:transform;
  transform:translate3d(0,0,0);
}

.strip__tile{
  flex:0 0 auto;
  width:var(--tile-w);
  height:var(--tile-h);
  overflow:hidden;
  border-radius:var(--radius);
  background:var(--ink-2);
}
.strip__tile img{
  display:block;width:100%;height:100%;
  object-fit:cover;object-position:50% 50%;
  opacity:0;transition:opacity .4s ease;
  -webkit-user-drag:none;
}
.strip__tile img.is-loaded{opacity:1;}
.strip::after{
  content:"";
  position:absolute;inset:0;z-index:2;
  pointer-events:none;
  background:linear-gradient(90deg,
    var(--paper) 0%, rgba(242,239,232,0) 7%,
    rgba(242,239,232,0) 93%, var(--paper) 100%);
}
.dark .strip::after{
  background:linear-gradient(90deg,
    var(--ink) 0%, rgba(23,25,29,0) 7%,
    rgba(23,25,29,0) 93%, var(--ink) 100%);
}

.strip-note{
  margin-top:18px;
  display:flex;justify-content:space-between;align-items:baseline;
  gap:20px;flex-wrap:wrap;
  font-family:var(--font-mono);font-size:11px;letter-spacing:.14em;
  text-transform:uppercase;color:var(--muted);
}
.dark .strip-note{color:var(--muted-dk);}
.strip-note .hint{color:var(--ink);}
.dark .strip-note .hint{color:var(--body-dk);}
@media (prefers-reduced-motion: reduce){
  .strip__tile img{transition:none;}
}
@media (max-width:560px){
  .strip{
    --tile-max-w: 84vw;
    --tile-h: calc(var(--tile-max-w) * 3 / 4);
    --gap: 12px;
  }

  .strip__tile{
    width: calc(var(--tile-h) * clamp(0.5, var(--ar, 1.333), 3));
  }
  .section:has(> .strip){padding-bottom:40px;}
  .strip-note{margin-top:12px;}
  .strip::after{
    background:linear-gradient(90deg,
      var(--paper) 0%, rgba(242,239,232,0) 4%,
      rgba(242,239,232,0) 96%, var(--paper) 100%);
  }
  .dark .strip::after{
    background:linear-gradient(90deg,
      var(--ink) 0%, rgba(23,25,29,0) 4%,
      rgba(23,25,29,0) 96%, var(--ink) 100%);
  }
}