@charset "UTF-8";

@import url('https://fonts.googleapis.com/css2?family=Caveat&family=Cute+Font&family=Prosto+One&family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&family=Istok+Web:ital,wght@0,400;0,700;1,400;1,700&display=swap');

:root {
  --neutral-bg: #f0f0f0;
  --neutral-text: #333333;
  --maxWidth: 870px;
  --bigShadow: none;
  --contentContainerBackground: #bebebe;
  --lightBackground: rgb(255 255 255 / 0.85);
  --itemUp: itemUp 0.6s;
  --itemJump: itemJump 0.6s;
  --colorBuy: #00fe00;
  --colorSell: #ff001a;
    /* Цвета кнопок главного меню */;
  --color-dark-text: #262b2b;
  --color-light: #f8f9fa;
  --color-black: #000;
  --color-outline-info: #28a6e4;
  --color-red: #fc4f4f;
  --color-violet: #b76fff;
  --color-darkblue: #0273ff;
  --color-greenyellow: #97f805;
  --color-yellow: #e0e00e;
  --color-orange: #ffa500;
  --color-green: #00cc30;
  --color-success: #4aff34;
  --color-success-dark: #1c7430;
  --color-success-text: #032b0c;
  --color-greeting: #9484ff;
    /* Цвета фона кнопок главного меню */
  --color-greeting-bg: #c1b7ff;
  --color-green-bg: #89ffa5;
  --color-orange-bg: #ffd17a;
  --color-yellow-bg: #ffff92;
  --color-greenyellow-bg: #cbfc83;
  --color-darkblue-bg: #85bbfd;
  --color-violet-bg: #d8b2ff;
  --color-red-bg: #fcadad;
  --color-outline-info-bg: #7bd3ff;
  --color-outline-dark-bg: #f8f9fa9a;
  --color-happy-calc-result-bg:#e1e2e2;
}

.dark {
  --neutral-bg: #202020;
  --neutral-text: #f5f5f5;
  --contentContainerBackground: #2c2c2c;
   /* Цвета кнопок главного меню */;
  --color-dark-text: #262b2b;
  --color-light: #f8f9fa;
  --color-black: #000;
  --color-outline-info: #28a6e4;
  --color-red: #ef3b3b;
  --color-violet: #ae5dfd;
  --color-darkblue: #0273ff;
  --color-greenyellow: #adff2f;
  --color-yellow: #ffff00;
  --color-orange: #ffa500;
  --color-green: #00dd33;
  --color-success: #4aff34;
  --color-success-dark: #1c7430;
  --color-success-text: #032b0c;
  --color-greeting: #9484ff;
    /* Цвета фона кнопок главного меню */
  --color-greeting-bg: #1f194366;
  --color-green-bg: #00310c66;
  --color-orange-bg: #37230066;
  --color-yellow-bg: #35350066;
  --color-greenyellow-bg: #20350066;
  --color-darkblue-bg: #00224d66;
  --color-violet-bg: #2d045766;
  --color-red-bg: #35000066;
  --color-outline-info-bg: #002c4266;
  --color-outline-dark-bg: #4b4b4b;
  --color-happy-calc-result-bg:#4b4b4b;
}

/** СБРОС ВСТРОЕННЫХ СТИЛЕЙ **/
a.active.focus,
a.active:focus,
a.focus,
a:active.focus,
a:active:focus,
a:focus,
button.active.focus,
button.active:focus,
button.focus,
button:active.focus,
button:active:focus,
button:focus,
.btn.active.focus,
.btn.active:focus,
.btn.focus,
.btn:active.focus,
.btn:active:focus,
.btn:focus,
input:focus,
select:focus {
  outline: 0 !important;
  outline-color: transparent !important;
  outline-width: 0 !important;
  outline-style: none !important;
  box-shadow: 0 0 0 0 rgba(0, 0, 0, 0) !important;
}

a,
a.btn,
button.btn {
  -webkit-appearance: none;
  appearance: none;
  background: none;
  border: none;
  margin: 0;
  padding: 0;
  font: inherit;
  color: inherit;
  text-align: center;
  text-decoration: none;
  cursor: pointer;
  outline: none;
  -webkit-tap-highlight-color: transparent !important;
  touch-action: manipulation;
  display: inline-block;
}

input {
  height: 2rem !important;
  min-height: 2rem !important;
  border: none !important;
  -webkit-autofill-style: none;
}

input[type="number"] {
  /* Убираем стрелки в Safari */
  -webkit-appearance: none;
  -moz-appearance: textfield;
  
  /* Для Chrome/Safari */
  &::-webkit-inner-spin-button,
  &::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0;
  }
}

/* Сброс для всех типов input */
input[type="text"],
input[type="number"],
input[type="tel"],
input[type="email"],
input[type="password"],
input[type="search"] {
  /* Предотвращает зум на iOS */
  transform: translateZ(0);
  /* Сброс iOS стилей */
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  /* Убираем внутренние тени iOS */
  -webkit-box-shadow: none;
  box-shadow: none;
  /* Фикс для фокуса */
  -webkit-tap-highlight-color: transparent !important;
  outline: none;
  /* Убираем дефолтные стили Safari */
  -webkit-user-select: text;
  -webkit-user-modify: read-write-plaintext-only;
}

select {
  appearance: none !important;
  -moz-appearance: none !important;
  -webkit-appearance: none !important;
  -webkit-box-shadow: none;
  line-height: normal;
  height: 2rem !important;
  min-height: 2rem !important;
  border: none !important;
  outline: none !important;
  -webkit-tap-highlight-color: transparent !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%23262b2b' d='M6 8.825L1.175 4 2.238 2.938 6 6.713 9.763 2.938 10.825 4z'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: right 4px center !important;
  background-size: 12px !important;
}

@supports (-webkit-touch-callout: none) {
  select {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
  }
}

::-webkit-scrollbar {
  width: 3px;
}
/* фон полоски */
::-webkit-scrollbar-track {
  /*-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3); */
  background-color: rgba(0, 0, 0, 0.1);
}

/* активный бегунок */
::-webkit-scrollbar-thumb {
  -webkit-border-radius: 5px;
  border-radius: 5px;
  background: rgba(30, 189, 38, 0.85);
  -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.5);
}

/* неактивный бегунок */
::-webkit-scrollbar-thumb:window-inactive {
  background: #818181;
}

div {
  -o-transition: all 0.45s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  -moz-transition: all 0.45s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  -webkit-transition: all 0.45s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  transition: all 0.45s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}
/*------------ УБРАТЬ -------------*/
a.text-primary {
  color: #0099ff !important;
}
a.text-primary:focus, a.text-primary:hover {
  color: #ff6868 !important;
}
/*--------------------------------*/

.blur {
  background-color: rgb(0 0 0 / 0) !important;
  /*  background: rgb(76, 76, 76, 0.2);*/
  -webkit-backdrop-filter: saturate(180%) blur(6px);
  backdrop-filter: saturate(180%) blur(4px);
  opacity: 1;
}

