daddl-pack-xray{--xray-x: 50%;--xray-y: 50%;--xray-r: 0px;--xray-bleed: 0px;--xray-p: 0;display:block;width:100%}.daddl-pack-xray__frame{position:relative;aspect-ratio:1;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;border-radius:var(--daddl-border-radius, var(--inputs-radius))}.daddl-pack-xray__frame:focus{outline:none}.daddl-pack-xray__frame:focus-visible{outline:.2rem solid var(--daddl-ink);outline-offset:.2rem}.daddl-pack-xray__layer{position:absolute;inset:calc(var(--xray-bleed) * -1);pointer-events:none}.daddl-pack-xray__layer--front{z-index:1}.daddl-pack-xray__window{position:absolute;top:0;right:0;bottom:0;left:0;overflow:hidden}.daddl-pack-xray__img{position:absolute;top:0;right:0;bottom:0;left:0;display:block;box-sizing:border-box;width:100%;height:100%;padding:var(--xray-bleed);object-fit:contain;scale:var(--daddl-pack-xray-scale, 1)}.daddl-pack-xray__marker{position:absolute;top:50%;left:0;width:.1rem;height:.1rem;pointer-events:none}@media(hover:hover)and (pointer:fine){.daddl-pack-xray__layer{--xray-cx: calc(var(--xray-x) + var(--xray-bleed));--xray-cy: calc(var(--xray-y) + var(--xray-bleed))}.daddl-pack-xray__layer--front{-webkit-mask-image:radial-gradient(circle var(--xray-r) at var(--xray-cx) var(--xray-cy),transparent 98%,#000 100%);mask-image:radial-gradient(circle var(--xray-r) at var(--xray-cx) var(--xray-cy),transparent 98%,#000 100%)}.daddl-pack-xray__layer--inside{clip-path:circle(var(--xray-r) at var(--xray-cx) var(--xray-cy))}.daddl-pack-xray__ring{position:absolute;z-index:2;top:var(--xray-y);left:var(--xray-x);width:calc(var(--xray-r) * 2);height:calc(var(--xray-r) * 2);border:.3rem solid var(--daddl-highlight);border-radius:50%;box-shadow:0 0 0 .1rem rgba(var(--brand-burgundy-rgb),.2),0 .8rem 2.4rem rgba(var(--brand-burgundy-rgb),.22);transform:translate(-50%,-50%);opacity:0;transition:opacity .25s ease;pointer-events:none}.daddl-pack-xray.is-open .daddl-pack-xray__ring{opacity:1}.daddl-pack-xray.is-open .daddl-pack-xray__frame{cursor:none}}@media not all and (hover:hover)and (pointer:fine){daddl-pack-xray{--xray-feather: 8%;timeline-scope:--daddl-xray}.daddl-pack-xray__marker{view-timeline:--daddl-xray block}.daddl-pack-xray__ring{display:none}.daddl-pack-xray__window,.daddl-pack-xray__img{will-change:translate}.daddl-pack-xray__layer--front .daddl-pack-xray__window{-webkit-mask-image:linear-gradient(to bottom,transparent,#000 var(--xray-feather));mask-image:linear-gradient(to bottom,transparent,#000 var(--xray-feather));translate:0 calc(var(--xray-p) * 100%)}.daddl-pack-xray__layer--front .daddl-pack-xray__img{translate:0 calc(var(--xray-p) * -100%)}.daddl-pack-xray__layer--inside .daddl-pack-xray__window{-webkit-mask-image:linear-gradient(to top,transparent,#000 var(--xray-feather));mask-image:linear-gradient(to top,transparent,#000 var(--xray-feather));translate:0 calc((var(--xray-p) - 1) * 100% + var(--xray-feather))}.daddl-pack-xray__layer--inside .daddl-pack-xray__img{translate:0 calc((1 - var(--xray-p)) * 100% - var(--xray-feather))}@supports (animation-timeline: view()){.daddl-pack-xray__window,.daddl-pack-xray__img{animation-duration:auto;animation-timing-function:linear;animation-fill-mode:both;animation-timeline:--daddl-xray;animation-range:cover 40% cover 80%}.daddl-pack-xray__layer--front .daddl-pack-xray__window{animation-name:daddl-xray-front-window}.daddl-pack-xray__layer--front .daddl-pack-xray__img{animation-name:daddl-xray-front-img}.daddl-pack-xray__layer--inside .daddl-pack-xray__window{animation-name:daddl-xray-inside-window}.daddl-pack-xray__layer--inside .daddl-pack-xray__img{animation-name:daddl-xray-inside-img}}}@keyframes daddl-xray-front-window{0%{translate:0 0}to{translate:0 100%}}@keyframes daddl-xray-front-img{0%{translate:0 0}to{translate:0 -100%}}@keyframes daddl-xray-inside-window{0%{translate:0 calc(var(--xray-feather) - 100%)}to{translate:0 var(--xray-feather)}}@keyframes daddl-xray-inside-img{0%{translate:0 calc(100% - var(--xray-feather))}to{translate:0 calc(var(--xray-feather) * -1)}}
/*# sourceMappingURL=/cdn/shop/t/31/assets/daddl-pack-xray.css.map */