/* ССтили для Firefox */
*
{
  scrollbar-width : thin; /* Тонкий скролл */
  scrollbar-color : rgba(0, 0, 0, 0.5) transparent;
}

/* Стили для Chrome, Edge и Safari (WebKit) */
::-webkit-scrollbar
{
  width  : 8px;
  height : 8px;
}

/* Фон дорожки (track) */
::-webkit-scrollbar-track
{
  border-radius : 10px;
  background    : transparent;
}

/* Сам ползунок (thumb) */
::-webkit-scrollbar-thumb
{
  background-color : rgba(0, 0, 0, 0.3);
  border-radius    : 10px;
  border           : 2px solid transparent; /* Отступ от краев за счет прозрачной границы */
  background-clip  : content-box; /* Чтобы граница работала как отступ */
}

::-webkit-scrollbar-thumb:hover
{
  background-color : rgba(0, 0, 0, 0.5);
}