:root{
    --green-1: #00D490;
    --green-2: #0C5840;
    --green-3: #06251E;
    --green-4: #041A15;
    --red-1: #FE6363;
    --white: #FFFFFF;
    --white-70: #FFFFFF70;
    --white-10: #FFFFFF10;
    --wf: #ffffff;
  }
  
  .ats2{
      a{
          display: inline-flex;
          gap: 15px;
          width: 100%;
          background: #ffffff00;
      }
  }
  .ats2:hover{
      a{
          background: linear-gradient(135deg, var(--green-1), var(--green-2));
      }
  }
  
  /* --- Deep Forest Game Swiper Styles --- */
  :root {
      --forest-bg: #1B2D25; /* Глубокий темно-зеленый */
      --forest-card-bg: #2A4037; /* Фон карточки, чуть светлее */
      --forest-card-bg-hover: #385347; /* Фон при наведении */
      --forest-border-color: rgba(139, 195, 160, 0.2); /* Полупрозрачная граница */
      --forest-text-color: #FFFFFF; /* Белый текст */
      --forest-icon-color: #E0E0E0; /* Светло-серый для иконок */
      --forest-soon-text-color: #9E9E9E; /* Серый для текста "скоро" */
      --forest-soon-icon-color: #757575; /* Темно-серый для иконки "скоро" */
      --forest-soon-badge-bg: rgba(0, 0, 0, 0.3);
      --forest-soon-badge-text: #BDBDBD;
      --forest-shadow-color: rgba(0, 0, 0, 0.25);
  }
  
  /* Подключаем шрифт (пример для Google Fonts) */
  @import url('https://fonts.googleapis.com/css2?family=Roboto:wght@400;500;700&display=swap');
  
  .forest-game-section {
      padding: 45px 0; /* Вертикальные отступы */
      position: relative;
      overflow: hidden; /* Обрезаем то, что выходит за секцию */
  }
  
  .forest-game-title {
      color: var(--forest-text-color);
      text-align: center;
      margin-bottom: 40px;
      font-family: 'Roboto', sans-serif; /* Используем подключенный шрифт */
      font-size: 2.1em;
      font-weight: 500; /* Средняя жирность */
      letter-spacing: 0.5px;
      position: relative;
      z-index: 1;
  }
  
  .forest-game-swiper {
      width: 100%;
      padding: 10px 25px; /* Отступы по бокам */
      position: relative;
      z-index: 1;
      overflow: visible !important; /* Позволяем тени выходить */
      box-sizing: border-box;
  }
  
  .forest-game-slide {
      width: 190px; /* Фиксированная ширина слайда */
      height: auto;
      display: flex;
      justify-content: center;
      align-items: stretch; /* Растягиваем ссылку по высоте */
      overflow: visible !important; /* Позволяем тени выходить */
      padding: 5px 0; /* Отступ для тени */
      box-sizing: border-box;
  }
  
  .forest-game-card {
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center; /* Центрируем контент */
      width: 100%; /* Занимает всю ширину слайда */
      height: 100%; /* Растягиваем по высоте слайда */
      background-color: var(--forest-card-bg);
      border: 1px solid var(--forest-border-color);
      border-radius: 10px; /* Небольшое скругление */
      padding: 25px 15px;
      text-decoration: none;
      color: var(--forest-text-color);
      position: relative;
      overflow: hidden; /* Обрезаем контент по рамке */
      box-shadow: 0 5px 15px var(--forest-shadow-color);
      transition: transform 0.3s ease, background-color 0.3s ease, box-shadow 0.3s ease;
      will-change: transform;
  }
  
  .forest-game-card:hover {
      transform: translateY(-6px); /* Легкий подъем */
      background-color: var(--forest-card-bg-hover);
      box-shadow: 0 8px 20px rgba(0, 0, 0, 0.3); /* Усиление тени */
      z-index: 5; /* Над соседними */
  }
  
  .forest-game-card__icon-wrapper {
      width: 55px; /* Размер иконки */
      height: 55px;
      margin-bottom: 20px; /* Отступ под иконкой */
      display: flex;
      justify-content: center;
      align-items: center;
      transition: transform 0.3s ease;
  }
  
  .forest-game-card:hover .forest-game-card__icon-wrapper {
      transform: scale(1.1); /* Увеличение иконки */
  }
  
  .forest-game-card__icon {
      width: 100%;
      height: 100%;
      fill: var(--forest-icon-color); /* Светло-серый цвет иконки */
  }
  
  .forest-game-card__name {
      font-family: 'Roboto', sans-serif;
      font-size: 1.05em;
      font-weight: 500;
      line-height: 1.3;
      text-align: center;
      margin-top: auto; /* Прижимаем к низу */
  }
  
  /* Стили для "Скоро" */
  .forest-game-card--soon {
      cursor: default;
      background-color: #26342d; /* Чуть другой фон */
      border-color: rgba(139, 195, 160, 0.1);
  }
  .forest-game-card--soon:hover {
      transform: none;
      background-color: #26342d;
      box-shadow: 0 5px 15px var(--forest-shadow-color);
  }
  .forest-game-card--soon .forest-game-card__icon {
      fill: var(--forest-soon-icon-color); /* Темно-серый */
  }
  .forest-game-card--soon .forest-game-card__name {
      color: var(--forest-soon-text-color); /* Серый */
  }
  .forest-game-card--soon:hover .forest-game-card__icon-wrapper {
      transform: none;
  }
  
  .forest-game-card__soon-badge {
      position: absolute;
      top: 8px; /* Сверху */
      right: 8px;
      background-color: var(--forest-soon-badge-bg);
      color: var(--forest-soon-badge-text);
      padding: 3px 8px;
      border-radius: 4px;
      font-size: 0.7em;
      font-weight: 500;
      text-transform: uppercase;
  }
  
  /* --- Адаптивность --- */
  @media (max-width: 992px) {
      .forest-game-title { font-size: 2em; }
      .forest-game-slide { width: 180px; }
  }
  
  @media (max-width: 768px) {
      .forest-game-title { font-size: 1.8em; margin-bottom: 35px; }
      .forest-game-section { padding: 40px 0; }
      .forest-game-swiper { padding: 10px 20px; }
      .forest-game-slide { width: 165px; }
      .forest-game-card { padding: 20px 10px; border-radius: 8px;}
      .forest-game-card__icon-wrapper { width: 50px; height: 50px; margin-bottom: 15px; }
      .forest-game-card__name { font-size: 1em; }
  }
  
  @media (max-width: 480px) {
      .forest-game-title { font-size: 1.6em; margin-bottom: 30px; }
      .forest-game-section { padding: 35px 0; }
      .forest-game-swiper { padding: 10px 15px; }
      .forest-game-slide { width: 150px; } /* Еще меньше */
      .forest-game-card { padding: 15px 10px; border-radius: 6px;}
      .forest-game-card__icon-wrapper { width: 45px; height: 45px; }
      .forest-game-card__name { font-size: 0.95em; }
      .forest-game-card__soon-badge { font-size: 0.65em; padding: 2px 6px;}
  }
  
  /* --- Minimalist Green Slot Swiper Styles (GRID VERSION) --- */
  :root {
      /* Переменные для управления цветами и размерами */
      --min-bg: #101a15; /* Очень темный зеленый фон секции */
      --min-title-color: #e8f5e9; /* Цвет заголовка */
      --min-card-bg: #22352b; /* Фоновый цвет карточки */
      --min-card-border: rgba(94, 172, 129, 0.1); /* Цвет границы карточки */
      --min-text-color: #ffffff; /* Основной белый цвет текста */
      --min-provider-color: #b0cfc0; /* Цвет текста провайдера */
      --min-overlay-bg: rgba(16, 26, 21, 0.85); /* Цвет оверлея при наведении */
      --min-button-color: #ffffff; /* Цвет текста кнопок */
      --min-play-bg: #00b359; /* Цвет кнопки "Играть" */
      --min-play-hover-bg: #00d96b; /* Цвет кнопки "Играть" при наведении */
      --min-demo-bg: rgba(176, 207, 192, 0.2); /* Фон кнопки "Демо" */
      --min-demo-hover-bg: rgba(176, 207, 192, 0.3); /* Фон кнопки "Демо" при наведении */
      --min-scrollbar-bg: rgba(94, 172, 129, 0.15); /* Фон скроллбара */
      --min-scrollbar-drag-bg: rgba(94, 172, 129, 0.6); /* Цвет ползунка скроллбара */
  }
  
  /* Подключаем шрифт (пример для Google Fonts) */
  @import url('https://fonts.googleapis.com/css2?family=Roboto:wght@400;500&display=swap');
  
  /* --- Общая секция --- */
  .minimal-slot-section {
      padding: 40px 0;
      font-family: 'Roboto', sans-serif; /* Применяем шрифт ко всей секции */
      position: relative;
  }
  
  /* --- Заголовок секции --- */
  .minimal-slot-title {
      color: var(--min-title-color);
      text-align: center;
      margin-bottom: 25px;
      padding: 0 30px; /* Отступы слева/справа */
      font-size: 1.9em;
      font-weight: 500;
      letter-spacing: 0.5px;
  }
  
  /* --- Swiper контейнер --- */
  .minimal-slot-swiper {
      width: 100%;
      padding: 5px 30px 35px 30px; /* Отступы + место для скролла */
      position: relative;
      overflow: hidden; /* Скрываем лишнее у контейнера */
      box-sizing: border-box;
  }
  
  /* --- Скроллбар --- */
  .minimal-slot-scrollbar {
      background: var(--min-scrollbar-bg);
      height: 4px;
      bottom: 10px; /* Позиция от нижнего края контейнера */
      border-radius: 2px;
      left: 30px; /* Учитываем padding контейнера */
      right: 30px;
      width: auto; /* Автоматическая ширина */
  }
  .minimal-slot-scrollbar .swiper-scrollbar-drag {
      background: var(--min-scrollbar-drag-bg);
      border-radius: 2px;
  }
  
  /* --- Стили для Grid в Swiper --- */
  /* Swiper сам управляет display:grid, мы убираем ненужное */
  .minimal-slot-swiper .swiper-wrapper {
      /* align-items: stretch; */ /* Можно оставить по умолчанию */
  }
  
  /* --- Слайд (в режиме Grid) --- */
  .minimal-slot-swiper .swiper-slide {
      height: auto; /* Swiper рассчитает высоту */
      width: auto; /* Swiper рассчитает ширину */
      /* Отступ между рядами */
      margin-bottom: 20px !important;
      display: flex; /* Для центрирования карточки внутри */
      justify-content: center;
      align-items: center;
      overflow: visible; /* Позволяем тени выходить */
      box-sizing: border-box;
  }
  
  
  /* --- Карточка слота --- */
  .minimal-slot-card {
      display: block;
      width: 220px;  /* Фиксированная ширина */
      height: 290px; /* Фиксированная высота */
      border-radius: 8px;
      overflow: hidden; /* Обрезаем все, что внутри */
      position: relative;
      background-color: var(--min-card-bg);
      border: 1px solid var(--min-card-border);
      box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2);
      transition: transform 0.3s ease, box-shadow 0.3s ease;
      cursor: pointer;
  }
  .minimal-slot-card:hover {
      transform: translateY(-4px); /* Подъем при наведении */
      box-shadow: 0 7px 15px rgba(0, 0, 0, 0.3);
  }
  
  /* --- Изображение слота --- */
  .minimal-slot-card__image {
      display: block;
      width: 100%; height: 100%;
      background-size: cover; background-position: center; background-repeat: no-repeat;
      position: absolute; top: 0; left: 0; z-index: 1;
      transition: transform 0.3s ease;
  }
  .minimal-slot-card:hover .minimal-slot-card__image {
      transform: scale(1.03); /* Зум картинки */
  }
  
  /* --- Блок с информацией (название, провайдер) --- */
  .minimal-slot-card__info {
      position: absolute; bottom: 0; left: 0; width: 100%;
      padding: 20px 12px 10px 12px; box-sizing: border-box; z-index: 2;
      /* Градиент для читаемости текста поверх картинки */
      background: linear-gradient(to top, rgba(16, 26, 21, 0.95) 15%, rgba(16, 26, 21, 0.7) 50%, transparent 100%);
      pointer-events: none; /* Не мешает наведению */
      border-bottom-left-radius: inherit; border-bottom-right-radius: inherit;
  }
  .minimal-slot-card__title {
      color: var(--min-text-color); font-size: 0.95em; font-weight: 500;
      white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
      margin-bottom: 3px; text-shadow: 0 1px 1px rgba(0,0,0,0.4);
  }
  .minimal-slot-card__provider {
      color: var(--min-provider-color); font-size: 0.75em; font-weight: 400;
      white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
      text-transform: capitalize;
  }
  
  /* --- Оверлей с кнопками (появляется при наведении) --- */
  .minimal-slot-card__overlay {
      position: absolute; top: 0; left: 0; width: 100%; height: 100%;
      background-color: var(--min-overlay-bg);
      display: flex; flex-direction: column; justify-content: center; align-items: center;
      opacity: 0; transition: opacity 0.3s ease; z-index: 3;
      padding: 10px; box-sizing: border-box; pointer-events: none;
  }
  .minimal-slot-card:hover .minimal-slot-card__overlay {
      opacity: 1; pointer-events: auto;
  }
  
  /* --- Кнопки внутри оверлея --- */
  .minimal-slot-card__button {
      display: inline-flex; align-items: center; justify-content: center;
      padding: 9px 16px; border-radius: 6px; font-size: 0.9em; font-weight: 500;
      text-decoration: none; cursor: pointer; border: none;
      transition: background-color 0.2s ease, transform 0.2s ease;
      margin-bottom: 10px; width: 75%; max-width: 130px; box-sizing: border-box;
      text-align: center; color: var(--min-button-color);
  }
  .minimal-slot-card__button:last-child { margin-bottom: 0; }
  
  /* Стили для иконок Box Icons */
  .minimal-slot-card__button i {
      font-size: 1.2em; margin-right: 6px; line-height: 1;
  }
  /* Кнопка "Играть" */
  .minimal-slot-card__button--play { background-color: var(--min-play-bg); }
  .minimal-slot-card__button--play:hover { background-color: var(--min-play-hover-bg); transform: scale(1.05); }
  /* Кнопка "Демо" */
  .minimal-slot-card__button--demo { background-color: var(--min-demo-bg); border: 1px solid rgba(176, 207, 192, 0.3); }
  .minimal-slot-card__button--demo:hover { background-color: var(--min-demo-hover-bg); transform: scale(1.05); }
  
  /* --- Стиль для неактивных слотов ("Скоро") --- */
  .minimal-slot-card--soon {
      filter: grayscale(100%); cursor: default; pointer-events: none;
  }
  .minimal-slot-card--soon:hover {
      transform: none; box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2);
  }
  /* Показываем оверлей для "Скоро", но без кнопок */
  .minimal-slot-card--soon .minimal-slot-card__overlay {
      opacity: 1; background-color: rgba(16, 26, 21, 0.9); pointer-events: auto;
  }
  .minimal-slot-card--soon .minimal-slot-card__button { display: none; }
  /* Добавляем текст "Скоро" на оверлей */
  .minimal-slot-card--soon .minimal-slot-card__overlay::before {
      content: 'Скоро'; color: var(--min-provider-color); font-size: 1.1em; font-weight: 500;
  }
  .minimal-slot-card--soon .minimal-slot-card__info { opacity: 0.7; }
  
  /* --- Прелоадер Swiper --- */
  .swiper-lazy-preloader { margin-top: 40%; }
  
  /* --- Адаптивность --- */
  @media (max-width: 768px) {
      .minimal-slot-title { font-size: 1.7em; padding: 0 25px; margin-bottom: 20px;}
      .minimal-slot-swiper { padding: 5px 15px 5px 15px !important; }
      .minimal-slot-card { width: 200px; height: 260px; } /* Уменьшаем */
      .minimal-slot-card__button { padding: 8px 14px; font-size: 0.85em; }
      .minimal-slot-card__title { font-size: 0.9em; }
  }
  @media (max-width: 520px) {
      .minimal-slot-title { font-size: 1.5em; padding: 0 20px; }
      .minimal-slot-swiper { padding: 5px 15px 5px 15px !important; }
      .minimal-slot-card { width: 180px; height: 235px; } /* Еще уменьшаем */
      .minimal-slot-scrollbar { left: 20px; right: 20px; bottom: 5px; }
      .minimal-slot-card__button { width: 85%; padding: 7px 12px; font-size: 0.8em; }
      .minimal-slot-card__title { font-size: 0.85em; }
  }
  @media (max-width: 420px) {
      .minimal-slot-card { width: 160px; height: 210px; } /* Для самых маленьких */
      .minimal-slot-card__button { margin-bottom: 8px; }
  }
  
  /* --- Polished Profile Styles (using your CSS variables & fonts) --- */
  
  /* Контейнер профиля */
  .profile-new-layout {
      display: grid;
      /* Две колонки: левая макс. 380px, правая занимает остальное */
      grid-template-columns: minmax(300px, 380px) 1fr;
      gap: 24px; /* Отступ между колонками */
      margin-top: 30px;
      margin-bottom: 30px;
      align-items: start; /* Выравниваем по верху */
  }
  
  /* Общие стили для карточек */
  .profile-main-card,
  .profile-stats-card {
      background: var(--green-4); /* Используем ваш фон */
      border-radius: 20px; /* Скругление как у ваших кнопок */
      padding: 25px 30px; /* Увеличенные внутренние отступы */
      border: 1px solid var(--white-10); /* Тонкая граница */
      box-shadow: 0 6px 16px rgba(0, 0, 0, 0.2); /* Легкая тень */
      height: fit-content; /* Высота по содержимому */
      box-sizing: border-box;
  }
  
  /* Карточка основной информации */
  .profile-main-card {
      display: flex;
      flex-direction: column;
  }
  
  .profile-user-header {
      display: flex; /* Используем flex для выравнивания */
      align-items: center; /* Центрируем по вертикали */
      gap: 20px;
      margin-bottom: 25px; /* Увеличенный отступ */
  }
  
  .profile-avatar {
      width: 85px; /* Чуть меньше аватар */
      height: 85px;
      border-radius: 14px; /* Скругление чуть меньше карточки */
      border: 2px solid var(--white-10);
      object-fit: cover;
      flex-shrink: 0;
      box-shadow: 0 2px 5px rgba(0,0,0,0.2); /* Тень для аватара */
  }
  
  .profile-user-info {
      display: flex;
      flex-direction: column;
      gap: 6px; /* Увеличенный отступ */
      flex-grow: 1; /* Занимает доступное место */
  }
  
  .profile-username {
      font-family: 'Benzin', sans-serif;
      font-size: 2em; /* Крупнее имя */
      color: var(--white);
      line-height: 1.15;
      margin: 0;
      word-break: break-word;
  }
  
  .profile-meta {
      display: flex;
      align-items: center;
      gap: 12px;
  }
  
  .profile-id {
      color: var(--white-70);
      font-size: 0.9em;
      background: var(--white-10);
      padding: 4px 10px;
      border-radius: 6px;
      display: inline-flex;
      align-items: center;
      gap: 6px; /* Увеличенный отступ иконки */
  }
  .profile-id i { font-size: 1.2em; } /* Иконка крупнее */
  
  .profile-vk-link {
      color: #a8cde6; /* Светлее VK цвет */
      display: inline-flex;
      align-items: center;
      gap: 5px;
      font-size: 0.9em;
      opacity: 0.9; /* Чуть ярче */
  }
  .profile-vk-link:hover {
      opacity: 1;
      color: #cce4f5; /* Светлее при наведении */
  }
  .profile-vk-link i { font-size: 1.5em; } /* Крупнее иконка VK */
  .profile-vk-link span {
      display: none; /* Скрываем текст */
      @media (max-width: 540px) { /* Показываем на мобилке */
          display: inline;
      }
  }
  
  /* Разделитель */
  .profile-divider {
      border: none;
      height: 1px;
      background-color: var(--white-10);
      margin: 0 0 25px 0; /* Увеличенные отступы */
      width: 100%;
  }
  
  .profile-balance-details {
      display: flex;
      flex-direction: column;
      align-items: center; /* Центрируем все */
      gap: 10px;
      margin-top: auto;
      padding-top: 20px;
  }
  
  /* Используем класс label из ваших стилей */
  .profile-balance-details .label {
      font-size: 0.85em; /* Чуть крупнее */
      font-weight: light;
      margin-bottom: 0; /* Убираем лишний отступ */
  }
  
  .profile-balance-amount {
      font-family: 'Benzin', sans-serif;
      font-size: 2.6em; /* Значительно крупнее баланс */
      color: var(--green-1);
      line-height: 1.1;
      margin: 0;
      display: inline-flex; /* Для выравнивания иконки */
      align-items: center;
      gap: 8px;
  }
  .profile-balance-amount i {
      font-size: 0.8em; /* Размер иконки относительно текста */
      vertical-align: baseline; /* Выравнивание */
  }
  
  .profile-buttons {
      display: flex; /* Используем flex */
      gap: 12px;
      margin-top: 20px;
      justify-content: center;
      width: 100%;
      max-width: 300px; /* Ограничим ширину кнопок */
  }
  
  .profile-action-btn {
      flex: 1;
      display: inline-flex !important;
      align-items: center;
      justify-content: center;
      gap: 8px; /* Увеличенный отступ иконки */
      padding: 12px 15px !important; /* Больше паддинг */
      font-size: 0.95em !important;
      font-weight: 500; /* Четче текст */
      border-radius: 14px !important; /* Скругление побольше */
      transition: all ease .2s; /* Используем вашу анимацию */
  }
  .profile-action-btn i {
      font-size: 1.3em; /* Иконка крупнее */
  }
  /* Переопределяем стили для белой кнопки */
  .profile-action-btn.btn__white {
      background: var(--white) !important;
      color: var(--green-3) !important; /* Темный текст */
  }
  .profile-action-btn.btn__white:hover {
      background: #f0f0f0 !important; /* Чуть темнее белый */
      transform: scale(1.03); /* Добавим легкий scale */
  }
  .profile-action-btn.btn__white i {
       color: var(--green-3) !important;
  }
  /* Hover для зеленой кнопки */
  .profile-action-btn:not(.btn__white):hover {
      transform: scale(1.03);
      /* Можно добавить изменение градиента, если нужно */
      /* background: linear-gradient(135deg, #00e0a0, #0e6850) !important; */
  }
  
  
  /* Карточка статистики */
  .profile-stats-card {
       padding: 25px 30px;
  }
  
  .profile-stats-title {
      font-family: 'Benzin', sans-serif;
      font-size: 1.6em; /* Чуть крупнее */
      color: var(--white);
      margin: 0 0 25px 0;
      padding-bottom: 15px;
      border-bottom: 1px solid var(--white-10);
      display: flex; /* Выравнивание иконки */
      align-items: center;
      gap: 10px;
  }
  .profile-stats-title i {
      vertical-align: middle; /* Выравнивание */
      font-size: 1.1em; /* Размер иконки */
      color: var(--green-1);
  }
  
  /* Сетка статистики - используем ваш grid-s */
  .profile-stats-grid {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 24px;
      margin: 0;
  }
  
  .stat-item {
      background: transparent; /* Убираем фон, чтобы было чище */
      border: 1px solid var(--white-10); /* Оставляем рамку */
      border-radius: 14px; /* Скругление побольше */
      padding: 18px 15px; /* Увеличенные паддинги */
      gap: 6px;
      text-align: center; /* Центрируем текст */
      transition: background-color 0.2s ease, border-color 0.2s ease;
  }
  .stat-item:hover {
      background-color: var(--white-10); /* Подсветка фона при наведении */
      border-color: rgba(94, 172, 129, 0.3); /* Рамка чуть ярче */
  }
  
  .stat-item .icon-stat {
      font-size: 2.4em;
      margin-bottom: 8px; /* Больше отступ */
      line-height: 1;
      /* Цвет иконок по умолчанию */
      color: var(--green-1);
  }
  .stat-item .icon-stat.positive,
  .stat-item .icon-stat.win { color: var(--green-1); } /* Позитивные - зеленые */
  .stat-item .icon-stat.negative,
  .stat-item .icon-stat.loss { color: var(--red-1); } /* Негативные - красные */
  
  .stat-item h4 {
      font-family: 'Stolzl', sans-serif;
      font-size: 1.5em; /* Крупнее цифры */
      font-weight: bold;
      color: var(--white);
      margin: 0;
      line-height: 1.1;
      word-break: break-all;
  }
  
  .stat-item .label {
       font-size: 0.85em; /* Крупнее лейбл */
       font-weight: light;
       color: var(--white-70);
       margin-top: 4px;
       line-height: 1.2; /* На случай переноса */
  }
  
  /* Адаптивность */
  @media (max-width: 1060px) {
      .profile-new-layout {
          grid-template-columns: 1fr;
          gap: 24px;
      }
      .profile-main-card { order: 1; } /* Профиль сверху */
      .profile-stats-card { order: 2; }
      .profile-stats-grid {
          /* grid-template-columns: repeat(3, 1fr); */ /* Используем ваш grid-m, вероятно */
      }
  }
  
  @media (max-width: 770px) {
      .profile-stats-grid {
          /* grid-template-columns: repeat(2, 1fr); */ /* Используем ваш grid-s */
      }
       .profile-username { font-size: 1.8em; }
       .profile-balance-amount { font-size: 2.4em; }
       .profile-stats-title { font-size: 1.5em; }
       .stat-item h4 { font-size: 1.4em; }
  }
  
  @media (max-width: 540px) {
      .profile-new-layout { padding: 15px; gap: 20px; }
      .profile-main-card, .profile-stats-card { padding: 20px; border-radius: 16px; } /* Уменьшаем паддинг и скругление */
      .profile-user-header { flex-direction: column; text-align: center; gap: 15px; }
      .profile-avatar { width: 80px; height: 80px; }
      .profile-meta { justify-content: center; }
      .profile-username { font-size: 1.6em; }
      .profile-balance-amount { font-size: 2em; }
      .profile-buttons { flex-direction: column; gap: 10px; max-width: 220px; margin-left: auto; margin-right: auto;}
      .profile-stats-title { font-size: 1.4em; }
      .profile-stats-grid { gap: 15px; /* grid-template-columns: repeat(2, 1fr); */ /* Ваш grid-s */ }
      .stat-item { padding: 15px 10px; border-radius: 12px; }
      .stat-item .icon-stat { font-size: 2em; }
      .stat-item h4 { font-size: 1.3em; }
      .stat-item .label { font-size: 0.8em; }
  }
  
  /* Убираем стандартные стили для .ic::before, если они мешают Box Icons */
  .profile-action-btn.ic::before { content: none !important; display: none !important; }
  /* --- Polished Profile Styles - STATS & RESPONSIVE --- */