/* Switch Lite-Dark Theme */
.ui-switch {
  /* switch */
  --switch-bg: rgb(135, 150, 165);
  --switch-width: 48px;
  --switch-height: 20px;
  /* circle */
  --circle-diameter: 32px;
  --circle-bg: rgb(0, 56, 146);
  --circle-inset: calc((var(--circle-diameter) - var(--switch-height)) / 2);
}

.ui-switch input {
  display: none;
}

.slider {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  width: var(--switch-width);
  height: var(--switch-height);
  background: var(--switch-bg);
  border-radius: 999px;
  position: relative;
  cursor: pointer;
}

.slider .circle {
  top: calc(var(--circle-inset) * -1);
  left: 0;
  width: var(--circle-diameter);
  height: var(--circle-diameter);
  position: absolute;
  background: #e5ac00;
  border-radius: inherit;
  background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgZmlsbD0iIzAwMzg5MiIgdmlld0JveD0iMCAwIDI0IDI0Ij48cGF0aCBkPSJNMTIgMi4yNWEuNzUuNzUgMCAwMS43NS43NXYyLjI1YS43NS43NSAwIDAxLTEuNSAwVjNhLjc1Ljc1IDAgMDEuNzUtLjc1ek03LjUgMTJhNC41IDQuNSAwIDExOSAwIDQuNSA0LjUgMCAwMS05IDB6TTE4Ljg5NCA2LjE2NmEuNzUuNzUgMCAwMC0xLjA2LTEuMDZsLTEuNTkxIDEuNTlhLjc1Ljc1IDAgMTAxLjA2IDEuMDYxbDEuNTkxLTEuNTl6TTIxLjc1IDEyYS43NS43NSAwIDAxLS43NS43NWgtMi4yNWEuNzUuNzUgMCAwMTAtMS41SDIxYS43NS43NSAwIDAxLjc1Ljc1ek0xNy44MzQgMTguODk0YS43NS43NSAwIDAwMS4wNi0xLjA2bC0xLjU5LTEuNTkxYS43NS43NSAwIDAwLTEuMDYxIDEuMDZsMS41OSAxLjU5MXpNMTIgMThhLjc1Ljc1IDAgMDEuNzUuNzVWMjFhLjc1Ljc1IDAgMDEtMS41IDB2LTIuMjVBLjc1Ljc1IDAgMDExMiAxOHpNNy43NTggMTcuMzAzYS43NS43NSAwIDAwLTEuMDYxLTEuMDZsLTEuNTkxIDEuNTlhLjc1Ljc1IDAgMDAxLjA2IDEuMDYxbDEuNTkxLTEuNTl6TTYgMTJhLjc1Ljc1IDAgMDEtLjc1Ljc1SDNhLjc1Ljc1IDAgMDEwLTEuNWgyLjI1QS43NS43NSAwIDAxNiAxMnpNNi42OTcgNy43NTdhLjc1Ljc1IDAgMDAxLjA2LTEuMDZsLTEuNTktMS41OTFhLjc1Ljc1IDAgMDAtMS4wNjEgMS4wNmwxLjU5IDEuNTkxeiIvPjwvc3ZnPg==");
  background-repeat: no-repeat;
  background-position: center center;
  -webkit-transition: left 150ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, -webkit-transform 150ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
  -o-transition: left 150ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, transform 150ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
  transition: left 150ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, transform 150ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, -webkit-transform 150ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
  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;
  box-shadow: 0px 2px 1px -1px rgba(0,0,0,0.2), 0px 1px 1px 0px rgba(0,0,0,0.14), 0px 1px 3px 0px rgba(0,0,0,0.12);
  ;
}

.slider .circle::before {
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  background: rgba(255, 255, 255, 0.8);
  border-radius: inherit;
  -webkit-transition: all 500ms;
  -o-transition: all 500ms;
  transition: all 500ms;
  opacity: 0;
}

/* actions */
.ui-switch input:checked+.slider .circle {
  background: #003892;
  background-repeat: no-repeat;
  background-position: center center;
  left: calc(100% - var(--circle-diameter));
  background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyMCIgaGVpZ2h0PSIyMCIgZmlsbD0iI2ZmYzEwNyIgdmlld0JveD0iMCAwIDI0IDI0Ij48cGF0aCBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik05LjUyOCAxLjcxOGEuNzUuNzUgMCAwIDEgLjE2Mi44MTlBOC45NyA4Ljk3IDAgMCAwIDkgNmE5IDkgMCAwIDAgOSA5IDguOTcgOC45NyAwIDAgMCAzLjQ2My0uNjkuNzUuNzUgMCAwIDEgLjk4MS45OCAxMC41MDMgMTAuNTAzIDAgMCAxLTkuNjk0IDYuNDZjLTUuNzk5IDAtMTAuNS00LjcwMS0xMC41LTEwLjUgMC00LjM2OCAyLjY2Ny04LjExMiA2LjQ2LTkuNjk0YS43NS43NSAwIDAgMSAuODE4LjE2MnoiIGNsaXAtcnVsZT0iZXZlbm9kZCIvPjwvc3ZnPg==");
}

.ui-switch input:active+.slider .circle::before {
  -webkit-transition: 0s;
  -o-transition: 0s;
  transition: 0s;
  opacity: 1;
  width: 0;
  height: 0;
}

@keyframes itemUp {
  from {
    display: none;
    transform: scale(0.9);
  }
  to {
    display: block;
    transform: scale(1);
    transition-timing-function: cubic-bezier(0.68, -0.55, 0.265, 1.55);
  }
}

@keyframes itemJump {
  from {
    display: none;
    transform: translate(0, 10%) scale(0.9);
  }
  to {
    display: block;
    transform: translate(0, 0) scale(1);
    transition-timing-function: cubic-bezier(0.68, -0.55, 0.265, 1.55);
  }
}

