.variations-container{margin-top:1rem;padding:1rem;background-color:#f8f9fa;border-radius:.5rem;border:1px solid #e9ecef}.variation-thumbnail{width:100px;height:100px;cursor:pointer;border:3px solid transparent;border-radius:.5rem;overflow:hidden;transition:all .2s ease-in-out}.variation-thumbnail:hover{transform:scale(1.05)}.variation-thumbnail.selected{border-color:#facc15;box-shadow:0 0 10px #facc1580}.comparison-main{position:relative;border-radius:.5rem;overflow:hidden}div[data-testid=container]{touch-action:none}.before-after-hero-container{position:relative;width:100%;overflow:visible;aspect-ratio:1/1}.before-after-hero-image{position:absolute;-o-object-fit:cover;object-fit:cover;top:0;width:100%;height:100%}.before-after-hero-image.reveal{-webkit-mask-image:linear-gradient(to right,transparent 0%,transparent 50%,black 50%,black 100%);mask-image:linear-gradient(to right,transparent 0%,transparent 50%,black 50%,black 100%);-webkit-mask-size:200% 100%;mask-size:200% 100%;-webkit-mask-position:200% 0;mask-position:200% 0}.before-after-hero-image.reveal.animate-mask{animation:revealWipe 6s ease-in-out infinite alternate}.before-after-mask-line{position:absolute;top:-10px;width:3px;background-color:#fff;z-index:10}.before-after-mask-line.animate-line{animation:lineMove 6s ease-in-out infinite alternate}@keyframes lineMove{0%{left:0%}to{left:100%}}@keyframes revealWipe{0%{-webkit-mask-position:200% 0;mask-position:200% 0}to{-webkit-mask-position:100% 0;mask-position:100% 0}}.image-canvas-mode{position:fixed!important;top:50vh!important;transform:translate(calc(-50% + 17px),-50%)!important;transform-origin:center center!important;z-index:1000!important;display:block!important;visibility:visible!important;width:min(calc(100vw - var(--sidebar-width, 320px)),calc((100vh - 160px) * 4 / 3))!important;height:calc(min(calc(100vw - var(--sidebar-width, 320px)),calc((100vh - 160px) * 4 / 3))*.75)!important;-o-object-fit:contain!important;object-fit:contain!important;box-sizing:border-box!important}.image-canvas-mode.with-sidebar{left:calc(50vw - var(--sidebar-width, 320px) / 2)!important;max-width:calc(100vw - var(--sidebar-width, 320px))!important}.image-canvas-mode:not(.with-sidebar){left:50vw!important;max-width:100vw!important;--sidebar-width: 0px !important}.image-canvas-mode{transition:left .3s ease-out,transform .3s ease-out,max-width .3s ease-out}