.artwork-wipe{position:absolute;z-index:5;top:0;bottom:0;width:36px;transform:translateX(-50%);will-change:transform;cursor:ew-resize;touch-action:none;user-select:none;display:flex;align-items:center;justify-content:center;outline:0}
.artwork-wipe[hidden]{display:none!important}
.artwork-wipe::before{content:"";position:absolute;top:0;bottom:0;left:var(--wipe-line,17px);width:2px;background:#fff;box-shadow:0 0 0 1px #263b46aa}
.artwork-wipe>span{position:relative;display:grid;place-items:center;width:32px;height:42px;flex:none;border:1px solid #fff;border-radius:18px;background:transparent;color:white;font:20px/1 system-ui;opacity:.35;box-shadow:none;transition:opacity .14s ease,background-color .14s ease,box-shadow .14s ease}
.artwork-wipe:focus-visible:not([data-pointer-focus])>span,.is-wiping>.artwork-wipe>span{background:#344e45;opacity:1;box-shadow:0 2px 8px #0005}
.artwork-wipe:focus-visible:not([data-pointer-focus])>span{outline:3px solid #e8b878;outline-offset:3px}
@media(hover:hover){.artwork-wipe:hover>span{background:#526f50;opacity:1;box-shadow:0 2px 8px #0005}}
@media(prefers-reduced-motion:reduce){.artwork-wipe>span{transition:none}}
.is-wiping>.artwork-wipe>span{background:#526f50;transition:none}

.artwork-wipe-clip,.artwork-wipe-content{position:absolute;inset:0;will-change:transform;pointer-events:none}
.artwork-wipe-clip{z-index:2;overflow:hidden;contain:paint}