ul::scroll-button(*) { position: absolute; }
ul::scroll-button(left) { left: 0; }
ul::scroll-button(right) { right: 0; }

ul {
  scroll-marker-group: after;
  position: relative;
}
li::scroll-marker {
  content: "";
  height: 1em;
  width: 1em;
  transition: flex 0.26s ease;
}
::scroll-marker:target-current {
  flex: 2;
}
ul::scroll-marker-group {
  gap: .2em;
  display: flex;
  position: relative;
  align-items: center;
  left: 50%;
  translate: -50% 2rem;
  justify-content: center;
}

scroll-button
135135××
scroll-marker
135135××