.compare-container{position:relative;width:100%;overflow:hidden;aspect-ratio:1/1;cursor:ew-resize;-moz-user-select:none;user-select:none;touch-action:none;-webkit-user-select:none}.compare-layer{position:absolute;inset:0}.compare-base{z-index:1}.compare-overlay{z-index:2}.compare-overlay-clip{overflow:hidden;width:50%}.compare-media,.compare-overlay-clip,.compare-overlay-inner{position:absolute;inset:0}.compare-media{width:100%;height:100%;object-fit:cover;display:block;pointer-events:none;-webkit-backface-visibility:hidden;backface-visibility:hidden;transform:translateZ(0)}.base-media{object-position:right center}.overlay-media{object-position:left center}.compare-handle{width:44px;z-index:3}.compare-handle,.handle-line{position:absolute;top:0;bottom:0;transform:translateX(-50%)}.handle-line{left:50%;width:3px;background:#fff;box-shadow:0 0 0 1px rgba(0,0,0,.1)}.handle-arrows{position:absolute;top:50%;left:50%;width:96px;transform:translate(-50%,-50%);display:flex;justify-content:space-between;align-items:center;color:#fff;font-size:32px;font-weight:700;pointer-events:none;text-shadow:0 1px 2px rgba(0,0,0,.25)}.arrow{position:relative}.handle-arrows.pulse .arrow:after,.handle-arrows.pulse .arrow:before{content:"";position:absolute;top:52%;left:50%;width:28px;height:28px;border-radius:9999px;border:2px solid hsla(0,0%,100%,.9);transform:translate(-50%,-50%) scale(.6);opacity:0;pointer-events:none}.handle-arrows.pulse .arrow:before{animation:pulseRipple 1.2s ease-out 0s infinite}.handle-arrows.pulse .arrow:after{animation:pulseRipple 1.2s ease-out .6s infinite}@keyframes pulseRipple{0%{transform:translate(-50%,-50%) scale(.6);opacity:.7}60%{opacity:.15}to{transform:translate(-50%,-50%) scale(1.6);opacity:0}}.compare-label{position:absolute;bottom:12px;background:hsla(0,0%,100%,.82);padding:6px 12px;border-radius:6px;font-weight:700;font-size:14px;color:#00aeef;box-shadow:0 1px 2px rgba(0,0,0,.08);z-index:3}.compare-label.right{right:12px}.compare-label.left{left:12px}