/* Карточка статистики */
.profile-stats-card {
    /* background: var(--green-4); */
    /* border-radius: 20px; */
    padding: 25px 30px; /* Основные паддинги */
    /* border: 1px solid var(--white-10); */
    /* box-shadow: 0 6px 16px rgba(0, 0, 0, 0.2); */
    height: fit-content;
    box-sizing: border-box;
}

.profile-stats-title {
   font-family: 'Benzin', sans-serif;
   font-size: 1.6em;
   color: var(--white);
   margin: 0 0 25px 0; /* Увеличен отступ снизу */
   padding-bottom: 15px;
   border-bottom: 1px solid var(--white-10);
   display: flex;
   align-items: center;
   gap: 12px; /* Увеличен gap */
}
.profile-stats-title i {
   font-size: 1.2em;
   color: var(--green-1);
}

/* Сетка статистики - используем ваш grid-s */
.profile-stats-grid {
   /* Использует стили из вашего класса grid-s */
   /* display: grid; */
   /* grid-template-columns: repeat(4, 1fr); */
   /* gap: 24px; */
   margin: 0; /* Убираем внешние отступы сетки */
}

/* --- Новый вид для .stat-item --- */
.stat-item {
   background: linear-gradient(145deg, var(--white-10), rgba(4, 26, 21, 0.3)); /* Градиент фона */
   border: 1px solid var(--white-10);
   border-radius: 16px; /* Больше скругление */
   padding: 20px 15px; /* Увеличенные внутренние отступы */
   display: flex; /* Используем flex для выравнивания */
   flex-direction: column;
   align-items: center; /* Центрируем все */
   text-align: center;
   gap: 8px; /* Увеличен вертикальный отступ */
   transition: transform 0.2s ease, background-color 0.2s ease, box-shadow 0.2s ease;
   box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15); /* Легкая тень */
   position: relative; /* Для псевдоэлементов */
   overflow: hidden; /* Обрезаем псевдоэлементы */
}

