.button-pixel-corners,
.button-pixel-corners--wrapper {
  clip-path: polygon(
    0px calc(100% - 8px),
    4px calc(100% - 8px),
    4px calc(100% - 4px),
    8px calc(100% - 4px),
    8px 100%,
    calc(100% - 8px) 100%,
    calc(100% - 8px) calc(100% - 4px),
    calc(100% - 4px) calc(100% - 4px),
    calc(100% - 4px) calc(100% - 8px),
    100% calc(100% - 8px),
    100% 8px,
    calc(100% - 4px) 8px,
    calc(100% - 4px) 4px,
    calc(100% - 8px) 4px,
    calc(100% - 8px) 0px,
    8px 0px,
    8px 4px,
    4px 4px,
    4px 8px,
    0px 8px
  );
  position: relative;
}
.button-pixel-corners {
  border: 4px solid transparent;
}
.button-pixel-corners--wrapper {
  width: fit-content;
  height: fit-content;
}
.button-pixel-corners--wrapper .button-pixel-corners {
  display: block;
  clip-path: polygon(
    4px 8px,
    8px 8px,
    8px 4px,
    calc(100% - 8px) 4px,
    calc(100% - 8px) 8px,
    calc(100% - 4px) 8px,
    calc(100% - 4px) calc(100% - 8px),
    calc(100% - 8px) calc(100% - 8px),
    calc(100% - 8px) calc(100% - 4px),
    8px calc(100% - 4px),
    8px calc(100% - 8px),
    4px calc(100% - 8px)
  );
}
.button-pixel-corners::after,
.button-pixel-corners--wrapper::after {
  content: "";
  position: absolute;
  clip-path: polygon(
    0px calc(100% - 8px),
    4px calc(100% - 8px),
    4px calc(100% - 4px),
    8px calc(100% - 4px),
    8px 100%,
    calc(100% - 8px) 100%,
    calc(100% - 8px) calc(100% - 4px),
    calc(100% - 4px) calc(100% - 4px),
    calc(100% - 4px) calc(100% - 8px),
    100% calc(100% - 8px),
    100% 8px,
    calc(100% - 4px) 8px,
    calc(100% - 4px) 4px,
    calc(100% - 8px) 4px,
    calc(100% - 8px) 0px,
    8px 0px,
    8px 4px,
    4px 4px,
    4px 8px,
    0px 8px,
    0px 50%,
    4px 50%,
    4px 8px,
    8px 8px,
    8px 4px,
    calc(100% - 8px) 4px,
    calc(100% - 8px) 8px,
    calc(100% - 4px) 8px,
    calc(100% - 4px) calc(100% - 8px),
    calc(100% - 8px) calc(100% - 8px),
    calc(100% - 8px) calc(100% - 4px),
    8px calc(100% - 4px),
    8px calc(100% - 8px),
    4px calc(100% - 8px),
    4px 50%,
    0px 50%
  );
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background: #acc2ed;
  display: block;
  pointer-events: none;
}
.button-pixel-corners::after {
  margin: -4px;
}