/** -- GARLANDS -- */
.garlands {
  box-shadow: inset 0px 17px 17px 0px var(--neutral-bg);
  position: absolute;
  width: 100%;
  /*  
  border-top: 2px solid #777;
*/
  padding: 0;
  display: flex;
  justify-content: center;
}
.garlands li {
  list-style: none;
  top: -20px;
  position: relative;
  width: 24px;
  min-width: 24px;
  height: 24px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.1);
  margin: 25px 25px 10px;
}
.garlands li::before {
  content: "";
  position: absolute;
  top: -7px;
  left: 7px;
  width: 10px;
  height: 8px;
  background: #444;
}
.garlands li::after {
  content: "";
  position: absolute;
  top: -24px;
  left: 12px;
  width: 74px;
  height: 26px;
  border-bottom: 2px solid #444;
  border-radius: 50%;
}
.garlands li:last-child::after {
  border-bottom: none;
}
.garlands li:nth-child(3n + 1) {
  background: rgba(255, 255, 0, 1);
  animation: animate1 1.5s linear infinite;
}
@keyframes animate1 {
  0% {
    background: rgba(255, 255, 0, 0.2);
  }
  50% {
    background: rgb(255, 166, 0);
    box-shadow: 0 0 25px rgba(255, 166, 0, 1), 0 0 45px rgba(255, 166, 0, 1);
  }
  100% {
    background: rgba(255, 255, 0, 0.2);
  }
}
.garlands li:nth-child(3n + 2) {
  background: rgba(255, 0, 255, 1);
  animation: animate2 1.5s linear infinite;
  animation-delay: 0.5s;
}
@keyframes animate2 {
  0% {
    background: rgba(255, 0, 255, 0.2);
  }
  50% {
    background: rgba(255, 0, 255, 1);
    box-shadow: 0 0 25px rgba(255, 0, 255, 1), 0 0 45px rgba(255, 0, 255, 1);
  }
  100% {
    background: rgba(255, 0, 255, 0.2);
  }
}
.garlands li:nth-child(3n + 3) {
  background: rgba(50, 255, 0, 1);
  animation: animate3 1.5s linear infinite;
  animation-delay: 1s;
}
@keyframes animate3 {
  0% {
    background: rgba(50, 255, 0, 0.2);
  }
  50% {
    background: rgba(50, 255, 0, 1);
    box-shadow: 0 0 25px rgba(50, 255, 0, 1), 0 0 45px rgba(50, 255, 0, 1);
  }
  100% {
    background: rgba(50, 255, 0, 0.2);
  }
}
/** -- End GARLANDS -- */

.animation-up {
  animation: var(--itemUp);
}

.animation-jump {
  animation: var(--itemJump);
}

body,
html,
html a {
  -webkit-text-size-adjust: 100%;
  -webkit-font-smoothing: antialiased;
}

canvas {
  display: block;
  position: absolute;
  inset: 0;
}

.cenz {
  position: fixed;
  top: 0.3rem;
  right: 0.7rem;
  z-index: 999999;
  font-family: "Prosto One";
  font-size: xx-large;
  line-height: 35px;
  font-weight: 600;
  opacity: 0.65;
  user-select: none;
}

.body {
  background-color: var(--neutral-bg);
  color: var(--neutral-text);
  font-family: Istok Web;
  font-size: 14px;
  line-height: 1.42857143;
  text-align: center;
  margin: 0;
  padding: 0;
  /* padding-top: 3rem; garlands */
  position: relative;
  top: 0;
  left: 0;
  width: 100%;
  min-width: 320px;
  height: 100vh;
  height: 100dvh;
}

.page {
  scroll-behavior: smooth;
  overflow: auto;
}

.page.display {
  display: block;
}

.feed-content {
  padding: 0 0.2rem;
}

#logoImage {
  display: block;
  width: 100%;
  max-width: 230px;
  margin: 0 auto;
  padding-top: 30px;
  /*
  filter: drop-shadow(0 1rem 1rem rgb(0 0 0 / 80%));
  filter: drop-shadow(0 1rem 3rem rgb(0 0 0 / 50%));
  */
  transform: scale(var(--scale, 1)); /* Масштабирование */
  /* Плавность анимации */
  transform-origin: center center;
  transition: transform 0.03s linear;
  will-change: transform;
  opacity: 1;
}

.menu-item-btn {
  position: relative;
  display: inline-flex !important;
  margin: 0 0.1rem;
  padding: 0.3rem 0.75rem !important;
  transition: all 0.45s;
  align-content: center;
  justify-content: center;
  align-items: center;
  width: 100%;
  /*height: 40px;*/
}

.content-container {
  border-radius: 2rem;
  max-width: var(--maxWidth);
  background-color: var(--contentContainerBackground);
  box-shadow: var(--bigShadow);
}

.header-content-container {
  letter-spacing: 1px;
}

body:not(.dark) .header-content-container {
  color: var(--color-dark-text) !important;
}

.menu-item-btn span {
  font-weight: 600;
  letter-spacing: 2px;
  margin: 0;
  font-size: clamp(1.12rem, calc(10px + 1vw), 21px);
  line-height: normal;
  text-transform: uppercase;
}

.menu-item-btn:hover span {
  color: var(--color-dark-text) !important;
}

body:not(.dark) .menu-item-btn span {
  color: var(--color-dark-text) !important;
}

.menu-item-btn.btn-outline-info {
  color: var(--color-outline-info);
  border: 2px solid var(--color-outline-info);
  background-color: var(--color-outline-info-bg);
  &:hover {
    background-color: var(--color-outline-info);
    border-color: var(--color-outline-info);
  }
}

.menu-item-btn.btn-outline-dark {
  color: var(--color-light);
  border: 2px solid var(--color-light);
  background-color: var(--color-outline-dark-bg);
  &:hover {
    border-color: var(--color-light);
    background-color: var(--color-light);
  }
  &:active {
    color: var(--color-dark-text) !important;
    border-color: var(--color-light) !important;
    background-color: var(--color-light) !important;
  }
}

.menu-item-btn.red {
  color: var(--color-red);
  border: 2px solid var(--color-red);
  background-color: var(--color-red-bg);
  &:hover {
    background-color: var(--color-red);
  }
}

.menu-item-btn.violet {
  color: var(--color-violet);
  border: 2px solid var(--color-violet);
  background-color: var(--color-violet-bg);
  &:hover {
    background-color: var(--color-violet);
  }
}

.menu-item-btn.darkblue {
  color: var(--color-darkblue);
  border: 2px solid var(--color-darkblue);
  background-color: var(--color-darkblue-bg);
  &:hover {
    background-color: var(--color-darkblue);
  }
}

.menu-item-btn.greenyellow {
  color: var(--color-greenyellow);
  border: 2px solid var(--color-greenyellow);
  background-color: var(--color-greenyellow-bg);
  &:hover {
    background-color: var(--color-greenyellow);
  }
}

.menu-item-btn.yellow {
  color: var(--color-yellow);
  border: 2px solid var(--color-yellow);
  background-color: var(--color-yellow-bg);
  &:hover {
    background-color: var(--color-yellow);
  }
}

.menu-item-btn.orange {
  color: var(--color-orange);
  border: 2px solid var(--color-orange);
  background-color: var(--color-orange-bg);
  &:hover {
    background-color: var(--color-orange);
  }
}

.menu-item-btn.btn-green {
  color: var(--color-green);
  border: 2px solid var(--color-green);
  background-color: var(--color-green-bg);
  &:hover {
    background-color: var(--color-green);
  }
}

.menu-item-btn.btn-success {
  color: var(--color-success-text);
  background-color: var(--color-success);
  border: 2px solid var(--color-success);
  &:hover {
    color: var(--color-light);
    background-color: var(--color-success-dark);
  }
}