/* Декоративная линия сверху */
.stat-item::before {
   content: '';
   position: absolute;
   top: 0;
   left: 50%;
   transform: translateX(-50%);
   width: 50%;
   height: 3px; /* Толщина линии */
   background-color: var(--green-1); /* Цвет линии */
   border-radius: 0 0 3px 3px;
   opacity: 0.7; /* Полупрозрачность */
   box-shadow: 0 0 8px rgba(0, 212, 144, 0.5); /* Легкое свечение */
}

.stat-item:hover {
   transform: translateY(-3px) scale(1.02); /* Небольшой подъем и увеличение */
   background: linear-gradient(145deg, rgba(4, 26, 21, 0.4), rgba(12, 38, 30, 0.5));
   border-color: rgba(94, 172, 129, 0.3);
   box-shadow: 0 6px 12px rgba(0, 0, 0, 0.2);
}

.stat-item .icon-stat {
   font-size: 2.6em; /* Крупнее иконка */
   margin-bottom: 5px;
   line-height: 1;
   color: var(--green-1); /* Цвет иконки */
   filter: drop-shadow(0 2px 4px rgba(0, 212, 144, 0.2)); /* Тень для иконки */
}
.stat-item .icon-stat.positive,
.stat-item .icon-stat.win { color: var(--green-1); }
.stat-item .icon-stat.negative,
.stat-item .icon-stat.loss { color: var(--red-1); filter: drop-shadow(0 2px 4px rgba(254, 99, 99, 0.2));} /* Красная тень для негативных */

