.wtt-outfit-toc{
  --wtt-toc-gap:10px;
  --wtt-toc-w:72px;
  --wtt-toc-h:96px;
  display:flex;
  align-items:center;
  gap:6px;
  margin:0 0 1.25em;
  width:100%;
  max-width:100%;
  min-width:0;
  box-sizing:border-box;
  overflow:hidden;
  contain:inline-size;
}
@media (min-width:768px){
  .wtt-outfit-toc{
    --wtt-toc-w:88px;
    --wtt-toc-h:118px;
    --wtt-toc-gap:12px;
  }
}
.entry-content > .wtt-outfit-toc{
  max-width:100%;
}
.wtt-outfit-toc__viewport{
  flex:1 1 0%;
  min-width:0;
  max-width:100%;
  overflow-x:auto;
  overflow-y:hidden;
  scroll-behavior:smooth;
  -webkit-overflow-scrolling:touch;
  scrollbar-width:none;
}
.wtt-outfit-toc__viewport::-webkit-scrollbar{display:none}
.wtt-outfit-toc__track{
  display:flex;
  flex-wrap:nowrap;
  gap:var(--wtt-toc-gap);
  width:max-content;
}
.wtt-outfit-toc__item{
  flex:0 0 auto;
  display:block;
  position:relative;
  width:var(--wtt-toc-w);
  height:var(--wtt-toc-h);
  overflow:hidden;
  border-radius:4px;
  text-decoration:none;
  background-color:#fff;
  background-size:cover;
  background-position:center 20%;
  background-repeat:no-repeat;
  box-shadow:inset 0 0 0 1px rgba(0,0,0,.08);
}
.wtt-outfit-toc__item.is-loaded{
  filter:blur(0.55px) saturate(0.9);
}
.wtt-outfit-toc__item::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:1;
  pointer-events:none;
  border-radius:inherit;
  background:
    linear-gradient(
      105deg,
      #f4f4f4 0%,
      #f4f4f4 38%,
      #ebebeb 50%,
      #f4f4f4 62%,
      #f4f4f4 100%
    );
  background-size:220% 100%;
  animation:wtt-toc-shimmer 1.15s ease-in-out infinite;
  opacity:1;
  transition:opacity .28s ease;
}
.wtt-outfit-toc__item.is-loaded::before{
  opacity:0;
  animation:none;
}
@keyframes wtt-toc-shimmer{
  0%{background-position:100% 0}
  100%{background-position:-100% 0}
}
.wtt-outfit-toc__btn{
  flex:0 0 auto;
  width:28px;
  height:28px;
  padding:0;
  border:1px solid rgba(0,0,0,.15);
  border-radius:50%;
  background:#fff;
  color:rgba(0,0,0,.65);
  cursor:pointer;
  line-height:1;
  font-size:18px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
}
.wtt-outfit-toc__btn[hidden]{display:none!important}
.wtt-outfit-toc__btn:hover{color:#000;border-color:rgba(0,0,0,.35)}
@media (prefers-reduced-motion:reduce){
  .wtt-outfit-toc__viewport{scroll-behavior:auto}
  .wtt-outfit-toc__item{filter:none}
  .wtt-outfit-toc__item::before{animation:none;background:#f0f0f0}
}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
}