.menu-item-btn.greeting-btn {
  color: var(--color-greeting);
  border: 2px solid var(--color-greeting);
  background-color: var(--color-greeting-bg);
  &:hover {
    background-color: var(--color-greeting);
  }
}

.paragraph {
  height: auto;
  display: none;
}

.more-btn.bi::before {
  vertical-align: -0.25em;
}

.br-1rem {
  border-radius: 1rem !important;
}

#regNumber {
  letter-spacing: 3px;
  margin-bottom: 0.5rem;
  font-family: "Prosto One", sans-serif;
 /* font-weight: 600; */
  font-style: normal;
  font-size: 2.563rem;
  line-height: 36px;
  text-align: center;
  white-space: nowrap;
  color: #1a1b1a;
  border-radius: 1.3rem;
  padding: 0.7rem 0.8rem;
  border: 2px solid #5af500;
  background-color: lawngreen;
}

.total-reg-bg {
  max-width: 300px;
  background-color: rgb(0 100 0 / 0.8);
  border: 2px solid #5af500;
  border-radius: 2rem;
  position: relative;
  padding: 0.5rem 0.7rem; /* 1rem 0.5rem 1rem; */
  display: flex;
  flex-direction: column;
  justify-content: space-around;
  align-items: center;
  box-shadow: var(--bigShadow);
  animation: var(--itemUp);
}

.total-reg-bg p {
  margin-bottom: 0.5rem;
  font-family: "Roboto";
  font-style: normal;
  letter-spacing: 1px;
  color: var(--color-light);
  font-size: 1.5rem;
  line-height: 36px;
  font-weight: bold;
  text-transform: uppercase;
  white-space: nowrap;
}

.container-switch-btn {
  display: inline-block;
  padding: .215rem;
  font-size: 79%;
  font-weight: bold;
  line-height: 1;
  text-align: center;
  white-space: nowrap;
  vertical-align: baseline;
  border-radius: 50rem !important;
  border: 2px solid var(--neutral-text);
  /* background-color: var(--color-outline-dark-bg); */
}

.switch-btn-lable {
  border: none !important;
  color: var(--neutral-text);
  border-radius: 50rem !important;
  padding: .175rem .75rem;
  &:hover {
    color: inherit;
  }
}

.switch-btn-lable.active {
  color: var(--neutral-bg);
  background-color: var(--neutral-text);
}

.referal-bonus,
.operator-bonus,
.calc-wait-time,
.calc-give-summ {
  display: none;
}

.referal-bonus.checked,
.operator-bonus.checked,
.calc-wait-time.checked,
.calc-give-summ.checked {
  display: block;
}

#paragraph-4 .switch-btn-lable {
  min-width: 130px;
}

.happy-calc-container .switch-btn-lable {
  min-width: 148px;
}

.happy-calc-container {
  position: relative;
  background-color: var(--color-outline-dark-bg);
  border-radius: 1rem;
}
.happy-calc-body {
  display: flex;
  align-items: flex-start;
  justify-content: center;
  flex-wrap: nowrap;
  margin-bottom: 1rem;
}

.happy-calc-input-box {
  width: 290px;
  margin-right: -3.5rem;
}

.happy-calc-input-box input {
  color: var(--green);
  padding-top: 0;
  padding-bottom: 0;
  font-size: 1.25rem !important;
  font-weight: bold;
  background-color: var(--lightBackground);
}

.container-select-currency {
  padding-top: 3.15rem;
/*
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: flex-end;
*/
}

/* Убираем стандартную стрелку в IE/Edge */
.happy-calc-container select::-ms-expand {
  display: none;
}

.happy-calc-body select {
  color: var(--color-dark-text);
  background-color: var(--lightBackground);
  vertical-align: middle;
  text-align: center;
  text-align-last: center;
  font-weight: bold;
}

.happy-calc-select-currency {
  width: 4.25rem;
  margin-right: -0.5rem;
}

.happy-calc-select-month {
  font-size: 1rem;
}

.happy-calc-header {
  font-size: 1.1rem;
  margin-bottom: .5rem;
  font-weight: normal;
  line-height: 1.2;
}

.happy-calc-header span {
  display: inline-block;
  font-weight: 600;
  color: var(--orange);
}

select option {
  text-align: center;
  text-align-last: center;
}

/* если месяцы в виде кнопок в ряд
.btn-select-month button {
  color: var(--neutral-bg);
  background-color: var(--neutral-text);
  padding: 7px 5px;
  width: 34px;
  height: 34px;
}
*/

.calculate-btn,
.close-calc-result-btn {
  text-transform: uppercase;
  letter-spacing: 1px;
  width: 310px;
  border: none !important;
  border-radius: 50rem !important;
  line-height: 2.5rem !important;
  font-weight: bold !important;
/*  padding: .65rem !important; */
}

.calculate-btn,
.close-calc-result-btn {
  display: none !important;
}

.calculate-btn.active,
.close-calc-result-btn.active {
  display: inline-block !important;
}

.calculate-btn {
  color: var(--color-light) !important;
  background-color: var(--green) !important;
  &:hover {
    background-color: var(--color-success-dark) !important;
  }
  &:active {
    background-color: var(--color-success-dark) !important;
  }
}

.close-calc-result-btn {
  color: var(--color-dark-text) !important;
  background-color: var(--color-orange) !important;
  &:hover {
    background-color: var(--orange) !important;
  }
  &:active {
    background-color: var(--orange) !important;
  }
}

.happy-calc-result {
  display: none;
  position: absolute;
  z-index: 2;
  top: 3.438rem;
  bottom: 3.438rem;
  left: 0;
  right: 0;
  width: 100%;
  height: auto;
  background-color: var(--color-happy-calc-result-bg);
  border-radius: 1rem;
  /*animation: var(--itemUp);*/
  padding: 0.75rem;
  font-size: 1.5rem;
  font-weight: normal;
  line-height: 1.2;
  text-align: center;
  text-align: -webkit-center;
}

.happy-calc-result.active {
  display: block;
}

.happy-calc-result strong {
  color: var(--green);
}

button.close {
  font-size: 1rem !important;
}

.modal {
  background-color: var(--neutral-bg);
}

.modal-backdrop {
  background-color: transparent;
}

.modal-backdrop.show {
  opacity: 1;
}

.modal-content {
  background-color: transparent !important;
}

.modal-header {
  border: none !important;
}

.modal-header .close {
  margin: 0 0 auto 0 !important;
  opacity: 1 !important;
  float: none !important;
  color: #fff;
  text-shadow: none !important;
}

.menu-item-box .modal-dialog {
  transform: translate(0, 10%);
}

.menu-item-box .modal.show .modal-dialog {
  transform: translate(0, 0);
}

.modal-box.registration .modal-body {
  background-color: var(--contentContainerBackground);
}

