.card-legacy-bg {
  background: linear-gradient(rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.6)), 
              url("/static/images/background-rpg.png") no-repeat center/cover;
  
  color: white;
  position: relative;

  backdrop-filter: blur(24px); 
  -webkit-backdrop-filter: blur(10px);

  border: 1px solid rgba(255, 255, 255, 0.1);
}

.game-logo {
  font-family: "Roboto", sans-serif;
  font-optical-sizing: auto;
  font-weight: 300;
  /* font-style: normal; */
  font-variation-settings: "wdth" 100;
    
}
/* Настройки для ТЕМНОЙ темы (основной стиль игры) */
[data-bs-theme="dark"] .card-legacy-bg {
    background: linear-gradient(rgba(0,0,0,0.7), rgba(0,0,0,0.7)), 
                url('/static/images/background-rpg.png') no-repeat center/cover;
    border: 1px solid #444 !important;
    color: white;
}

/* Настройки для СВЕТЛОЙ темы (чтобы не сливалось) */
[data-bs-theme="light"] .card-legacy-bg {
    background-color: #f8f9fa; /* Светло-серый фон вместо белого */

}

/* Настройки специально для ТЕМНОЙ темы */
[data-bs-theme="dark"] .card-legacy-bg {
    /* Делаем фон карточки чуть светлее общего фона страницы */
    background-color: #fff1ef !important; 
    
    /* Добавляем видимую рамку (серую или стальную) */
    border: 1px solid #444 !important;
    
    /* Добавляем мягкую тень, чтобы карточка "приподнялась" над фоном */
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.5);
}

/* Если внутри карточки есть картинка, убедитесь, что она не слишком темная */
[data-bs-theme="dark"] .card-legacy-bg {
    background: linear-gradient(rgba(246, 0, 0, 0.05), rgba(0, 0, 0, 0.8)), 
                url('/static/images/background-rpg.png') no-repeat center/cover;
}
body {
  background: linear-gradient(180deg, #f8f9fa 0%, #ffffff 100%);
  background-attachment: fixed; 
  min-height: 100vh;
}
[data-bs-theme="light"] body {
    background: radial-gradient(circle at top, #fdfbfb 0%, #ebedee 100%);
    background-attachment: fixed;
    min-height: 100vh;
}

[data-bs-theme="light"] .display-4 {
    color: #444;
    text-shadow: 1px 1px 2px rgba(0,0,0,0.1);
}

[data-bs-theme="dark"] body {
  background: linear-gradient(180deg, #212529 0%, #111111 100%);
}

/* Настройка для ТЕМНОЙ темы */
[data-bs-theme="dark"] .bg-body-tertiary {
    background-color: #2b3035 !important; /* Светло-серый графит */
    border: 1px solid #495057 !important; /* Более выраженная рамка */
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.4); /* Мягкая тень для объема */
}

/* Эффект при наведении, чтобы карточка "оживала" */
[data-bs-theme="dark"] .bg-body-tertiary:hover {
    background-color: #32383e !important; /* Еще чуть светлее при наведении */
    transition: 0.3s ease;
}