.serena-compare{--position:50%;--divider:#fff;--arrow:#705a4a;--handle:44px;position:relative;overflow:hidden;border-radius:28px;isolation:isolate;line-height:0;direction:ltr;background:#f4f0ed;aspect-ratio:var(--ratio,auto)}.serena-compare .serena-compare__image{display:block;width:100%;max-width:none;height:100%;object-fit:cover;object-position:center;margin:0;border:0;border-radius:0;user-select:none;pointer-events:none}.serena-compare .serena-compare__base{height:auto;aspect-ratio:var(--ratio,auto);object-fit:cover}.serena-compare__after{position:absolute;inset:0;clip-path:inset(0 0 0 var(--position))}.serena-compare__divider{position:absolute;top:0;bottom:0;left:var(--position);width:3px;transform:translateX(-50%);background:var(--divider);pointer-events:none}.serena-compare__handle{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:var(--handle);height:var(--handle);box-sizing:border-box;border-radius:50%;background:var(--divider);box-shadow:0 0 0 2px rgb(35 30 26 / .65),0 2px 6px #0003;display:flex;align-items:center;justify-content:center;gap:7px}.serena-compare__handle span{width:0;height:0;border-top:6px solid #fff0;border-bottom:6px solid #fff0}.serena-compare__handle span:first-child{border-right:6px solid var(--arrow)}.serena-compare__handle span:last-child{border-left:6px solid var(--arrow)}.serena-compare .serena-compare__range{position:absolute;inset:0;z-index:3;width:100%;height:100%;min-height:0;margin:0;padding:0;border:0;opacity:0;cursor:ew-resize;touch-action:pan-y;direction:ltr}.serena-compare:focus-within .serena-compare__handle{outline:3px solid var(--arrow);outline-offset:5px}.serena-compare__label{position:absolute;top:18px;z-index:2;padding:8px 12px;border-radius:4px;font:500 12px/1.3 sans-serif;color:#fff;background:#705a4acc;pointer-events:none;max-width:42%;overflow-wrap:anywhere}.serena-compare__label--before{left:18px}.serena-compare__label--after{right:18px}