.stat-item h4 {
   font-family: 'Stolzl', sans-serif;
   font-size: 1.6em; /* Крупнее цифры */
   font-weight: bold;
   color: var(--white);
   margin: 0;
   line-height: 1.1;
   word-break: break-all;
}

.stat-item .label {
    font-size: 0.85em;
    font-weight: light;
    color: var(--white-70);
    margin-top: 0; /* Убираем лишний отступ */
    line-height: 1.3; /* Улучшаем читаемость */
}


/* ----- ОБНОВЛЕННАЯ АДАПТИВНОСТЬ ----- */

@media (max-width: 1240px) { /* Ваша точка */
    /* Стили для wrapper и h4 уже есть в вашем CSS */
}

@media (max-width: 1060px) { /* Ваша точка */
   .profile-new-layout {
       grid-template-columns: 1fr; /* Одна колонка */
       gap: 24px;
   }
   .profile-main-card { order: 1; }
   .profile-stats-card { order: 2; padding: 20px 25px; } /* Уменьшаем паддинг */
   .profile-stats-grid {
       /* Меняем на grid-m при перестроении, если нужно */
       /* grid-template-columns: repeat(3, 1fr); */
       /* Или оставляем grid-s */
       gap: 20px; /* Уменьшаем gap */
   }
}

