@keyframes rotation-loader {
  0% {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}
@-webkit-keyframes spinTo1 {
  0% {
    -webkit-transform: rotate(-44deg);
    transform: rotate(-44deg);
  }
  to {
    transform: rotate(1080deg);
  }
}
@-webkit-keyframes spinTo2 {
  0% {
    transform: rotate(-4deg);
  }
  to {
    transform: rotate(1396deg);
  }
}
@-webkit-keyframes spinTo3 {
  0% {
    transform: rotate(-4deg);
  }
  to {
    transform: rotate(1351deg);
  }
}
@-webkit-keyframes spinTo4 {
  0% {
    transform: rotate(-4deg);
  }
  to {
    transform: rotate(1305deg);
  }
}
@-webkit-keyframes spinTo5 {
  0% {
    transform: rotate(-4deg);
  }
  to {
    transform: rotate(1261deg);
  }
}
@-webkit-keyframes spinTo6 {
  0% {
    transform: rotate(-4deg);
  }
  to {
    transform: rotate(1217deg);
  }
}
@-webkit-keyframes spinTo7 {
  0% {
    transform: rotate(-4deg);
  }
  to {
    transform: rotate(1531deg);
  }
}
@-webkit-keyframes spinTo8 {
  0% {
    transform: rotate(-4deg);
  }
  to {
    transform: rotate(1485deg);
  }
}
@-webkit-keyframes spinner-win {
  0%,
  to {
    transform: rotate(1080deg);
  }
  50% {
    transform: rotate(1085deg);
  }
}
@keyframes flip {
  0% {
    transform: perspective(800px) scale3d(0.85, 0.85, 0.85) translate3d(0, 0, 0)
      rotate3d(0, 1, 0, -360deg) scaleY(-1);
    animation-timing-function: ease-out;
  }
  40% {
    transform: perspective(800px) scale3d(0.85, 0.85, 0.85)
      translate3d(0, 0, 150px) scaleY(-1) rotate3d(0, 1, 0, -190deg);
    animation-timing-function: ease-out;
  }
  50% {
    transform: perspective(800px) scale3d(0.85, 0.85, 0.85)
      translate3d(0, 0, 150px) scaleY(-1) rotate3d(0, 1, 0, -170deg);
    animation-timing-function: ease-in;
  }
  80% {
    transform: perspective(800px) scale3d(0.8, 0.8, 0.8) translate3d(0, 0, 0)
      scaleY(-1) rotate3d(0, 1, 0, 0deg);
    animation-timing-function: ease-in;
  }
  to {
    transform: perspective(800px) scale3d(0.85, 0.85, 0.85) translate3d(0, 0, 0)
      rotate3d(0, 1, 0, 0deg) scaleY(-1);
    animation-timing-function: ease-in;
  }
}
@keyframes kist {
  50% {
    transform: translate(-50%, 1%) rotate(-5deg) scale(1.1);
  }
}
@keyframes logo {
  50% {
    transform: scale(1.1);
  }
}
@-webkit-keyframes scaleButton {
  0%,
  to {
    transform: scale(1);
  }
  50% {
    transform: scale(0.98);
  }
}
@-webkit-keyframes spinner {
  0%,
  to {
    -webkit-transform: rotate(-40deg);
    transform: rotate(-40deg);
  }
  50% {
    -webkit-transform: rotate(-44deg);
    transform: rotate(-44deg);
  }
}
@-webkit-keyframes spin {
  0%,
  to {
    opacity: 0.5;
  }
  50% {
    opacity: 0.2;
  }
}
@keyframes zoomInDown {
  0% {
    opacity: 0;
    transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0);
    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
  }
  60% {
    opacity: 1;
    transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
  }
}
@keyframes headShake {
  0%,
  to {
    transform: scale3d(1, 1, 1);
  }
  10%,
  20% {
    transform: scale3d(0.9, 0.9, 0.9) rotate3d(0, 0, 1, -3deg);
  }
  30%,
  50%,
  70%,
  90% {
    transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
  }
  40%,
  60%,
  80% {
    transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
  }
}
@-webkit-keyframes personAnimation {
  0% {
    transform: translateX(50%) translateY(0);
  }
  40% {
    transform: translateX(50%) translateY(-3%);
  }
  60% {
    transform: translateX(50%) translateY(-3);
  }
}
@-webkit-keyframes spinnerBefore {
  0%,
  to {
    background-size: 80%;
  }
  50% {
    background-size: 90%;
  }
}
@-webkit-keyframes hide {
  0% {
    opacity: 1;
  }
  to {
    opacity: 0;
  }
}
*,
::after,
::before {
  box-sizing: border-box;
}
* {
  margin: 0;
  padding: 0;
}
ol[role="list"],
ul[role="list"] {
  list-style: none;
}
html:focus-within {
  scroll-behavior: smooth;
}
a {
  text-decoration: none !important;
}
a:not([class]) {
  text-decoration-skip-ink: auto;
}
canvas,
img,
picture,
svg,
video {
  max-width: 100%;
  height: auto;
  vertical-align: middle;
  font-style: italic;
  background-repeat: no-repeat;
  background-size: cover;
}
button,
input,
select,
textarea {
  font: inherit;
}
/* prefers-reduced-motion removed — game requires animations for slot spins */
body,
html {
  height: 100%;
  scroll-behavior: smooth;
}
.hidden {
  display: none !important;
}
.visible {
  display: flex !important;
}
body {
  user-select: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  width: 100vw;
  min-height: 100vh;
  padding: 0;
  background-size: cover;
  align-items: center;
  justify-content: flex-start;
  flex-direction: column;
  font-size: 16px;
  font-style: normal;
  overflow: hidden;
}
.bottom__section-button {
  min-width: 50px;
}
.bottom__section-button span {
  height: auto;
}
.bottom__section-button .button-loader {
  display: none;
}
.bottom__section-button.is--link {
  display: flex;
  align-items: center;
  justify-content: center;
}
.bottom__section-button.is--disabled {
  pointer-events: none;
}
.bottom__section-button.is--disabled span {
  opacity: 0.2;
}
.bottom__section-button.is--disabled .button-loader,
body {
  display: flex;
}
.button-loader {
  position: absolute;
  align-items: center;
  justify-content: center;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}
