.hd--picker{--hd-cap: 76px;--hd-sw: 20px}.hd__swatches{display:flex;justify-content:center;gap:8px;margin-top:8px}.hd__swatch{position:relative;flex:0 0 auto;width:var(--hd-sw);height:var(--hd-sw);padding:0;border:0;border-radius:50%;background-color:#eee;background-position:center;background-size:cover;box-shadow:0 0 0 1px #00000024;cursor:pointer;transition:transform .2s ease,box-shadow .2s ease}.hd__swatch:after{content:"";position:absolute;top:-6px;right:-6px;bottom:-6px;left:-6px;border-radius:50%}.hd__swatch:hover{transform:scale(1.12)}.hd__swatch.is-active{box-shadow:0 0 0 2px var(--hd-bg, #fff),0 0 0 3px var(--hd-fg, #111)}.hd__swatch:focus-visible{outline:1px solid var(--hd-fg, #111);outline-offset:4px}.hd__play{position:absolute;right:6%;bottom:4%;z-index:4;width:40px;height:40px;padding:0;border:1px solid var(--hd-fg, #111);border-radius:50%;background:#ffffffd9;color:var(--hd-fg, #111);display:inline-flex;align-items:center;justify-content:center;cursor:pointer;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);transition:transform .2s ease,background-color .2s ease}.hd__play[hidden]{display:none}.hd__play:hover{transform:scale(1.08);background:#fff}.hd__play:focus-visible{outline:1px solid var(--hd-fg, #111);outline-offset:3px}.hd__play .hd__stop-icon,.hd__play.is-active .hd__play-icon{display:none}.hd__play.is-active .hd__stop-icon{display:block}.hd__play-icon{margin-left:2px}.hd__all{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:8px;margin-top:10px;font-family:var(--font-body-family)}.hd__all-label{font-size:1.05rem;letter-spacing:.14em;text-transform:uppercase;opacity:.7;margin-right:4px}@media screen and (min-width:750px){.hd--picker{--hd-cap: 88px;--hd-sw: 24px}.hd__swatches{gap:10px;margin-top:10px}.hd__all{margin-top:0;justify-content:flex-end}.hd__all-label{font-size:1.15rem}}@media(prefers-reduced-motion:reduce){.hd--picker .hd__motion{display:block}.hd__swatch{transition:none}.hd__swatch:hover{transform:none}}.hd--picker .hd__motion{filter:brightness(1.012)}
/*# sourceMappingURL=/cdn/shop/t/28/assets/hero-dress-up-picker.css.map */
