.rdg-image-compare{--_pos:50%;position:relative;width:100%;overflow:hidden;border-radius:var(--radius-lg);touch-action:none;-webkit-user-select:none;-moz-user-select:none;user-select:none}.rdg-image-compare>img,.rdg-image-compare>span>img{display:block;width:100%;height:auto}.rdg-image-compare__before{position:absolute;inset:0;clip-path:inset(0 calc(100% - var(--_pos)) 0 0)}.rdg-image-compare__before img{display:block;width:100%;height:100%;-o-object-fit:cover;object-fit:cover}.rdg-image-compare__divider{top:0;bottom:0;left:var(--_pos);width:var(--border-width-thick);transform:translateX(-50%);pointer-events:none}.rdg-image-compare__divider,.rdg-image-compare__knob{position:absolute;background-color:hsl(var(--color-white))}.rdg-image-compare__knob{top:50%;left:50%;width:var(--size-icon-xl);height:var(--size-icon-xl);transform:translate(-50%,-50%);border-radius:var(--radius-full);box-shadow:var(--shadow-lg)}.rdg-image-compare__label{position:absolute;bottom:var(--spacing-component-md);padding:var(--spacing-component-xs) var(--spacing-component-sm);border-radius:var(--radius-md);background-color:hsl(var(--color-black)/.6);color:hsl(var(--color-white));font-size:var(--typography-semantic-ui-sm-font-size);font-weight:var(--typography-semantic-ui-sm-font-weight);pointer-events:none}.rdg-image-compare__label[data-side=before]{left:var(--spacing-component-md)}.rdg-image-compare__label[data-side=after]{right:var(--spacing-component-md)}.rdg-image-compare__range{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:ew-resize}.rdg-image-compare__range:focus-visible{outline:var(--border-width-thick) solid hsl(var(--border-interactive-focus));outline-offset:calc(-1 * var(--border-width-thick));border-radius:var(--radius-lg)}