.ugc__viewport{position:relative}.ugc__track{display:flex;gap:var(--ugc-gap, 12px);margin:0;padding:2px 0 6px;list-style:none;overflow-x:auto;scroll-behavior:smooth;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;scrollbar-width:none}.ugc__track::-webkit-scrollbar{display:none}.ugc__item{flex:0 0 auto;scroll-snap-align:start;width:var(--ugc-card-w-mobile, 125px)}.ugc__card{position:relative;display:block;width:100%;aspect-ratio:9 / 16;padding:0;border:1px solid rgba(var(--colors-text, 0, 0, 0),.08);border-radius:14px;overflow:hidden;cursor:pointer;background:rgba(var(--colors-text, 0, 0, 0),.04);transition:transform .22s ease,box-shadow .22s ease}.ugc__card:hover{transform:translateY(-2px);box-shadow:0 12px 26px -12px #00000059}.ugc__card:focus-visible{outline:2px solid rgba(var(--colors-button, 28, 28, 28),1);outline-offset:3px}.ugc__placeholder{display:flex;align-items:center;justify-content:center;padding:8px;text-align:center;font-size:.75rem;cursor:default;color:rgba(var(--colors-text, 0, 0, 0),.5);border-style:dashed;border-width:1px}.ugc-card__video,.ugc__card img{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;object-fit:cover;display:block}.ugc__play{position:absolute;top:8px;right:8px;width:22px;height:22px;display:flex;align-items:center;justify-content:center;border-radius:50%;background:#00000073;color:#fff;pointer-events:none;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}.ugc__play svg{width:11px;height:11px}.ugc__label{position:absolute;left:0;right:0;bottom:0;padding:18px 8px 7px;font-size:.6875rem;font-weight:600;color:#fff;text-align:left;line-height:1.2;pointer-events:none;background:linear-gradient(to top,rgba(0,0,0,.6),transparent)}.ugc__nav{position:absolute;top:50%;z-index:2;width:34px;height:34px;margin-top:-17px;display:flex;align-items:center;justify-content:center;border:1px solid rgba(var(--colors-text, 0, 0, 0),.1);border-radius:50%;cursor:pointer;color:rgba(var(--colors-text, 0, 0, 0),1);background:rgba(var(--colors-background, 255, 255, 255),.92);box-shadow:0 4px 14px -6px #0000004d;transition:opacity .2s ease,transform .16s ease}.ugc__nav:hover{transform:scale(1.06)}.ugc__nav svg{width:15px;height:15px}.ugc__nav--prev{left:-10px}.ugc__nav--next{right:-10px}.ugc__nav[hidden]{display:none}.ugc-modal{position:fixed;top:0;right:0;bottom:0;left:0;z-index:10000;display:flex;align-items:center;justify-content:center;padding:16px;opacity:0;background:#000000d1;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);transition:opacity .22s ease}.ugc-modal.is-open{opacity:1}.ugc-modal__stage{position:relative;height:min(86vh,780px);aspect-ratio:9 / 16;max-width:calc(100vw - 32px);border-radius:16px;overflow:hidden;background:#000;box-shadow:0 30px 70px -30px #000c}.ugc-modal__stage video{width:100%;height:100%;object-fit:contain;display:block;background:#000}.ugc-modal__cta{position:absolute;left:14px;right:14px;bottom:58px;display:block;padding:12px 18px;border-radius:9999px;text-align:center;font-size:.875rem;font-weight:600;text-decoration:none;color:rgba(var(--colors-button-text, 255, 255, 255),1);background:rgba(var(--colors-button, 28, 28, 28),1)}.ugc-modal__close,.ugc-modal__nav{position:absolute;display:flex;align-items:center;justify-content:center;border:0;border-radius:50%;cursor:pointer;color:#fff;background:#ffffff29;transition:background .18s ease}.ugc-modal__close:hover,.ugc-modal__nav:hover{background:#ffffff4d}.ugc-modal__close{top:18px;right:18px;width:42px;height:42px;z-index:2}.ugc-modal__close svg{width:17px;height:17px}.ugc-modal__nav{top:50%;width:46px;height:46px;margin-top:-23px}.ugc-modal__nav svg{width:19px;height:19px}.ugc-modal__nav--prev{left:18px}.ugc-modal__nav--next{right:18px}.ugc-modal__nav[hidden]{display:none}@media(min-width:768px){.ugc__item{width:var(--ugc-card-w, 155px)}.ugc__play{width:26px;height:26px}.ugc__play svg{width:12px;height:12px}.ugc__label{font-size:.75rem}}@media(max-width:767px){.ugc-modal{padding:0}.ugc-modal__stage{height:100%;width:100%;max-width:none;border-radius:0}.ugc-modal__nav{display:none}}@media(prefers-reduced-motion:reduce){.ugc__track{scroll-behavior:auto}.ugc__card,.ugc-modal{transition:none}}
/*# sourceMappingURL=/cdn/shop/t/9/assets/ugc-videos.css.map */