:root {
  --rg-scroll-thumb: rgba(76, 86, 101, 0.34);
  --rg-scroll-thumb-hover: rgba(35, 135, 235, 0.72);
}
html[data-theme="dark"] {
  --rg-scroll-thumb: rgba(184, 194, 208, 0.30);
  --rg-scroll-thumb-hover: rgba(82, 166, 248, 0.78);
}
html,
body,
* {
  scrollbar-width: thin;
  scrollbar-color: var(--rg-scroll-thumb) transparent;
}
*::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}
*::-webkit-scrollbar-track {
  background: transparent;
}
*::-webkit-scrollbar-thumb {
  min-height: 44px;
  border: 2px solid transparent;
  border-radius: 999px;
  background: var(--rg-scroll-thumb);
  background-clip: padding-box;
}
*::-webkit-scrollbar-thumb:hover {
  background: var(--rg-scroll-thumb-hover);
  background-clip: padding-box;
}
*::-webkit-scrollbar-corner {
  background: transparent;
}
@media (max-width: 820px) {
  *::-webkit-scrollbar {
    width: 6px;
    height: 6px;
  }
  *::-webkit-scrollbar-thumb {
    border-width: 1px;
  }
}