.button-loader span {
  width: 30px !important;
  height: 30px !important;
  border: 4px solid #fff;
  border-bottom-color: transparent;
  border-radius: 50%;
  display: inline-block;
  box-sizing: border-box;
  animation: rotation-loader 1s linear infinite;
  opacity: 1 !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}
img {
  width: 100%;
}
.wheel__spinner_win_1 {
  animation: 3s spinTo1 ease-in-out forwards !important;
}
.wheel__spinner_win_2 {
  animation: 3s spinTo2 ease-in-out forwards;
}
.wheel__spinner_win_3 {
  animation: 3s spinTo3 ease-in-out forwards;
}
.wheel__spinner_win_4 {
  animation: 3s spinTo4 ease-in-out forwards;
}
.wheel__spinner_win_5 {
  animation: 3s spinTo5 ease-in-out forwards;
}
.wheel__spinner_win_6 {
  animation: 3s spinTo6 ease-in-out forwards;
}
.wheel__spinner_win_7 {
  animation: 3s spinTo7 ease-in-out forwards;
}
.wheel__spinner_win_8 {
  animation: 3s spinTo8 ease-in-out forwards;
}
.wheel__texts-block {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  padding-right: 1em !important;
  padding-left: 2em !important;
}
.wheel__texts-block p {
  transform: rotate(-7deg);
}
.wheel__texts-block p:only-child {
  transform: rotate(0deg);
}
.wheel__texts-block p + p {
  margin-top: 10px;
  transform: rotate(7deg);
}
.aahcko,
.effects__block {
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}
.aahcko {
  position: absolute;
  z-index: 997;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  mix-blend-mode: screen;
}
.effects__block {
  background-repeat: no-repeat;
  -webkit-background-size: cover;
  background-size: cover;
  background-position: center;
  position: fixed;
}
.wheel__texts-1 {
  transform: rotate(-137deg);
  position: absolute;
  left: 11%;
  top: 23%;
}
.wheel__texts-2,
.wheel__texts-3 {
  transform: rotate(-93deg);
  position: absolute;
  left: 32%;
  top: 14%;
}
.wheel__texts-3 {
  transform: rotate(-45deg);
  left: 54%;
  top: 23%;
}
.wheel__texts-4,
.wheel__texts-5 {
  transform: rotate(-2deg);
  position: absolute;
  left: 63%;
  top: 44%;
}
.wheel__texts-5 {
  transform: rotate(43deg);
  left: 54%;
  top: 65%;
}
.wheel__texts-6,
.wheel__texts-7 {
  transform: rotate(87deg);
  position: absolute;
  left: 33%;
  top: 74%;
}
.wheel__texts-7 {
  transform: rotate(133deg);
  left: 11%;
  top: 66%;
}
.aahckq,
.wheel__texts-8 {
  transform: rotate(177deg);
  position: absolute;
  left: 2%;
  top: 45%;
}
.aahckq {
  left: 0;
  top: 0;
  transform: rotate(45deg);
  opacity: 0;
  width: 100%;
}
.aahckq.is--active {
  opacity: 1;
}
.is--win-spinner {
  animation: 2s spinner-win ease-in-out infinite !important;
}
body.is--winner .aahckl {
  opacity: 0;
}
.aahckd {
  display: flex;
  width: 100%;
  height: 100%;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
}
@media (max-width: 991px) {
  .aahckd {
    background-image: url(../img/page-bg-mobile.webp);
  }
}
#reels,
.aahckk > .icons {
  position: relative;
}
#slot.inverted .aahckk {
  transform: scaleY(-1);
}
#slot.inverted .aahckk > .icons > img {
  transform: scaleY(-1) scale(0.8);
}
#reels {
  display: flex;
  width: 79vw;
  height: 47.4vw;
  max-height: 520px;
  max-width: 870px;
  z-index: 1;
}
@media (max-width: 991px) {
  #reels {
    width: 88vw;
    height: 89vw;
    max-height: 89vw;
  }
}
#reels:before,
.aahckj {
  position: absolute;
  left: 50%;
  transform: translate(-50%, -50%);
}
.aahckj {
  background-repeat: no-repeat;
  background-position: center;
  top: 49%;
  z-index: 2;
  background-image: url(../img/frame.webp);
}
@media (max-width: 991px) {
  .aahckj {
    background-image: url(../img/frame-mobile.webp);
    background-size: 100%;
  }
}
#reels:before {
  content: "";
  top: 50%;
  width: 100%;
  height: 100%;
  z-index: -1;
  background: linear-gradient(180deg, #0D0520 0, #1A0B3D 49.5%, #0D0520 97.5%);
  backdrop-filter: blur(21.2999992371px);
  background:
    linear-gradient(90deg, transparent 52.51%, rgba(0, 0, 0, 0.1) 100%),
    linear-gradient(270deg, transparent 48.8%, rgba(0, 0, 0, 0.1) 100%),
    linear-gradient(
      180deg,
      rgba(30, 15, 80, 0.8) 0,
      rgba(123, 97, 255, 0.8) 47%,
      rgba(75, 34, 153, 0.8) 73%
    );
}
#slot {
  width: 100%;
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  max-width: 970px;
  margin: 0 auto;
  flex-direction: column;
}
.aahckk {
  overflow: hidden;
  width: 20%;
  height: 100%;
}
@media (max-width: 991px) {
  .aahckk {
    width: 33.333%;
  }
}
.aahckk > .icons > img {
  width: calc(100% + 6px);
  margin: -3px 0 0 -3px;
  height: auto;
  max-width: none;
  transform: translate3d(0, 0, 0) scale(0.9);
}
.icons {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
.is--winner .aahckk .icons img:nth-child(2) {
  transform: scaleY(-1);
  animation: 2s flip ease-in-out infinite;
}
.is--modal-open #slot {
  opacity: 0;
  transition: opacity 0.3s;
  z-index: -1;
}
.aahckd,
.aahcki {
  position: relative;
}
.aahcki {
  max-width: 560px;
  width: 100%;
  animation: logo 6s infinite both alternate ease-in-out;
  display: block;
  margin: 50px auto 20px;
  z-index: 5;
}
@media (max-width: 767px) {
  .aahcki.is--desktop {
    display: none;
  }
}
.aahcki.is--mobile {
  display: block;
  max-width: 359px;
  margin-bottom: 20px;
  margin-top: 0;
}
@media (min-width: 768px) {
  .aahcki.is--mobile {
    display: none;
  }
}
@media (max-height: 680px) {
  .aahcki.is--mobile {
    max-width: 259px;
    margin-bottom: 0;
  }
}
.aahckd {
  background-image: url(../img/page-bg.webp);
  overflow: hidden;
}
@media (max-width: 767px) {
  .aahckd {
    background-image: url(../img/page-bg-mobile.webp);
    background-position: center;
  }
}
@media (min-width: 991px) and (max-height: 840px) {
  .aahckd {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    width: 100vw;
    height: 100vh;
  }
  .aahckh {
    transform: scale(0.85);
  }
}
@media (max-width: 767px) {
  #slot {
    margin-top: -40px;
  }
}
.aahckf {
  width: 35em;
  position: absolute;
  pointer-events: none;
  right: 9em;
  bottom: -15em;
  z-index: 6;
  font-size: 65%;
}
@media (max-width: 991px) {
  .aahckf {
    font-size: 45%;
      right: 6em;
  }
}
.aahckg {
  width: 30em;
  position: absolute;
  bottom: 31em;
  z-index: 5;
  mix-blend-mode: screen;
  right: 2em;
  font-size: 45%;
}
@media (max-width: 991px) {
  .aahckg {
    font-size: 30%;
  }
}
.aahcke {
  position: absolute;
  right: calc(50% - 52em);
  bottom: calc(50% - 35em);
  width: 30em;
  height: 100%;
}
@media (max-width: 991px) {
  .aahcke {
    right: calc(50% - 18em);
    bottom: calc(50% - 32em);
  }
}
@media (max-width: 991px) and (max-height: 741px) {
  .aahcke {
    bottom: calc(50% - 35em);
  }
}
.aahckl {
  position: relative;
  z-index: 8;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  margin-top: 40px;
}
@media (max-width: 991px) {
  .aahckl {
    margin-top: 40px;
  }
}
.aahckr {
  margin-bottom: 15px;
  font-size: 55px;
  text-align: center;
  text-transform: uppercase;
  -webkit-text-stroke-width: 4px;
  -webkit-text-stroke-color: #ff00a2;
  background: -webkit-linear-gradient(#fff, #eee);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  opacity: 0;
}
.aahckr.win__show {
  opacity: 1;
  animation: 1.5s zoomInDown both;
}
.bottom__section-button {
  background: url(../img/button_middle.webp) repeat-x center center;
  background-size: contain;
  padding: 0;
  height: 91px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 36px;
  border: 0;
  cursor: pointer;
  text-transform: uppercase;
  text-decoration: none;
  white-space: nowrap;
  position: relative;
}
.bottom__section-button span {
  position: relative;
  z-index: 3;
  margin-left: -75px;
  margin-right: -75px;
  top: -12px;
  color: #fff;
  text-shadow:
    0 -3px 1px #4B2299,
    -2px -2px 1px #4B2299,
    -1px -2px 1px #4B2299,
    0 -2px 1px #4B2299,
    1px -2px 1px #4B2299,
    2px -2px 1px #4B2299,
    -2px -1px 1px #4B2299,
    -1px -1px 1px #4B2299,
    0 -1px 1px #4B2299,
    1px -1px 1px #4B2299,
    2px -1px 1px #4B2299,
    -3px 0 1px #4B2299,
    -2px 0 1px #4B2299,
    -1px 0 1px #4B2299,
    0 0 1px #4B2299,
    1px 0 1px #4B2299,
    2px 0 1px #4B2299,
    3px 0 1px #4B2299,
    -2px 1px 1px #4B2299,
    -1px 1px 1px #4B2299,
    0 1px 1px #4B2299,
    1px 1px 1px #4B2299,
    2px 1px 1px #4B2299,
    -2px 2px 1px #4B2299,
    -1px 2px 1px #4B2299,
    0 2px 1px #4B2299,
    1px 2px 1px #4B2299,
    2px 2px 1px #4B2299,
    0 3px 1px #4B2299;
  -webkit-font-smoothing: antialiased;
}
@media (max-width: 1024px) {
  .bottom__section-button span {
    text-shadow:
      0 -2px 1px #4B2299,
      -1px -1px 1px #4B2299,
      0 -1px 1px #4B2299,
      1px -1px 1px #4B2299,
      -2px 0 1px #4B2299,
      -1px 0 1px #4B2299,
      0 0 1px #4B2299,
      1px 0 1px #4B2299,
      2px 0 1px #4B2299,
      -1px 1px 1px #4B2299,
      0 1px 1px #4B2299,
      1px 1px 1px #4B2299,
      0 2px 1px #4B2299;
    -webkit-font-smoothing: antialiased;
  }
}
.bottom__section-button:after,
.bottom__section-button:before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  width: 123px;
  background-size: contain;
  background-repeat: no-repeat;
}
.bottom__section-button:before {
  left: -122px;
  background-image: url(../img/button_left.webp);
}
.bottom__section-button:after {
  right: -123px;
  background-image: url(../img/button_right.webp);
}
.bottom__section-button:focus {
  animation: 0.5s scaleButton ease-in-out forwards;
}
.bottom__section-button.pulse {
  animation: 0.5s scaleButton ease-in-out infinite;
}
.aahckn,
.bottom__section-button.is--win-button {
  display: none;
}
.bottom__section-button.is--win-button.visible {
  animation: 1s headShake ease-in-out infinite;
}
@media (max-width: 767px) {
  .bottom__section-button {
    font-size: 30px;
  }
}
html {
  font-size: 10px;
  background: #0D0520;
  overflow: hidden;
}
@media (orientation: landscape) {
  html {
    overflow-y: scroll;
  }
}
.modal {
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  z-index: 998;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  opacity: 0;
  visibility: hidden;
}
@media (max-width: 767px) {
  .modal {
    justify-content: flex-start;
    top: 150px;
  }
}
.modal__container,
.modal__container:before {
  width: 100%;
  background-image: url(../img/modal-background.webp);
  background-position: center center;
  background-repeat: no-repeat;
  background-size: contain;
}
.modal__container {
  max-width: 2000px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 50px;
  flex-direction: column;
  position: static;
  z-index: 2;
}
.modal__container:before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  height: 100%;
  z-index: -1;
}
@media (max-width: 767px) {
  .modal__container:before {
    top: -30%;
  }
}
@media (max-width: 991px) {
  .modal__container {
    padding: 0;
  }
}
@media (max-width: 767px) {
  .modal__container {
    height: auto;
  }
}
.modal__logo {
  width: 100%;
  max-width: 850px;
}
@media (max-width: 991px) {
  .modal__logo {
    max-width: 80%;
    margin-top: 20px;
  }
}
@media (max-width: 767px) {
  .modal__logo {
    margin-top: 0;
    max-width: 90%;
  }
}
.modal__text {
  text-align: center;
  font-size: 44px;
  font-style: normal;
  line-height: normal;
  text-transform: uppercase;
  padding: 2px;
  margin-bottom: 15px;
  max-width: 800px;
  color: #7B61FF;
  text-shadow:
    0 -3px 1px #fff,
    -2px -2px 1px #fff,
    -1px -2px 1px #fff,
    0 -2px 1px #fff,
    1px -2px 1px #fff,
    2px -2px 1px #fff,
    -2px -1px 1px #fff,
    -1px -1px 1px #fff,
    0 -1px 1px #fff,
    1px -1px 1px #fff,
    2px -1px 1px #fff,
    -3px 0 1px #fff,
    -2px 0 1px #fff,
    -1px 0 1px #fff,
    0 0 1px #fff,
    1px 0 1px #fff,
    2px 0 1px #fff,
    3px 0 1px #fff,
    -2px 1px 1px #fff,
    -1px 1px 1px #fff,
    0 1px 1px #fff,
    1px 1px 1px #fff,
    2px 1px 1px #fff,
    -2px 2px 1px #fff,
    -1px 2px 1px #fff,
    0 2px 1px #fff,
    1px 2px 1px #fff,
    2px 2px 1px #fff,
    0 3px 1px #fff;
  -webkit-font-smoothing: antialiased;
}
@media (max-width: 1024px) {
  .modal__text {
    text-shadow:
      0 -2px 1px #fff,
      -1px -1px 1px #fff,
      0 -1px 1px #fff,
      1px -1px 1px #fff,
      -2px 0 1px #fff,
      -1px 0 1px #fff,
      0 0 1px #fff,
      1px 0 1px #fff,
      2px 0 1px #fff,
      -1px 1px 1px #fff,
      0 1px 1px #fff,
      1px 1px 1px #fff,
      0 2px 1px #fff;
    -webkit-font-smoothing: antialiased;
  }
}
@media (max-width: 991px) {
  .modal__text {
    font-size: 21px;
    max-width: 100%;
    margin-bottom: 20px;
  }
}
.modal__title {
  text-align: center;
  font-size: 80px;
  font-style: normal;
  line-height: normal;
  text-transform: uppercase;
  margin-top: -20px;
  margin-bottom: 40px;
  max-width: 800px;
  color: #fff;
  text-shadow:
    0 -3px 1px #7B61FF,
    -2px -2px 1px #7B61FF,
    -1px -2px 1px #7B61FF,
    0 -2px 1px #7B61FF,
    1px -2px 1px #7B61FF,
    2px -2px 1px #7B61FF,
    -2px -1px 1px #7B61FF,
    -1px -1px 1px #7B61FF,
    0 -1px 1px #7B61FF,
    1px -1px 1px #7B61FF,
    2px -1px 1px #7B61FF,
    -3px 0 1px #7B61FF,
    -2px 0 1px #7B61FF,
    -1px 0 1px #7B61FF,
    0 0 1px #7B61FF,
    1px 0 1px #7B61FF,
    2px 0 1px #7B61FF,
    3px 0 1px #7B61FF,
    -2px 1px 1px #7B61FF,
    -1px 1px 1px #7B61FF,
    0 1px 1px #7B61FF,
    1px 1px 1px #7B61FF,
    2px 1px 1px #7B61FF,
    -2px 2px 1px #7B61FF,
    -1px 2px 1px #7B61FF,
    0 2px 1px #7B61FF,
    1px 2px 1px #7B61FF,
    2px 2px 1px #7B61FF,
    0 3px 1px #7B61FF;
  -webkit-font-smoothing: antialiased;
}
@media (max-width: 1024px) {
  .modal__title {
    text-shadow:
      0 -2px 1px #7B61FF,
      -1px -1px 1px #7B61FF,
      0 -1px 1px #7B61FF,
      1px -1px 1px #7B61FF,
      -2px 0 1px #7B61FF,
      -1px 0 1px #7B61FF,
      0 0 1px #7B61FF,
      1px 0 1px #7B61FF,
      2px 0 1px #7B61FF,
      -1px 1px 1px #7B61FF,
      0 1px 1px #7B61FF,
      1px 1px 1px #7B61FF,
      0 2px 1px #7B61FF;
    -webkit-font-smoothing: antialiased;
  }
}
@media (max-width: 991px) {
  .modal__title {
    margin-bottom: 15px;
    font-size: 39px;
    -webkit-text-stroke-width: 0px;
  }
}
.modal.is--active {
  opacity: 1;
  visibility: visible;
}
.modal.is--active .aahckl {
  opacity: 1;
  position: static;
  margin-top: 0;
}
.is--modal-open .aahckl,
.is--modal-open .aahcks {
  opacity: 0;
}
@media (max-width: 991px) {
  .is--modal-open .aahckg {
    z-index: 1;
  }
  .is--modal-open .aahcke {
    bottom: calc(50% - 37em);
  }
}
@media (max-width: 991px) and (max-height: 741px) {
  .is--modal-open .aahcke {
    bottom: calc(50% - 40em);
  }
}
.is--modal-open .aahcki.is--mobile {
  max-width: 359px;
}
@media (max-width: 991px) {
  #reels:before {
    width: 106%;
  }
}
.aahckj {
  height: 106%;
  width: 110%;
  background-size: contain;
}
@media (max-width: 991px) {
  .aahckj {
    top: 50%;
  }
}
.aahckk {
  position: relative;
  top: 2px;
}
.aahckk:first-child {
  left: -5px;
}
.aahckk:last-child {
  right: -5px;
}
#bonus-inline {
  position: fixed;
}
@media (max-height: 741px) {
  #bonus-inline {
    position: absolute;
    left: -200%;
    min-width: 350px;
    transition: left 1s ease-out;
  }
  #bonus-inline img {
    transform: unset;
    top: -20px;
  }
}
#bonus-inline.is--active {
  background: linear-gradient(to left, #fedf01, #985100);
}
@media (max-height: 1024px) and (max-width: 1279px) {
  #bonus-inline.is--active {
    left: 50%;
    transform: translate(-50%, 0);
    transform-origin: unset;
    bottom: 5px;
    transition: left 1s ease-out;
  }
}
#bonus-inline.is--active p {
  background: linear-gradient(90deg, #004dff 0, #004dff 100%);
  -webkit-background-clip: text;
}
#bonus-inline.is--active svg path {
  stroke: #004dff;
}
/* ─── Стилі перенесені з index.html ─────────────────────────────────────────── */

