[data-wet-photo] {
  position: relative;
  isolation: isolate;
  overflow: hidden;
}

[data-wet-photo] > img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

[data-wet-photo] > canvas {
  position: absolute;
  inset: 0;
  z-index: 1;
  width: 100%;
  height: 100%;
  touch-action: pan-y pinch-zoom;
}

[data-wet-photo] > .photo-wipe {
  position: absolute;
  right: 12px;
  bottom: 12px;
  z-index: 2;
  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  padding: 11px;
  border: 0;
  border-radius: 50%;
  background: #101e2ab8;
  color: #edf2ef;
  cursor: pointer;
  touch-action: manipulation;
  -webkit-tap-highlight-color: transparent;
}

[data-wet-photo] > .photo-wipe:hover {
  background: #101e2a;
}

[data-wet-photo] > .photo-wipe:focus-visible {
  outline: 2px solid #edf2ef;
  outline-offset: 4px;
}

[data-wet-photo] > .photo-wipe > svg {
  display: block;
  width: 100%;
  height: 100%;
  pointer-events: none;
}

[data-wet-photo] > .photo-wipe[hidden],
[data-wet-photo] > canvas[hidden] {
  display: none;
}