.modal-box.registration .avtorise-btn,
.modal-box.registration .close-avtorise-btn {
  font-size: 1rem;
  line-height: 1.4rem;
  padding: 0.8rem 0;
}
.text-about-support-email {
  overflow-wrap: break-word;
  word-break: normal;
}

.horizontal-scroll-box {
  width: 100%;
  max-width: 100%;
  -webkit-overflow-scrolling: touch;
  vertical-align: middle;
  overflow-x: auto;
  overflow-y: hidden;
  white-space: nowrap;
  
  /* Улучшенная плавность скролла */
  scroll-behavior: smooth;
  -webkit-overflow-scrolling: touch; /* для iOS */
  
  /* Улучшаем производительность */
  will-change: scroll-position;
  backface-visibility: hidden;
  transform: translateZ(0);
  
  /* Скрываем скроллбар на всех устройствах */
  scrollbar-width: none; /* Firefox */
  -ms-overflow-style: none; /* IE/Edge */
}

.horizontal-scroll-box::-webkit-scrollbar {
  display: none; /* Chrome/Safari */
}

/* Десктоп-специфичные стили */
@media (hover: hover) and (pointer: fine) {
  .horizontal-scroll-box {
    cursor: grab;
    
    /* Сглаживание анимаций */
    transition: cursor 0.1s ease;
    
    &.is-dragging {
      cursor: grabbing;
      user-select: none;
      
      /* Улучшаем производительность при перетаскивании */
      .btn {
        pointer-events: none;
      }
    }
    
    /* Легкий эффект инерции для лучшего UX */
    scroll-behavior: auto; /* Отключаем smooth для drag, включаем для wheel */
  }
}

/* Для тач-устройств оставляем стандартное поведение */
@media (hover: none) and (pointer: coarse) {
  .horizontal-scroll-box {
    /* На iOS для плавности */
    -webkit-overflow-scrolling: touch;
  }
}

.horizontal-scroll-box > .select-item-btn {
  position: relative;
  font-family: 'Roboto';
  letter-spacing: 0.5px;
  font-size: 1.2rem;
  font-weight: 600;
  padding: 2rem 1.7rem 3rem;
  margin-right: 0.55rem;
  display: inline-block;
  color: #212529;
  background-color: var(--color-light);
  border: none;
  min-width: 228px;
  min-height: 138px;
  &:last-child {
    margin-right: 0.125rem;
  }
  &:hover {
    background-color: #c4f6ff;
  }
  &:active {
    background-color: #c4f6ff; /* #20c997 #999999 */
  }
  &::before {
    content: 'Подробнее';
    font-size: 80%;
    font-weight: 400;
    line-height: normal;
    color: var(--color-light);
    background-color: #212529a4;
    border-radius: 50rem;
    padding: 0.1rem 1rem;
    position: absolute;
    left: 50%;
    bottom: 0.9rem;
    transform: translateX(-50%);
    box-shadow: 0px 1px 4px rgba(0, 0, 0, 0.4);
  }
}

.horizontal-scroll-box > .scroll-box-item {
  border-radius: 1rem;
  background-color: var(--color-outline-dark-bg);
  position: relative;
  display: inline-flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  margin: 0 .55rem 0 0;
  border: none;
  width: 100%;
  max-width: 14.5rem;
  min-height: 11.5rem;
  padding: 0.5rem 0;
  vertical-align: middle;
  height: 100%;
  &:first-child {
    margin-left: 0rem;
    text-align: center;
  }
  &:last-child {
    margin-right: 0rem;
  }
}

.scroll-box-item .icon {
  margin: 0 auto;
}

.scroll-box-item .icon {
  display: inline-block;
  position: relative;
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
  width: 7rem;
  height: 7rem;
}

.scroll-box-item p.item-title {
  font-family: 'Roboto';
  letter-spacing: 0.5px;
  white-space: normal;
  font-weight: 600;
  padding: 0 0.5rem 0.3rem;
  margin: 0;
}

