.before-after-stage{aspect-ratio:3/2;isolation:isolate;background:#f6f4ff;border-radius:12px;position:relative;overflow:hidden}.before-after-stage img{object-fit:cover;-webkit-user-select:none;user-select:none;pointer-events:none}.comparison-label{color:#171932;pointer-events:none;background:#ffffffed;border-radius:6px;padding:5px 10px;font-size:12px;font-weight:600;position:absolute;top:14px}.comparison-before{left:14px}.comparison-after{right:14px}.comparison-divider{pointer-events:none;background:#fff;width:2px;position:absolute;top:0;bottom:0;transform:translate(-50%);box-shadow:0 0 5px #17193230}.comparison-divider span{color:#6947f6;letter-spacing:3px;background:#fff;border-radius:50%;place-items:center;width:44px;height:44px;font-size:24px;display:grid;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);box-shadow:0 3px 16px #17193230}.before-after-stage input{opacity:0;cursor:ew-resize;touch-action:pan-y;width:100%;height:100%;margin:0;position:absolute;inset:0}.before-after-stage:has(input:focus-visible){outline-offset:4px;outline:3px solid #6947f6}.comparison-disclosure{color:#667085;margin:12px 4px 0;font-size:12px;line-height:1.6}.comparison-image-layer,.comparison-clip-layer{pointer-events:none;position:absolute;inset:0}.comparison-view-controls{background:#f6f4ff;border-radius:9px;gap:4px;width:fit-content;margin:0 0 12px;padding:4px;display:flex}.comparison-view-controls button{color:#667085;background:0 0;border:1px solid #0000;border-radius:6px;min-height:36px;padding:6px 12px;font-size:12px;font-weight:600}.comparison-view-controls button[aria-pressed=true]{color:#5030de;background:#fff;border-color:#e9e8f3;box-shadow:0 1px 3px #17193208}.comparison-view-controls button:focus-visible{outline-offset:2px;outline:2px solid #6947f6}
