.viic{position:relative;display:block;width:100%;overflow:hidden;isolation:isolate;line-height:0;background:#eee;user-select:none;-webkit-user-select:none;}
.viic__image{display:block;width:100%;height:auto;object-fit:cover;pointer-events:none;}
.viic__before{position:absolute;inset:0;clip-path:inset(0 calc(100% - var(--viic-pos)) 0 0);pointer-events:none;}
.viic__before img{display:block;width:100%;height:100%;object-fit:cover;object-position:center;}
.viic__divider{position:absolute;z-index:2;top:0;bottom:0;left:var(--viic-pos);transform:translateX(-50%);width:3px;background:white;box-shadow:0 0 3px #0008;pointer-events:none;}
.viic__handle{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);display:grid;place-items:center;width:48px;height:48px;border-radius:50%;background:#fff;color:#222;box-shadow:0 2px 12px #0005;font:700 18px/1 Arial,sans-serif;white-space:nowrap;}
.viic__range{position:absolute;z-index:3;inset:0;width:100%;height:100%;margin:0;padding:0;opacity:0;cursor:ew-resize;touch-action:pan-y;appearance:none;-webkit-appearance:none;}
.viic:focus-within{outline:3px solid #2578c3;outline-offset:3px;}