.image-comparison--root{display:block;-webkit-user-select:none;-moz-user-select:none;user-select:none;--image-comparison--cursor-pos:10%;--image-comparison--cursor-width:48px;--image-comparison--transition:all 1.5s var(--transition--ease-out) 0.25s}.image-comparison--header{text-align:center}.image-comparison--images{display:grid;position:relative}.image-comparison--images>*{grid-area:1/-1}.image-comparison--after{z-index:1;transition:var(--image-comparison--transition)}.image-comparison--root[data-cursor-direction=horizontal] .image-comparison--after{-webkit-clip-path:inset(0 0 0 var(--image-comparison--cursor-pos,0));clip-path:inset(0 0 0 var(--image-comparison--cursor-pos,0))}.image-comparison--root[data-cursor-direction=vertical] .image-comparison--after{-webkit-clip-path:inset(var(--image-comparison--cursor-pos,0) 0 0 0);clip-path:inset(var(--image-comparison--cursor-pos,0) 0 0 0)}.image-comparison--cursor-wrapper{display:grid;position:relative;cursor:pointer;transition:var(--image-comparison--transition)}.image-comparison--root[data-cursor-direction=horizontal] .image-comparison--cursor-wrapper{justify-self:start;place-items:center start;inset-inline-start:calc(var(--image-comparison--cursor-pos,0%) - var(--image-comparison--cursor-width)/ 2)}.image-comparison--root[data-cursor-direction=horizontal] .image-comparison--cursor-wrapper::before{height:100%;width:2px;left:calc(50% - 1px)}.image-comparison--root[data-cursor-direction=vertical] .image-comparison--cursor-wrapper{align-self:start;place-items:start center;inset-block-start:calc(var(--image-comparison--cursor-pos,0%) - var(--image-comparison--cursor-width)/ 2)}.image-comparison--root[data-cursor-direction=vertical] .image-comparison--cursor-wrapper::before{height:2px;width:100%;top:calc(50% - 1px)}.image-comparison--cursor-wrapper::before{content:"";position:absolute;background-color:#fff}.image-comparison--cursor{z-index:1;display:flex;align-items:center;justify-content:center;width:var(--image-comparison--cursor-width);height:var(--image-comparison--cursor-width);border-radius:50%;border:1px solid var(--bdr-color--general);background-color:#fff}.image-comparison--cursor .icon--drag-indicator{color:#000;height:32px}.image-comparison--root[data-cursor-direction=horizontal] .image-comparison--cursor .icon--drag-indicator{transform:rotate(90deg)}.image-comparison--link--container{text-align:center}