@media (max-width: 940px) { /* Ваша точка */
    .profile-new-layout { max-width: 750px; margin: 0 auto; } /* Центрируем */
}


@media (max-width: 770px) { /* Ваша точка */
    .profile-new-layout { max-width: 520px; }
    .profile-stats-grid {
       grid-template-columns: repeat(2, 1fr); /* Явно 2 колонки */
       gap: 18px; /* Уменьшаем gap */
   }
    .profile-username { font-size: 1.7em; }
    .profile-balance-amount { font-size: 2.2em; }
    .profile-stats-title { font-size: 1.5em; }
    .stat-item { padding: 18px 12px; border-radius: 14px;}
    .stat-item h4 { font-size: 1.5em; }
    .stat-item .icon-stat { font-size: 2.4em; }
}

@media (max-width: 540px) { /* Ваша точка */
   .profile-new-layout { padding: 15px; gap: 20px; max-width: 360px;}
   .profile-main-card, .profile-stats-card { padding: 20px 15px; border-radius: 16px; } /* Уменьшаем паддинг */
   .profile-user-header { flex-direction: column; text-align: center; gap: 12px; }
   .profile-avatar { width: 75px; height: 75px; border-radius: 12px;}
   .profile-meta { justify-content: center; }
   .profile-username { font-size: 1.5em; }
   .profile-balance-amount { font-size: 1.9em; }
   .profile-buttons { flex-direction: column; gap: 10px; max-width: 200px; margin-left: auto; margin-right: auto;}
   .profile-stats-title { font-size: 1.4em; }
   .profile-stats-grid {
       grid-template-columns: repeat(2, 1fr); /* Строго 2 колонки */
       gap: 15px;
   }
   .stat-item { padding: 15px 10px; border-radius: 12px; }
   .stat-item .icon-stat { font-size: 2.2em; }
   .stat-item h4 { font-size: 1.4em; }
   .stat-item .label { font-size: 0.8em; }
}

