/* One composition, three fixed captions. The photographs carry the variation. */
.custom-looks{position:relative;align-items:start}
.custom-looks .card-photo{background:var(--soft)}
.custom-looks [data-custom-look-image]{position:absolute;inset:0;width:100%;height:100%;opacity:0;pointer-events:none;transition:opacity 900ms ease-in-out;object-position:50% 50%;transform:none!important}
.custom-looks [data-custom-look-image].is-active{opacity:1}
.custom-look-detail{position:relative;min-width:0}
.custom-look-detail>.image-card{display:block}
.custom-look-control{position:absolute;right:8px;top:8px;width:44px;height:44px;border:0;padding:0;background:transparent;color:var(--ink);cursor:pointer;z-index:2}
.custom-look-control[hidden]{display:none}
.custom-look-control>span{display:grid;place-items:center;width:28px;height:28px;margin:auto;border-radius:50%;background:rgba(241,237,229,.92);box-shadow:0 1px 6px #0002}
.custom-look-control>span::before{content:"";width:8px;height:10px;border-inline:2px solid currentColor;box-sizing:border-box}
.custom-look-control[data-paused="true"]>span::before{width:0;height:0;border:0;border-top:5px solid transparent;border-bottom:5px solid transparent;border-left:7px solid currentColor;margin-left:2px}
.custom-look-control[data-reduced="true"]>span::before{width:7px;height:7px;border:0;border-top:1.5px solid currentColor;border-right:1.5px solid currentColor;transform:rotate(45deg);margin-left:-2px}
.custom-look-control:focus-visible{outline:2px solid var(--ink);outline-offset:0;border-radius:50%}
.custom-look-announcement{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
@media(hover:hover) and (pointer:fine){.custom-look-control{opacity:0;transition:opacity 160ms ease}.custom-looks:hover .custom-look-control,.custom-looks:focus-within .custom-look-control{opacity:1}}
@media(prefers-reduced-motion:reduce){.custom-looks [data-custom-look-image]{transition:none}}