:root {
  --scroll-gutter: 0.5rem;
  --edge: clamp(1.15rem, 4vw, 2.5rem);
}

html,
body {
  scrollbar-width: none;
  -ms-overflow-style: none;
}

html::-webkit-scrollbar,
body::-webkit-scrollbar {
  display: none;
  width: 0;
  height: 0;
  background: transparent;
}

.page-scroll {
  position: fixed;
  top: 0;
  right: 0;
  width: var(--scroll-gutter);
  height: 100%;
  z-index: 1200;
  background: transparent;
  pointer-events: none;
}

.page-scroll-thumb {
  position: absolute;
  top: 0;
  right: 0;
  width: 100%;
  border-radius: 999px 0 0 999px;
  background: var(--scroll-thumb, #d4af37);
  pointer-events: auto;
  cursor: grab;
  touch-action: none;
}

.page-scroll-thumb:hover,
.page-scroll-thumb.is-drag {
  background: var(--scroll-thumb-hover, #f4e4b0);
}