@media (max-width: 380px) { /* Дополнительная точка для очень маленьких */
    .profile-new-layout { max-width: 300px; }
    .profile-stats-grid { grid-template-columns: 1fr; } /* Одна колонка */
    .stat-item { width: 80%; margin: 0 auto; } /* Центрируем */
    .profile-main-card, .profile-stats-card { padding: 15px; }
    .profile-username { font-size: 1.4em; }
    .profile-balance-amount { font-size: 1.7em; }
    .profile-stats-title { font-size: 1.3em; }
    .stat-item h4 { font-size: 1.3em; }
}

/* --- Конец обновленных стилей --- */

.dTypes{
    display: inline-flex;width: 100%;margin-bottom: 25px;
}

.btnSType{
    background: linear-gradient(250deg, rgb(38, 34, 60), rgba(255, 23, 183, 0.4) 84%, rgb(75, 43, 102));margin-right: 10px;width: 100%;padding: 10px;display: inline-flex;gap: 5px;align-items: center;justify-content: flex-start;font-weight: bold;border-radius: 5px;
}

.btnSType2{
    background: linear-gradient(250deg, rgb(28, 40, 55), rgba(0, 168, 88, 0.3) 84%, rgb(25, 67, 83));margin-right: 10px;width: 100%;padding: 10px;display: inline-flex;gap: 5px;align-items: center;justify-content: flex-start;font-weight: bold;border-radius: 5px;
}

