@font-face {
  font-family: 'Benzin-Bold';
  src: url('../../assets/fonts/benzin-bold.eot'); /* IE 9 Compatibility Mode */
  src:
    url('../../assets/fonts/benzin-bold.eot?#iefix') format('embedded-opentype'),
    /* IE < 9 */ url('../../assets/fonts/benzin-bold.woff2') format('woff2'),
    /* Super Modern Browsers */ url('../../assets/fonts/benzin-bold.woff')
      format('woff'),
    /* Firefox >= 3.6, any other modern browser */
      url('../../assets/fonts/benzin-bold.ttf') format('truetype'),
    /* Safari, Android, iOS */
      url('../../assets/fonts/benzin-bold.svg#benzin-bold') format('svg'); /* Chrome < 4, Legacy iOS */
}

:root {
  --ui-scale: 1;
}

#root {
  transform: scale(var(--ui-scale));
  transform-origin: top left;

  /* компенсация, чтобы после scale не появлялись пустые области/скроллы */
  width: calc(100% / var(--ui-scale));
  height: calc(100% / var(--ui-scale));
}

body {
  position: relative;
  color: white;
  height: 100vh;
  background: linear-gradient(242.94deg, #000000 39.07%, #3b4187 184.73%);
  font-family: 'Benzin-Bold' !important;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 0;
  margin: 0;
  user-select: none;
}

p {
  font-family: 'Benzin-Bold' !important;
}

h1 {
  font-family: 'Benzin-Bold' !important;
}

h2 {
  font-family: 'Benzin-Bold' !important;
}

h3 {
  font-family: 'Benzin-Bold' !important;
}

h4 {
  font-family: 'Benzin-Bold' !important;
}

h5 {
  font-family: 'Benzin-Bold' !important;
}

h6 {
  font-family: 'Benzin-Bold' !important;
}

span {
  font-family: 'Benzin-Bold' !important;
}

::-webkit-scrollbar {
  width: 12px;
  height: 12px;
}

/* трек */
::-webkit-scrollbar-track {
  background: rgba(255, 255, 255, 0.08);
  border-radius: 100px;
  margin: 20px 0; /* ⬅– отступы сверху и снизу */
}

/* Бегунок */
::-webkit-scrollbar-thumb {
  background: linear-gradient(71deg, #f27121 0%, #e940cd 70%, #8a2387 100%);
  border-radius: 10px;
}

/* hover эффект */
::-webkit-scrollbar-thumb:hover {
  background-size: 400% 400%;
  animation-duration: 1.7s;
}

/* shimmer-анимация градиента */
@keyframes scrollbarShimmer {
  0% {
    background-position: 0% 50%;
  }
  50% {
    background-position: 100% 50%;
  }
  100% {
    background-position: 0% 50%;
  }
}