body {
  font-family: "Montserrat", sans-serif;
  font-weight: 700;
}

/* Лоадер — кольори */
.aahcjz {
  background: radial-gradient(
    63.19% 63.19% at 50% 50%,
    #7B61FF 0%,
    #4B2299 54.5%,
    #1A0B3D 100%
  );
}
.aahckc {
  background: linear-gradient(to right, #2D1B69, #7B61FF);
}
.aahckb {
  background: linear-gradient(
    304deg,
    #fce767 0%,
    #e67b00 27%,
    #e4ac28 47%,
    #d87803 67.9951%,
    #fdeaac 83%
  );
}
.aahcka {
  margin-bottom: 0 !important;
}

/* Лоадер — позиціонування */
.aahcjz {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  z-index: 999;
  width: 100%;
  padding: 15px;
  display: flex;
  overflow: hidden;
  height: 100dvh;
}
.aahcjz.is--loaded {
  display: none;
}
.aahcka {
  margin-bottom: 35px;
  width: 100%;
  max-width: 400px;
}
.aahckb {
  width: 100%;
  height: 28px;
  max-width: 340px;
  padding: 4px;
  border-radius: 100px;
  position: relative;
}
.aahckb::before {
  position: absolute;
  content: "";
  left: 4px;
  top: 4px;
  border-radius: 100px;
  width: calc(100% - 8px);
  height: calc(100% - 8px);
  background-color: #fff;
}
.aahckc {
  position: relative;
  z-index: 2;
  width: 0;
  height: 100%;
  border-radius: 100px;
  transition: width 0.5s ease;
}
@media (max-width: 767px) {
  .aahckb {
    max-width: 220px;
  }
}

/* Кнопка — текст */
.bottom__section-button-text {
  white-space: nowrap;
}

/* Bonuses wrapper */
.bonuses-wrapper {
  background-color: rgba(0, 0, 0, 0.9);
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100dvh;
  z-index: 999;
  display: none;
  align-items: center;
  justify-content: center;
  flex-direction: column;
}
.bonuses-wrapper.is--active {
  display: flex;
}
.bonuses-wrapper h3 {
  font-size: 35px;
  padding: 5px;
  text-align: center;
}
.bonuses-wrapper img {
  width: 275px;
  height: 275px;
  margin-bottom: 45px;
  contain: paint;
  isolation: isolate;
  backface-visibility: hidden;
  will-change: auto;
  transform: none !important;
}
.display-none {
  display: none;
}
.bonus-inline {
  border-radius: 50px;
  height: 60px;
  min-width: 350px;
  position: absolute;
  bottom: 10px;
  left: -200%;
  z-index: 999;
  background: linear-gradient(to right, #fb121b, #49d915);
  padding: 6px;
}
.bonus-inline.is--active {
  left: 100%;
  transform: translate(calc(-100% - 10px), 0);
  transition: left 1s ease-out;
}
.bonus-inline.is--hidden {
  opacity: 0;
  overflow: hidden;
  visibility: hidden;
}
.bonus-inline img {
  width: 90px;
  min-width: 90px;
  height: 90px;
  position: relative;
  top: -20px;
  contain: paint;
  isolation: isolate;
  backface-visibility: hidden;
  will-change: auto;
}
.bonus-inline p {
  background: linear-gradient(90deg, #2a9e00 0%, #49d915 100%);
  white-space: nowrap;
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  font-size: 22px;
  text-align: center;
}
.bonus-inline .clickable-inline-box-element {
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  width: 100%;
  height: 100%;
  z-index: 2;
}
.bonus-inline__wrapper {
  background: #fff;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-radius: 50px;
  padding: 0 15px 0 0;
  height: calc(60px - 12px);
}
.bonus-inline__arrows {
  width: 36px;
  min-width: 36px;
  margin-left: 10px;
}
.bonus-inline__arrows svg {
  animation: arrow-left 1s infinite;
  float: left;
}
.bonus-inline__arrows svg:nth-child(1) {
  animation-delay: -0.2s;
}
.bonus-inline__arrows svg:nth-child(2) {
  animation-delay: -0.1s;
}
@keyframes arrow-left {
  0% {
    opacity: 0;
    transform: translate(0, 0);
  }
  50% {
    opacity: 1;
  }
  100% {
    opacity: 0;
    transform: translate(0, 0);
  }
}
@media (max-width: 768px) {
  .bonus-inline.is--active {
    left: 50%;
    transform: translate(-50%, 0);
  }
  .bonuses-wrapper img {
    width: 175px;
    height: 175px;
    margin-bottom: 25px;
  }
}
@media (max-height: 741px) {
  .bonus-inline {
    left: unset;
    right: 65px;
    bottom: 200%;
    transform: unset;
    min-width: 255px;
  }
  .bonus-inline.is--active {
    left: unset;
    right: 65px;
    transform: rotate(90deg);
    transform-origin: bottom right;
    bottom: 10px;
    transition: bottom 1s ease-out;
  }
  .bonus-inline img {
    transform: rotate(-90deg);
    top: 0;
  }
  .bonuses-wrapper img {
    width: 190px;
    height: 190px;
    margin-bottom: 25px;
  }
}

/* ─── Фікс: обводка тексту модалки на мобільному ──────────────────────────── */
@media (max-width: 991px) {
  .modal__title {
    -webkit-text-stroke-color: #7B61FF;
  }
}

/* ─── Fix: GPU acceleration for reel spin animation on mobile ─── */
.aahckk > div,
.aahckk > .icons {
    will-change: top, filter;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    position: relative;
}

/* ─── Restore reduced-motion ONLY for non-game elements ─── */
@media (prefers-reduced-motion: reduce) {
    html:focus-within {
        scroll-behavior: auto;
    }
    /* Protect game animations from being disabled */
    .aahckk > div,
    .aahckk > .icons,
    .aahckk .icons img,
    #reels,
    #reels *,
    #slot,
    #slot *,
    .wheel__spinner_win_1,
    .wheel__spinner_win_2,
    .wheel__spinner_win_3,
    .wheel__spinner_win_4,
    .wheel__spinner_win_5,
    .wheel__spinner_win_6,
    .wheel__spinner_win_7,
    .wheel__spinner_win_8,
    .is--win-spinner,
    .is--winner .aahckk .icons img {
        animation-duration: revert !important;
        animation-iteration-count: revert !important;
        transition-duration: revert !important;
        transition: revert !important;
    }
}