.ri-head{
    display: flex;align-items: center;flex-direction: row;gap: .75rem;margin-bottom: 10px;
}
.ri-icon{
    display: flex;justify-content: center;align-items: center;width: 3rem;height: 3rem;background-color: #20273a;border-radius: 100%;
}
.ri-liner{
    height: .3rem;border-radius: .5rem;width: 105%;margin-right: calc(.5rem* -1);flex: 1;background-color: #20273a;
}
.ri-item{
    display: flex;
    flex-direction: column;
    gap: 1rem;
    background: linear-gradient(92deg, #03ba7f, rgb(14 118 83 / 29%)), url(https://3ocial.com/wp-content/uploads/2021/03/golden-coins-png-transparent-png-falling_pngimagesfree.com_-1024x517.png);
    flex: 1;
    border-radius: .5rem;
    height: 20rem;
    padding: 1.25rem;
}
.ri-item-head{
    display: flex;flex-direction: column;align-items: center;margin-top: 25px;
}
.ri-ul-item{
    margin: 0;padding: 0;list-style: none;display: flex;flex-direction: column;gap: .5rem;
}
.ri-item-li{
    display: flex;align-items: center;gap: .5rem;
}
.ri-success{
    background-color: #1b2030;display: flex;justify-content: center;align-items: center;width: 1.5rem;height: 1.5rem;border-radius: 100%;
    svg{fill: #fff !important}
}
.ri-rank{
    width: fit-content;padding: .25rem .5rem;border-radius: .25rem;background-color: #1b2030;font-size: 14px !important;
}
.br-rz1{
    width: 100%;
    display: inline-flex;
    justify-content: space-between;
    margin-top: 1px;
    gap: 10px;
    padding: 2px 0px;
}
.br-rz1-item{
    width: 100%; height: 120px; background: #20273a; border-radius: 7px; display: inline-flex; flex-direction: column;
}
.br-rz1-in{
    width: 100%; display: inline-flex; justify-content: space-between; /*padding: 10px 25px;*/ align-items: center;padding-bottom: 15px
}
.br-rz1-upp{
    color: gray; font-size: 11px; display: inline-flex; align-items: center; justify-content: center; gap: 15px;
}
.br-rz1-info{
    color: gray; font-size: 11px; display: inline-flex; align-items: center; justify-content: center; gap: 5px;
}
.br-rz1-info:hover{svg{fill: #fff !important}color:white}
.br-rz1-b{
    width: 100%; display: inline-flex; justify-content: space-between; padding: 10px 25px; gap: 10px;
}
.br-rz1-up1{
    color: #ffffff; font-size: 11px; display: inline-flex; align-items: center; justify-content: center; gap: 5px; font-weight: 900; background: #1475e1; padding: 4px 5px; border-radius: 7px;
}

