@import "games/shoot.css";
@import "games/coinflip.css";
@import "games/dice.css";


@font-face {
  font-style: normal;
  font-weight: 500;
  font-family: "Google Sans";
  font-display: swap;
  src: url(../GoogleSans-Medium.woff) format("woff");
}
:root {
  --footer-bg: #0c1323;
  --body-font-size: 16px;
  --content-width: 1368px;
  --content-width-mode: 1280px;
  --container-offset: 16px;
  --container-width: calc(var(--content-width) + (var(--container-offset) * 2));
  --container-width-mode: calc(var(--content-width-mode) + (var(--container-offset) * 2));
  --size: Min(24vw, 264px);
  --t-xxs: 10px;
  --t-xs: 12px;
  --t-sm: 14px;
  --t-base: 16px;
  --t-md: 18px;
  --t-lg: 20px;
  --t-xl: 24px;
  --t-xxl: 26px;
  --t-xxl-2: 28px;
  --t-xxl-3: 32px;
  --t-xxl-4: 36px;
  --scrollbar-thumb: #6866f6;
  --scrollbar-thumb-hover: #f6866F6ff;
  --scrollbar-track: #05031d;
  --scrollbar-track-hover: #05031d;
  --overlay-bg: rgba(0, 0, 0, 0.5);
  --select-inner-bg: #404040;
  --select-inner-border: #fdfdfd;
  --select-focus-border: #fdfdfd;
  --ff: "Unbounded", sans-serif;
  --ff-gs: "Google Sans", sans-serif;
  --clr-b: 0, 0, 0;
  --clr-w: 255, 255, 255;
  --clr-r: 249, 78, 73;
  --clr-grn: 41, 255, 162;
  --clr-pr: 196, 51, 59;
  --clr-r-2: 200, 32, 57;
  --clr-light: 231, 231, 231;
  --clr-light-2: 204, 205, 207;
  --clr-p: 217, 7, 124;
  --clr-gr: 94, 96, 114;
  --clr-y: 218, 208, 164;
  --clr-bl: 6, 144, 193;
  --clr-bl-2: 49, 131, 223;
  --clr-o: 238, 103, 66;
  --bg-b: 3, 2, 2;
  --bg-item-red: 215, 71, 109;
  --bg-item-ppl: 112, 15, 215;
  --bg-rating-item: 33, 27, 40;
  --br-a: #3d3e5c;
  --br-b: #262d3d;
  --br-c: #d72f33;
  --br-d: #1e6ff6;
  --br-e: #ecbf08;
  --br-f: #546db3;
  --br-g: #66f6a8;
  --delay-transition: cubic-bezier(0.47, 1.64, 0.41, 0.8);
  --bg-body: #121317;
  --clr-main: 93, 139, 106;
  --clr-green: 145, 200, 168;
  --g-border-clr: 27, 28, 34;
  --clr-green-2: 61, 106, 73;
  --clr-green-3: 64, 109, 76;
  --bg-chat: #17191e;
  --clr-r: 228, 81, 81;
  --green-gradient: linear-gradient(to bottom, #78a887 0%, #3d6a49 100%);
  --ff: "Unbounded", sans-serif;
  --header-h: 74px;
  --chat-w: 424px;
  --sidebar-w: 104px;
  --layout-bottom-pt: 30px;
}
@media (max-width: 1024px) {
  :root {
      --header-h: 74px;
  }
}
.burger {
  display: none;
}
.custom-radio {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  width: 100%;
  height: 45px;
}
.custom-radio__field {
  position: absolute;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}
.custom-radio__content {
  z-index: 0;
  font-style: normal;
  font-weight: 500;
  font-size: 14px;
  line-height: 100%;
  font-family: var(--font-family);
  vertical-align: middle;
  color: rgba(var(--cl-a), 1);
  cursor: pointer;
}
.custom-radio__content i {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
.custom-radio__content::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  width: 100%;
  height: 100%;
  border: 1px solid transparent;
}
.custom-radio__content::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  width: 100%;
  height: 100%;
  border: 1px solid rgba(var(--cl-e), 1);
  background-repeat: no-repeat;
  background-position: center center;
  background-size: 10px 10px;
  border-radius: 4px;
  -webkit-transition: opacity 0.3s ease-in-out;
  transition: opacity 0.3s ease-in-out;
}
.custom-radio__field:checked + .custom-radio__content::after {
  opacity: 1;
  background-color: rgba(var(--cl-e), 1);
}
.custom-checkbox__field:disabled + .custom-checkbox__content {
  opacity: 0.4;
  pointer-events: none;
}
.custom-checkbox {
  position: relative;
  -ms-flex-negative: 0;
  flex-shrink: 0;
  width: 100%;
  max-width: 46px;
}
.custom-checkbox input {
  position: absolute;
  width: 100%;
  height: 100%;
  border: none;
  outline: 0;
  cursor: pointer;
  opacity: 0;
}
.custom-checkbox input:checked + .checkbox-label {
  -webkit-box-shadow: inset 0 0 0 20px var(--bg-g);
  box-shadow: inset 0 0 0 20px var(--bg-g);
  background: #512c92;
}
.custom-checkbox input:checked + .checkbox-label:before {
  left: calc(100% - 22px);
}
.checkbox-label {
  position: relative;
  display: block;
  width: 100%;
  height: 24px;
  background: var(--bg-d);
  border-radius: 18px;
  cursor: pointer;
  -webkit-transition: 0.4s;
  transition: 0.4s;
  pointer-events: none;
}
.checkbox-label:before {
  content: "";
  position: absolute;
  top: 50%;
  right: auto;
  left: 2px;
  z-index: 1;
  display: block;
  width: 20px;
  height: 20px;
  background: #fff;
  border-radius: 100%;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
  -webkit-transition: 0.4s;
  transition: 0.4s;
}
.switch {
  position: relative;
  display: inline-block;
  min-width: 46px;
  min-height: 24px;
}
.switch--dark .switch__slider {
  background-color: rgba(var(--bg-q), 1);
}
.switch .switch input {
  opacity: 0;
  width: 0;
  height: 0;
}
.switch__slider {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(var(--bg-e), 1);
  -webkit-transition: 0.4s;
  transition: 0.4s;
  border-radius: 100px;
}
.switch__slider:before {
  position: absolute;
  content: "";
  height: 21px;
  width: 21px;
  left: 1px;
  bottom: 1.5px;
  background-color: rgba(var(--bg-a), 1);
  -webkit-transition: 0.4s;
  transition: 0.4s;
  border-radius: 50%;
}
.switch input:checked + .switch__slider {
  background-color: rgba(var(--bg-e), 1);
}
.switch input:checked + .switch__slider:before {
  -webkit-transform: translateX(23px);
  -ms-transform: translateX(23px);
  transform: translateX(23px);
}
.dropholder {
  position: relative;
  cursor: pointer;
}
.dropdown {
  min-width: 96px;
  min-height: 40px;
  background-color: #171515;
  border-radius: 6px;
  font-size: var(--t-base);
  font-weight: 700;
  text-transform: uppercase;
  padding: 0 12px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  grid-gap: 14px;
}
.dropdown-active ~ .dropdownOption {
  opacity: 1 !important;
  -webkit-transform: translateY(0);
  -ms-transform: translateY(0);
  transform: translateY(0);
  pointer-events: all !important;
}
.dropdownOption {
  position: absolute;
  top: calc(100% + 4px);
  width: 100%;
  z-index: 5;
  background-color: #171515;
  border-radius: 4px;
  border: 1px solid rgba(var(--clr-w), 0.1);
  opacity: 0;
  -webkit-transform: translateY(0.25rem);
  -ms-transform: translateY(0.25rem);
  transform: translateY(0.25rem);
  pointer-events: none;
  -webkit-transition: 250ms;
  transition: 250ms;
}
.dropdownOption li {
  padding: 0 12px;
  font-weight: 600;
  font-size: var(--t-sm);
  text-transform: uppercase;
  min-height: 2rem;
  -webkit-transition: 0.3s;
  transition: 0.3s;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}
@media (max-width: 1239px) {
  .dropdown {
      min-width: 84px;
      font-size: var(--t-xs);
      min-height: 2rem;
      grid-gap: 6px;
      padding: 0 8px;
  }
  .dropdownOption li {
      font-size: var(--t-xs);
  }
}
.swiper-container {
  margin-left: auto;
  margin-right: auto;
  position: relative;
  overflow: hidden;
  list-style: none;
  padding: 0;
  z-index: 1;
}
.swiper-container-vertical > .swiper-wrapper {
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
}
.swiper-wrapper {
  position: relative;
  width: 100%;
  height: 100%;
  z-index: 1;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-transition-property: -webkit-transform;
  transition-property: transform, -webkit-transform;
  -webkit-box-sizing: content-box;
  box-sizing: content-box;
}
.swiper-container-android .swiper-slide,
.swiper-wrapper {
  -webkit-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
}
.swiper-container-multirow > .swiper-wrapper {
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}
.swiper-container-multirow-column > .swiper-wrapper {
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
}
.swiper-container-free-mode > .swiper-wrapper {
  -webkit-transition-timing-function: ease-out;
  transition-timing-function: ease-out;
  margin: 0 auto;
}
.swiper-slide {
  -ms-flex-negative: 0;
  flex-shrink: 0;
  width: 100%;
  height: 100%;
  position: relative;
  -webkit-transition-property: -webkit-transform;
  transition-property: transform, -webkit-transform;
}
.swiper-slide-invisible-blank {
  visibility: hidden;
}
.swiper-container-autoheight,
.swiper-container-autoheight .swiper-slide {
  height: auto;
}
.swiper-container-autoheight .swiper-wrapper {
  -webkit-box-align: start;
  -ms-flex-align: start;
  align-items: flex-start;
  -webkit-transition-property: height, -webkit-transform;
  transition-property: transform, height, -webkit-transform;
}
.swiper-container-3d {
  -webkit-perspective: 1200px;
  perspective: 1200px;
}
.swiper-container-3d .swiper-cube-shadow,
.swiper-container-3d .swiper-slide,
.swiper-container-3d .swiper-slide-shadow-bottom,
.swiper-container-3d .swiper-slide-shadow-left,
.swiper-container-3d .swiper-slide-shadow-right,
.swiper-container-3d .swiper-slide-shadow-top,
.swiper-container-3d .swiper-wrapper {
  -webkit-transform-style: preserve-3d;
  transform-style: preserve-3d;
}
.swiper-container-3d .swiper-slide-shadow-bottom,
.swiper-container-3d .swiper-slide-shadow-left,
.swiper-container-3d .swiper-slide-shadow-right,
.swiper-container-3d .swiper-slide-shadow-top {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  z-index: 10;
}
.swiper-container-3d .swiper-slide-shadow-left {
  background-image: -webkit-gradient(linear, right top, left top, from(rgba(0, 0, 0, 0.5)), to(rgba(0, 0, 0, 0)));
  background-image: linear-gradient(to left, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
}
.swiper-container-3d .swiper-slide-shadow-right {
  background-image: -webkit-gradient(linear, left top, right top, from(rgba(0, 0, 0, 0.5)), to(rgba(0, 0, 0, 0)));
  background-image: linear-gradient(to right, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
}
.swiper-container-3d .swiper-slide-shadow-top {
  background-image: -webkit-gradient(linear, left bottom, left top, from(rgba(0, 0, 0, 0.5)), to(rgba(0, 0, 0, 0)));
  background-image: linear-gradient(to top, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
}
.swiper-container-3d .swiper-slide-shadow-bottom {
  background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0.5)), to(rgba(0, 0, 0, 0)));
  background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
}
.swiper-container-css-mode > .swiper-wrapper {
  overflow: auto;
  scrollbar-width: none;
  -ms-overflow-style: none;
}
.swiper-container-css-mode > .swiper-wrapper::-webkit-scrollbar {
  display: none;
}
.swiper-container-css-mode > .swiper-wrapper > .swiper-slide {
  scroll-snap-align: start start;
}
.swiper-container-horizontal.swiper-container-css-mode > .swiper-wrapper {
  -ms-scroll-snap-type: x mandatory;
  scroll-snap-type: x mandatory;
}
.swiper-container-vertical.swiper-container-css-mode > .swiper-wrapper {
  -ms-scroll-snap-type: y mandatory;
  scroll-snap-type: y mandatory;
}
html {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  width: 100%;
  height: 100%;
  overflow-x: hidden;
}
body {
  overflow-x: inherit;
  width: 100%;
  min-height: -webkit-fill-available;
  margin: 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  font-weight: 400;
  font-size: 16px;
  line-height: normal;
  font-family: var(--ff);
  color: rgba(var(--clr-w), 1);
  background: var(--bg-body);
  -webkit-text-size-adjust: 100%;
  min-height: 100dvh;
  position: relative;
}
p {
  font-weight: 300;
  line-height: 150%;
  color: #73727a;
  font-size: clamp(14px, 1.125vw, 18px);
}
.heading {
  --fz: clamp(28px, 2.75vw, 44px);
  font-size: var(--fz);
  text-transform: uppercase;
  font-weight: 900;
}
.heading--large {
  --fz: clamp(22px, 2.125vw, 34px);
}
.fade-in {
  display: block !important;
  -webkit-animation: 0.6s fade-in;
  animation: 0.6s fade-in;
}
@-webkit-keyframes fade-in {
  from {
      opacity: 0;
      -webkit-transform: translateY(0.5rem);
      transform: translateY(0.5rem);
  }
  to {
      opacity: 100%;
      -webkit-transform: translateY(0);
      transform: translateY(0);
  }
}
@keyframes fade-in {
  from {
      opacity: 0;
      -webkit-transform: translateY(0.5rem);
      transform: translateY(0.5rem);
  }
  to {
      opacity: 100%;
      -webkit-transform: translateY(0);
      transform: translateY(0);
  }
}
.locked {
  overflow: hidden !important;
}
.swiper-button-disabled {
  opacity: 0.5;
}
main {
  min-width: 0 !important;
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  grid-gap: clamp(80px, 7.5vw, 120px);
}
*,
::after,
::before {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
* {
  -webkit-tap-highlight-color: transparent;
}
a {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  margin: 0;
  font-style: inherit;
  font-weight: inherit;
  font-family: inherit;
  color: inherit;
  text-decoration: none;
  cursor: pointer;
}
a svg,
button img,
button svg {
  pointer-events: none;
}
button {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  margin: 0;
  padding: 0;
  line-height: initial;
  color: inherit;
  background-color: transparent;
  border: none;
  outline: 0;
  cursor: pointer;
  font-family: var(--ff);
}
button[disabled] {
  pointer-events: none;
  opacity: 0.5;
}
li,
ol,
ul {
  margin: 0;
  padding: 0;
  list-style: none;
}
h1,
h2,
h3,
h4,
h5,
h6,
p {
  margin: 0;
  padding: 0;
}
img {
  max-width: 100%;
  height: auto;
  display: block;
  -o-object-fit: cover;
  object-fit: cover;
}
label {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
}
input {
  width: 100%;
  font-family: inherit;
  background-color: none;
  border: none;
  outline: 0;
}
input::-webkit-input-placeholder {
  font-weight: inherit;
  font-size: inherit;
  line-height: inherit;
  font-family: inherit;
}
input::-moz-placeholder {
  font-weight: inherit;
  font-size: inherit;
  line-height: inherit;
  font-family: inherit;
}
input:-ms-input-placeholder {
  font-weight: inherit;
  font-size: inherit;
  line-height: inherit;
  font-family: inherit;
}
input::-ms-input-placeholder {
  font-weight: inherit;
  font-size: inherit;
  line-height: inherit;
  font-family: inherit;
}
input::placeholder {
  font-weight: inherit;
  font-size: inherit;
  line-height: inherit;
  font-family: inherit;
}
input::-webkit-inner-spin-button,
input::-webkit-outer-spin-button {
  margin: 0;
  -webkit-appearance: none;
  appearance: none;
}
textarea {
  border: none;
  outline: 0;
  resize: none;
}
input[type="number"] {
  -webkit-appearance: textfield;
  -moz-appearance: textfield;
  appearance: textfield;
}
.visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  white-space: nowrap;
  border: 0;
  clip: rect(0 0 0 0);
  clip-path: inset(100%);
}
.container {
  position: relative;
  width: 100%;
  max-width: calc(var(--container-offset) * 2 + var(--container-width));
  margin: 0 auto;
  padding: 0 var(--container-offset);
}
.container--wide {
  --container-width: 1844px;
}
.page--ios .dis-scroll {
  position: relative;
}
.overlay {
  position: fixed;
  height: 100%;
  right: 0;
  bottom: 0;
  left: 0;
  top: 0;
  z-index: 1;
  padding: 20px;
  overflow-y: scroll;
  display: -ms-grid;
  display: grid;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -ms-grid-rows: 1fr;
  grid-template-rows: 1fr;
  visibility: hidden;
  opacity: 0;
  background: -webkit-gradient(linear, left top, left bottom, from(rgba(104, 102, 246, 0)), to(rgba(104, 102, 246, 0.21))) rgba(8, 20, 40, 0.87);
  background: linear-gradient(180deg, rgba(104, 102, 246, 0) 0, rgba(104, 102, 246, 0.21) 100%) rgba(8, 20, 40, 0.87);
  -webkit-transition: 0.6s 0.5s;
  transition: 0.6s 0.5s;
  pointer-events: none;
}
.overlay::-webkit-scrollbar {
  display: none;
}
.overlay.none {
  display: none !important;
}
.overlay.active {
  position: fixed;
  z-index: 20;
  visibility: visible;
  opacity: 1;
  -webkit-transition: 0.6s;
  transition: 0.6s;
  pointer-events: initial;
}
.overlay.active--mode {
  z-index: 8;
  background: rgba(18, 19, 23, 0.9);
  opacity: 1;
  visibility: inherit;
}
.overlay.active--mode .modal {
  -webkit-transition: none !important;
  transition: none !important;
  -webkit-animation: none;
  animation: none;
}
@media (max-width: 767px) {
  .overlay.active--mode {
      z-index: 10;
      -webkit-box-align: center;
      -ms-flex-align: center;
      align-items: center;
  }
}
@media (max-width: 767px) {
  .popup {
    width: 90%;
  }
}
fieldset {
  margin: 0;
  padding: 0;
  border: none;
}
.button {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-transition: -webkit-transform 0.3s;
  transition: transform 0.3s;
  transition: transform 0.3s, -webkit-transform 0.3s;
  will-change: transform;
  text-align: center;
  grid-gap: 4px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}
