@font-face {
  font-family: "Ode to idle Gaming";
  src: url("../fonts/Ode_to_Idle_Gaming.woff");
}
@font-face {
  font-family: "ChakraPetch";
  font-weight: 300;
  src: url("../fonts/ChakraPetch-Light.ttf");
}
@font-face {
  font-family: "ChakraPetch";
  src: url("../fonts/ChakraPetch-Regular.ttf");
}
@font-face {
  font-family: "ChakraPetch";
  font-weight: 500;
  src: url("../fonts/ChakraPetch-Medium.ttf");
}
@font-face {
  font-family: "ChakraPetch";
  font-weight: 600;
  src: url("../fonts/ChakraPetch-SemiBold.ttf");
}
@font-face {
  font-family: "ChakraPetch";
  font-weight: 700;
  src: url("../fonts/ChakraPetch-Bold.ttf");
}
:root {
  --base-scale: 0.2777777778vh;
  --base-scale-width: 0.15625vw;
  --font-size-xxxs: calc(6 * var(--base-scale));
  --font-size-xxs: calc(8 * var(--base-scale));
  --font-size-xs: calc(10 * var(--base-scale));
  --font-size-sm: calc(12 * var(--base-scale));
  --font-size-md: calc(14 * var(--base-scale));
  --font-size-lg: calc(16 * var(--base-scale));
  --font-size-xl: calc(18 * var(--base-scale));
  --font-size-xxl: calc(20 * var(--base-scale));
  --font-size-display: calc(24 * var(--base-scale));
  --spacing-quark: calc(2 * var(--base-scale));
  --spacing-nano: calc(4 * var(--base-scale));
  --spacing-xxxs: calc(8 * var(--base-scale));
  --spacing-xxs: calc(16 * var(--base-scale));
  --spacing-xs: calc(24 * var(--base-scale));
  --spacing-sm: calc(32 * var(--base-scale));
  --spacing-xxl: calc(64 * var(--base-scale));
  --border-width-none: calc(none * var(--base-scale));
  --border-width-hairline: calc(1 * var(--base-scale));
  --border-width-thin: calc(2 * var(--base-scale));
  --border-width-medium: calc(3 * var(--base-scale));
  --border-width-thick: calc(4 * var(--base-scale));
  --spacing_inset-xxxs: calc(8 * var(--base-scale));
  --spacing_sides-xxxs: calc(8 * var(--base-scale));
  --spacing_sides-xxs: calc(16 * var(--base-scale));
  --screen-margin: var(--spacing-xxs);
  --one-pixel-scaled: calc(1 * var(--base-scale));
}
@media (max-aspect-ratio: 16/9) {
  :root {
    --base-scale: 0.15625vw;
  }
}
#frvrMenuMobile {
  pointer-events: all;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 9999999999;
}
.frvr-dark-blur {
  background: rgba(0, 0, 0, 0.6);
  width: 100%;
  height: 100%;
  position: fixed;
  z-index: -1;
}
.frvr-bg-lights {
  background: center/cover no-repeat
    url("../../img/frvr-ui/lights.svg");
  width: 100%;
  height: 100%;
  position: fixed;
  z-index: -1;
  opacity: 0.7;
}
.frvr-explosion-effect {
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  position: absolute;
  z-index: -1;
}
.mobPopPrompt {
  padding: var(--spacing-sm);
  text-align: center;
  height: 100%;
  box-sizing: border-box;
}
.mobPopPrompt .frvr-scroll-content {
  display: flex;
}
.mobPopPrompt .prompt-content {
  justify-self: center;
  margin: auto;
}
.mobPopPrompt .header {
  color: #fff;
  margin: 0 var(--spacing-sm) var(--spacing-sm);
  font-family: "ChakraPetch";
  font-weight: 600;
  font-size: var(--font-size-xl);
  line-height: 1.5em;
}
.mobPopPrompt .header span {
  color: #fff;
}
.mobPopPrompt .buttons {
  display: flex;
  margin-top: 15px;
  justify-content: center;
}
.mobPopPrompt .buttons .frvr-button + .frvr-button {
  margin-top: 0;
  margin-left: var(--spacing-xxs);
}
.frvr-icon-close,
.frvr-icon-back,
.frvr-item-icon-back {
  background: url("../../img/frvr-ui/close-icon.svg");
  display: block;
  width: calc(36 * var(--base-scale));
  height: calc(36 * var(--base-scale));
  background-size: calc(36 * var(--base-scale));
  pointer-events: auto;
  z-index: 1;
  position: absolute;
  transition: transform 0.2s;
  cursor: pointer;
}
.frvr-icon-close:before,
.frvr-icon-back:before,
.frvr-item-icon-back:before {
  content: "";
  display: block;
  position: absolute;
  left: -5px;
  right: -5px;
  top: -5px;
  bottom: -5px;
}
.frvr-icon-close--small,
.frvr-icon-back--small,
.frvr-item-icon-back--small {
  width: calc(32 * var(--base-scale));
  height: calc(32 * var(--base-scale));
  background-size: calc(32 * var(--base-scale));
}
.frvr-icon-close:hover,
.frvr-icon-close.is-pressed,
.frvr-icon-back:hover,
.frvr-icon-back.is-pressed,
.frvr-item-icon-back:hover,
.frvr-item-icon-back.is-pressed {
  transform: scale(0.9);
}
.mobPopAlert {
  padding: 20px;
  text-align: center;
  height: 100%;
  box-sizing: border-box;
}
.mobPopAlert .frvr-scroll-wrapper {
  height: calc(100% - 36 * var(--base-scale));
  padding-bottom: var(--screen-margin);
}
.mobPopAlert .frvr-scroll-content {
  display: flex;
}
.mobPopAlert .alert-content {
  justify-self: center;
  margin: auto;
}
.mobPopAlert .alert-content .alert-img {
  width: calc(65 * var(--base-scale));
}
.mobPopAlert .alert-text {
  color: #fff;
  margin: var(--spacing-sm) 0;
  line-height: 32px;
  font-family: "ChakraPetch";
  font-weight: 600;
  font-size: var(--font-size-xl);
  line-height: 1.5em;
}
.mobPopAlert .alert-text span,
.mobPopAlert .alert-text p {
  color: #fff;
}
.mobPopAlert .alert-text .title-text {
  font-family: "Ode to idle Gaming";
  font-weight: 400;
  font-size: var(--font-size-display);
  line-height: 1.2em;
  font-size: var(--font-size-xxl);
  text-transform: uppercase;
}
.mobPopAlert .alert-text .small-text {
  font-family: "ChakraPetch";
  font-weight: 700;
  font-size: var(--font-size-sm);
  line-height: 1.2em;
}
.mobPopAlert .frvr-button {
  margin-left: 5px;
  margin-right: 5px;
}
.mobBlurred {
  filter: blur(8px);
}
.frvr-scroll-wrapper {
  min-height: 100%;
  position: relative;
  pointer-events: auto;
}
.frvr-scroll-content {
  overflow: auto;
  position: absolute;
  width: 100%;
  height: 100%;
  padding-bottom: var(--screen-margin);
}
.frvr-button {
  pointer-events: all;
  display: inline-flex;
  width: fit-content;
  align-items: center;
  justify-content: center;
  position: relative;
  z-index: 1;
  filter: drop-shadow(
    calc(-2 * var(--one-pixel-scaled)) calc(3 * var(--one-pixel-scaled)) 0px
      rgba(0, 0, 0, 0.75)
  );
  font-family: "Ode to idle Gaming";
  font-weight: 400;
  font-size: var(--font-size-xs);
  line-height: 1.2em;
  min-height: calc(36 * var(--base-scale));
  box-sizing: border-box;
  letter-spacing: 0.05em;
  padding: var(--spacing-xxxs) var(--spacing_sides-xxxs);
  color: #fff;
  text-shadow:
    var(--one-pixel-scaled) var(--one-pixel-scaled) 0px #000,
    calc(-1 * var(--one-pixel-scaled)) calc(-1 * var(--one-pixel-scaled)) 0px
      #000,
    var(--one-pixel-scaled) calc(-1 * var(--one-pixel-scaled)) 0px #000,
    calc(-1 * var(--one-pixel-scaled)) var(--one-pixel-scaled) 0px #000,
    calc(-1.5 * var(--one-pixel-scaled)) calc(1.5 * var(--one-pixel-scaled)) 0px
      #000;
  cursor: pointer;
  -webkit-user-select: none;
  user-select: none;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  gap: var(--spacing-nano);
  will-change: filter;
}
@supports not (gap: var(--spacing-nano)) {
  .frvr-button > * {
    margin-right: var(--spacing-nano);
  }
  .frvr-button > *:last-child {
    margin-right: 0;
  }
}
.frvr-button img {
  max-height: calc(16 * var(--base-scale));
  height: calc(16 * var(--base-scale));
}
.frvr-button > .material-icons {
  font-size: var(--font-size-md);
}
.frvr-button--size-xxs {
  font-family: "Ode to idle Gaming";
  font-weight: 400;
  font-size: var(--font-size-xxxs);
  line-height: 1.2em;
  min-height: calc(20 * var(--base-scale));
  padding: var(--spacing-nano) var(--spacing-xxxs);
}
.frvr-button--size-xxs img {
  max-height: calc(12 * var(--base-scale));
  height: calc(12 * var(--base-scale));
}
.frvr-button--size-xs {
  font-family: "Ode to idle Gaming";
  font-weight: 400;
  font-size: var(--font-size-xxs);
  line-height: 1.5em;
  min-height: calc(24 * var(--base-scale));
}
.frvr-button--size-sm {
  font-family: "Ode to idle Gaming";
  font-weight: 400;
  font-size: var(--font-size-xs);
  line-height: 1.2em;
  min-height: calc(30 * var(--base-scale));
  padding: var(--spacing-xxxs) var(--spacing_sides-xxxs);
}
.frvr-button--size-md {
  font-family: "Ode to idle Gaming";
  font-weight: 400;
  font-size: var(--font-size-sm);
  line-height: 1.2em;
  min-height: calc(36 * var(--base-scale));
}
.frvr-button--size-lg {
  font-family: "Ode to idle Gaming";
  font-weight: 400;
  font-size: var(--font-size-lg);
  line-height: 1.2em;
  min-height: calc(60 * var(--base-scale));
  text-shadow:
    var(--one-pixel-scaled) var(--one-pixel-scaled) 0px #000,
    calc(-1 * var(--one-pixel-scaled)) calc(-1 * var(--one-pixel-scaled)) 0px
      #000,
    var(--one-pixel-scaled) calc(-1 * var(--one-pixel-scaled)) 0px #000,
    calc(-1 * var(--one-pixel-scaled)) var(--one-pixel-scaled) 0px #000,
    calc(-2 * var(--one-pixel-scaled)) calc(2 * var(--one-pixel-scaled)) 0px
      #000,
    calc(-3 * var(--one-pixel-scaled)) calc(3 * var(--one-pixel-scaled)) 0px
      #000;
}
.frvr-button--size-lg img {
  max-height: calc(20 * var(--base-scale));
  height: calc(20 * var(--base-scale));
}
.frvr-button--width-100 {
  width: calc(100 * var(--base-scale));
}
.frvr-button--width-120 {
  width: calc(120 * var(--base-scale));
}
.frvr-button--width-150 {
  width: calc(150 * var(--base-scale));
}
.frvr-button--width-170 {
  width: calc(170 * var(--base-scale));
}
.frvr-button--width-200 {
  width: calc(200 * var(--base-scale));
}
.frvr-button::before {
  content: "";
  display: block;
  position: absolute;
  height: 100%;
  width: 100%;
  top: 0;
  left: 0;
  z-index: -1;
  background: #ffe540;
  clip-path: polygon(
    0 calc(3 * var(--base-scale)),
    calc(3.5 * var(--base-scale)) 0,
    calc(100% - 4.5 * var(--base-scale)) 0,
    100% calc(4.5 * var(--base-scale)),
    100% calc(100% - 3.5 * var(--base-scale)),
    calc(100% - 3.5 * var(--base-scale)) 100%,
    calc(4.5 * var(--base-scale)) 100%,
    calc(2.75 * var(--base-scale)) calc(100% - 3.5 * var(--base-scale)),
    0 calc(100% - 4.5 * var(--base-scale))
  );
}
.frvr-button::after {
  content: "";
  display: block;
  position: absolute;
  height: 100%;
  width: 100%;
  top: 0;
  left: 0;
  z-index: -1;
  background: #efbe3f;
  clip-path: polygon(
    0 calc(3 * var(--base-scale)),
    calc(3.5 * var(--base-scale)) 0,
    calc(100% - 4.5 * var(--base-scale)) 0,
    100% calc(4.5 * var(--base-scale)),
    100% calc(100% - 3.5 * var(--base-scale)),
    calc(100% - 3.5 * var(--base-scale)) 100%,
    calc(4.5 * var(--base-scale)) 100%,
    calc(2.75 * var(--base-scale)) calc(100% - 3.5 * var(--base-scale)),
    0 calc(100% - 4.5 * var(--base-scale)),
    0 calc(3 * var(--base-scale)),
    calc(3 * var(--base-scale)) calc(4.379 * var(--base-scale)),
    calc(3 * var(--base-scale)) calc(100% - 6.602 * var(--base-scale)),
    calc(4.898 * var(--base-scale)) calc(100% - 5.91 * var(--base-scale)),
    calc(6.354 * var(--base-scale)) calc(100% - 3 * var(--base-scale)),
    calc(100% - 4.742 * var(--base-scale)) calc(100% - 3 * var(--base-scale)),
    calc(100% - 3 * var(--base-scale)) calc(100% - 4.742 * var(--base-scale)),
    calc(100% - 3 * var(--base-scale)) calc(5.742 * var(--base-scale)),
    calc(100% - 5.742 * var(--base-scale)) calc(3 * var(--base-scale)),
    calc(4.609 * var(--base-scale)) calc(3 * var(--base-scale)),
    calc(3 * var(--base-scale)) calc(4.379 * var(--base-scale))
  );
}
.frvr-button.frvr-button--magenta::before {
  background: #eb8cff;
}
.frvr-button.frvr-button--magenta::after {
  background: #c569d8;
}
.frvr-button.frvr-button--purple::before {
  background: #d747f5;
}
.frvr-button.frvr-button--purple::after {
  background: #a81ac6;
}
.frvr-button.frvr-button--pink::before {
  background: #f5479b;
}
.frvr-button.frvr-button--pink::after {
  background: #d01563;
}
.frvr-button.frvr-button--blue::before {
  background: #00b1ff;
}
.frvr-button.frvr-button--blue::after {
  background: #008dcb;
}
.frvr-button.frvr-button--red::before {
  background: #fb5555;
}
.frvr-button.frvr-button--red::after {
  background: #d14040;
}
.frvr-button.frvr-button--gray::before {
  background: #a8a8a8;
}
.frvr-button.frvr-button--gray::after {
  background: gray;
}
.frvr-button.frvr-button--bookmark::before {
  background: url(../../img/bookmark_icon.png);
  background-size: contain;
  border: 0px #fff;
  border-radius: 50%;
  width: calc(60 * var(--base-scale));
  height: calc(58 * var(--base-scale));
  top: calc(2 * var(--base-scale));
  bottom: calc(2 * var(--base-scale));
  right: calc(2 * var(--base-scale));
  left: calc(2 * var(--base-scale));
}
.frvr-button.frvr-button--bookmark::after {
  background: unset;
}
@media (hover: hover) and (pointer: fine) {
  .frvr-button:hover::before,
  .frvr-button:hover:after,
  .frvr-button:hover > * {
    transform: scale(0.98);
  }
}
.frvr-button:active::before,
.frvr-button:active:after,
.frvr-button:active > *,
.frvr-button.is-pressed::before,
.frvr-button.is-pressed:after,
.frvr-button.is-pressed > * {
  transform: scale(0.95);
}
.frvr-button:disabled,
.frvr-button.is-disabled {
  color: #bebebe;
  text-shadow: none;
  filter: none;
  cursor: not-allowed;
}
.frvr-button:disabled::before,
.frvr-button.is-disabled::before {
  background: rgba(0, 0, 0, 0.5);
  transform: none;
}
.frvr-button:disabled::after,
.frvr-button.is-disabled::after {
  background: gray;
  transform: none;
}
.frvr-button:disabled > *,
.frvr-button.is-disabled > * {
  transform: none;
}
.loader-animation {
  position: relative;
  overflow: hidden;
  border-radius: 4px;
}
.loader-animation::before {
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  background: rgba(255, 255, 255, 0.25);
  opacity: 1;
  animation: opacityChange 1.7s infinite;
  animation-delay: 200ms;
}
.loader-animation::after {
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  left: -100%;
  opacity: 0;
  background: linear-gradient(
    90deg,
    rgba(255, 255, 255, 0.1) 0%,
    rgba(255, 255, 255, 0.182836) 66.67%,
    rgba(255, 255, 255, 0.5) 100%
  );
  animation: shimmer 1.7s infinite;
  animation-delay: 200ms;
}
@keyframes shimmer {
  0% {
    left: -100%;
    opacity: 0;
    animation-timing-function: cubic-bezier(0, 0.55, 0, 0.98);
    animation-delay: 200ms;
    animation-duration: 1000ms;
  }
  70% {
    left: 0;
    opacity: 0.5;
    animation-timing-function: linear;
    animation-delay: 1ms;
    animation-duration: 300ms;
  }
  86% {
    left: 0;
    opacity: 0;
    animation-timing-function: linear;
    animation-delay: 1ms;
    animation-duration: 100ms;
  }
  100% {
    left: -100%;
    opacity: 0;
    animation-timing-function: linear;
    animation-delay: 1ms;
    animation-duration: 100ms;
  }
}
@keyframes opacityChange {
  0% {
    opacity: 1;
    animation-timing-function: cubic-bezier(0, 0.55, 0, 0.98);
    animation-delay: 200ms;
    animation-duration: 1000ms;
  }
  70% {
    opacity: 1;
    animation-timing-function: linear;
    animation-delay: 1ms;
    animation-duration: 300ms;
  }
  86% {
    opacity: 0.75;
    animation-timing-function: linear;
    animation-delay: 1ms;
    animation-duration: 100ms;
  }
  100% {
    opacity: 0.75;
    animation-timing-function: linear;
    animation-delay: 1ms;
    animation-duration: 100ms;
  }
}
.frvr-reward-screen {
  text-align: center;
  display: flex;
  flex-direction: column;
  justify-content: center;
  height: 100%;
}
@media only screen and (min-width: 1200px) {
  .frvr-reward-screen {
    width: 100vw;
    height: 56.25vw;
    max-height: 100vh;
    max-width: 177.78vh;
    margin: auto;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
  }
}
.frvr-reward-screen .screen-title {
  color: #fff;
}
.frvr-reward-screen .screen-title .reward-title {
  font-family: "Ode to idle Gaming";
  font-weight: 400;
  font-size: var(--font-size-lg);
  line-height: 1.2em;
}
.frvr-reward-screen .screen-title .reward-subtitle {
  margin-top: var(--spacing-xxxs);
  font-family: "ChakraPetch";
  font-weight: 700;
  font-size: var(--font-size-sm);
  line-height: 1.2em;
}
.frvr-reward-screen .reward-image {
  position: absolute;
  width: calc(174 * var(--base-scale));
  max-height: calc(174 * var(--base-scale));
  top: calc(50% - 87 * var(--base-scale));
  left: calc(50% - 87 * var(--base-scale));
}
.frvr-reward-screen .reward-image--bp {
  width: calc(84 * var(--base-scale));
  max-height: calc(174 * var(--base-scale));
  top: calc(50% - 68 * var(--base-scale));
  left: calc(50% - 42 * var(--base-scale));
}
.frvr-reward-screen .reward-image--xp {
  top: calc(50% - 68 * var(--base-scale));
}
.frvr-reward-screen .reward-image--doublexp {
  width: unset;
  height: calc(110 * var(--base-scale));
  top: calc(50% - 54 * var(--base-scale));
  left: 50%;
  transform: translateX(-50%);
}
.frvr-reward-screen .buttons {
  display: flex;
  width: 100%;
  margin-top: 50vh;
  align-items: center;
}
.frvr-reward-screen .buttons:not(.buttons--center) > * {
  flex: 1;
}
.frvr-reward-screen .buttons--center {
  justify-content: center;
  gap: var(--spacing-sm);
}
:root {
  --genericPromptBackgroundOverlayColor: #faff00;
  --genericPromptButtonColor: #faff00;
}
#frvrMenuMobile {
  color: #fff;
}
.genericprompt .frvr-scroll-content {
  overflow: visible;
}
.genericprompt .header {
  font-size: initial;
  margin: 0px;
}
.genericprompt .genericPromptTitle {
  margin-top: -25px;
  color: #fff;
  font-size: calc(12 * var(--base-scale));
  line-height: calc(14 * var(--base-scale));
  font-family: "GameFont";
  z-index: 1;
  position: relative;
}
.genericprompt .genericPromptBackgroundOverlay {
  width: 100%;
  position: absolute;
  height: 30vw;
  padding: 13%;
  box-sizing: border-box;
  display: flex;
  justify-content: center;
  align-items: center;
}
.genericprompt .genericPromptBackgroundOverlay .frvr-explosion-effect {
  height: unset;
  top: unset;
  left: unset;
  position: absolute;
  width: 70%;
  z-index: 0;
}
.genericprompt .genericPromptBackgroundOverlay:after {
  content: "";
  width: 100%;
  height: 100%;
  display: block;
  background: center/var(--overlay-image-size) no-repeat var(--overlay-image);
  z-index: 1;
}
.genericprompt .genericPromptBackgroundOverlay--shorter {
  height: 25vw;
}
.genericprompt .genericPromptBackgroundOverlay--item {
  padding: 0%;
  height: 50vw;
}
.genericprompt .genericPromptSubTitle {
  margin-top: calc(15 * var(--base-scale));
  color: #fff;
  font-size: calc(6 * var(--base-scale));
  font-weight: 200;
}
.genericprompt .genericPromptBackground {
  height: 15vw;
  border-radius: 4px;
  position: relative;
  background: #000;
}
.genericprompt .genericPromptBackground:before {
  content: "";
  width: 100%;
  height: 100%;
  background: center/cover no-repeat
    url(../../img/frvr-ui/lights.svg);
  filter: var(--prompt-filter);
  display: block;
}
.genericprompt .genericPromptBackgroundOverlay canvas {
  margin-top: -15%;
}
.genericprompt .prompt-content {
  padding: 20px;
  background: #353535;
  border: 1.5px solid #fff;
  box-shadow:
    0px 0px 30px var(--genericPromptBackgroundOverlayColor),
    inset 0px 0px 4px var(--genericPromptBackgroundOverlayColor);
  border-radius: 8px;
  width: 50vw;
  z-index: 0;
}
.genericprompt .buttons {
  display: flex;
  justify-content: center;
  padding-bottom: 0px;
}
.genericprompt .buttons .frvr-button + .frvr-button {
  margin-top: 0;
  margin-left: 4px;
}
.genericprompt .frvr-button {
  margin-left: 4px;
  margin-right: 4px;
  background: rgba(0, 0, 0, 0.5);
  border: 3px solid;
  border-radius: 4px;
  box-sizing: border-box;
  clip-path: none;
  min-height: 15px;
}
.genericprompt .frvr-button::before {
  display: none;
}
.genericprompt .frvr-button::after {
  display: none;
}
.genericprompt .genericPromptButton {
  filter: none;
  max-width: 50%;
  margin-left: 2px;
  margin-left: 8px;
  margin-right: 8px;
  flex: 1;
}
.genericprompt .frvr-button-text {
  color: #fff;
  margin-top: 4px;
}