/* SVG icon */
      .icon-money {
        background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='%2300dd33' viewBox='0 0 16 16'%3e%3cpath d='M1 3a1 1 0 0 1 1-1h12a1 1 0 0 1 1 1H1zm7 8a2 2 0 1 0 0-4 2 2 0 0 0 0 4z'/%3e%3cpath d='M0 5a1 1 0 0 1 1-1h14a1 1 0 0 1 1 1v8a1 1 0 0 1-1 1H1a1 1 0 0 1-1-1V5zm3 0a2 2 0 0 1-2 2v4a2 2 0 0 1 2 2h10a2 2 0 0 1 2-2V7a2 2 0 0 1-2-2H3z'/%3e%3c/svg%3e");
      }
      .icon-chart {
        background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='%2323cf88' viewBox='0 0 16 16'%3e%3cpath d='M11 2a1 1 0 0 1 1-1h2a1 1 0 0 1 1 1v12h.5a.5.5 0 0 1 0 1H.5a.5.5 0 0 1 0-1H1v-3a1 1 0 0 1 1-1h2a1 1 0 0 1 1 1v3h1V7a1 1 0 0 1 1-1h2a1 1 0 0 1 1 1v7h1V2z'/%3e%3c/svg%3e");
      }
      .icon-robot {
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%230273ff' viewBox='0 0 16 16'%3E%3Cpath d='M6 12.5a.5.5 0 0 1 .5-.5h3a.5.5 0 0 1 0 1h-3a.5.5 0 0 1-.5-.5ZM3 8.062C3 6.76 4.235 5.765 5.53 5.886a26.58 26.58 0 0 0 4.94 0C11.765 5.765 13 6.76 13 8.062v1.157a.933.933 0 0 1-.765.935c-.845.147-2.34.346-4.235.346-1.895 0-3.39-.2-4.235-.346A.933.933 0 0 1 3 9.219V8.062Zm4.542-.827a.25.25 0 0 0-.217.068l-.92.9a24.767 24.767 0 0 1-1.871-.183.25.25 0 0 0-.068.495c.55.076 1.232.149 2.02.193a.25.25 0 0 0 .189-.071l.754-.736.847 1.71a.25.25 0 0 0 .404.062l.932-.97a25.286 25.286 0 0 0 1.922-.188.25.25 0 0 0-.068-.495c-.538.074-1.207.145-1.98.189a.25.25 0 0 0-.166.076l-.754.785-.842-1.7a.25.25 0 0 0-.182-.135Z'/%3E%3Cpath d='M8.5 1.866a1 1 0 1 0-1 0V3h-2A4.5 4.5 0 0 0 1 7.5V8a1 1 0 0 0-1 1v2a1 1 0 0 0 1 1v1a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2v-1a1 1 0 0 0 1-1V9a1 1 0 0 0-1-1v-.5A4.5 4.5 0 0 0 10.5 3h-2V1.866ZM14 7.5V13a1 1 0 0 1-1 1H3a1 1 0 0 1-1-1V7.5A3.5 3.5 0 0 1 5.5 4h5A3.5 3.5 0 0 1 14 7.5Z'/%3E%3C/svg%3E");
      }
      .icon-refresh {
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%230273ff' viewBox='0 0 16 16'%3E%3Cpath d='M11.534 7h3.932a.25.25 0 0 1 .192.41l-1.966 2.36a.25.25 0 0 1-.384 0l-1.966-2.36a.25.25 0 0 1 .192-.41zm-11 2h3.932a.25.25 0 0 0 .192-.41L2.692 6.23a.25.25 0 0 0-.384 0L.342 8.59A.25.25 0 0 0 .534 9z'/%3E%3Cpath fill-rule='evenodd' d='M8 3c-1.552 0-2.94.707-3.857 1.818a.5.5 0 1 1-.771-.636A6.002 6.002 0 0 1 13.917 7H12.9A5.002 5.002 0 0 0 8 3zM3.1 9a5.002 5.002 0 0 0 8.757 2.182.5.5 0 1 1 .771.636A6.002 6.002 0 0 1 2.083 9H3.1z'/%3E%3C/svg%3E");
      }
      .icon-person-check {
        position: relative;
        display: inline-block;
        width: 16px;
        height: 16px;
      }
      /* before - для управления цветом иконки */
      .icon-person-check::before {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background: linear-gradient(135deg, #5EFCE8 10%, #10a2fd 100%);  /* linear-gradient(135deg, #5EFCE8 10%, #736EFE 100%); */ /*цвет круга отдельно linear-gradient(108deg, #5e8ffc 60% 0%, #2feb00 60%) */
        -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M12.5 16a3.5 3.5 0 1 0 0-7 3.5 3.5 0 0 0 0 7Zm1.679-4.493-1.335 2.226a.75.75 0 0 1-1.174.144l-.774-.773a.5.5 0 0 1 .708-.708l.547.548 1.17-1.951a.5.5 0 1 1 .858.514ZM11 5a3 3 0 1 1-6 0 3 3 0 0 1 6 0Z'/%3E%3Cpath d='M2 13c0 1 1 1 1 1h5.256A4.493 4.493 0 0 1 8 12.5a4.49 4.49 0 0 1 1.544-3.393C9.077 9.038 8.564 9 8 9c-5 0-6 3-6 4Z'/%3E%3C/svg%3E");
        mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M12.5 16a3.5 3.5 0 1 0 0-7 3.5 3.5 0 0 0 0 7Zm1.679-4.493-1.335 2.226a.75.75 0 0 1-1.174.144l-.774-.773a.5.5 0 0 1 .708-.708l.547.548 1.17-1.951a.5.5 0 1 1 .858.514ZM11 5a3 3 0 1 1-6 0 3 3 0 0 1 6 0Z'/%3E%3Cpath d='M2 13c0 1 1 1 1 1h5.256A4.493 4.493 0 0 1 8 12.5a4.49 4.49 0 0 1 1.544-3.393C9.077 9.038 8.564 9 8 9c-5 0-6 3-6 4Z'/%3E%3C/svg%3E");
        -webkit-mask-repeat: no-repeat;
        mask-repeat: no-repeat;
        -webkit-mask-position: center;
        mask-position: center;
        -webkit-mask-size: contain;
        mask-size: contain;
      }
      .icon-headset {
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%239484ff' viewBox='0 0 16 16'%3E%3Cpath d='M8 1a5 5 0 0 0-5 5v1h1a1 1 0 0 1 1 1v3a1 1 0 0 1-1 1H3a1 1 0 0 1-1-1V6a6 6 0 1 1 12 0v6a2.5 2.5 0 0 1-2.5 2.5H9.366a1 1 0 0 1-.866.5h-1a1 1 0 1 1 0-2h1a1 1 0 0 1 .866.5H11.5A1.5 1.5 0 0 0 13 12h-1a1 1 0 0 1-1-1V8a1 1 0 0 1 1-1h1V6a5 5 0 0 0-5-5z'/%3E%3C/svg%3E");
      }
      .icon-clock {
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23ff6a00' viewBox='0 0 16 16'%3E%3Cpath d='M2.5 15a.5.5 0 1 1 0-1h1v-1a4.5 4.5 0 0 1 2.557-4.06c.29-.139.443-.377.443-.59v-.7c0-.213-.154-.451-.443-.59A4.5 4.5 0 0 1 3.5 3V2h-1a.5.5 0 0 1 0-1h11a.5.5 0 0 1 0 1h-1v1a4.5 4.5 0 0 1-2.557 4.06c-.29.139-.443.377-.443.59v.7c0 .213.154.451.443.59A4.5 4.5 0 0 1 12.5 13v1h1a.5.5 0 0 1 0 1h-11zm2-13v1c0 .537.12 1.045.337 1.5h6.326c.216-.455.337-.963.337-1.5V2h-7zm3 6.35c0 .701-.478 1.236-1.011 1.492A3.5 3.5 0 0 0 4.5 13s.866-1.299 3-1.48V8.35zm1 0v3.17c2.134.181 3 1.48 3 1.48a3.5 3.5 0 0 0-1.989-3.158C8.978 9.586 8.5 9.052 8.5 8.351z'/%3E%3C/svg%3E");
      }
      .icon-arrow-left-circle {
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%236610f2' viewBox='0 0 16 16'%3E%3Cpath fill-rule='evenodd' d='M1 8a7 7 0 1 0 14 0A7 7 0 0 0 1 8zm15 0A8 8 0 1 1 0 8a8 8 0 0 1 16 0zm-4.5-.5a.5.5 0 0 1 0 1H5.707l2.147 2.146a.5.5 0 0 1-.708.708l-3-3a.5.5 0 0 1 0-.708l3-3a.5.5 0 1 1 .708.708L5.707 7.5H11.5z'/%3E%3C/svg%3E");
      }
      .icon-ask-donate {
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='m384.54 283.26c0 18.933 15.347 34.279 34.279 34.279 18.933 0 34.279-15.346 34.279-34.279 0-18.927-15.346-34.274-34.279-34.274-18.932 0-34.279 15.347-34.279 34.274zm-128.54-267.26c37.62 0 68.117 30.497 68.117 68.117s-30.497 68.116-68.117 68.116-68.117-30.497-68.117-68.117 30.497-68.116 68.117-68.116zm-20.107 99.182c3.983 3.757 7.896 6.761 13.268 8.138l.083 3.449c.09 3.851 3.286 6.899 7.137 6.809s6.899-3.286 6.809-7.137l-.079-3.26c10.197-2.771 18.202-11.519 18.202-22.409 0-13.633-12.23-23.354-25.313-23.354-5.359 0-11.313-3.468-11.313-9.353 0-5.865 5.964-9.381 11.313-9.381 4.175-.275 9.081 2.371 10.422 4.412 2.114 3.216 6.436 4.11 9.652 1.996s4.11-6.436 1.996-9.653c-2.051-3.121-5.722-5.757-9.668-7.593-1.772-.824-3.672-1.517-5.544-2.039l-.104-4.343c-.09-3.851-3.286-6.899-7.137-6.808s-6.899 3.286-6.809 7.137l.093 3.878c-10.213 2.75-18.216 11.497-18.216 22.393 0 13.633 12.23 23.354 25.313 23.354 5.359 0 11.313 3.468 11.313 9.353 0 5.886-5.953 9.353-11.313 9.353-4.907 0-7.102-1.875-10.537-5.114-2.809-2.643-7.228-2.508-9.871.301-2.641 2.808-2.506 7.228.303 9.871zm-110.172-18.927h-91.663c-8.273 0-15.042 6.769-15.042 15.043v58.536c0 8.273 6.769 15.042 15.042 15.042h5.517l28.376 33.137 1.345-33.137h56.426c8.273 0 15.042-6.769 15.042-15.042v-58.536c0-8.274-6.769-15.043-15.043-15.043zm-52.831 23.711c0-3.866 3.134-7 7-7s7 3.134 7 7v13.6h13.6c3.866 0 7 3.134 7 7s-3.134 7-7 7h-13.6v13.6c0 3.866-3.134 7-7 7s-7-3.134-7-7v-13.6h-13.6c-3.866 0-7-3.134-7-7s3.134-7 7-7h13.6zm313.389-23.711h91.664c8.273 0 15.042 6.769 15.042 15.043v58.536c0 8.273-6.769 15.042-15.042 15.042h-5.517l-28.376 33.137-1.345-33.137h-56.426c-8.273 0-15.042-6.769-15.042-15.042v-58.536c-.001-8.274 6.768-15.043 15.042-15.043zm38.832 23.711v13.6h-13.6c-3.866 0-7 3.134-7 7s3.134 7 7 7h13.6v13.6c0 3.866 3.134 7 7 7s7-3.134 7-7v-13.6h13.6c3.866 0 7-3.134 7-7s-3.134-7-7-7h-13.6v-13.6c0-3.866-3.134-7-7-7s-7 3.134-7 7zm-62.284 331.786c0 58.997-213.654 58.997-213.654 0 0-58.996 47.834-106.823 106.831-106.823 58.996.001 106.823 47.828 106.823 106.823zm-156.197-184.65c0 27.27 22.104 49.374 49.374 49.374s49.374-22.104 49.374-49.374c0-27.261-22.104-49.366-49.374-49.366s-49.374 22.105-49.374 49.366zm-147.723 16.158c0 18.933 15.347 34.279 34.279 34.279s34.279-15.346 34.279-34.279c0-18.927-15.346-34.274-34.279-34.274s-34.279 15.347-34.279 34.274zm77.158 153.8c2.639-21.756 11.062-41.727 23.684-58.336-12.093-24.542-37.354-41.43-66.563-41.43-40.961 0-74.171 33.205-74.171 74.165 0 28.838 73.529 37.371 117.05 25.601zm356.919-25.601c0-40.96-33.205-74.165-74.165-74.165-29.208 0-54.472 16.887-66.566 41.429 12.621 16.609 21.044 36.581 23.682 58.338 43.521 11.769 117.049 3.236 117.049-25.602z' fill='%2316a6ff'/%3E%3C/svg%3E");
      }
      .icon-send-donate {
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='%23deac17'%3E%3Cpath d='m22 12a10 10 0 0 1-10.285 10 10.11 10.11 0 0 1-9.715-9.715 10 10 0 0 1 10-10.285 9.762 9.762 0 0 1 3.747.733.305.305 0 0 1 .151.413 4.5 4.5 0 0 0 3.623 6.33 4.607 4.607 0 0 0 1.78-.164.3.3 0 0 1 .383.2 9.87 9.87 0 0 1 .316 2.488z' opacity='.4'/%3E%3Cpath d='m22.53 3.47-2-2a.751.751 0 0 0-1.06 0l-2 2a.75.75 0 0 0 1.06 1.06l.72-.719v3.189a.75.75 0 0 0 1.5 0v-3.189l.72.719a.75.75 0 0 0 1.06-1.06z'/%3E%3Cpath d='m14.972 14.017a2.624 2.624 0 0 0-1.986-2.545l-1.608-.4a1.12 1.12 0 0 1-.617-.405 1.1 1.1 0 0 1-.233-.685 1.123 1.123 0 0 1 1.122-1.121h.7a1.125 1.125 0 0 1 1.116 1 .75.75 0 1 0 1.49-.167 2.617 2.617 0 0 0-2.228-2.3v-.394a.75.75 0 0 0-1.5 0v.4a2.618 2.618 0 0 0-.214 5.124l1.608.4a1.123 1.123 0 0 1-.272 2.212h-.7a1.125 1.125 0 0 1-1.116-1 .75.75 0 1 0-1.49.167 2.619 2.619 0 0 0 2.184 2.297v.4a.75.75 0 0 0 1.5 0v-.4a2.608 2.608 0 0 0 2.244-2.585z'/%3E%3C/g%3E%3C/svg%3E");
      }
      .icon-referal-bonus {
        background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 128 128' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m64 0 13.8 12.48 18.2-3.91 5.71 17.72 17.72 5.71-3.91 18.2 12.48 13.8-12.48 13.8 3.91 18.2-17.72 5.71-5.71 17.72-18.2-3.91-13.8 12.48-13.8-12.48-18.2 3.91-5.71-17.72-17.72-5.71 3.91-18.2-12.48-13.8 12.48-13.8-3.91-18.2 17.72-5.71 5.71-17.72 18.2 3.91z' fill='%23e0e689'/%3E%3Cpath d='m45.13 57.22a12.09 12.09 0 1 1 12.09-12.09 12.1 12.1 0 0 1 -12.09 12.09zm0-16.17a4.09 4.09 0 1 0 4.09 4.09 4.09 4.09 0 0 0 -4.09-4.14z' fill='%2399a30f'/%3E%3Cpath d='m82.87 95a12.09 12.09 0 1 1 12.13-12.13 12.1 12.1 0 0 1 -12.13 12.13zm0-16.17a4.09 4.09 0 1 0 4.13 4.04 4.09 4.09 0 0 0 -4.13-4.09z' fill='%2399a30f'/%3E%3Cpath d='m25.69 60h76.62v8h-76.62z' transform='matrix(.707 -.707 .707 .707 -26.51 64)' fill='%2399a30f'/%3E%3C/svg%3E");
      }
      .icon-ask-help {
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 120'%3E%3Cpath d='M10 39c0 16.0163 12.9837 29 29 29s29-12.9837 29-29-12.9837-29-29-29-29 12.9837-29 29z' fill='%23ffba33'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M41 25c0-1.1046-.8954-2-2-2s-2 .8954-2 2v2h-3.8781c-2.2675 0-4.1062.8933-5.3524 2.3303-1.2111 1.3966-1.7695 3.1942-1.7695 4.9197s.5584 3.5231 1.7695 4.9197c1.2462 1.437 3.0849 2.3303 5.3524 2.3303h3.8781v6.5h-7.526c-1.1046 0-2 .8954-2 2s.8954 2 2 2h7.526v2c0 1.1046.8954 2 2 2s2-.8954 2-2v-2h3.878c2.2676 0 4.1063-.8933 5.3525-2.3303 1.2111-1.3966 1.7695-3.1942 1.7695-4.9197s-.5584-3.5231-1.7695-4.9197c-1.2462-1.437-3.0849-2.3303-5.3525-2.3303h-3.878v-6.5h6.8049c1.1045 0 2-.8954 2-2s-.8955-2-2-2h-6.8049zm-4 6h-3.8781c-1.1471 0-1.8693.4192-2.3304.951-.4962.5721-.7915 1.3995-.7915 2.299s.2953 1.7269.7915 2.299c.4611.5318 1.1833.951 2.3304.951h3.8781zm4 10.5v6.5h3.878c1.1472 0 1.8694-.4192 2.3305-.951.4962-.5721.7915-1.3995.7915-2.299s-.2953-1.7269-.7915-2.299c-.4611-.5318-1.1833-.951-2.3305-.951z' fill='%23fff'/%3E%3Cpath d='M52 81c0 16.0163 12.9837 29 29 29s29-12.9837 29-29-12.9837-29-29-29-29 12.9837-29 29z' fill='%2300d60e'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M80 65c1.1046 0 2 .8954 2 2v12h11c1.1046 0 2 .8954 2 2s-.8954 2-2 2h-11c-2.2091 0-4-1.7909-4-4v-12c0-1.1046.8954-2 2-2z' fill='%23fff'/%3E%3Cpath d='M101 43.1716v-7.1716c0-9.3888-7.6112-17-17-17h-11c-1.1046 0-2 .8954-2 2s.8954 2 2 2h11c7.1797 0 13 5.8203 13 13v7.1652l-3.587-3.5807c-.7818-.7803-2.0481-.7792-2.8285.0025-.7803.7818-.7792 2.0481.0025 2.8285l5.592 5.5821c1.5625 1.5597 4.093 1.5586 5.654-.0026l5.581-5.5808c.781-.781.781-2.0474 0-2.8284-.781-.7811-2.047-.7811-2.828 0z' fill='%23ffba33'/%3E%3Cpath d='M12.5858 78.5858c-.7811.781-.7811 2.0474 0 2.8284.781.7811 2.0474.7811 2.8284 0l3.5858-3.5858v7.1716c0 9.3888 7.6112 17 17 17h11c1.1046 0 2-.895 2-2 0-1.1046-.8954-2-2-2h-11c-7.1797 0-13-5.8203-13-13v-7.1652l3.587 3.5807c.7818.7803 2.0481.7792 2.8285-.0025.7803-.7818.7792-2.0481-.0025-2.8285l-5.592-5.5821c-1.5625-1.5597-4.0933-1.5586-5.6544.0025z' fill='%2300d60e'/%3E%3C/svg%3E");
      }

      .icon-graph-up {
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23ffff00' viewBox='0 0 16 16'%3E%3Cpath fill-rule='evenodd' d='M0 0h1v15h15v1H0V0Zm10 3.5a.5.5 0 0 1 .5-.5h4a.5.5 0 0 1 .5.5v4a.5.5 0 0 1-1 0V4.9l-3.613 4.417a.5.5 0 0 1-.74.037L7.06 6.767l-3.656 5.027a.5.5 0 0 1-.808-.588l4-5.5a.5.5 0 0 1 .758-.06l2.609 2.61L13.445 4H10.5a.5.5 0 0 1-.5-.5Z'/%3E%3C/svg%3E");
      }
      .icon-lightning {
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23ffff00' viewBox='0 0 16 16'%3E%3Cpath d='M11.251.068a.5.5 0 0 1 .227.58L9.677 6.5H13a.5.5 0 0 1 .364.843l-8 8.5a.5.5 0 0 1-.842-.49L6.323 9.5H3a.5.5 0 0 1-.364-.843l8-8.5a.5.5 0 0 1 .615-.09z'/%3E%3C/svg%3E");
      }
/* End SVG icon */

.blur-bg {
  position: fixed;
  z-index: 1050;
  top: 0px;
  left: 0px;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.4);
  -webkit-backdrop-filter: saturate(180%) blur(6px);
  backdrop-filter: saturate(180%) blur(4px);
  opacity: 1;
  -o-transition: opacity 0.15s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  transition: opacity 0.15s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  -webkit-transition: opacity 0.15s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.site-banner {
  background: url(img/main_little_banner.png) center center no-repeat;
  background-size: contain;
  height: 330px;
  /* animation: var(--itemUp); */
  filter: drop-shadow(0 1rem 3rem rgb(0 0 0 / 35%));
}

.chat {
  min-height: 2.5rem;
}

.chat .header-content-container {
  position: relative;
  background-color: var(--contentContainerBackground);
  border-radius: 50rem;
  margin-bottom: -2.3rem;
  /* background: radial-gradient(circle, rgba(0, 0, 0, 1) 97%, rgba(255, 255, 255, 0) 100%); */
}
.main-box {
  max-width: var(--maxWidth);
  margin: 0 auto;
  display: flex;
  flex-direction: column;
}

.guest-box {
  width: 100%;
  max-width: var(--maxWidth);
  margin: 0 auto;
  display: flex;
  flex-wrap: wrap;
}


.registration-btn {
/*  background-color: #f8f9fa !important; */
  animation: var(--itemUp);
  box-shadow: var(--bigShadow);
  /* Предотвращаем изменение layout при анимации */
  min-width: 85px;
  min-height: 85px;
}

/* Фиксы для кнопки */
.icon-registration-btn {
    /* Стабильный flex-контейнер */
    display: inline-flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100%;
    height: 100%;
    /* Фиксируем transform-origin */
    transform-origin: center center;
    /* iOS оптимизация */
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
}

@keyframes tada {
    0% { transform: scale(1); }
    10%, 20% { transform: scale(0.9) rotate(-3deg); }
    30%, 50%, 70%, 90% { transform: scale(1.1) rotate(3deg); }
    40%, 60%, 80% { transform: scale(1.1) rotate(-3deg); }
    100% { transform: scale(1) rotate(0); }
}

.tada-animation {
    animation: tada 1s ease !important;
    -webkit-animation: tada 1s ease !important;
}

.reset-transform {
    transform: scale(1) rotate(0) !important;
    /* Убираем transition - это важно для iOS! */
    transition: none !important;
    animation: none !important;
}