@media (any-hover: hover) {
  .dropdownOption li:hover {
      background-color: rgba(var(--clr-w), 0.075);
  }
  .button:hover {
      -webkit-transform: scale(1.05);
      -ms-transform: scale(1.05);
      transform: scale(1.05);
  }
  .nav-link:hover {
      --initial-clr: #fff;
      --icon-clr: #5d8b6a;
  }
}
.gradient-block {
  --radius: 50%;
  position: relative;
  background-image: var(--green-gradient);
  border-radius: var(--radius);
  overflow: hidden;
  min-height: 48px;
}
.gradient-block::after {
  content: "";
  position: absolute;
  width: 40%;
  height: 40%;
  background-image: radial-gradient(#9dfcbe 0, rgba(var(--clr-green-2), 1));
  pointer-events: none;
  left: 50%;
  bottom: 0;
  -webkit-transform: translateX(-50%) translateY(50%);
  -ms-transform: translateX(-50%) translateY(50%);
  transform: translateX(-50%) translateY(50%);
  border-radius: 50%;
  -webkit-filter: blur(5px);
  filter: blur(5px);
}
.gradient-block::before {
  pointer-events: none;
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  padding: 1px;
  background: -webkit-gradient(linear, left top, left bottom, from(#97d8ab), to(rgba(var(--clr-green-3), 0)));
  background: linear-gradient(#97d8ab 0, rgba(var(--clr-green-3), 0));
  -webkit-mask: -webkit-gradient(linear, left top, left bottom, color-stop(0, #fff)) content-box, -webkit-gradient(linear, left top, left bottom, color-stop(0, #fff));
  -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
}
.flex {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
.flex-col {
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
}
.text-base {
  font-size: 16px;
}
.text-sm {
  font-size: 14px;
}
.items-center {
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}
.jb {
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
}
.gap-1 {
  grid-gap: 4px;
}
.gap-2 {
  grid-gap: 8px;
}
.gap-3 {
  grid-gap: 12px;
}
.gap-4 {
  grid-gap: 16px;
}
.game-wrapper {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: calc(37% - 12px) calc(63% - 12px);
  grid-template-columns: calc(37% - 12px) calc(63% - 12px);
  -webkit-box-align: start;
  -ms-flex-align: start;
  align-items: flex-start;
  grid-gap: 24px;
}
.game-wrapper--wheel {
  -ms-grid-columns: calc(30% - 12px) calc(70% - 12px);
  grid-template-columns: calc(30% - 12px) calc(70% - 12px);
}
@media (max-width: 1540px) {
  .game-wrapper--wheel {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
      -ms-flex-direction: column;
      flex-direction: column;
  }
  .game-wrapper--wheel > * {
      width: 100% !important;
  }
}
@media (max-width: 1440px) {
  .game-wrapper {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-orient: vertical;
      -webkit-box-direction: reverse;
      -ms-flex-direction: column-reverse;
      flex-direction: column-reverse;
      grid-gap: 10px;
  }
  .game-wrapper > * {
      width: 100%;
  }
}
.box {
  background-color: var(--bg-chat);
  border-radius: 24px;
  padding: clamp(24px, 2vw, 32px);
}
@media (max-width: 767px) {
  .box {
      padding: 14px;
  }
}
.layout {
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
  width: calc(100% - var(--chat-w));
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
}
.layout-main {
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
}
.layout-top {
  position: fixed;
  width: calc(100% - var(--chat-w));
  left: 0;
  top: 0;
  z-index: 2;
}
.layout-bottom {
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
  padding: var(--layout-bottom-pt) 0 140px 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
}
.layout-content {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  grid-gap: 20px;
  padding: 0 clamp(20px, 2.25vw, 36px);
  padding-top: calc(var(--header-h));
  width: calc(100% - var(--sidebar-w));
  margin-left: auto;
}
.layout-content > * {
  width: 100%;
}
@media (max-width: 1440px) {
  .layout-content {
      padding: 0 20px;
      padding-top: calc(var(--header-h));
      width: calc(100% - 94px);
  }
}
@media (max-width: 1239px) {
  .layout {
      width: 100%;
  }
  .layout-top {
      width: 100%;
      z-index: 10;
  }
  .layout-content {
      width: 100%;
      grid-gap: 10px;
      padding: 0 14px;
      padding-top: var(--header-h);
  }
}
.header {
  border-bottom: 1px solid rgba(var(--g-border-clr), 1);
  background-color: var(--bg-body);
}
.header-container {
  padding: 0 34px 0 50px;
}
.header-body {
  min-height: var(--header-h);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
}
.header-user {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  grid-gap: 8px;
  background-color: #17191e;
  border-radius: 12px;
  padding-right: 12px;
  cursor: pointer;
}
.header-user-name {
  font-size: 10px;
  font-weight: 500;
}
.header-user-arrow {
  width: 18px;
  height: 18px;
  border-radius: 6px;
  background-color: #1f2229;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}
.header-user-icon {
  width: 42px;
  height: 42px;
  border-radius: 12px;
}
.header-user-icon img {
  border-radius: inherit;
  width: 100%;
  height: 100%;
}
.header-balance {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  grid-gap: 8px;
  padding-left: 14px;
  border-radius: 12px 0 0 12px;
  margin-right: -8px;
  background-image: -webkit-gradient(linear, left top, right top, from(#22242c), to(rgba(18, 19, 23, 0)));
  background-image: linear-gradient(to right, #22242c 0, rgba(18, 19, 23, 0));
  position: relative;
  font-size: 10px;
  font-weight: 500;
  text-transform: uppercase;
}
.header-balance::before {
  pointer-events: none;
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  padding: 1px;
  background: -webkit-gradient(linear, left top, right top, from(#2e303b), to(rgba(46, 48, 59, 0.15)));
  background: linear-gradient(to right, #2e303b 0, rgba(46, 48, 59, 0.15) 100%);
  -webkit-mask: -webkit-gradient(linear, left top, left bottom, color-stop(0, #fff)) content-box, -webkit-gradient(linear, left top, left bottom, color-stop(0, #fff));
  -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
}
.header-balance img,
.header-balance svg {
  max-width: 14px;
}
.header-account {
  min-height: 42px;
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: (1fr) [2];
  grid-template-columns: repeat(2, 1fr);
}
.header-account > * {
  min-height: 42px;
}
.header-wallet {
  --radius: 12px;
  padding: 0 16px;
  font-size: 10px;
  text-transform: uppercase;
  font-weight: 600;
}
.header-col--navigation {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  grid-gap: clamp(32px, 3.375vw, 54px);
}
.header-col--actions {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  grid-gap: 16px;
}
@media (max-width: 1560px) {
  .header-user {
      padding-right: 0;
  }
  .header-user-name {
      display: none;
  }
  .header-user-icon {
      width: 40px;
      height: 40px;
  }
  .header-user-arrow {
      display: none;
  }
}
@media (max-width: 1440px) {
  .header-container {
      padding: 0 20px 0 32px;
  }
  .header-account {
      display: -ms-grid;
      display: grid;
      -ms-grid-columns: auto auto;
      grid-template-columns: auto auto;
      min-height: 40px;
  }
  .header-account > * {
      min-height: inherit;
  }
  .header-balance {
      padding: 0 20px 0 10px;
  }
  .header-wallet {
      min-width: auto;
      padding: 0 10px;
  }
  .header-wallet span {
      display: none;
  }
  .header-col--navigation {
      grid-gap: 24px;
  }
}
@media (max-width: 1239px) {
  .header-container {
      padding: 0 14px;
  }
  .header-logo {
      max-width: 32px;
  }
  .header-account {
      margin: 0 auto;
  }
  .header-col--actions {
      grid-gap: 0;
      -webkit-box-flex: 1;
      -ms-flex: 1;
      flex: 1;
  }
}
.nav {
  --initial-clr: #77797f;
  --icon-clr: var(--initial-clr);
}
.nav-link {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  grid-gap: 8px;
  font-size: 11px;
  text-transform: uppercase;
  font-weight: 600;
  color: var(--initial-clr);
  -webkit-transition: color 0.4s;
  transition: color 0.4s;
  padding: 0 8px;
}
.nav-link--selected {
  --initial-clr: #fff;
  --icon-clr: #5d8b6a;
}
.nav-chat {
  display: none;
}
.nav-icon {
  width: 18px;
  aspect-ratio: 1;
  -webkit-transition: fill 0.4s;
  transition: fill 0.4s;
  fill: var(--icon-clr);
}
.nav ul {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  grid-gap: 8px;
}
.nav-menu {
  display: none;
}
@media (max-width: 1239px) {
  .nav {
      position: fixed;
      width: calc(100% - 24px);
      height: 68px;
      bottom: 16px;
      left: 50%;
      -webkit-transform: translateX(-50%);
      -ms-transform: translateX(-50%);
      transform: translateX(-50%);
      z-index: 5;
      background-color: #17191e;
      border: 1px solid #252830;
      -webkit-box-shadow: 0 4px 4px 4px rgba(var(--clr-b), 0.2);
      box-shadow: 0 4px 4px 4px rgba(var(--clr-b), 0.2);
      border-radius: 14px;
  }
  .nav-menu {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      grid-area: menu;
      -ms-grid-row: 1;
      -ms-grid-column: 1;
  }
  .nav-chat {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      grid-area: chat;
      -ms-grid-row: 1;
      -ms-grid-column: 9;
  }
  .nav-icon {
      width: 20px;
      height: 20px;
  }
  .nav-icon-wrapper {
      width: 40px;
      height: 40px;
      background-image: var(--green-gradient);
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-align: center;
      -ms-flex-align: center;
      align-items: center;
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      justify-content: center;
      position: relative;
      overflow: hidden;
      border-radius: 14px;
  }
  .nav-icon-wrapper svg {
      fill: #fff;
  }
  .nav-icon-wrapper::after {
      content: "";
      position: absolute;
      width: 40%;
      height: 40%;
      background-image: radial-gradient(#9dfcbe 0, rgba(var(--clr-green-2), 1));
      pointer-events: none;
      left: 50%;
      bottom: 0;
      -webkit-transform: translateX(-50%) translateY(50%);
      -ms-transform: translateX(-50%) translateY(50%);
      transform: translateX(-50%) translateY(50%);
      border-radius: 50%;
      -webkit-filter: blur(5px);
      filter: blur(5px);
  }
  .nav-icon-wrapper::before {
      pointer-events: none;
      content: "";
      position: absolute;
      inset: 0;
      border-radius: inherit;
      padding: 1px;
      background: -webkit-gradient(linear, left top, left bottom, from(#97d8ab), to(rgba(var(--clr-green-3), 0)));
      background: linear-gradient(#97d8ab 0, rgba(var(--clr-green-3), 0));
      -webkit-mask: -webkit-gradient(linear, left top, left bottom, color-stop(0, #fff)) content-box, -webkit-gradient(linear, left top, left bottom, color-stop(0, #fff));
      -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
      -webkit-mask-composite: xor;
      mask-composite: exclude;
  }
  .nav-link--partner {
      display: none;
  }
  .nav ul {
      height: 100%;
      display: -ms-grid;
      display: grid;
      -ms-grid-columns: 1fr 8px 1fr 8px 1fr 8px 1fr 8px 1fr;
      grid-template-columns: repeat(5, 1fr);
      grid-template-areas: "menu bonuses main support chat";
  }
  .nav-link {
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
      -ms-flex-direction: column;
      flex-direction: column;
      -webkit-box-align: center;
      -ms-flex-align: center;
      align-items: center;
      padding: 0;
      height: 100%;
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      justify-content: center;
      font-size: 8px;
  }
  .nav-link--main {
      grid-area: main;
      -webkit-transform: translateY(-14px);
      -ms-transform: translateY(-14px);
      transform: translateY(-14px);
      grid-gap: 12px;
      -ms-grid-row: 1;
      -ms-grid-column: 5;
  }
  .nav-link--main span {
      color: #fff;
  }
  .nav-link--bonuses {
      grid-area: bonuses;
      -ms-grid-row: 1;
      -ms-grid-column: 3;
  }
  .nav-link--support {
      grid-area: support;
      -ms-grid-row: 1;
      -ms-grid-column: 7;
  }
  .nav-link--faq {
      display: none;
  }
}
.panel {
  --offset: var(--layout-bottom-pt) + var(--header-h);
  position: fixed;
  height: 100%;
  padding-bottom: 30px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  left: 30px;
  top: calc(var(--offset));
  height: calc(100% - (var(--offset)));
}
.sidebar {
  --icon-clr: #77797f;
  background-color: var(--bg-chat);
  padding: 12px;
  border-radius: 120px;
  display: block;
}
.sidebar-link {
  width: 52px;
  aspect-ratio: 1;
  position: relative;
  border-radius: 50%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}
.sidebar-link img,
.sidebar-link svg {
  -webkit-transition: fill 0.4s;
  transition: fill 0.4s;
  fill: var(--icon-clr);
}
.sidebar-link--selected {
  --icon-clr: #fff;
}
.sidebar-link--selected::after {
  opacity: 1;
}
.sidebar-icon {
  width: 24px;
  aspect-ratio: 1;
  position: relative;
  z-index: 1;
}
@media (max-width: 1440px) {
  .panel {
      left: 16px;
  }
  .keno {
      --ratio: 64px;
  }
}
@media (max-width: 1239px) {
  .panel {
      display: none;
  }
}
.lang {
  border-radius: 112px;
  background-color: #17191e;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  position: relative;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  overflow-y: auto;
}
.lang::-webkit-scrollbar {
  display: none;
}
.lang-list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  grid-gap: 22px;
  height: 0;
  -webkit-transition: 0.4s;
  transition: 0.4s;
  padding: 0;
  opacity: 0;
  pointer-events: none;
}
.lang-flag {
  background-color: transparent;
  -webkit-transition: -webkit-box-shadow 0.4s;
  transition: box-shadow 0.4s;
  transition: box-shadow 0.4s, -webkit-box-shadow 0.4s;
}
.lang-flag:not(.lang-selected) {
  cursor: pointer;
  border-radius: 50%;
}
.lang-flag img {
  border-radius: inherit;
  width: 30px;
  aspect-ratio: 1;
}
.lang-selected {
  width: 100%;
  height: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  padding: 20px 0;
  border-top: 1px solid transparent;
  -webkit-transition: border-color 0.4s;
  transition: border-color 0.4s;
}
.history-divider {
  width: 100%;
  margin-bottom: 12px;
}
.table {
  font-size: 12px;
  font-weight: 700;
}
.table-header {
  margin-bottom: 20px;
  color: #77797f;
  text-transform: uppercase;
}
.table-flex {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  grid-gap: 10px;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  text-transform: capitalize;
  text-align: center;
}
.table-coeff {
  position: relative;
}
.table-coeff_back {
  font-size: 24px;
  text-transform: lowercase;
  opacity: 0.07;
  position: absolute;
  left: 50%;
  top: 50%;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}
.table-rows {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  grid-gap: 14px;
}
.table-rows .table-row {
  background-color: var(--bg-chat);
  min-height: 58px;
  padding: 0 12px;
  border-radius: 14px;
  text-transform: uppercase;
}
.table-user {
  width: 32px;
  aspect-ratio: 1;
}
.table-user img {
  width: inherit;
  height: inherit;
}
.table-row {
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: (1fr) [5];
  grid-template-columns: repeat(5, 1fr);
}
.table-row > * {
  text-align: center;
}
@media (max-width: 1239px) {
  .table {
      display: none;
  }
}
.dashboard-grid {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: (1fr) [4];
  grid-template-columns: repeat(4, 1fr);
  grid-gap: clamp(10px, 1.25vw, 20px);
}
.dashboard-bg {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  will-change: transform;
  -webkit-transition: -webkit-transform 0.3s;
  transition: transform 0.3s;
  transition: transform 0.3s, -webkit-transform 0.3s;
  pointer-events: none;
}
.dashboard-block {
  padding: 30px;
  background-color: rgba(var(--clr-b), 1);
  min-height: 200px;
  border-radius: 16px;
  overflow: hidden;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  position: relative;
}
.dashboard-block--span {
  padding: 40px 30px;
  -ms-grid-column-span: 2;
  grid-column: span 2;
  min-height: 308px;
}
.dashboard-block--span:nth-child(2) {
  background-image: -webkit-gradient(linear, left top, left bottom, from(#0a2679), to(#4599da));
  background-image: linear-gradient(to bottom, #0a2679 0, #4599da 100%);
}
@media (any-hover: hover) {
  .sidebar-link:hover {
      --icon-clr: #fff;
  }
  .lang-flag:not(.lang-selected):hover {
      -webkit-box-shadow: 0 0 0 14px #1e2027;
      box-shadow: 0 0 0 14px #1e2027;
  }
  .lang:hover .lang-selected {
      border-color: #24272e;
  }
  .lang:hover .lang-list {
      height: 176px;
      padding: 22px 0;
      pointer-events: all;
      opacity: 1;
  }
  .dashboard-block:hover .dashboard-bg {
      -webkit-transform: scale(1.1);
      -ms-transform: scale(1.1);
      transform: scale(1.1);
  }
}
.dashboard-link {
  text-align: center;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  font-size: 10px;
  font-weight: 600;
  text-transform: uppercase;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  padding: 0 18px;
  background-color: rgba(var(--clr-w), 0.03);
  min-height: 36px;
  border-radius: 8px;
}
.dashboard-link--light {
  min-height: 44px;
  background-color: rgba(var(--clr-w), 1);
  min-width: 200px;
  border-radius: 10px;
  color: #367cc1;
  font-size: 12px;
}
.dashboard-object {
  position: absolute;
  top: 50%;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
  right: 30px;
  max-width: 290px;
}
.dashboard-content {
  position: relative;
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
}
.dashboard-nested {
  max-width: 290px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  grid-gap: 6px;
}
.dashboard-description {
  color: #a3caff;
  font-size: 14px;
  line-height: 120%;
}
.dashboard-title {
  position: relative;
  z-index: 1;
  font-size: clamp(14px, 1.125vw, 18px);
  font-weight: 600;
  text-transform: uppercase;
  -ms-flex-item-align: end;
  align-self: flex-end;
  line-height: 100%;
}
.dashboard-title--xl {
  -ms-flex-item-align: initial;
  -ms-grid-row-align: initial;
  align-self: initial;
  font-size: 24px;
  line-height: 130%;
  text-transform: capitalize;
}
.tours {
  margin-bottom: 20px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  min-height: 70px;
  padding: 0 14px 0 8px;
  background-image: -webkit-gradient(linear, right top, left top, from(#7eb28e), to(#3d6a4a));
  background-image: linear-gradient(to left, #7eb28e 0, #3d6a4a 100%);
  border-radius: 16px;
}
.tours-cta {
  background-color: #629471;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  padding: 0 18px;
  min-height: 42px;
  border-radius: 12px;
  font-size: 10px;
  font-weight: 600;
  text-transform: uppercase;
}
.tours-flex {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  grid-gap: 16px;
}
.tours-flex span {
  color: #b5e5c3;
  font-size: 14px;
  font-weight: 500;
}
.tours-icon {
  background-color: #355c40;
  width: 54px;
  aspect-ratio: 1;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  border-radius: 12px;
}
@media (max-width: 1480px) {
  .dashboard-grid {
      grid-gap: 12px;
      -ms-grid-columns: (1fr) [2];
      grid-template-columns: repeat(2, 1fr);
  }
  .dashboard-block {
      min-height: 140px;
      padding: 18px;
      border-radius: 10px;
  }
  .dashboard-block--span {
      min-height: 180px;
  }
  .dashboard-object {
      max-width: 180px;
      right: 12px;
  }
  .dashboard-description {
      font-size: 12px;
  }
  .dashboard-title--xl {
      font-size: 16px;
  }
}
@media (max-width: 767px) {
  .tours {
      position: relative;
      background: #497756;
      min-height: 56px;
      padding: 0 12px;
  }
  .tours::before {
      pointer-events: none;
      content: "";
      position: absolute;
      inset: 0;
      border-radius: inherit;
      padding: 1px;
      background: -webkit-gradient(linear, left top, right top, from(#3e6b4b), to(#96d6aa));
      background: linear-gradient(to right, #3e6b4b 0, #96d6aa 100%);
      -webkit-mask: -webkit-gradient(linear, left top, left bottom, color-stop(0, #fff)) content-box, -webkit-gradient(linear, left top, left bottom, color-stop(0, #fff));
      -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
      -webkit-mask-composite: xor;
      mask-composite: exclude;
  }
  .tours-flex {
      grid-gap: 10px;
  }
  .tours-flex span {
      font-size: 10px;
  }
  .tours-cta {
      padding: 0 14px;
      font-size: 8px;
  }
  .tours-icon {
      width: 40px;
      height: 40px;
  }
  .tours-icon img,
  .tours-icon svg {
      max-width: 18px;
  }
  .dashboard-block {
      border-radius: 10px;
  }
  .dashboard-block:not(.dashboard-block--span) {
      min-height: 112px;
  }
  .dashboard-block--span {
      min-height: 150px;
  }
  .dashboard-content {
      grid-gap: 14px;
  }
  .dashboard-object {
      max-width: 130px;
      right: 28px;
  }
  .dashboard-nested {
      max-width: 200px;
  }
  .dashboard-title {
      font-size: 12px;
  }
  .dashboard-link {
      min-height: 30px;
      font-size: 8px;
      padding: 0 8px;
  }
  .dashboard-link--light {
      min-height: 34px;
      min-width: 120px;
      font-size: 8px;
  }
  .dashboard-description {
      font-size: 10px;
  }
}
.keno {
  --ratio: 80px;
}
.keno-grid {
  display: -ms-grid;
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(var(--ratio), 1fr));
  grid-gap: clamp(8px, 1vw, 16px);
}
.keno-grid > * {
  font-weight: 500;
  min-height: var(--ratio);
  aspect-ratio: 1;
  background-color: #1e2127;
  border-radius: 20px;
  border: 1px solid #272a34;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  text-align: center;
  color: #b1b5c2;
  font-size: 24px;
  cursor: pointer;
  will-change: transform;
  -webkit-transition: -webkit-transform 0.3s;
  transition: transform 0.3s;
  transition: transform 0.3s, -webkit-transform 0.3s;
}
@media (any-hover: hover) {
  .keno-grid > :hover {
      -webkit-transform: scale(1.075);
      -ms-transform: scale(1.075);
      transform: scale(1.075);
  }
  .game-panel-flex__button:not(.game-panel-flex__button--selected):hover::after {
      opacity: 0.5;
  }
}
@media (max-width: 1040px) {
  .keno {
      --ratio: 48px;
  }
  .keno-grid li {
      font-size: 18px;
      border-radius: 12px;
  }
}
@media (max-width: 767px) {
  .keno {
      --ratio: 36px;
  }
  .keno-grid {
      grid-gap: 8px;
  }
  .keno-grid li {
      border-radius: 8px;
      font-size: 10px;
  }
}
.game-panel {
  background-color: #17191e;
  border-radius: 20px;
  padding: 20px;
}
.game-panel--sm {
  padding: 16px;
}
.game-panel-toggle {
  position: relative;
  cursor: pointer;
}
.game-panel-toggle__switch {
  min-height: 18px;
  width: 32px;
  border-radius: 10px;
  position: absolute;
  pointer-events: none;
  left: 0;
  top: 0;
  z-index: 1;
  font-size: 8px;
  font-weight: 500;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  text-align: center;
  -webkit-transition: 0.4s;
  transition: 0.4s;
  background-color: #eb6054;
  will-change: transform, background-color, left;
  -webkit-transform: translateX(0);
  -ms-transform: translateX(0);
  transform: translateX(0);
}
.game-panel-toggle input {
  min-height: 18px;
  min-width: 44px;
  border-radius: 12px;
  background-color: #242730;
  margin: 0;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
}
.game-panel-toggle input:checked ~ .game-panel-toggle__switch {
  background-color: #54b466;
  left: 100%;
  -webkit-transform: translateX(-100%);
  -ms-transform: translateX(-100%);
  transform: translateX(-100%);
}
.game-panel-stop__flex {
  font-size: 14px;
  font-weight: 700;
}
.game-panel-stop__icon {
  width: 16px;
  aspect-ratio: 1;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  border-radius: 6px;
  background-image: var(--green-gradient);
}
.game-panel-stop__icon img {
  width: 8px;
  height: 8px;
}
.game-panel-play {
  min-height: clamp(58px, 5vw, 80px);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  border-radius: 12px;
  font-size: 14px;
  font-weight: 700;
  background-image: var(--green-gradient);
}
.game-panel-bordered {
  min-height: 60px;
  padding: 0 20px;
}
.game-panel-flex {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  grid-gap: 6px;
}
.game-panel-flex__value {
  font-size: 14px;
  font-weight: 700;
}
.game-panel-flex__value img,
.game-panel-flex__value svg {
  width: 16px;
  height: 16px;
  fill: #78a887;
}
.game-panel-flex__button {
  min-height: 28px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  grid-gap: 4px;
  text-align: center;
  padding: 0 12px;
  font-size: 11px;
  color: #b1b5c2;
  font-weight: 500;
  background-color: #2f343c;
  border-radius: 6px;
  position: relative;
}
.game-panel-flex__button > * {
  position: relative;
  z-index: 1;
}
.game-panel-flex__button span {
  z-index: 1;
  -webkit-transition: color 0.3s;
  transition: color 0.3s;
}
.game-panel-flex__button svg {
  fill: rgba(var(--clr-w), 1);
  width: 10px;
  height: 10px;
}
.game-panel-flex__button::after {
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  background-image: var(--green-gradient);
  top: 0;
  left: 0;
  border-radius: inherit;
  pointer-events: none;
  opacity: 0;
  -webkit-transition: opacity 0.3s;
  transition: opacity 0.3s;
}
.game-panel-flex__button--selected::after {
  opacity: 1;
}
.game-panel-flex__button--selected span {
  color: rgba(var(--clr-w), 1);
}
.game-panel-flex__button_iconed {
  padding: 0 8px;
}
.game-panel-unit {
  border: 1px solid #1e2127;
  border-radius: 12px;
}
.game-panel-rounded {
  background-color: #1e2127;
  border-radius: 50%;
  min-height: 26px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  aspect-ratio: 1;
  font-size: 11px;
  font-weight: 700;
  position: relative;
}
.game-panel-rounded--green {
  color: #5e8d6c;
}
.game-panel-rounded--green::after {
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  border-radius: inherit;
  top: 0;
  left: 0;
  background-image: var(--green-gradient);
  opacity: 0.15;
  pointer-events: none;
}
.game-panel-rounded--green > * {
  position: relative;
  z-index: 1;
}
.game-panel-rounded svg {
  width: 14px;
  height: 14px;
  fill: #b1b5c2;
}
.game-panel-slider__filled {
  background-image: var(--green-gradient);
  position: absolute;
  height: 100%;
  top: 0;
  left: 0;
  border-radius: inherit;
}
.game-panel-slider__bar,
.game-panel-slider__bar img {
  width: 100%;
}
.game-panel-slider__thumb {
  background-color: rgba(var(--clr-w), 1);
  min-height: 32px;
  border-radius: 112px;
  padding: 0 10px;
  position: absolute;
  top: 50%;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  left: 50%;
  cursor: pointer;
  will-change: box-shadow;
  -webkit-transition: -webkit-box-shadow 0.4s;
  transition: box-shadow 0.4s;
  transition: box-shadow 0.4s, -webkit-box-shadow 0.4s;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  grid-gap: 4px;
}
@media (any-hover: hover) {
  .game-panel-slider__thumb:hover {
      -webkit-box-shadow: 0 0 4px 4px #3d6a49;
      box-shadow: 0 0 4px 4px #3d6a49;
  }
  .crash-values__item:hover {
      --opacity: 0.3;
  }
}
.game-panel-slider__thumb-icon {
  max-width: 14px;
}
.game-panel-slider__thumb-icon--right {
  -webkit-transform: scaleX(-1);
  -ms-transform: scaleX(-1);
  transform: scaleX(-1);
}
.game-panel-slider__thumb span {
  background-color: #376ac0;
  opacity: 0.1;
  display: block;
  height: 16px;
  width: 2px;
  border-radius: 112px;
}
.game-panel-slider__input {
  margin: 10px 0 20px;
  position: relative;
  background-color: #1e2127;
  min-height: 10px;
  border-radius: 112px;
}
.game-panel-sizes__button {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  text-align: center;
  font-size: 12px;
  font-weight: 500;
  color: #424650;
}
.game-panel-bet {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  grid-gap: 10px;
}
.game-panel-bet__inner {
  grid-gap: 24px;
}
.game-panel-bet__amount {
  font-size: 12px;
  font-weight: 700;
}
.game-panel-bet__amount input {
  background: var(--color-bg);
  color: #fff;
  width: 72px;
}
.game-panel-bet__multiplies {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  overflow-x: auto;
  grid-gap: 6px;
}
.game-panel-bet__multiplies::-webkit-scrollbar {
  display: none;
}
.game-panel-bet__multiplies-button {
  background-color: #242730;
  border-radius: 6px;
  min-height: 28px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  min-width: 46px;
  color: #b1b5c2;
  font-size: 11px;
  font-weight: 500;
  -ms-flex-negative: 0;
  flex-shrink: 0;
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
}
.game-panel-bet__multiplies-button img,
.game-panel-bet__multiplies-button svg {
  width: 16px;
  aspect-ratio: 1;
}
.game-panel-bet__multiplies-button--sm {
  min-height: 28px;
  min-width: 28px;
}
.game-panel-bet__multiplies--sm > :not(:last-child) {
  min-width: 62px;
}
.game-panel-flex {
  grid-gap: 6px;
}
.game-panel-label {
  color: #424650;
  font-size: 12px;
}
.game-panel-label--sm {
  font-size: 10px;
}
.game-panel-box {
  background-color: #1e2127;
  border-radius: 12px;
  padding: 16px;
}
.game-panel-statistics > div {
  min-height: 80px;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
}
.game-panel-statistics__amount {
  font-weight: 700;
}
.game-panel-statistics__label {
  color: #424650;
  font-size: 12px;
}
.game-panel-actions__button {
  min-height: 46px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  border-radius: 10px;
  padding: 0 20px;
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
}
.game-panel-actions__button--orange {
  background-image: -webkit-gradient(linear, left top, left bottom, from(#ffc46c), to(#d38209));
  background-image: linear-gradient(to bottom, #ffc46c 0, #d38209 100%);
  color: rgba(var(--clr-b), 1);
}
.game-panel-actions__button--green {
  background-image: var(--green-gradient);
}
.game-panel-button {
  width: 40px;
  aspect-ratio: 1;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  border-radius: 10px;
  background-color: #1e2127;
}
.game-panel-button img,
.game-panel-button svg {
  width: 16px;
  aspect-ratio: 1;
}
.game-panel-inner {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  grid-gap: 16px;
}
.game-panel-header {
  margin-bottom: 20px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  font-weight: 700;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
}
.game-panel-header__aside {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  grid-gap: 12px;
}
.game-panel-header__controls {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  grid-gap: 10px;
}
.game-panel-header__name {
  width: 48px;
  aspect-ratio: 1;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  border-radius: 12px;
  font-size: 16px;
  font-weight: 700;
  background-image: -webkit-gradient(linear, left top, left bottom, from(#78a887), to(#3d6a49));
  background-image: linear-gradient(to bottom, #78a887 0, #3d6a49 100%);
}
.game-panel-header__name svg {
  fill: rgba(var(--clr-w), 1);
  height: 18px;
}
.game-panel-header__name img,
.game-panel-header__name svg {
  width: 18px;
  aspect-ratio: 1;
}
.game-panel-cols {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: (1fr) [var(--count) ];
  grid-template-columns: repeat(var(--count), 1fr);
  grid-gap: 12px;
}
.game-panel-cols--two {
  --count: 2;
}
.game-panel-cols--three {
  --count: 3;
}
@media (max-width: 1540px) {
  .game-panel-cols--three {
      --count: 2;
  }
  .game-panel-cols--three > :last-child {
      -ms-grid-column-span: 2;
      grid-column: span 2;
  }
}
.game-panel--shorted .game-panel-bet__multiplies-button {
  min-width: 60px;
  min-height: 30px;
  aspect-ratio: initial;
  background-color: #20232b;
}
.game-panel--shorted .game-panel-bet__multiplies-button--sm {
  min-width: 30px;
}
.box--sm {
  padding: 16px 10px;
}
.box--sm > * {
  margin-bottom: 0 !important;
}
.box--sm .game-panel-header {
  position: relative;
  padding: 0 6px 16px;
}
.box--sm .game-panel-header::after {
  content: "";
  position: absolute;
  width: calc(100% + 20px);
  left: 50%;
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  transform: translateX(-50%);
  background-color: var(--bg-body);
  height: 1px;
  bottom: 0;
  pointer-events: none;
}
.box-arrow {
  height: 104px;
  pointer-events: none;
  left: 50%;
  top: 50%;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
}
.box-arrow img {
  height: 24px;
}
.box-arrow img:nth-child(1) {
  -webkit-transform: scaleY(-1);
  -ms-transform: scaleY(-1);
  transform: scaleY(-1);
}
.box-inner {
  position: relative;
}
.box-inner::after,
.box-inner::before {
  --direction: right;
  content: "";
  position: absolute;
  width: 20%;
  height: 72%;
  background-image: -webkit-gradient(linear, right top, left top, from(#17191e), to(rgba(23, 25, 30, 0)));
  background-image: linear-gradient(to left, #17191e 0, rgba(23, 25, 30, 0) 100%);
  top: 50%;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
  pointer-events: none;
  z-index: 1;
}
.box-inner::before {
  left: 0;
  -webkit-transform: translateY(-50%) scaleX(-1);
  -ms-transform: translateY(-50%) scaleX(-1);
  transform: translateY(-50%) scaleX(-1);
}
.box-inner::after {
  right: 0;
}
.box-tape {
  min-height: 130px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  grid-gap: 12px;
  overflow-x: auto;
}
.box-tape::-webkit-scrollbar {
  display: none;
}
.box-tape__item {
  overflow-x: auto;
  min-height: 86px;
  min-width: 86px;
  border-radius: 24px;
  background-image: var(--bg);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  grid-gap: 12px;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  text-transform: uppercase;
  text-align: center;
  font-size: 14px;
  font-weight: 500;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}
.box-tape__item img,
.box-tape__item svg {
  width: 22px;
  height: 22px;
}
.box-tape__item--green {
  --bg: linear-gradient(#477841 0%, #5da752 100%);
}
.box-tape__item--red {
  --bg: linear-gradient(#812722 0%, #e64f49 100%);
}
.box-tape__item--purple {
  --bg: linear-gradient(#553672 0%, #8b41b2 100%);
}
.box-tape__item--orange {
  --bg: linear-gradient(#a15322 0%, #e89f47 100%);
}
.box-tape__item--navy {
  --bg: linear-gradient(#33475c 0%, #487274 100%);
}
.box-tape__item--blue {
  --bg: linear-gradient(#2e355f 0%, #384680 100%);
}
.steps-bar {
  position: relative;
  min-height: 6px;
  background-image: url(../img/barsMask.svg);
  background-size: cover;
  background-repeat: no-repeat;
  width: 100%;
}
.steps-bar__filled {
  background-image: var(--green-gradient);
  position: absolute;
  height: 100%;
  top: 0;
  left: 0;
  border-radius: 112px;
}
.steps-bar__value {
  top: 50%;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
  position: absolute;
  width: 24px;
  aspect-ratio: 1;
  border-radius: 50%;
  font-size: 11px;
  font-weight: 500;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  text-align: center;
  background-color: #2f343c;
  color: #5a606e;
}
.steps-bar__value--first {
  left: 0;
}
.steps-bar__value--second {
  left: 33.333%;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}
.steps-bar__value--third {
  left: 66.666%;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}
.steps-bar__value--fourth {
  left: 100%;
  -webkit-transform: translate(-100%, -50%);
  -ms-transform: translate(-100%, -50%);
  transform: translate(-100%, -50%);
}
.steps-bar__previous {
  background-color: #558362;
  color: #8abf99;
}
.steps-bar__current {
  background: var(--green-gradient);
  width: 24px;
  -webkit-box-shadow: 0 0 0 4px rgba(120, 168, 135, 0.15);
  box-shadow: 0 0 0 4px rgba(120, 168, 135, 0.15);
  color: rgba(var(--clr-w), 1);
}
.game-grid {
  --gap: 24px;
  display: -ms-grid;
  display: grid;
  grid-gap: var(--gap);
  -ms-grid-columns: calc(30% - var(--gap) / 2) calc(70% - var(--gap) / 2);
  grid-template-columns: calc(30% - var(--gap) / 2) calc(70% - var(--gap) / 2);
}
.game-grid > * {
  background-color: #17191e;
  border-radius: 12px;
}
.game-grid .box {
  padding: 20px;
}
.game-history-label {
  color: #b1b5c2;
  font-size: 12px;
  display: block;
  margin-bottom: 8px;
  font-weight: 500;
}
.game-history-inner {
  position: relative;
}
.game-history-inner::after {
  content: "";
  position: absolute;
  width: 28%;
  height: 100%;
  top: 50%;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
  right: 0;
  background-image: -webkit-gradient(linear, right top, left top, from(#17191e), to(rgba(23, 25, 30, 0.48)));
  background-image: linear-gradient(to left, #17191e 0, rgba(23, 25, 30, 0.48) 100%);
  pointer-events: none;
}
.game-history-list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  grid-gap: 6px;
  overflow-x: auto;
}
.game-history-list::-webkit-scrollbar {
  display: none;
}
.game-history-item {
  width: 6px;
  border-radius: 112px;
  background-image: var(--bg);
  -ms-flex-negative: 0;
  flex-shrink: 0;
}
.game-history-item--purple {
  --bg: linear-gradient(to top, #674dc8 0%, #8567f8 100%);
}
.game-history-item--yellow {
  --bg: linear-gradient(to top, #bb7c1e 0%, #f1ac44 100%);
}
.game-history-item--blue {
  --bg: linear-gradient(to top, #6674a2 0%, #9aa9e3 100%);
}
.game-history-item--red {
  --bg: linear-gradient(to top, #ab3c38 0%, #fa6761 100%);
}
.game-history-item--green {
  --bg: linear-gradient(to top, #479355 0%, #47ad5b 100%);
}
.game-history-item--short {
  height: 13px;
}
.game-history-item--height {
  height: 26px;
}
.game-history--gradientless .game-history-label {
  color: #424650;
}
.game-history--gradientless .game-history-inner::after {
  display: none;
}
@media (max-width: 1239px) {
  .game-grid {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
      -ms-flex-direction: column;
      flex-direction: column;
      grid-gap: 10px;
  }
  .steps-bar__value {
      width: 20px;
      height: 20px;
      font-size: 10px;
  }
  .game-panel-unit .game-panel-box {
      padding: 0 11px;
      min-height: 42px;
  }
  .game-panel-inner {
      grid-gap: 12px;
  }
  .game-panel-bordered {
      min-height: 42px;
      padding: 0 16px;
  }
  .game-panel-box {
      padding: 10px;
  }
  .game-panel-rounded {
      min-height: 20px;
      font-size: 10px;
  }
  .game-panel-rounded img,
  .game-panel-rounded svg {
      width: 10px;
      height: 10px;
  }
  .game-panel-flex__value {
      grid-gap: 6px;
      font-size: 10px;
  }
  .game-panel-flex__value img,
  .game-panel-flex__value svg {
      width: 12px;
      height: 12px;
  }
  .game-panel-flex__button {
      min-height: 20px;
      padding: 0 8px;
      font-size: 9px;
  }
  .game-panel-flex__button img,
  .game-panel-flex__button svg {
      max-width: 10px;
  }
  .game-panel-header__aside {
      grid-gap: 8px;
      font-size: 12px;
  }
  .game-panel-header__name {
      border-radius: 8px;
      width: 36px;
      height: 36px;
  }
  .game-panel-header__name img,
  .game-panel-header__name svg {
      width: 14px;
      height: 14px;
  }
  .game-panel-header__controls {
      grid-gap: 8px;
  }
  .game-panel-button {
      border-radius: 8px;
      width: 30px;
  }
  .game-panel-button img {
      max-width: 12px;
  }
  .game-panel-label {
      font-size: 8px;
  }
  .game-panel-bet__amount {
      font-size: 12px;
  }
  .game-panel-bet__amount img {
      max-width: 10px;
  }
  .game-panel-bet__multiplies {
      grid-gap: 3px;
  }
  .game-panel-bet__multiplies-button {
      min-width: 58px !important;
      min-height: 30px;
  }
  .game-panel-bet__multiplies-button img {
      width: 10px;
      height: 10px;
  }
  .game-panel-bet__multiplies-button--sm {
      min-width: 30px !important;
      min-height: 30px !important;
  }
  .game-panel-statistics__amount {
      font-size: 12px;
  }
  .game-panel-statistics__label {
      font-size: 10px;
  }
  .game-panel-cols {
      grid-gap: 10px;
  }
  .game-panel-cols--three {
      --count: 3;
  }
  .game-panel-cols--three > :last-child {
      grid-column: initial;
  }
  .game-panel-cols > * {
      min-height: 64px !important;
      padding: 0;
      -webkit-box-pack: center !important;
      -ms-flex-pack: center !important;
      justify-content: center !important;
      grid-gap: 4px;
  }
  .game-panel-actions__button {
      border-radius: 8px;
      font-size: 10px;
      font-weight: 500;
      min-height: 34px !important;
  }
}
@media (max-width: 767px) {
  .game-panel {
      padding: 14px;
  }
}
@media (max-width: 576px) {
  .game-panel-bet__multiplies-button {
      min-width: 56px;
  }
  .box-tape {
      grid-gap: 10px;
  }
  .box-tape__item {
      min-width: 80px;
      min-height: 80px;
  }
}
.crazyshoot-tape {
  min-height: 296px;
  background-size: cover;
  background-image: url(../img/tapeBg.png);
  border-radius: 12px;
  margin-bottom: 12px;
  padding: 20px 30px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}
.crazyshoot-panel {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  grid-gap: 24px;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  margin-bottom: 20px;
}
.crazyshoot-btn {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  background-color: var(--bg-chat);
  padding: 0 12px;
  min-height: 42px;
  border-radius: 12px;
  color: #b1b5c2;
  grid-gap: 8px;
  font-size: 11px;
  font-weight: 500;
}
.crazyshoot-btn img {
  max-width: 20px;
}
.crazyshoot-multiplies {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  grid-gap: 10px;
}
.crazyshoot-multiplies__btn {
  --opacity: 0.2;
  min-height: 42px;
  aspect-ratio: 1;
  font-size: 12px;
  font-weight: 600;
  border-radius: 12px;
  background: rgba(var(--bg), var(--opacity));
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  text-align: center;
  color: rgba(var(--bg), 1);
}
.crazyshoot-multiplies__btn:nth-child(1) {
  background: -webkit-gradient(linear, left top, left bottom, from(rgba(81, 163, 251, var(--opacity))), to(rgba(81, 95, 251, var(--opacity))));
  background: linear-gradient(rgba(81, 163, 251, var(--opacity)) 0, rgba(81, 95, 251, var(--opacity)) 100%);
}
.crazyshoot-multiplies__btn:nth-child(2) {
  --bg: 126, 47, 255;
}
.crazyshoot-multiplies__btn:nth-child(3) {
  --bg: 17, 128, 108;
}
.crazyshoot-multiplies__btn:nth-child(4) {
  --bg: 100, 130, 15;
}
.crazyshoot-multiplies__btn:nth-child(5) {
  --bg: 160, 56, 23;
}
.crazyshoot-multiplies__btn:nth-child(6) {
  --bg: 255, 107, 0;
}
.crazyshoot-multiplies__btn--selected {
  --opacity: 1;
}
.crazyshoot-spin {
  --radius: 12px;
  min-width: 188px;
  padding: 0 30px;
  font-size: 11px;
  text-transform: uppercase;
  font-weight: 600;
}
.crazyshoot-buttons {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: (1fr) [4];
  grid-template-columns: repeat(4, 1fr);
  grid-gap: 16px;
}
.crazyshoot-buttons__item {
  padding: 0 20px;
  min-height: 58px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  text-align: center;
  font-size: 18px;
  font-weight: 600;
  border-radius: 16px;
  background-image: var(--bg);
}
.crazyshoot-buttons__item--turquoise {
  --bg: linear-gradient(#59a5b1 0%, #245a62 100%);
}
.crazyshoot-buttons__item--brown {
  --bg: linear-gradient(#d6b288 0%, #80613d 100%);
}
.crazyshoot-buttons__item--dustyrose {
  --bg: linear-gradient(#b1848d 0%, #583f44 100%);
}
.crazyshoot-buttons__item--purple {
  --bg: linear-gradient(#8d87b8 0%, #4b4863 100%);
}
.crazyshoot-buttons__item--crazytime {
  --bg: linear-gradient(#f2625d 0%, #ab3c38 100%);
}
.crazyshoot-buttons__item--cash {
  --bg: linear-gradient(#6c9a48 0%, #416627 100%);
}
.crazyshoot-buttons__item--coinflip {
  --bg: linear-gradient(#4f9acc 0%, #19567c 100%);
}
.crazyshoot-buttons__item--pachinko {
  --bg: linear-gradient(#cf649b 0%, #b71d6c 100%);
}
.crazyshoot-buttons__item--filled {
  position: relative;
  overflow: hidden;
  font-size: 14px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
}
.crazyshoot-buttons__item--filled::after {
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  pointer-events: none;
  background-size: 100% 100%;
  background-repeat: no-repeat;
  top: 0;
  left: 0;
  background-image: url(../img/buttonBg.png);
}
.crazyshoot-buttons__item--filled > * {
  position: relative;
}
.tape-cards {
  min-height: 180px;
  width: 100%;
  margin-bottom: 26px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  grid-gap: 20px;
  overflow-y: auto;
}
.tape-cards::-webkit-scrollbar {
  display: none;
}
.tape-cards__item {
  -ms-flex-negative: 0;
  flex-shrink: 0;
  min-height: 180px;
  min-width: 120px;
  border-radius: 10px;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  position: relative;
}
.tape-cards__item-value {
  position: absolute;
  font-size: 32px;
  font-weight: 700;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  z-index: 1;
}
.tape-cards__item--red {
  background-image: url(../img/shoot/card_red.png);
}
.tape-cards__item--blue {
  background-image: url(../img/shoot/card_blue.png);
}
.tape-cards__item--brown {
  background-image: url(../img/shoot/card_brown.png);
}
.tape-cards__item--dark {
  background-image: url(../img/shoot/card_dark.png);
}
.tape-cards__item--navy {
  background-image: url(../img/shoot/card_navy.png);
}
.tape-cards__item--gradient {
  background-image: url(../img/shoot/card_gradient.png);
}
@media (max-width: 767px) {
  .crazyshoot-tape {
      padding: 20px 0;
  }
  .crazyshoot-multiplies {
      grid-area: multiplies;
      -ms-grid-row: 1;
      -ms-grid-column: 1;
      -ms-grid-column-span: 3;
  }
  .crazyshoot-btn:nth-child(1) {
      grid-area: btn-remove;
      -ms-grid-row: 3;
      -ms-grid-column: 1;
  }
  .crazyshoot-btn:nth-child(2) {
      grid-area: btn-repeat;
      -ms-grid-row: 3;
      -ms-grid-column: 3;
  }
  .crazyshoot-buttons {
      -ms-grid-columns: (1fr) [2];
      grid-template-columns: repeat(2, 1fr);
      grid-gap: 10px;
  }
  .crazyshoot-panel {
      display: -ms-grid;
      display: grid;
      max-width: 300px;
      margin: 0 auto 16px;
      grid-gap: 16px 54px;
      grid-template-areas: "multiplies multiplies" "btn-remove btn-repeat";
  }
}
.chat {
  position: fixed;
  height: 100%;
  right: 0;
  top: 0;
  width: var(--chat-w);
  --p: 20px;
  background-color: var(--bg-chat);
  border-left: 1px solid rgba(var(--g-border-clr), 1);
}
.chat-container {
  height: 100vh;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
}
.chat-header {
  padding: 24px var(--p);
  border-bottom: 1px solid rgba(var(--g-border-clr), 1);
}
.chat-tape {
  padding: var(--p);
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
  overflow-y: auto;
  position: relative;
}
.chat-tape::-webkit-scrollbar {
  width: 5px;
}
.chat-tape::-webkit-scrollbar-track {
  background: 0 0;
}
.chat-tape::-webkit-scrollbar-thumb {
  border-radius: 4px;
  background-color: #51665a;
}
.chat-footer input {
  background-color: #1b1e24;
  padding: 24px;
  width: 100%;
  border: none;
  outline: 0;
  font-size: 11px;
  color: rgba(var(--clr-w), 1);
}
.chat-footer input::-webkit-input-placeholder {
  color: #596070;
}
.chat-footer input::-moz-placeholder {
  color: #596070;
}
.chat-footer input:-ms-input-placeholder {
  color: #596070;
}
.chat-footer input::-ms-input-placeholder {
  color: #596070;
}
.chat-footer input::placeholder {
  color: #596070;
}
.chat-promo {
  border: solid #51665a;
  border-radius: 20px;
  padding: clamp(24px, 2.125vw, 34px);
  background-color: #3f5247;
}
.chat-promo__heading {
  color: rgba(var(--clr-green), 1);
  font-weight: 900;
  font-size: 13px;
  text-transform: uppercase;
  display: block;
  margin-bottom: 16px;
}
.chat-counter {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  grid-gap: 7px;
}
.chat-counter__dots {
  color: #433614;
  opacity: 0.5;
  font-size: 14px;
  font-weight: 700;
}
.chat-counter__unit {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  grid-gap: 6px;
}
.chat-counter__item {
  min-height: 36px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  text-align: center;
  padding: 0 6px;
  background-color: rgba(var(--clr-green), 0.25);
  min-width: 28px;
  border-radius: 8px;
  font-size: 16px;
  font-weight: 900;
  color: rgba(var(--clr-green), 1);
}
.messages,
.ss-content {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  grid-gap: 20px;
}
.messages-item {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 48px 1fr;
  grid-template-columns: 48px 1fr;
  grid-gap: 20px;
}
.messages-avatar {
  width: 48px;
  aspect-ratio: 1;
  border-radius: 50%;
  overflow: hidden;
  position: relative;
  background-color: #212636;
}
.messages-avatar::after {
  content: "";
  position: absolute;
  width: 18px;
  height: 18px;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  background-image: url(../img/new/icons/userIcon.svg);
  background-size: 100% 100%;
  background-repeat: no-repeat;
  pointer-events: none;
  z-index: 1;
}
.messages-avatar > * {
  z-index: 2;
}
.messages-avatar img {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
}
.messages-post {
  padding: 12px 20px;
}
.messages-post img {
  max-width: 100px;
}
.messages-user {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  grid-gap: 8px;
}
.messages-user__name {
  font-size: 12px;
  font-weight: 500;
}
.messages-user__rank {
  font-weight: 500;
  text-transform: uppercase;
  padding: 2px 12px;
  min-height: 26px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}
.messages-promo {
  color: rgba(var(--clr-r), 1);
  font-size: 11px;
  font-weight: 500;
}
.messages-block {
  background-color: #242730;
  border-radius: 24px;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  font-size: 10px;
  color: #b1b5c2;
}
.messages-header {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  margin-bottom: 10px;
}
.messages-date {
  font-size: 9px;
  color: #424650;
}
@media (max-width: 1239px) {
  .chat {
      position: fixed;
      width: 100%;
      height: 100%;
      height: calc(100% - var(--header-h));
      top: var(--header-h);
      left: 0;
      z-index: 5;
      opacity: 0;
      pointer-events: none;
      -webkit-transition: 0.4s;
      transition: 0.4s;
  }
  .chat-container {
      padding-bottom: 158px;
  }
  .chat--opened {
      opacity: 1;
      pointer-events: all;
  }
}
.coinflip {
  --center-ratio: 280px;
  --border-clr: #25262c;
}
.coinflip .box {
  padding: 34px clamp(16px, 2.625vw, 42px);
}
.coinflip-game {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  align-items: center;
  grid-gap: 24px;
  align-items: center;
}
.coinflip-game__center {
  width: 100%;
  margin: 0 auto;
  max-width: var(--center-ratio);
  border-radius: 50%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  border: 1px solid var(--border-clr);
  aspect-ratio: 1;
  position: relative;
}
.coinflip-game__center::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  width: 100%;
  height: 1px;
  pointer-events: none;
  background-color: var(--border-clr);
}
.coinflip-game__center img {
  position: relative;
  z-index: 1;
  width: 60%;
  aspect-ratio: 1;
  margin: 0 auto;
}
.coinflip-game__coin {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  grid-gap: 10px;
  width: 100%;
  max-width: clamp(160px, 12.5vw, 200px);
  min-height: 72px;
  padding: 0 12px;
  background-image: -webkit-gradient(linear, left top, left bottom, from(#242730), to(#1e2127));
  background-image: linear-gradient(#242730 0, #1e2127 100%);
  border-radius: 110px;
  font-size: 14px;
  font-weight: 700;
}
.coinflip-game__coin img,
.coinflip-game__coin svg {
  max-width: 48px;
}
.coinflip-game__coin-name {
  position: relative;
}
.coinflip-game__coin-name span {
  position: relative;
  z-index: 1;
}
.coinflip-game__coin-name::after {
  content: attr(data-content);
  position: absolute;
  color: #2b2e37;
  font-size: 24px;
  font-weight: 700;
  top: 50%;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
  text-transform: uppercase;
}
[data-content="Tails"]::after {
  left: -5px;
}
[data-content="Heads"] {
  margin: 0 auto;
}
[data-content="Heads"]::after {
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}
@media (max-width: 1640px) {
  :root {
      --chat-w: 340px;
  }
  .coinflip-game {
      display: -ms-grid;
      display: grid;
      grid-gap: 28px 20px;
      -ms-grid-columns: 1fr 20px 1fr;
      grid-template-columns: repeat(2, 1fr);
      -ms-grid-rows: auto 28px auto;
      grid-template-areas: "center center" "tails heads";
  }
  .coinflip-game__center {
      grid-area: center;
      -ms-grid-row: 1;
      -ms-grid-column: 1;
      -ms-grid-column-span: 3;
  }
  .coinflip-game__coin {
      max-width: 100%;
  }
  .coinflip-game__coin--tails {
      grid-area: tails;
      -ms-grid-row: 3;
      -ms-grid-column: 1;
  }
  .coinflip-game__coin--heads {
      grid-area: heads;
      -ms-grid-row: 3;
      -ms-grid-column: 3;
  }
}
@media (max-width: 1239px) {
  .coinflip-game__center {
      max-width: 220px;
  }
  .coinflip-game__coin {
      min-height: 56px;
  }
  .coinflip-game__coin-name {
      font-size: 12px;
  }
  .coinflip-game__coin-name::after {
      font-size: 18px;
  }
  .coinflip-game__coin img {
      max-width: 38px;
  }
}
.mines {
  --card-bg-accent: 30, 33, 39;
}
.mines-game {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: auto 1fr auto;
  grid-template-columns: auto 1fr auto;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  grid-gap: 24px;
}
.mines-game__grid {
  display: -ms-grid;
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(70px, 1fr));
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  grid-gap: 16px;
}
.mines-game__icon {
  width: 60px;
  aspect-ratio: 1;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  margin-bottom: 12px;
  border-radius: 16px;
  background-color: var(--icon-box-bg);
}
.mines-game__icon img {
  max-width: 44px;
}
.mines-game__title {
  font-size: 14px;
  font-weight: 700;
}
.mines-game__inner {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  grid-gap: 8px;
}
.mines-game__description {
  font-size: 8px;
  font-weight: 500;
  color: #68737d;
}
.mines-game__col {
  padding-top: 20px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  text-align: center;
  max-width: 130px;
  min-height: 140px;
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
  border: 1px solid #242935;
  border-radius: 20px;
  position: relative;
}
.mines-game__col::after {
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  background-image: -webkit-gradient(linear, left bottom, left top, from(var(--bg)), to(rgba(var(--card-bg-accent), 0)));
  background-image: linear-gradient(to top, var(--bg) 0, rgba(var(--card-bg-accent), 0) 100%);
  border-radius: inherit;
  opacity: 0.05;
  pointer-events: none;
}
.mines-game__col--green {
  --clr: #54b466;
  --bg: #659d46;
  --mark-icon-bg: #3f974f;
  --icon-box-bg: #202729;
}
.mines-game__col--red {
  --mark-icon-bg: #b24440;
  --clr: #d24e49;
  --bg: #d24e49;
  --icon-box-bg: #262228;
}
.mines-game__col--red p {
  color: #9f97a8 !important;
}
.mines-game__mark {
  min-height: 32px;
  border-radius: 6px 6px 0 0;
  padding: 0 10px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  font-size: 10px;
  font-weight: 700;
  background-color: var(--clr);
  margin: 0 auto;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  grid-gap: 4px;
}
.mines-game__mark-icon {
  border-radius: 6px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  width: 18px;
  aspect-ratio: 1;
  background-color: var(--mark-icon-bg);
}
.mines-game__mark-icon svg {
  width: 10px;
  height: 10px;
  fill: rgba(var(--clr-w), 1);
}
.mines-game__card {
  min-height: 74px;
  background-image: -webkit-gradient(linear, left top, left bottom, from(#252830), to(#1e2127));
  background-image: linear-gradient(#252830 0, #1e2127 100%);
  border-radius: 20px;
  position: relative;
  border: 1px solid #242830;
  cursor: pointer;
  -webkit-transition: -webkit-transform 0.4s;
  transition: transform 0.4s;
  transition: transform 0.4s, -webkit-transform 0.4s;
  will-change: transform;
}
.mines-game__card:not(.mines-game__card--picked):hover {
  -webkit-transform: scale(1.1);
  -ms-transform: scale(1.1);
  transform: scale(1.1);
}
.mines-game__card svg {
  position: absolute;
  max-width: 30px;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%) scale(0.85);
  -ms-transform: translate(-50%, -50%) scale(0.85);
  transform: translate(-50%, -50%) scale(0.85);
  fill: var(--icon-clr);
  -webkit-transition: 0.4s;
  transition: 0.4s;
  will-change: transform, opacity;
  z-index: 1;
  opacity: 0;
}
.mines-game__card--picked svg {
  opacity: 1;
  -webkit-transform: translate(-50%, -50%) scale(1);
  -ms-transform: translate(-50%, -50%) scale(1);
  transform: translate(-50%, -50%) scale(1);
}
.mines-game__card--picked::after {
  opacity: 1 !important;
}
.mines-game__card--green {
  --icon-clr: #78c886;
  --bg: linear-gradient(-120deg, #165521 0%, #65c577 100%);
}
.mines-game__card--red {
  --icon-clr: #642220;
  --bg: linear-gradient(-120deg, #792825 0%, #d85550 100%);
}
.mines-game__card::after {
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  background-image: var(--bg);
  border-radius: inherit;
  pointer-events: none;
  -webkit-transition: opacity 0.4s;
  transition: opacity 0.4s;
  opacity: 0;
}
.mines-game__card::before {
  content: "";
  width: 24px;
  height: 30px;
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  background-image: url(../img/icons/mineLogoIcon.svg);
  background-size: 100% 100%;
  pointer-events: none;
}
@media (max-width: 1440px) {
  .mines-game {
      display: block;
  }
  .mines-game__grid {
      grid-template-columns: repeat(auto-fill, minmax(54px, 1fr));
      grid-gap: 12px;
  }
  .mines-game__col {
      display: none;
  }
  .mines-game__card {
      border-radius: 14px;
      min-height: auto;
      aspect-ratio: 1;
  }
  .mines-game__card img,
  .mines-game__card svg {
      width: 24px;
      height: 24px;
  }
}
@media (max-width: 767px) {
  .mines .box {
      padding: 14px;
  }
  .mines-game__card {
      min-height: 56px;
  }
}
.dice-game {
  grid-gap: 20px;
}
.dice-game-header {
  border-radius: 20px;
  overflow: hidden;
  background-color: #17191e;
}
.dice-game-footer {
  position: relative;
}
.dice-game-footer::after {
  content: "";
  position: absolute;
  background-image: -webkit-gradient(linear, right top, left top, from(#121317), to(rgba(18, 19, 23, 0)));
  background-image: linear-gradient(to left, #121317 0, rgba(18, 19, 23, 0) 100%);
  width: 80px;
  height: 100%;
  top: 0;
  right: 0;
  pointer-events: none;
}
.dice-game-steps {
  overflow-x: auto;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: nowrap;
  flex-wrap: nowrap;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  grid-gap: 16px;
}
.dice-game-steps::-webkit-scrollbar {
  display: none;
}
.dice-game-steps__item {
  background-color: #17191e;
  border-radius: 12px;
  padding: 10px;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}
.dice-game-steps__header {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: (1fr) [2];
  grid-template-columns: repeat(2, 1fr);
  margin-bottom: 10px;
  border-radius: 6px;
  overflow: hidden;
  border: 1px solid #1e2127;
}
.dice-game-steps__option {
  padding: 0 8px;
  border-radius: inherit;
  min-height: 24px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  text-align: center;
  font-size: 8px;
  font-weight: 500;
}
.dice-game-steps__option--selected {
  background-color: #242730;
  font-weight: 700;
}
.dice-game-steps__value {
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  text-align: center;
  font-size: 12px;
  font-weight: 700;
}
.dice-game-steps__value img {
  max-width: 10px;
}
.dice-game-play {
  min-height: 48px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  text-align: center;
  --radius: 12px;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  -ms-flex-item-align: center;
  -ms-grid-row-align: center;
  align-self: center;
  padding: 0 30px;
  font-size: 11px;
  font-weight: 500;
  text-transform: uppercase;
}
.dice-game-numbers {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: (1fr) [4];
  grid-template-columns: repeat(4, 1fr);
}
.dice-game-numbers__item {
  min-height: 190px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  text-align: center;
  font-size: 100px;
  font-weight: 700;
  position: relative;
  background: -webkit-gradient(linear, left top, left bottom, from(rgba(18, 19, 23, 0)), color-stop(50%, rgba(36, 39, 48, 0.45)), to(rgba(18, 19, 23, 0)));
  background: linear-gradient(to bottom, rgba(18, 19, 23, 0) 0, rgba(36, 39, 48, 0.45) 50%, rgba(18, 19, 23, 0) 100%);
}
.dice-game-numbers__item_coma {
  font-size: 72px;
  background: -webkit-linear-gradient(#78a887 0, #3d6a49 100%);
  right: 0;
  -webkit-transform: translateX(50%);
  -ms-transform: translateX(50%);
  transform: translateX(50%);
  bottom: 24px;
  position: absolute;
  z-index: 1;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
.dice-game-numbers__item_gradient {
  position: absolute;
  width: 100%;
  height: 50%;
  top: 0;
  left: 0;
  background-size: 100% 100%;
  background-image: url(../img/daceNumberGradient.svg);
}
.dice-game-numbers__item::before {
  content: "";
  position: absolute;
  width: 50%;
  height: 3px;
  background-color: #639171;
  border-radius: 0 0 6px 6px;
  top: 0;
  left: 50%;
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  transform: translateX(-50%);
}
.dice-game-numbers__item:not(:last-child)::after {
  content: "";
  position: absolute;
  width: 2px;
  height: 82%;
  background-image: -webkit-gradient(linear, left top, left bottom, from(#181b27), color-stop(50%, #323749), to(#181b27));
  background-image: linear-gradient(#181b27 0, #323749 50%, #181b27 100%);
  right: 0;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  top: 50%;
}
@media (max-width: 767px) {
  .dice-game-header {
      border-radius: 10px;
  }
  .dice-game-numbers__item {
      min-height: 84px;
      font-size: 32px;
  }
  .dice-game-numbers__item_coma {
      font-size: 32px;
      bottom: 10px;
      -webkit-transform: translateX(50%);
      -ms-transform: translateX(50%);
      transform: translateX(50%);
      right: 1px;
  }
  .dice-game-numbers__item::before {
      width: 44px;
  }
}
.crash-values {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  grid-gap: 8px;
  overflow-x: auto;
  border-radius: 8px;
}
.crash-values::-webkit-scrollbar {
  display: none;
}
.crash-values__item {
  --opacity: 0.2;
  cursor: pointer;
  min-height: 24px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  text-align: center;
  padding: 0 12px;
  font-size: 10px;
  font-weight: 500;
  font-family: var(--ff-gs);
  border-radius: 8px;
  background-color: rgba(var(--clr), var(--opacity));
  color: rgba(var(--clr), 1);
  -webkit-transition: background-color 0.4s;
  transition: background-color 0.4s;
}
.crash-values__item--blue {
  --clr: 59, 123, 230;
}
.crash-values__item--grey {
  --clr: 150, 160, 175;
}
.crash-values__item--green {
  --clr: 84, 180, 102;
}
.crash-game {
  padding: 16px;
  min-height: 490px;
  position: relative;
  border-radius: 12px;
  overflow: hidden;
  background-color: rgba(33, 39, 57, 0.2);
}
.crash-game-rocket {
  position: absolute;
  bottom: 0;
  left: 0;
  max-width: 72%;
  pointer-events: none;
}
.crash-game__multiple {
  position: absolute;
  left: 50%;
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  transform: translateX(-50%);
  top: 100px;
  background-color: rgba(63, 82, 71, 0.15);
  border: 1px solid rgba(var(--clr-w), 0.05);
  border-radius: 12px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  text-align: center;
  min-height: 48px;
  font-family: var(--ff-gs);
  font-size: 20px;
  color: #91c8a8;
  padding: 0 20px;
}
.crash-game__progress {
  position: absolute;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  top: 50%;
  color: #b1b5c2;
  font-family: var(--ff-gs);
  font-size: 12px;
  font-weight: 500;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  grid-gap: 10px;
  z-index: 1;
}
.crash-game__progress-bar {
  position: relative;
  min-height: 6px;
  background-color: rgba(var(--clr-w), 0.05);
  border-radius: 112px;
  width: 130px;
  overflow: hidden;
}
.crash-game__progress-bar_filled {
  background-image: var(--green-gradient);
  position: absolute;
  height: 100%;
  top: 0;
  left: 0;
  border-radius: inherit;
}
.crash-game__dropdown {
  min-height: 24px;
  width: 28px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  border-radius: 8px;
  border: 1px solid rgba(119, 133, 179, 0.25);
}
.crash-game__dropdown img {
  max-width: 10px;
}
.crash-game__header {
  z-index: 1;
  background-color: #242730;
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 1fr auto;
  grid-template-columns: 1fr auto;
  gap: 12px;
  border-radius: 12px;
  padding: 10px;
  position: relative;
}
.crash-game-bg {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  mix-blend-mode: color-dodge;
  z-index: 1;
  pointer-events: none;
}
@media (max-width: 767px) {
  .crash-game {
      min-height: 360px;
  }
  .crash-game__multiple {
      top: 78px;
  }
}
.game-multiplier-cols {
  display: -ms-grid;
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  grid-gap: 12px;
}
.game-multiplier-header {
  border-radius: 12px;
  overflow: hidden;
}
.game-multiplier-header .game-multiplier-box {
  border-radius: 0 0 12px 12px;
}
.game-multiplier-col {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  grid-gap: 10px;
}
.game-multiplier-box {
  padding: 0 10px;
  min-height: 54px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  grid-gap: 10px;
  background-color: #17191e;
  border-radius: 12px;
  font-size: 12px;
  font-weight: 500;
}
.game-multiplier-box__icon {
  background-color: #20232b;
  width: 30px;
  height: 30px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  border-radius: 8px;
}
.game-multiplier-gradient {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  grid-gap: 8px;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  min-height: 60px;
  background-image: var(--bg);
  padding: 0 20px;
  font-size: 14px;
  text-transform: uppercase;
  font-weight: 500;
}
.game-multiplier-gradient--center {
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}
.game-multiplier-gradient img {
  max-width: 30px;
}
.game-multiplier-gradient--teal {
  --bg: linear-gradient(to bottom, #33475c 0%, #487274 100%);
}
.game-multiplier-gradient--teal_light {
  --bg: linear-gradient(to bottom, #6674a2 0%, #9aa9e3 100%);
  color: #282e46;
}
.game-multiplier-gradient--navy {
  --bg: linear-gradient(to bottom, #2e355f 0%, #384680 100%);
}
.game-multiplier-gradient--purple {
  --bg: linear-gradient(to bottom, #553672 0%, #8b41b2 100%);
}
.game-multiplier-gradient--purple_light {
  --bg: linear-gradient(to bottom, #674dc8 0%, #8567f8 100%);
  color: #251d40;
}
.game-multiplier-gradient--green {
  --bg: linear-gradient(to bottom, #477841 0%, #5da752 100%);
}
.game-multiplier-gradient--green_light {
  --bg: linear-gradient(to bottom, #479355 0%, #47ad5b 100%);
  color: #2b4a2b;
}
.game-multiplier-gradient--yellow {
  --bg: linear-gradient(to bottom, #bb7c1e 0%, #f1ac44 100%);
  color: #4d362a;
}
.game-multiplier-gradient--red {
  --bg: linear-gradient(to bottom, #812722 0%, #e64f49 100%);
}
.game-multiplier-gradient--red_light {
  --bg: linear-gradient(to bottom, #ab3c38 0%, #fa6761 100%);
  color: #422121;
}
.game-multiplier-gradient--orange {
  --bg: linear-gradient(to bottom, #a15322 0%, #e89f47 100%);
}
.game-multiplier-gradient--orange_light {
  --bg: linear-gradient(to bottom, #ae562c 0%, #f3783e 100%);
  color: #472e27;
}
.game-multiplier-user {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  grid-gap: 8px;
  font-size: 12px;
  font-weight: 500;
}
.game-multiplier-value {
  background-color: #20232b;
  min-height: 30px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  text-align: center;
  padding: 0 10px;
  font-size: 10px;
  grid-gap: 5px;
  border-radius: 8px;
  font-weight: 500;
}
.game-multiplier-value img {
  max-width: 10px;
}
.game-multiplier-icon {
  width: 36px;
  height: 36px;
  border-radius: 8px;
}
.game-multiplier-icon img {
  width: 100%;
  height: 100%;
  border-radius: inherit;
}
@media (max-width: 576px) {
  .game-multiplier-icon {
      width: 30px;
      height: 30px;
  }
  .game-multiplier-box {
      padding: 0 8px;
  }
  .game-multiplier-value {
      font-size: 8px;
      padding: 0 6px;
      min-height: 20px;
      border-radius: 6px;
  }
  .game-multiplier-value img {
      max-width: 8px;
  }
  .game-multiplier-user {
      font-size: 10px;
  }
  .game-multiplier-col {
      grid-gap: 8px;
  }
  .game-multiplier-cols {
      -ms-grid-columns: (1fr) [2];
      grid-template-columns: repeat(2, 1fr);
      grid-gap: 10px;
  }
  .game-multiplier-gradient {
      min-height: 48px;
  }
  .game-multiplier-gradient img {
      max-width: 24px;
  }
  .game-multiplier-box {
      font-size: 12px;
  }
}
.menu {
  position: fixed;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  background-color: #121317;
  z-index: 10;
  overflow-y: auto;
  padding-bottom: 16px;
  pointer-events: none;
  opacity: 0;
  -webkit-transition: 0.3s;
  transition: 0.3s;
}
.menu::-webkit-scrollbar {
  display: none;
}
.menu--opened {
  opacity: 1;
  pointer-events: all;
}
.menu-lang {
  min-height: 44px;
  -ms-grid-column-span: 2;
  grid-column: span 2;
  border: 1px solid #1c1f26;
  border-radius: 8px;
  position: relative;
  -webkit-transition: 0.4s;
  transition: 0.4s;
}
.menu-lang-item {
  font-size: 11px;
  font-weight: 600;
  text-transform: uppercase;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  grid-gap: 8px;
}
.menu-lang-item img {
  width: 24px;
  height: 24px;
  border-radius: 50%;
}
.menu-lang-selected {
  padding: 0 12px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  min-height: inherit;
}
.menu-lang-hidden {
  position: absolute;
  top: 100%;
  left: 50%;
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  transform: translateX(-50%);
  width: calc(100% + 1px);
  opacity: 0;
  pointer-events: none;
  -webkit-transition: opacity 0.4s;
  transition: opacity 0.4s;
  border-radius: 0 0 8px 8px;
}
.menu-lang-list > * {
  padding: 10px 12px;
  border-top: 1px solid #1c1f26;
}
.menu-lang-icon {
  width: 20px;
  height: 20px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  background-color: #1f2229;
  border-radius: 6px;
}
.menu-lang:hover {
  background-color: #17191e;
  border-color: transparent;
  border-radius: 8px 8px 0 0;
}
.menu-lang:hover .menu-lang-hidden {
  opacity: 1;
  pointer-events: all;
  background-color: inherit;
}
.menu-container {
  padding: 16px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  grid-gap: 16px;
}
.menu-grid {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: (1fr) [2];
  grid-template-columns: repeat(2, 1fr);
  grid-gap: 10px;
}
.menu-block {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  grid-gap: 12px;
}
.menu-close {
  width: 28px;
  aspect-ratio: 1;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  border-radius: 10px;
  background-color: #242730;
}
.menu-flex {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  grid-gap: 4px;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  font-size: 11px;
  font-weight: 600;
  text-transform: uppercase;
}
.menu-link {
  min-height: 44px;
  padding: 0 12px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  grid-gap: 8px;
  background-color: #17191e;
  border-radius: 8px;
  font-size: 11px;
  font-weight: 600;
  text-transform: uppercase;
  color: #77797f;
}
.menu-link img,
.menu-link svg {
  width: 18px;
  height: 18px;
  fill: #77797f;
}
.menu-link--span {
  -ms-grid-column-span: 2;
  grid-column: span 2;
}
.menu-link--selected {
  color: rgba(var(--clr-w), 1);
}
.menu-link--selected svg {
  fill: #5d8b6a;
}
.modal {
  position: fixed;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 10;
  background-color: rgba(18, 19, 23, 0.9);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  pointer-events: none;
  -webkit-transition: 0.4s;
  transition: 0.4s;
  opacity: 0;
}
.modal.active--mode {
  pointer-events: auto;
  opacity: 1;
}
.modal-tab {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: (1fr) [2];
  grid-template-columns: repeat(2, 1fr);
  border: 1px solid #242730;
  min-height: 48px;
  border-radius: 12px;
  overflow: hidden;
}
.modal-tab-button {
  grid-gap: 8px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  text-align: center;
  font-size: 10px;
  font-weight: 600;
  -webkit-transition: 0.4s;
  transition: 0.4s;
  border-radius: inherit;
  color: #7b808e;
}
.modal-tab-button img,
.modal-tab-button svg {
  fill: currentColor;
}
.modal-tab-button--selected {
  color: #fff;
  background: var(--green-gradient);
  position: relative;
}
.modal-tab-button--selected::before {
  pointer-events: none;
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  padding: 1px;
  background: -webkit-gradient(linear, left top, left bottom, from(#3de592), to(#268053));
  background: linear-gradient(#3de592 0, #268053 100%);
  -webkit-mask: -webkit-gradient(linear, left top, left bottom, color-stop(0, #fff)) content-box, -webkit-gradient(linear, left top, left bottom, color-stop(0, #fff));
  -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
}
.modal-container {
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
  padding: 12px;
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}
.modal-policy {
  font-size: 9px;
  color: #4d5466;
}
.modal-policy a {
  color: #43704f;
  text-decoration: underline;
  display: inline;
}
.modal-content {
  max-width: 700px;
  width: 100%;
  border-radius: 18px;
  overflow: hidden;
  opacity: 0;
  -webkit-transform: scale(0.95);
  -ms-transform: scale(0.95);
  transform: scale(0.95);
  -webkit-transition: 0.3s 0.3s;
  transition: 0.3s 0.3s;
}
.modal.active--mode .modal-content {
  opacity: 1;
}
.modal-header-title {
  font-size: 18px;
  font-weight: 700;
}
.modal-close {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  border-radius: 10px;
  width: 28px;
  height: 28px;
  background-color: #242730;
}
.modal-form {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  grid-gap: 15px;
}
.modal-form-socials {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  grid-gap: 8px;
}
.modal-form-socials__btn {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  width: 48px;
  height: 48px;
  border-radius: 12px;
  background-color: rgba(var(--clr-w), 0.1);
}
.modal-form-socials__btn--blue {
  background-color: #1983ff;
}
.modal-form-socials__btn--navy {
  background-color: #40638b;
}
.modal-form-socials__btn--white {
  background-color: #fff;
}
.modal-form-socials__btn--red {
  background-color: #eb6054;
}
.modal-form-divider {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  grid-gap: 12px;
}
.modal-form-divider__center {
  font-size: 8px;
  font-weight: 600;
  color: #5f6471;
}
.modal-form-divider__bar {
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
  height: 1px;
  background-color: #242730;
}
.modal-form-enter {
  background-image: var(--green-gradient);
  min-height: 48px;
  width: 100%;
  font-size: 12px;
  font-weight: 700;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  text-align: center;
  border-radius: 12px;
  position: relative;
  cursor: pointer;
}
.modal-form-enter::before {
  pointer-events: none;
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  padding: 1px;
  background: -webkit-gradient(linear, left top, left bottom, from(#3de592), to(#268053));
  background: linear-gradient(#3de592 0, #268053 100%);
  -webkit-mask: -webkit-gradient(linear, left top, left bottom, color-stop(0, #fff)) content-box, -webkit-gradient(linear, left top, left bottom, color-stop(0, #fff));
  -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
}
.modal-form-label {
  position: relative;
}
.modal-form-label img,
.modal-form-label svg {
  position: absolute;
  top: 50%;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
  left: 16px;
}
.modal-form-label input {
  min-height: 48px;
  background-color: #242730;
  border-radius: 12px;
  font-size: 10px;
  padding: 0 24px 0 40px;
  color: #fff;
}
.modal-form-label input::-webkit-input-placeholder {
  color: #b1b5c2;
}
.modal-form-label input::-moz-placeholder {
  color: #b1b5c2;
}
.modal-form-label input:-ms-input-placeholder {
  color: #b1b5c2;
}
.modal-form-label input::-ms-input-placeholder {
  color: #b1b5c2;
}
.modal-form-label input::placeholder {
  color: #b1b5c2;
}
.modal-col--content {
  padding: 24px;
  background-color: #17191e;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  grid-gap: 10px;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
}
.modal-col--bg {
  background-image: var(--green-gradient);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  position: relative;
}
.modal-col--bg > * {
  position: relative;
  z-index: 1;
}
.modal-col--bg::after {
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  background-image: url(../img/new/modal/modalCol_bg.png);
  top: 0;
  left: 0;
  pointer-events: none;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
}
.modal-grid {
  min-height: clamp(340px, 31.25vw, 500px);
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: (1fr) [2];
  grid-template-columns: repeat(2, 1fr);
}
.modal--opened {
  opacity: 1;
  pointer-events: all;
}
.modal--opened .modal-content {
  opacity: 1;
  -webkit-transform: scale(1);
  -ms-transform: scale(1);
  transform: scale(1);
}
@media (max-width: 767px) {
  .modal-grid {
      display: block;
  }
  .modal-col--bg {
      display: none;
  }
  .modal-col--content {
      grid-gap: 28px;
  }
}
.wheel {
  --circle-wrapper: 794px;
  background-color: #17191e;
  border-radius: 16px;
  position: relative;
  min-height: 282px;
  overflow: hidden;
  width: 100%;
}
.wheel::after,
.wheel::before {
  content: "";
  position: absolute;
  width: 260px;
  height: 260px;
  background-image: radial-gradient(#6c9b7b 0, rgba(108, 155, 123, 0) 100%);
  pointer-events: none;
  border-radius: 50%;
  opacity: 0.45;
  -webkit-filter: blur(44px);
  filter: blur(44px);
}
.wheel::before {
  left: 0;
  top: 0;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}
.wheel::after {
  right: 0;
  bottom: 0;
  -webkit-transform: translate(50%, 50%);
  -ms-transform: translate(50%, 50%);
  transform: translate(50%, 50%);
}
.wheel-panel {
  position: absolute;
  left: 50%;
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  transform: translateX(-50%);
  bottom: 44px;
  z-index: 4;
  background-color: #13161b;
  border-radius: 12px;
  padding: 0 12px 12px;
}
.wheel-gradient {
  position: absolute;
  height: 30%;
  background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(23, 25, 30, 0)), to(#17191e));
  background-image: linear-gradient(rgba(23, 25, 30, 0) 0, #17191e 100%);
  width: 100%;
  bottom: 0;
  left: 0;
  z-index: 3;
  pointer-events: none;
}
.wheel-play {
  min-height: 30px;
  margin: 0 auto 10px;
  background: var(--green-gradient);
  border-radius: 0 0 12px 12px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  font-size: 10px;
  font-weight: 600;
  text-align: center;
  padding: 0 16px;
  text-transform: uppercase;
}
.wheel-timer {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  grid-gap: 6px;
}
.wheel-timer span {
  color: #4e546d;
  font-size: 12px;
  font-weight: 500;
}
.wheel-timer-col {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  grid-gap: 6px;
  font-size: 14px;
  font-weight: 400;
}
.wheel-timer-unit {
  background-color: #20232b;
  border-radius: 8px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  min-height: 34px;
  min-width: 30px;
}
.wheel-circle {
  position: absolute;
  top: 54px;
  left: 50%;
  width: 860px;
  height: 860px;
  z-index: 2;
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  transform: translateX(-50%);
  -webkit-transition: -webkit-transform 0.4s;
  transition: transform 0.4s;
  transition: transform 0.4s, -webkit-transform 0.4s;
  border-radius: 50%;
  overflow: hidden;
}
.wheel-circle-polygon {
  width: 100%;
  height: 100%;
}
.wheel-circle_half {
  --w: 894px;
  width: var(--w);
  min-width: var(--w);
  left: 50%;
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  transform: translateX(-50%);
  position: absolute;
  top: 36px;
  z-index: 2;
}
.box-arrow {
  position: absolute;
}
.box-arrow--wheel {
  z-index: 4;
  top: 64px;
  height: 82px;
}
.box-arrow--wheel img {
  height: 100%;
}

.d-flex {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.flex-wrap {
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}

.align-center {
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}

.align-end {
  -webkit-box-align: end;
  -ms-flex-align: end;
  align-items: flex-end;
}

.align-start {
  -webkit-box-align: start;
  -ms-flex-align: start;
  align-items: flex-start;
}

.justify-space-between {
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
}

.justify-space-around {
  -ms-flex-pack: distribute;
  justify-content: space-around;
}

.justify-center {
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}

.justify-end {
  -webkit-box-pack: end;
  -ms-flex-pack: end;
  justify-content: flex-end;
}

.justify-start {
  -webkit-box-pack: start;
  -ms-flex-pack: start;
  justify-content: flex-start;
}

.flex-column {
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
}

.bonus {
  position: relative;
  max-width: 1322px;
  margin: 0 auto;
}

.bonus__top {
  position: relative;
  margin-bottom: 30px;
  padding-bottom: 40px;
}

.bonus__top:before {
  content: '';
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 8px;
  background: url(../images/borders.svg) repeat;
}

.bonus__items {
  position: relative;
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: (1fr) [ 2 ];
  grid-template-columns: repeat(2, 1fr);
  grid-gap: 15px;
}

.bonus__item {
  background: var(--bg-chat);
  border-radius: 25px;
  min-height: 130px;
  padding: 22px 28px;
}

.bonus__item-title {
  position: relative;
  font-weight: 900;
  margin-bottom: 20px;
  font-size: 18px;
}

.bonus__content {
  position: relative;
}

.bonus__content .bx-input__input {
  width: 47%;
}

.bonus__content .icon.money {
  filter: invert(1);
}

.bonus__buttons a {
  margin-right: 8px;
}

.bonus__buttons a:nth-last-child(1) {
  margin-right: 0;
}

.bonus__item--block {
  -ms-grid-column: 1;
  -ms-grid-column-span: 2;
  grid-column: 1 / 3;
}

.bonus__item--levels {
  overflow: hidden;
  position: relative;
  padding-bottom: 40px;
}

.bonus__item--levels::before {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 50px;
  background: url(../images/bonus/borders.svg) repeat;
}

.bonus__levels-info {
  position: relative;
  padding: 15px 20px;
  background: #fff;
  border-radius: 15px;
  z-index: 1;
  width: 100%;
  margin-bottom: 20px;
}

.bonus__levels-info:before {
  content: '';
}

.bonus__levels-image {
  position: relative;
  width: 40px;
  height: 60px;
  background: url(../images/bonus/bonus-info.svg) no-repeat center center/contain;
}

.bonus__levels-text {
  position: relative;
  width: calc(100% - 40px);
  padding-left: 15px;
}

.bonus__levels-text span {
  font-weight: 600;
  padding-bottom: 8px;
}

.bonus__levels-text p {
  font-weight: 500;
  font-size: 12px;
  color: #78a887;
}

.bonus__levels-items {
  position: relative;
  width: 100%;
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: (1fr) [ 4 ];
  grid-template-columns: repeat(4, 1fr);
  grid-gap: 15px;
}

.bonus__levels-item {
  position: relative;
  border-radius: 15px;
  padding: 20px 22px;
  background: #fff;
}

.bonus__levels-item:before {
  content: '';
  position: absolute;
  left: 50%;
  top: -20px;
  -webkit-transform: translateX(-50%) rotate(45deg);
  transform: translateX(-50%) rotate(45deg);
  width: 36px;
  height: 36px;
  background: var(--bg-chat);
  border-radius: 50px;
}

.bonus__levels-item:after {
  content: '';
  position: absolute;
  left: 50%;
  top: -20px;
  -webkit-transform: translateX(-50%) rotate(45deg);
  transform: translateX(-50%) rotate(45deg);
  width: 18px;
  height: 18px;
  border-radius: 50px;
}

.bonus__levels-item h4 {
  text-transform: uppercase;
  padding-top: 10px;
  margin-bottom: 15px;
}

.bonus__levels-item .btn span > b {
  opacity: .5;
}

.bonus__levels-item.bonus__levels-item--1:after {
  background: linear-gradient(101.85deg, #F66B95 13.32%, #F79E6C 58.67%);
  top: -9px;
}

.bonus__levels-item.bonus__levels-item--2:after {
  background: linear-gradient(101.85deg, #6B71F6 13.32%, #8851E2 58.67%), #C4C4C4;
  top: -9px;
}

.bonus__levels-item.bonus__levels-item--3:after {
  background: linear-gradient(101.85deg, #29D195 13.32%, #479BCA 58.67%), #C4C4C4;
  top: -9px;
}

.bonus__levels-item.bonus__levels-item--4:after {
  background: linear-gradient(101.85deg, #FF4ED8 13.32%, #AA1B82 58.67%), #C4C4C4;
  top: -9px;
}

.bonus__item--daily {
  background: var(--bg-chat) url(../images/bonus/bonus-daily.png) no-repeat center center/cover;
  padding: 0;
  overflow: hidden;
}

.bonus__wheel {
  height: 250px;
  width: 450px;
  position: relative;
  overflow: hidden;
}

.bonus__wheel-image {
  position: absolute;
  left: 50%;
  top: -68%;
  -webkit-transform: translate(-50%, 50%);
  transform: translate(-50%, 50%);
}

.bonus__rotate {
  position: relative;
  pointer-events: none;
}

.bonus__rotate-defs {
  position: absolute;
  left: 0;
  top: 0;
  pointer-events: none;
}

.bonus__wheel-borders {
  width: 421px;
  height: 421px;
}

.bonus__wheel-go {
  position: absolute;
  left: 50%;
  bottom: -27%;
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
  padding: 20px;
  width: 115px;
  height: 115px;
  border-radius: 50%;
  background: #EDD164;
  z-index: 1;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: start;
  -ms-flex-align: start;
  align-items: flex-start;
  font-size: 12px;
  text-transform: uppercase;
  font-weight: bold;
  color: #69591C;
  cursor: pointer;
  -webkit-transition: .3s ease-in-out;
  transition: .3s ease-in-out;
}

.bonus__wheel-go.bonus__wheel-go--started {
  cursor: not-allowed;
  background: #cab251;
}

.bonus__wheel-go span {
  pointer-events: none;
}

.bonus__wheel-go:not(.bonus__wheel-go--started):hover {
  background: #ffe477;
}

.bonus__wheel-cursor {
  position: absolute;
  left: 50%;
  top: 30px;
  -webkit-transform: translateX(-50%) rotate(-180deg);
  transform: translateX(-50%) rotate(-180deg);
  width: 32px;
  height: 48px;
  background: url(../images/games/cursor.svg) no-repeat center center/contain;
  z-index: 2;
}

.bonus__reposts-items {
  position: relative;
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: (1fr) [ 4 ];
  grid-template-columns: repeat(4, 1fr);
  grid-gap: 20px;
  margin-top: 20px;
}

.bonus__reposts-item {
  position: relative;
}

.bonus__reposts-level {
  font-weight: 500;
  font-size: 12px;
  color: #BCC2D2;
  padding-bottom: 6px;
}

.bonus__reposts-count {
  font-weight: 500;
  font-weight: 500;
}

.bonus__reposts-count--value {
  font-size: 22px;
  font-weight: 900;
  color: #D8DCF1;
}

.bonus__reposts-progress {
  position: relative;
  width: 100%;
  border-radius: 50px;
  overflow: hidden;
  background: #E3E6F9;
  height: 4px;
  margin-top: 8px;
}

.bonus__reposts-progress--width {
  position: absolute;
  left: 0;
  top: 0;
  height: 100%;
  background: #706BF6;
  -webkit-transition: .15s ease-in-out;
  transition: .15s ease-in-out;
}

.bonus__hits {
  position: relative;
}

.bonus__hits .help {
  position: relative;
  z-index: 2;
}

.bonus__hits-content {
  position: relative;
  min-height: 500px;
  background: url(../images/bonus/bonus-bg.png) no-repeat center center/contain;
  margin-top: -35px;
  z-index: 1;
  padding-top: 160px;
  padding-left: 90px;
  padding-right: 90px;
}

.bonus__hits-title {
  position: absolute;
  left: 50%;
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
  font-size: 64px;
  text-transform: uppercase;
  font-weight: 900;
  top: 30px;
}

.bonus__hits-title span {
  -webkit-text-fill-color: #ebecf2;
  -webkit-text-stroke-width: 2px;
  -webkit-text-stroke-color: #d6daf8;
}

.bonus__hits-items {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: (1fr) [ 2 ];
  grid-template-columns: repeat(2, 1fr);
  grid-gap: 30px;
}

.bonus__hits-item {
  position: relative;
}

.bonus__hits-item span {
  color: #fff;
  font-weight: 600;
  text-transform: uppercase;
}

.bonus__hits-item b {
  position: absolute;
  right: 0;
  top: 0;
  font-size: 12px;
  color: #BA776C;
  font-weight: normal;
}

.bonus__hits-progress-bar {
  position: relative;
  width: 100%;
  border-radius: 50px;
  overflow: hidden;
  height: 6px;
  background: #89473D;
  margin-top: 15px;
}

.bonus__hits-progress {
  position: absolute;
  left: 0;
  top: 0;
  height: 100%;
  background: -webkit-gradient(linear, left top, right top, from(#FE2C2C), to(#FF7E35));
  background: linear-gradient(90deg, #FE2C2C 0%, #FF7E35 100%);
  -webkit-transition: .15s ease-in-out;
  transition: .15s ease-in-out;
}

.bonus__hits-progress:before {
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: -webkit-gradient(linear, 0 0, 100% 100%, color-stop(0.25, rgba(255, 255, 255, 0.2)), color-stop(0.25, transparent), color-stop(0.5, transparent), color-stop(0.5, rgba(255, 255, 255, 0.2)), color-stop(0.75, rgba(255, 255, 255, 0.2)), color-stop(0.75, transparent), to(transparent));
  border-radius: 50px;
  background-size: 30px 30px;
  -webkit-animation: progress-bar-stripes 2s linear infinite;
  animation: progress-bar-stripes 2s linear infinite;
}

@-webkit-keyframes progress-bar-stripes {
  from {
    background-position: 30px 0;
  }
  to {
    background-position: 0 0;
  }
}

@keyframes progress-bar-stripes {
  from {
    background-position: 30px 0;
  }
  to {
    background-position: 0 0;
  }
}

.bonus__hits-item--active span {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  position: relative;
  padding-right: 25px;
}

.bonus__hits-item--active span:before {
  content: '';
  position: absolute;
  right: 0;
  top: -3px;
  width: 6px;
  height: 12px;
  border-right: solid 2px;
  border-bottom: solid 2px;
  color: #e0c015;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
}

.refferal__stats {
  position: relative;
  padding: 20px 20px;
  padding-bottom: 10px;
}

.refferal__stat {
  position: relative;
  margin-right: 30px;
}

.refferal__stat:nth-last-child(1) {
  margin-right: 0;
}

.refferal__stat span {
  position: relative;
  font-size: 16px;
  padding-bottom: 8px;
  font-weight: 600;
}

.refferal__stat span .icon {
  width: 14px;
  height: 14px;
  margin-left: 8px;
  filter: invert(1);
}

.refferal__stat p {
  font-size: 12px;
  font-weight: 500;
  color: #78a887;
}

.refferal .bonus__top::before {
  content: none;
}

.faq {
  position: relative;
}

.faq__item {
  background: var(--bg-chat);
  border-radius: 15px;
  position: relative;
  max-height: 60px;
  overflow: hidden;
  -webkit-transition: .15s ease-in-out;
  transition: .15s ease-in-out;
  margin-bottom: 12px;
}

.faq__item:nth-last-child(1) {
  margin-bottom: 0;
}

.faq__item.faq__item--opened .faq__item-heading span {
  color: #3d6a49;
}

.faq__item.faq__item--opened .faq__item-heading:after {
  opacity: 0;
}

.faq__item.faq__item--opened .faq__item-question {
  background: var(--green-gradient);
}

.faq__item-heading {
  position: relative;
  height: 60px;
  padding: 11px 16px;
  cursor: pointer;
}

.faq__item-heading:before {
  content: '';
  position: absolute;
  width: 22px;
  height: 2px;
  border-radius: 50px;
  background: #78a887;
  right: 25px;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  top: 50%;
}

.faq__item-heading:after {
  content: '';
  position: absolute;
  width: 22px;
  height: 2px;
  border-radius: 50px;
  background: #3d6a49;
  right: 25px;
  -webkit-transform: translateY(-50%) rotate(90deg);
  transform: translateY(-50%) rotate(90deg);
  top: 50%;
}

.faq__item-heading span {
  position: relative;
  color: #78a887;
  font-weight: 500;
  pointer-events: none;
}

.faq__item-question {
  width: 40px;
  height: 40px;
  border-radius: 50px;
  background: var(--green-gradient);
  font-weight: 600;
  font-size: 18px;
  color: #fff;
  margin-right: 15px;
  pointer-events: none;
}

.faq__item-body {
  padding: 10px 20px;
  position: relative;
  border-top: solid 1px #eaedfb;
}

.faq__item-body p {
  margin: 10px 0px;
  font-size: 12px;
  color: #7785a4;
  font-weight: 500;
  line-height: 22px;
}

.profile {
  position: relative;
  padding-bottom: 30px;
  margin-bottom: 30px;
}

.profile:before {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 8px;
  background: url(../images/borders.svg) repeat;
}

.profile__user {
  width: 280px;
  padding: 30px;
  position: relative;
  border-radius: 25px;
  background: var(--bg-chat);
}

.profile__top {
  position: relative;
  width: 100%;
}

.profile__top b {
  position: relative;
  font-weight: 600;
  text-transform: uppercase;
}

.profile__top a {
  font-size: 12px;
  font-weight: 500;
  color: #7987AE;
}

.profile__top a:hover {
  color: #626f92;
}

.profile__top a .icon {
  margin-right: 6px;
  pointer-events: none;
}

.profile__top a span {
  pointer-events: none;
}

.profile__avatar {
  width: 200px;
  height: 150px;
  position: relative;
  background: url(../images/profile/profile-border.png) no-repeat center center/contain;
}

.profile__avatar-ellipse {
  position: relative;
  width: 80px;
  height: 80px;
  border-radius: 50%;
  background: #fff;
}

.profile__avatar-img {
  width: 60px;
  height: 60px;
  border-radius: 50%;
}

.profile__username {
  position: relative;
  line-height: 24px;
  margin-bottom: 20px;
}

.profile__username b {
  font-size: 16px;
  font-weight: 600;
}

.profile__username span {
  font-size: 12px;
  font-weight: 500;
  text-transform: uppercase;
  color: #8591B5;
}

.profile__balance {
  width: 100%;
}

.profile__balance span {
  font-weight: 600;
}

.profile__balance .icon {
  margin-right: 8px;
}

.profile__stats {
  position: relative;
  width: calc(100% - 280px);
  padding-left: 15px;
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: (1fr) [ 3 ];
  grid-template-columns: repeat(3, 1fr);
  grid-gap: 15px;
}

.profile__stat-item {
  padding: 26px;
  position: relative;
  border-radius: 25px;
  background: var(--bg-chat);
}

.profile__stat-item b {
  text-transform: uppercase;
  font-size: 12px;
  padding-bottom: 12px;
  color: #7987AE;
}

.profile__stat-item span {
  font-weight: 900;
  font-size: 24px;
}

.profile__settings {
  position: relative;
}

.profile__settings-check {
  position: relative;
}

.profile__settings-check label {
  color: #475A89;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  cursor: pointer;
}

.profile__settings-check label:before {
  content: '';
  display: inline-block;
  width: 24px;
  height: 24px;
  background: #CCCFE4;
  -ms-flex-negative: 0;
  flex-shrink: 0;
  -webkit-box-flex: 0;
  -ms-flex-positive: 0;
  flex-grow: 0;
  border-radius: 9px;
  margin-right: 12px;
}


.dice__select-chance .game-panel-box {
  min-width: 210px;
  margin-top: 15px;
  margin-bottom: 15px;
  min-height: 48px;
}
.dice-container .game-wrapper .game-panel--keno {
  min-width: 481px;
}

.dice__range {
  margin-top: 20px;
}

.procent-slider {
  position: relative;
  width: 100%;
  height: 36px;
  display: flex;
  align-items: center;
}

.procent-slider input[type="range"] {
  -webkit-appearance: none;
  appearance: none;
  width: 100%;
  height: 4px;
  background: transparent;
  outline: none;
  position: absolute;
  margin: 0;
  z-index: 2;
}

.slider-track {
  position: absolute;
  width: 100%;
  height: 4px;
  background: #48484a;
  border-radius: 2px;
  overflow: hidden;
}

.slider-fill {
  position: absolute;
  height: 100%;
  background: #30d158;
  border-radius: 2px;
  transition: width 0.1s ease-out;
}

.procent-slider input[type="range"]::-webkit-slider-thumb {
  -webkit-appearance: none;
  appearance: none;
  width: 28px;
  height: 28px;
  background: #ffffff;
  border-radius: 14px;
  cursor: pointer;
  box-shadow: 0 3px 8px rgba(0, 0, 0, 0.3),
  0 1px 2px rgba(0, 0, 0, 0.2);
  transition: transform 0.1s ease-out;
}

.procent-slider input[type="range"]::-moz-range-thumb {
  width: 28px;
  height: 28px;
  background: #ffffff;
  border-radius: 14px;
  cursor: pointer;
  border: none;
  box-shadow: 0 3px 8px rgba(0, 0, 0, 0.3),
  0 1px 2px rgba(0, 0, 0, 0.2);
  transition: transform 0.1s ease-out;
}

.procent-slider input[type="range"]::-webkit-slider-thumb:hover {
  transform: scale(1.1);
}

.procent-slider input[type="range"]::-moz-range-thumb:hover {
  transform: scale(1.1);
}

.procent-slider input[type="range"]::-webkit-slider-thumb:active {
  transform: scale(0.95);
}

.procent-slider input[type="range"]::-moz-range-thumb:active {
  transform: scale(0.95);
}

.dice-game-header-win {
  color: #31b37d;
}

.dice-game-header-lose {
  color: #FF3A67;
}
