/* ===== СПРАВОЧНИК (guide.php) ===== */

/* Справочник шире остальных страниц кабинета (там .container-xxl = 1400px) */
.container-xxl.gd-container { max-width: min(1800px, 96vw); }

.gd-layout { display: grid; grid-template-columns: 240px minmax(0, 1fr); gap: 18px; align-items: start; }
/* колонки сетки не должны растягиваться по самому широкому содержимому (ленты меню и вкладок) */
.gd-side, .gd-main { min-width: 0; }
.gd-main { overflow-wrap: break-word; }

/* --- Поиск по справочнику (guide.js, индекс guide/search_index.json): строка над меню и статьёй,
   результаты — на месте статьи (.gd-sr), сгруппированы по страницам, фильтр по группам меню --- */
.gd-search { position: relative; max-width: 640px; margin: 0 auto 18px; }
.gd-search__input {
  width: 100%; padding: 10px 40px 10px 40px; font-size: 15px; color: #fff;
  background: rgba(10,18,28,.75) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%238fa3bb' stroke-width='2.2' stroke-linecap='round'%3E%3Ccircle cx='10.5' cy='10.5' r='6.5'/%3E%3Cpath d='M15.5 15.5L21 21'/%3E%3C/svg%3E") no-repeat 12px center / 18px 18px;
  border: 1px solid rgba(160,205,255,.25); border-radius: 10px; outline: none;
}
.gd-search__input::-webkit-search-cancel-button { display: none; }
.gd-search__input:focus { border-color: #66b5ff; box-shadow: 0 0 0 2px rgba(102,181,255,.25); }
.gd-search__input::placeholder { color: #7f8fa3; }
.gd-search__clear {
  position: absolute; right: 8px; top: 50%; transform: translateY(-50%);
  width: 28px; height: 28px; border: 0; border-radius: 50%; line-height: 1; font-size: 20px;
  background: rgba(127,178,255,.12); color: #9fb3c8;
}
.gd-search__clear:hover { background: rgba(127,178,255,.25); color: #fff; }

.gd-sr { display: flex; flex-direction: column; gap: 12px; }
.gd-sr__sum { font-size: 15px; color: #9fb3c8; }
.gd-sr__sum b { color: #fff; }
.gd-sr__none { padding: 28px 16px; text-align: center; color: #9fb3c8; font-size: 15px; line-height: 1.6; }
.gd-sr__chips { display: flex; flex-wrap: wrap; gap: 8px; }
.gd-sr__chip {
  padding: 5px 12px; border-radius: 16px; font-size: 13.5px; color: #cfd6e3;
  background: rgba(127,178,255,.08); border: 1px solid rgba(127,178,255,.22);
}
.gd-sr__chip span { color: #8fa3bb; margin-left: 2px; }
.gd-sr__chip:hover { background: rgba(127,178,255,.16); }
.gd-sr__chip.active { background: rgba(102,181,255,.22); border-color: #66b5ff; color: #fff; }
.gd-sr__chip.active span { color: #cfe4ff; }
.gd-sr__card {
  background: linear-gradient(180deg, rgba(30,45,69,.85) 0%, rgba(10,17,28,.85) 100%);
  border: 1px solid rgba(127,178,255,.18); border-radius: 12px; overflow: hidden;
}
.gd-sr__page {
  display: flex; align-items: center; gap: 10px; padding: 10px 14px;
  border-bottom: 1px solid rgba(127,178,255,.12); color: #fff; text-decoration: none; font-weight: 700; font-size: 16px;
}
.gd-sr__page img { width: 26px; height: 26px; flex: none; object-fit: contain; opacity: .85; }
.gd-sr__page span { display: flex; flex-direction: column; min-width: 0; }
.gd-sr__page small { font-size: 12px; font-weight: 400; color: #8fa3bb; text-transform: uppercase; letter-spacing: .04em; }
.gd-sr__page:hover { background: rgba(102,181,255,.08); color: #fff; }
.gd-sr__list { list-style: none; margin: 0; padding: 4px 0; }
.gd-sr__hit { display: flex; flex-direction: column; gap: 3px; padding: 8px 14px 8px 50px; color: #e6edf6; text-decoration: none; }
.gd-sr__hit:hover { background: rgba(102,181,255,.1); color: #fff; }
.gd-sr__hit b { font-size: 14.5px; color: #9fc8ff; }
.gd-sr__hit span { font-size: 14px; line-height: 1.45; color: #cfd6e3; }
.gd-sr__etc { padding: 4px 14px 8px 50px; font-size: 13px; color: #8fa3bb; }
.gd-sr mark, .gd-hit { background: rgba(255,211,107,.35); color: #fff; padding: 0 1px; border-radius: 3px; }
.gd-sr__more { align-self: center; padding: 8px 18px; border: 1px solid rgba(127,178,255,.25); border-radius: 10px; background: rgba(102,181,255,.1); color: #9fc8ff; font-size: 14px; }
.gd-sr__more:hover { background: rgba(102,181,255,.2); }
@media (max-width: 991.98px) {
  .gd-search { position: sticky; top: 6px; z-index: 30; max-width: none; }
}
@media (max-width: 576px) {
  .gd-sr__hit, .gd-sr__etc { padding-left: 14px; }
  .gd-sr__page { font-size: 15px; }
}
/* --- Меню слева — в стиле шапки (как меню магазина вещей) --- */
.gd-side { position: sticky; top: 12px; }
.gd-nav {
  display: flex; flex-direction: column; gap: 0;
  padding: 0 0 6px; overflow: hidden;
  background: linear-gradient(180deg, #1e2d45 0%, #131e30 40%, #0a111c 100%);
  border: 1px solid rgba(127,178,255,.22); border-radius: 12px;
  box-shadow: 0 14px 34px rgba(0,0,0,.7), 0 4px 10px rgba(0,0,0,.5), 0 0 24px rgba(60,140,255,.08),
              inset 1px 0 0 rgba(160,200,255,.08), inset -1px 0 0 rgba(160,200,255,.08);
}
/* Группа — заголовок-полоса, пункты раскрываются по клику (открыта одна группа).
   У раскрытой — отсвет и бронзовая линия снизу, как у «Корзины» */
.gd-grp + .gd-grp { border-top: 1px solid rgba(0,0,0,.55); box-shadow: inset 0 1px 0 rgba(160,200,255,.06); }
.gd-group {
  display: flex; align-items: center; justify-content: space-between; width: 100%;
  padding: 9px 14px; border: 0; border-bottom: 1px solid transparent; border-radius: 0; cursor: pointer; text-align: left;
  background: linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,0) 60%);
  font-size: 11.5px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase;
  color: #cfd9e8; text-shadow: 0 1px 2px rgba(0,0,0,.8);
  transition: color .2s ease, background .2s ease;
}
.gd-group:hover { color: #fff; background: radial-gradient(160px 50px at 40px 50%, rgba(102,181,255,.14), transparent 70%),
                                           linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,0) 60%); }
.gd-group__arr { font-size: 12px; color: #8b9bb0; transition: transform .2s ease; }
.gd-grp.open .gd-group {
  color: #fff; border-bottom-color: #a58d5f;
  background: radial-gradient(160px 50px at 40px 50%, rgba(102,181,255,.18), transparent 70%),
              linear-gradient(180deg, rgba(255,255,255,.07), rgba(255,255,255,0) 60%);
  box-shadow: inset 0 1px 0 rgba(160,200,255,.22), 0 1px 0 rgba(90,74,46,.9);
}
.gd-grp.open .gd-group__arr { transform: rotate(180deg); color: #8cc8ff; }
.gd-grp__items { display: none; flex-direction: column; gap: 1px; padding: 6px 8px 8px; }
.gd-grp.open .gd-grp__items { display: flex; }
/* Пункты — как в выпадающем меню шапки; активный — объёмная плашка как в HUD */
.gd-link {
  display: flex; align-items: center; gap: 8px;
  padding: 5px 9px; border-radius: 8px; border: 1px solid transparent;
  color: #cfd9e8; font-weight: 600; font-size: .95rem; text-decoration: none; text-shadow: 0 1px 2px rgba(0,0,0,.6);
  transition: background .2s ease, border-color .2s ease, color .2s ease;
}
.gd-link img { width: 22px; height: 22px; object-fit: contain; flex: none; }
.gd-link:hover { color: #fff; background: linear-gradient(90deg, rgba(60,86,130,.55), rgba(24,36,58,.2));
                 border-color: rgba(102,181,255,.3); box-shadow: inset 3px 0 0 #66b5ff; }
.gd-link.active {
  color: #fff; border-color: rgba(102,181,255,.55);
  background: linear-gradient(180deg, rgba(60,86,130,.9), rgba(24,36,58,.95));
  box-shadow: inset 3px 0 0 #66b5ff, inset 0 1px 0 rgba(255,255,255,.12), 0 0 12px rgba(102,181,255,.25);
}
.gd-sub { display: none; flex-direction: column; gap: 2px; margin: 2px 0 4px 22px; padding-left: 10px; border-left: 1px dashed rgba(165,141,95,.45); }
.gd-sub.open { display: flex; }
.gd-link--sub { padding: 4px 10px; font-size: 14px; font-weight: 500; }
.gd-link--sub[data-p="greedy_miner"] { color: #ffd36b; }
.gd-link--sub[data-p="treasure_goblin"] { color: #ff9a3c; }

/* --- Контент --- */
.gd-main {
  min-height: 420px; padding: 1.2rem 1.4rem;
  background: rgba(0,0,0,.30); backdrop-filter: blur(6px);
  border: 1px solid var(--silk-edge, rgba(255,255,255,.1)); border-radius: 16px;
  color: #e8ecf4; font-size: 15px; line-height: 1.6;
  transition: opacity .15s ease;
}
.gd-main.gd-loading { opacity: .45; pointer-events: none; }
.gd-head { display: flex; align-items: center; gap: 10px; padding-bottom: 10px; margin-bottom: 14px; border-bottom: 1px solid rgba(255,255,255,.12); }
.gd-head img { width: 40px; height: 40px; object-fit: contain; }
.gd-head h2 { margin: 0; font-size: 1.45rem; font-weight: 800; color: #fff; text-shadow: 0 0 8px rgba(102,181,255,.25); }

.gd-main h3 { margin: 1.4rem 0 .6rem; font-size: 1.1rem; font-weight: 800; color: var(--glow-color, #66b5ff); }
.gd-main p { margin: 0 0 .8rem; }
.gd-main a:not(.btn) { color: #7fb2ff; }
.gd-main img.gd-shot { display: block; max-width: 100%; height: auto; margin: .6rem 0 1rem; border-radius: 10px; border: 1px solid rgba(255,255,255,.12); }

/* Подсказка / предупреждение */
.gd-note { margin: .8rem 0 1rem; padding: .7rem 1rem; border-radius: 12px; border-left: 4px solid #2f6db5; background: rgba(47,109,181,.14); }
.gd-note--warn { border-left-color: #e0a92e; background: rgba(224,169,46,.12); }
.gd-note--danger { border-left-color: #e05252; background: rgba(224,82,82,.16); font-size: 1.05rem; padding: .9rem 1.1rem; }
.gd-note__head { display: flex; align-items: center; gap: 10px; margin-bottom: .5rem; font-size: 1.2rem; font-weight: 800; color: #ff8f8f; text-transform: uppercase; letter-spacing: .04em; }
.gd-note__head img { width: 38px; height: 38px; object-fit: contain; }
.gd-note--danger ul { margin-bottom: 0; }

/* Яркий блок «обратите внимание» (золотой) */
.gd-hl {
  position: relative; margin: 1.6rem 0; padding: 1.2rem 1.3rem; border-radius: 16px; overflow: hidden;
  background: linear-gradient(135deg, rgba(224,169,46,.18), rgba(0,0,0,.35) 55%);
  border: 1px solid #e0a92e;
  box-shadow: 0 10px 26px rgba(0,0,0,.45), 0 0 22px -6px rgba(224,169,46,.8);
}
.gd-hl::before {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background: radial-gradient(60% 80% at 0% 0%, rgba(255,211,107,.18), transparent 70%);
}
.gd-hl > * { position: relative; }
.gd-hl__head { display: flex; align-items: center; gap: 12px; margin-bottom: .8rem; }
.gd-hl__head img { width: 52px; height: 52px; object-fit: contain; filter: drop-shadow(0 0 8px rgba(224,169,46,.6)); }
.gd-hl__kicker {
  display: inline-block; padding: 1px 10px; border-radius: 9px; background: #e0a92e; color: #1b1b1b;
  font-size: 11px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase;
}
.gd-hl__title { font-size: 1.3rem; font-weight: 800; color: #ffd36b; text-shadow: 0 0 10px rgba(224,169,46,.45); }
.gd-hl__num { color: #ffd36b; font-size: 1.1em; }
.gd-hl__cmp { display: flex; align-items: stretch; gap: 12px; margin: 1rem 0 1.1rem; }
.gd-hl__case { flex: 1; padding: .8rem 1rem; border-radius: 12px; text-align: center; background: rgba(0,0,0,.35); border: 1px solid rgba(255,255,255,.14); }
.gd-hl__case--win { border-color: #e0a92e; background: rgba(224,169,46,.14); box-shadow: 0 0 16px -4px rgba(224,169,46,.7); }
.gd-hl__label { font-size: 12px; font-weight: 700; color: #aab4c4; text-transform: uppercase; letter-spacing: .05em; }
.gd-hl__case--win .gd-hl__label { color: #ffd36b; }
.gd-hl__calc { font-size: 1.5rem; font-weight: 800; color: #fff; white-space: nowrap; }
.gd-hl__case--win .gd-hl__calc b { color: #ffd36b; }
.gd-hl__sub { font-size: 13px; color: #c9d1de; }
.gd-hl__sub b { color: #7dffb0; }
.gd-hl__arrow { align-self: center; font-size: 1.6rem; color: #e0a92e; }
.gd-hl__btn { min-width: 0; }
/* Компактный вариант (Муны): меньше отступы и заголовок, картинка не во всю ширину */
.gd-hl--compact { padding: .8rem 1rem; margin: 1rem 0; }
.gd-hl--compact .gd-hl__head { margin-bottom: .5rem; }
.gd-hl--compact .gd-hl__head img { width: 40px; height: 40px; }
.gd-hl--compact .gd-hl__title { font-size: 1.1rem; }
.gd-hl--compact p { margin-bottom: .5rem; }
/* Красный вариант — «что будет при неудаче» (Chaos Goblin) */
.gd-hl--bad { background: linear-gradient(135deg, rgba(214,69,69,.2), rgba(0,0,0,.35) 55%); border-color: #d64545; box-shadow: 0 10px 26px rgba(0,0,0,.45), 0 0 22px -6px rgba(214,69,69,.8); }
.gd-hl--bad::before { background: radial-gradient(60% 80% at 0% 0%, rgba(255,120,120,.18), transparent 70%); }
.gd-hl--bad .gd-hl__kicker { background: #d64545; color: #fff; }
.gd-hl--bad .gd-hl__title { color: #ff8f8f; text-shadow: 0 0 10px rgba(214,69,69,.45); }
.gd-hl--bad .gd-hl__head img { filter: drop-shadow(0 0 8px rgba(214,69,69,.6)) grayscale(.3); }
.gd-hl--bad .gd-upmat { border-color: rgba(214,69,69,.45); }
.gd-hl--bad .gd-upmat b { color: #ff8f8f; }
/* голубой вариант блока: выделение без «золота» (страница сокетов, бонус комплекта) */
.gd-hl--info { background: linear-gradient(135deg, rgba(74,163,232,.2), rgba(0,0,0,.35) 55%); border-color: #4aa3e8; box-shadow: 0 10px 26px rgba(0,0,0,.45), 0 0 22px -6px rgba(74,163,232,.8); }
.gd-hl--info::before { background: radial-gradient(60% 80% at 0% 0%, rgba(140,200,255,.18), transparent 70%); }
.gd-hl--info .gd-hl__kicker { background: #4aa3e8; color: #0d1420; }
.gd-hl--info .gd-hl__title { color: #9fd2ff; text-shadow: 0 0 10px rgba(74,163,232,.45); }
.gd-hl--info .gd-hl__head img { filter: drop-shadow(0 0 8px rgba(74,163,232,.6)); }
.gd-hl--info .gd-upmat { border-color: rgba(74,163,232,.45); }
.gd-hl--info .gd-upmat b { color: #9fd2ff; }
/* зелёный вариант блока: способ решить вопрос сразу (страница «Правила PvP», команда /pkclear) */
.gd-hl--ok { background: linear-gradient(135deg, rgba(63,191,127,.2), rgba(0,0,0,.35) 55%); border-color: #3fbf7f; box-shadow: 0 10px 26px rgba(0,0,0,.45), 0 0 22px -6px rgba(63,191,127,.8); }
.gd-hl--ok::before { background: radial-gradient(60% 80% at 0% 0%, rgba(140,255,190,.18), transparent 70%); }
.gd-hl--ok .gd-hl__kicker { background: #3fbf7f; color: #0d1420; }
.gd-hl--ok .gd-hl__title { color: #8ff0bb; text-shadow: 0 0 10px rgba(63,191,127,.45); }
.gd-hl--ok .gd-hl__head img { filter: drop-shadow(0 0 8px rgba(63,191,127,.6)); }
.gd-hl--ok .gd-upmat { border-color: rgba(63,191,127,.45); }
.gd-hl--ok .gd-upmat b { color: #8ff0bb; }
.gd-hl--ok .gd-hl__case--win { border-color: #3fbf7f; background: rgba(63,191,127,.14); box-shadow: 0 0 16px -4px rgba(63,191,127,.7); }
.gd-hl--info .gd-hl__case--win { border-color: #4aa3e8; background: rgba(74,163,232,.14); box-shadow: 0 0 16px -4px rgba(74,163,232,.7); }
.gd-hl--info .gd-hl__case--win .gd-hl__label, .gd-hl--info .gd-hl__arrow { color: #9fd2ff; }
/* Одна общая рамка со строками «кнопка — что там» (меню Chaos Goblin) */
.gd-menubox { flex: 1 1 320px; padding: .3rem .9rem; border-radius: 12px; background: rgba(0,0,0,.35); border: 1px solid rgba(224,169,46,.4); }
.gd-menubox__row { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 12px; padding: .55rem 0; border-bottom: 1px solid rgba(255,255,255,.08); font-size: 14px; }
.gd-menubox__row:last-child { border-bottom: 0; }
.gd-menubox__row .gd-gbtn { flex: 0 0 auto; }
.gd-main img.gd-hl__img { max-width: min(560px, 100%); margin-top: .3rem; margin-bottom: 0; }
@media (max-width: 576px) {
  .gd-hl__cmp { flex-direction: column; }
  .gd-hl__arrow { transform: rotate(90deg); }
  .gd-hl__calc { font-size: 1.3rem; }
}

/* Ступени (группы по ресетам) */
.gd-tiers { display: grid; grid-template-columns: repeat(auto-fit, minmax(110px, 1fr)); gap: 8px; margin: .6rem 0 1rem; }
.gd-tier { text-align: center; padding: .6rem .4rem; border-radius: 12px; background: rgba(0,0,0,.35); border: 1px solid rgba(127,178,255,.35); }
.gd-tier__num { font-size: 1.5rem; font-weight: 800; color: #9fd0ff; line-height: 1.1; }
.gd-tier__sub { font-size: 12px; color: #aab4c4; }
.gd-tier__sub s { color: #ff6b6b; font-weight: 700; text-decoration-thickness: 2px; }
/* Список изменений со стрелками: is-up — улучшение (зелёная вверх), is-down — ухудшение (красная вниз), без класса — точка */
.gd-trend { list-style: none; padding-left: .2rem; }
.gd-trend li { position: relative; padding-left: 1.6rem; margin: .25rem 0; }
.gd-trend li::before { content: "•"; position: absolute; left: .35rem; top: 0; color: #aab4c4; font-weight: 800; }
.gd-trend li.is-up::before { content: "▲"; left: 0; color: #4cd98a; }
.gd-trend li.is-down::before { content: "▼"; left: 0; color: #ff5c5c; }

/* Раскрывающийся блок */
.gd-more { margin: .6rem 0; border-radius: 12px; border: 1px solid rgba(255,255,255,.14); background: rgba(0,0,0,.25); }
.gd-more > summary { cursor: pointer; padding: .6rem 1rem; font-weight: 700; color: #cfe6ff; list-style: none; }
.gd-more > summary::-webkit-details-marker { display: none; }
.gd-more > summary::before { content: "▸"; display: inline-block; width: 1.1em; color: var(--glow-color, #66b5ff); transition: transform .2s ease; }
.gd-more[open] > summary::before { transform: rotate(90deg); }
.gd-more > summary:hover { color: #fff; }
.gd-more > :not(summary) { margin-left: 1rem; margin-right: 1rem; }
.gd-more[open] { padding-bottom: .4rem; }
/* Баннер сезона в разделе «Обновления»: картинки guide/img/updates/*.jpg слоями .gd-banner__slide (несколько — слайдер со сменой
   через CSS-анимацию, без JS: разделы подгружаются без перезагрузки); без картинки — тёмный фон; цвет рамки — --bn */
.gd-banner { --bn: #66b5ff; position: relative; display: flex; flex-direction: column; justify-content: flex-end; gap: 2px; aspect-ratio: 1600 / 512; min-height: 170px; margin: 0 0 1.2rem; padding: 1.2rem 1.5rem; border-radius: 14px; overflow: hidden; background: #0b111c; border: 1px solid color-mix(in srgb, var(--bn) 50%, transparent); box-shadow: 0 0 18px -6px var(--bn); }
.gd-banner__slide { position: absolute; inset: 0; background-size: cover; background-position: center top; }
.gd-banner--slider .gd-banner__slide { opacity: 0; animation: gd-banner-fade 8s infinite; }
.gd-banner--slider .gd-banner__slide:nth-child(2) { animation-delay: 4s; }
@keyframes gd-banner-fade { 0% { opacity: 0; } 8% { opacity: 1; } 50% { opacity: 1; } 58% { opacity: 0; } 100% { opacity: 0; } }
.gd-banner::after { content: ""; position: absolute; inset: 0; background: linear-gradient(0deg, rgba(8,12,20,.9) 0%, rgba(8,12,20,.35) 45%, rgba(8,12,20,0) 75%); }
.gd-banner > :not(.gd-banner__slide) { position: relative; z-index: 1; }
.gd-banner__kicker { font-size: 12px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: var(--bn); }
.gd-banner__title { font-size: 1.7rem; font-weight: 800; line-height: 1.15; color: #fff; text-shadow: 0 0 12px rgba(0,0,0,.9); }
.gd-banner__sub { font-size: 14px; color: #dfe6f1; text-shadow: 0 0 8px rgba(0,0,0,.9); }
@media (max-width: 576px) { .gd-banner { padding: .8rem 1rem; aspect-ratio: auto; min-height: 170px; width: 100%; } .gd-banner__title { font-size: 1.25rem; } .gd-banner__sub { font-size: 13px; } } /* 15.10.2026: на телефоне aspect-ratio + min-height растягивали баннер в ширину (~531px) */

/* Карточки категорий */
.gd-cats { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 10px; margin: .6rem 0 1rem; }
.gd-cat { display: flex; gap: 12px; padding: .8rem; border-radius: 12px; background: rgba(0,0,0,.35); border: 1px solid rgba(255,255,255,.12); }
.gd-cat img { width: 48px; height: 48px; object-fit: contain; flex: none; }
.gd-cat__name { font-weight: 800; color: #fff; }
.gd-cat__text { font-size: 14px; color: #c9d1de; line-height: 1.45; }
.gd-cat__req { display: inline-block; margin-top: 6px; padding: 0 8px; border-radius: 8px; font-size: 12px; background: rgba(127,178,255,.14); color: #9fd0ff; }
.gd-cat__req--inv { background: rgba(224,169,46,.16); color: #ffd36b; }

/* Галерея скриншотов */
.gd-gallery { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(280px, 100%), 1fr)); gap: 12px; margin: .8rem 0 1.2rem; }
.gd-gallery figure { margin: 0; border-radius: 12px; overflow: hidden; background: rgba(0,0,0,.35); border: 1px solid rgba(255,255,255,.12); }
.gd-gallery img { display: block; width: 100%; height: auto; }
.gd-gallery figcaption { padding: .45rem .7rem; font-size: 13px; color: #c9d1de; }

/* Группы клавиш */
.gd-kgroups { display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: 12px; margin: .6rem 0 1rem; align-items: start; }
.gd-kgroup { padding: .7rem .9rem; border-radius: 12px; background: rgba(0,0,0,.35); border: 1px solid rgba(255,255,255,.12); }
.gd-kgroup__title { display: flex; align-items: center; gap: 8px; margin-bottom: .4rem; font-weight: 800; color: var(--glow-color, #66b5ff); }
.gd-kgroup__title img { width: 28px; height: 28px; object-fit: contain; }
.gd-krow { display: flex; align-items: baseline; gap: 10px; padding: 4px 0; border-top: 1px solid rgba(255,255,255,.07); }
.gd-krow__keys { flex: 0 0 132px; }
.gd-krow__act { font-size: 14px; color: #dfe6f1; }
@media (max-width: 400px) { .gd-krow__keys { flex-basis: 108px; } }

/* Список в две колонки */
.gd-cols { columns: 2 280px; column-gap: 28px; margin: .4rem 0 1rem; }
.gd-cols li { break-inside: avoid; margin: .2rem 0; }
ol.gd-cols li::marker { color: var(--glow-color, #66b5ff); font-weight: 700; }

/* Пояснение под названием в таблице (как в «Антилаге») */
.gd-desc { display: block; margin-top: 1px; color: #aab4c4; font-size: 14px; }

/* Горизонтальные вкладки внутри раздела (компактнее, чем .ml2-tabs на других страницах) */
.gd-tabs { margin-top: 1rem; }
.gd-tabs .ml2-tabs { justify-content: flex-start; gap: .5rem; margin-bottom: 1rem; }
.gd-tabs .ml2-tab { min-width: 0; padding: .45rem .9rem; font-size: .95rem; }
.gd-tabs .ml2-tab .ml2-ico { width: 26px; height: 26px; margin-right: 0; }
/* Главные вкладки раздела (над вложенными) — крупнее, с разделителем снизу */
.gd-tabs--main { margin-top: 1.6rem; }
.gd-tabs--main > .ml2-tabs { padding-bottom: .7rem; border-bottom: 1px solid rgba(255,211,107,.3); }
.gd-tabs--main > .ml2-tabs > .ml2-tab { padding: .6rem 1.2rem; font-size: 1.05rem; font-weight: 800; }
.gd-tabs--main > .ml2-tabs > .ml2-tab .gd-tab-ico { max-height: 26px; max-width: 30px; margin-right: 6px; }
/* Таблица с цифрами по центру (шансы) */
.gd-table--center th, .gd-table--center td { text-align: center; white-space: nowrap; }

/* Разделы лотереи — горизонтальные карточки (Moss) */
.gd-boxes { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(230px, 100%), 1fr)); gap: 10px; margin: .6rem 0 1.2rem; }
/* Две группы карточек рядом (на узком экране — друг под другом) */
.gd-pair { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(340px, 100%), 1fr)); gap: 6px 22px; align-items: start; }
.gd-pair .gd-boxes { grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (max-width: 480px) { .gd-pair .gd-boxes { grid-template-columns: minmax(0, 1fr); } }
/* Ровно три карточки на всю ширину (Cherry Blossom); на узком экране — друг под другом */
.gd-boxes--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
@media (max-width: 760px) { .gd-boxes--3 { grid-template-columns: minmax(0, 1fr); } }
.gd-box { display: flex; flex-direction: column; gap: 6px; padding: .75rem .85rem; border-radius: 12px; background: rgba(0,0,0,.35); border: 1px solid rgba(255,255,255,.12); }
.gd-box:hover { border-color: rgba(102,181,255,.5); }
.gd-box__head { display: flex; align-items: center; gap: 10px; }
.gd-box__ico { display: flex; align-items: center; justify-content: center; width: 40px; height: 40px; flex: none; border-radius: 10px; background: rgba(127,178,255,.10); border: 1px solid rgba(127,178,255,.25); }
.gd-box__ico img { max-width: 34px; max-height: 34px; }
.gd-box__name { font-weight: 800; color: #fff; line-height: 1.2; }
.gd-box__price { font-size: 13px; color: #ffd36b; }
.gd-box__role { font-weight: 700; color: #9fd0ff; }
.gd-box__best { font-size: 13.5px; color: #c9d1de; line-height: 1.4; }
/* Ячейка таблицы: картинка предмета + подпись */
.gd-itemcell { display: flex; align-items: center; gap: 10px; }
.gd-itemcell img { width: auto; max-height: 56px; max-width: 40px; flex: none; filter: drop-shadow(0 3px 6px rgba(0,0,0,.5)); }
/* Полоска картинок предметов под текстом (таблицы наград) */
.gd-icons { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 8px; margin-top: 6px; }
.gd-icons img { height: 32px; width: auto; max-width: 48px; object-fit: contain; filter: drop-shadow(0 2px 4px rgba(0,0,0,.5)); }
/* Список внутри карточки (награды) — иконка только у ценного */
.gd-box__list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 4px; font-size: 13.5px; color: #dfe6f1; line-height: 1.35; }
.gd-box__list li { display: flex; align-items: center; gap: 6px; }
.gd-box__list li::before { content: "•"; color: #66b5ff; flex: none; }
.gd-box__list li:has(> img)::before, .gd-box__list li:has(> .gd-popbtn)::before { content: none; }
.gd-box__list img { height: 22px; width: auto; max-width: 26px; object-fit: contain; flex: none; }
.gd-box--gold { border-color: rgba(224,169,46,.6); box-shadow: 0 0 14px -4px rgba(224,169,46,.7); }
/* Кнопка с подсказкой (как «Подробнее» у мунов) */
.gd-popbtn { display: inline-flex; align-items: center; gap: 6px; padding: 0; background: none; border: 0; color: #ffd36b; font: inherit; font-weight: 700; cursor: pointer; text-align: left; }
.gd-popbtn img { height: 22px; width: auto; }
.gd-popbtn__i { display: inline-flex; align-items: center; justify-content: center; width: 16px; height: 16px; border-radius: 50%; font-size: 11px; background: rgba(224,169,46,.25); border: 1px solid #e0a92e; color: #ffd36b; }
.gd-popbtn:hover, .gd-popbtn:focus { color: #fff; outline: none; }
/* Всплывающая подсказка (bootstrap popover, класс ml2-popover задаёт Monsterlegue.js) */
/* Подсказки «Подробнее» — общий файл assets/css/popover.css (подключён в guide.php) */
/* маленькая картинка во вкладке */
.gd-tab-ico { max-height: 22px; max-width: 28px; margin-right: 2px; }
@media (max-width: 768px) { .gd-page .gd-tabs .ml2-tab .gd-tab-ico { display: none; } }

/* Карточки предметов с картинкой (коробки и т.п.) */
.gd-items { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(220px, 100%), 1fr)); gap: 12px; margin: .6rem 0 1.2rem; }
.gd-item { display: flex; align-items: center; gap: 12px; padding: .7rem .9rem; border-radius: 12px; background: rgba(0,0,0,.35); border: 1px solid rgba(255,255,255,.12); }
.gd-items--center { grid-template-columns: repeat(auto-fit, minmax(min(240px, 100%), 300px)); justify-content: center; }
.gd-item img { width: 64px; height: auto; flex: none; filter: drop-shadow(0 4px 8px rgba(0,0,0,.5)); }
.gd-item__name { font-weight: 800; color: #fff; }
.gd-item__text { font-size: 14px; color: #c9d1de; line-height: 1.4; }

/* Метка */
.gd-tag { display: inline-block; padding: 0 7px; border-radius: 9px; font-size: 11px; font-weight: 700; color: #fff; background: #2f6db5; white-space: nowrap; vertical-align: 1px; }
.gd-tag--warn { background: #b5502f; }
.gd-tag--gold { background: #e0a92e; color: #1b1b1b; }

/* Клавиша */
.gd-key {
  display: inline-block; min-width: 26px; padding: 0 7px; text-align: center;
  border-radius: 6px; border: 1px solid rgba(255,255,255,.28); border-bottom-width: 3px;
  background: rgba(255,255,255,.08); color: #fff; font-size: 13px; font-weight: 700; line-height: 1.6;
}
/* Кнопка из игрового окна (только картинка, не кликается) */
.gd-gbtn {
  display: inline-block; min-width: 110px; margin: 5px 0; padding: 3px 12px; text-align: center; white-space: nowrap; cursor: default; user-select: none;
  border-radius: 4px; border: 1px solid #6b5a3a; box-shadow: inset 0 0 0 1px rgba(0,0,0,.6), 0 1px 3px rgba(0,0,0,.6);
  background: linear-gradient(#4a3d2c, #2a2219 55%, #1d1712); color: #f2c94c; font-size: 13.5px; font-weight: 700; line-height: 1.5;
}

/* Таблица */
.gd-table { width: 100%; margin: .4rem 0 1rem; border-collapse: collapse; font-size: 14px; }
.gd-table th, .gd-table td { padding: 6px 10px; border-bottom: 1px solid rgba(255,255,255,.1); vertical-align: top; }
.gd-table th { color: #9fd0ff; font-weight: 700; text-align: left; background: rgba(0,0,0,.25); }
.gd-table tr:hover td { background: rgba(127,178,255,.06); }
.gd-table-wrap { overflow-x: auto; }

/* Заглушка пустого раздела */
.gd-empty { display: flex; flex-direction: column; align-items: center; gap: 10px; padding: 60px 10px; color: #aab4c4; text-align: center; }
.gd-empty img { width: 64px; height: 64px; object-fit: contain; opacity: .8; }

/* ml2-info внутри справочника: по две карточки в ряд */
.gd-main .ml2-info { margin-bottom: 1rem; }
@media (min-width: 992px) { .gd-main .ml2-info__col { grid-column: span 6; } }

/* Сетка карточек (муны и т.п.): колонка уже, чем на обычных страницах */
.gd-main .ml2-grid { grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); }

/* Телефон: кнопка «☰ Раздел» вместо меню (показывается в @media ниже) */
.gd-navbtn { display: none; }

/* плашка как в мобильном меню шапки */
.gd-navbtn {
  width: 100%; align-items: center; justify-content: space-between; gap: 8px;
  padding: .65rem 1rem; border-radius: 10px; border: 1px solid rgba(127,178,255,.3);
  background: linear-gradient(180deg, rgba(46,64,92,.9), rgba(16,23,36,.95));
  color: #e3ecf8; font-weight: 700; font-size: 1rem; text-align: left; text-shadow: 0 1px 2px rgba(0,0,0,.7);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.1), inset 0 -2px 4px rgba(0,0,0,.45), 0 2px 6px rgba(0,0,0,.45);
}
.gd-navbtn[aria-expanded="true"] { border-color: rgba(102,181,255,.55); background: linear-gradient(180deg, rgba(60,86,130,.9), rgba(24,36,58,.95));
                                   box-shadow: inset 3px 0 0 #66b5ff, inset 0 1px 0 rgba(255,255,255,.12), 0 0 12px rgba(102,181,255,.25); }
.gd-navbtn[aria-expanded="true"] .gd-navbtn__arr { transform: rotate(180deg); }
.gd-navbtn__arr { transition: transform .2s ease; }

/* --- Телефон / планшет: меню — горизонтальная лента сверху --- */
@media (max-width: 991.98px) {
  .gd-layout { grid-template-columns: minmax(0, 1fr); }
  .gd-side { position: static; }
  .gd-nav { flex-direction: row; overflow-x: auto; scroll-snap-type: x proximity; gap: 6px; padding: 8px; }
  .gd-group, .gd-sub:not(.open) { display: none; }
  .gd-sub.open { flex-direction: row; gap: 6px; margin: 0; padding: 0; border: 0; }
  .gd-link { flex: none; white-space: nowrap; scroll-snap-align: start; border-color: rgba(255,255,255,.1); }
  .gd-main { padding: 1rem; }
}
/* Меню разделов на телефоне: кнопка «☰ Раздел» раскрывает полный список по группам */
@media (max-width: 991.98px) {
  .gd-page .gd-navbtn { display: flex; }
  .gd-page .gd-nav { display: none; margin-top: 6px; }
  .gd-page .gd-nav.open { display: flex; flex-direction: column; overflow: hidden; gap: 0; padding: 0 0 6px; }
  .gd-page .gd-nav.open .gd-group { display: flex; }
  .gd-page .gd-nav.open .gd-link { white-space: normal; border-color: transparent; }
  .gd-page .gd-nav.open .gd-link.active { border-color: rgba(102,181,255,.55); }
  .gd-page .gd-nav.open .gd-sub.open { flex-direction: column; margin: 2px 0 4px 22px; padding-left: 10px; border-left: 1px dashed rgba(165,141,95,.45); }
}

/* Вкладки на телефоне: сетка по 2 в ряд, без иконок — всё видно без прокрутки */
@media (max-width: 768px) {
  .gd-page .gd-tabs .ml2-tabs { display: grid !important; grid-template-columns: 1fr 1fr; gap: .4rem; overflow: visible !important; padding: 0; }
  .gd-page .gd-tabs .ml2-tabs::after { display: none; }
  .gd-page .gd-tabs .ml2-tab { width: 100%; min-width: 0; white-space: normal; padding: .5rem .4rem; font-size: .88rem; line-height: 1.2; }
  .gd-page .gd-tabs .ml2-tab .ml2-ico { display: none; }
}

@media (max-width: 576px) {
  /* на телефоне три вложенных отступа съедали треть ширины */
  .container-xxl.gd-container { max-width: 100%; padding-left: 8px !important; padding-right: 8px !important; margin-top: 1rem !important; }
  .gd-page { padding: .6rem !important; }
  .gd-main { padding: .8rem .7rem; font-size: 14.5px; }
  .gd-head h2 { font-size: 1.2rem; }
  .gd-head img { width: 32px; height: 32px; }
  .gd-hl { padding: .9rem .8rem; }
  .gd-hl__head img { width: 40px; height: 40px; }
  .gd-hl__title { font-size: 1.1rem; }
  /* таблицы: первый столбец без фиксированной ширины, поменьше отступы */
  .gd-table th, .gd-table td { padding: 5px 6px; }
  .gd-table th[style] { width: auto !important; }
  .gd-table td:first-child { white-space: normal; }
  .ml2-info__col { padding: .8rem .8rem; }
  .ml2-info__list { padding-left: 1rem; font-size: 14px; }
  .gd-more > :not(summary) { margin-left: .6rem; margin-right: .6rem; }
}

/* --- Карточки как у яиц мунов (общие: муны, крылья) --- */
.mi-eggs { display: grid; gap: 14px; grid-template-columns: repeat(3, 1fr); margin-bottom: 18px; }
@media (max-width: 768px) { .mi-eggs { grid-template-columns: 1fr; } }
.mi-egg { position: relative; text-align: center; padding: 16px 12px 14px; border-radius: 16px; background: rgba(0,0,0,.40); backdrop-filter: blur(8px); border: 1px solid var(--mi-c); box-shadow: 0 10px 24px rgba(0,0,0,.45), 0 0 18px -6px var(--mi-c); overflow: hidden; transition: transform .2s ease, box-shadow .2s ease; }
.mi-egg:hover { transform: translateY(-3px); box-shadow: 0 14px 30px rgba(0,0,0,.55), 0 0 26px -4px var(--mi-c); }
.mi-egg::before { content: ""; position: absolute; inset: 0; pointer-events: none; background: radial-gradient(70% 55% at 50% 30%, var(--mi-c), transparent 70%); opacity: .22; }
.mi-egg img { position: relative; height: 130px; max-width: 100%; object-fit: contain; filter: drop-shadow(0 6px 12px rgba(0,0,0,.6)); }
.mi-egg__mob { position: relative; margin-top: 6px; font-weight: 700; color: #e8ecf4; }
.mi-egg__arrow { position: relative; font-size: 13px; color: #aab4c4; margin: 2px 0; }
.mi-egg__name { position: relative; font-weight: 800; color: var(--mi-c); text-shadow: 0 0 8px rgba(0,0,0,.6); }
.mi-egg__class { position: relative; display: inline-block; margin-top: 6px; padding: 2px 12px; border-radius: 10px; background: var(--mi-c); color: #fff; font-size: 12px; font-weight: 700; letter-spacing: .04em; }
.mi-egg__drop { position: relative; margin-top: 8px; font-size: 12px; color: #c9d1de; }
.mi-egg__spawn { position: relative; margin-top: 10px; padding-top: 8px; border-top: 1px dashed rgba(255,255,255,.2); font-size: 12px; color: #c9d1de; text-align: left; }
.mi-egg__when { display: flex; flex-wrap: wrap; gap: 5px; justify-content: center; margin-bottom: 6px; }
.mi-time { padding: 1px 8px; border-radius: 8px; background: rgba(127,178,255,.16); color: #7fb2ff; font-weight: 700; white-space: nowrap; }
.mi-day { padding: 1px 8px; border-radius: 8px; background: var(--mi-c); color: #fff; font-weight: 700; white-space: nowrap; }
.mi-egg__maps { text-align: center; line-height: 1.5; }
.mi-egg__maps b { color: #e8ecf4; }  .mi-egg--normal { --mi-c: #2fae8f; } .mi-egg--premium { --mi-c: #3f8fe0; } .mi-egg--brave { --mi-c: #e0a92e; }

/* --- Крылья: карточки на базе .mi-egg --- */
.mi-egg--std   { --mi-c: rgba(255,255,255,.22); }
.mi-egg--std::before { opacity: .06; }
.mi-egg--std .mi-egg__name { color: #e8ecf4; }
.mi-egg--std .mi-egg__class { background: rgba(255,255,255,.14); }
.mi-egg--small { --mi-c: #4d8a74; }
.mi-egg--special { --mi-c: #b39653; }
.mi-egg--special.is-w25   { --mi-c: #a8645c; }
.mi-egg--special.is-conq  { --mi-c: #5b83b3; }
.mi-egg--special.is-angel { --mi-c: #8a72b0; }
.mi-egg--special.is-power { --mi-c: #b39653; }
.mi-eggs--wings { grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); align-items: start; }
@media (max-width: 768px) { .mi-eggs--wings { grid-template-columns: minmax(0, 1fr); } }
.mi-eggs--wings .mi-egg img { height: 150px; }
.gd-wcard { min-width: 0; }
.gd-wv { display: none; }
.gd-wv.on { display: block; }
.gd-wv__none { position: relative; padding: 40px 0; color: #8d97a8; font-size: 13px; }
.mi-egg__stats { position: relative; margin-top: 10px; padding: 8px 10px; border-radius: 10px; background: rgba(0,0,0,.35); font-size: 13px; color: #c9d1de; }
.mi-egg__stats-head { display: flex; justify-content: flex-end; font-size: 11px; color: #8d97a8; }
.mi-egg__stats-head span { min-width: 52px; text-align: right; }
.mi-egg__stat { display: flex; align-items: baseline; gap: 6px; padding: 2px 0; }
.mi-egg__stat > span:first-child { flex: 1 1 auto; text-align: left; }
.mi-egg__stat b { min-width: 46px; text-align: right; color: #e8ecf4; }
.mi-egg__stat b.mi-egg__max { color: #f0c96a; }
.mi-egg__btns { position: relative; display: flex; flex-wrap: wrap; justify-content: center; gap: 6px; margin-top: 10px; }
.gd-recipe { margin-top: 6px; }
.gd-recipe > summary { cursor: pointer; list-style: none; text-align: center; font-size: 13px; font-weight: 700; color: #9fc6f5; padding: 4px 0; }
.gd-recipe > summary::-webkit-details-marker { display: none; }
.gd-recipe > summary::after { content: " ▾"; }
.gd-recipe[open] > summary::after { content: " ▴"; }
.gd-recipe__body { padding: 8px 12px; border-radius: 10px; background: rgba(0,0,0,.30); border: 1px solid rgba(255,255,255,.10); font-size: 13px; color: #c9d1de; }
.gd-recipe__step + .gd-recipe__step { margin-top: 8px; padding-top: 8px; border-top: 1px dashed rgba(255,255,255,.15); }
.gd-recipe__title { font-weight: 700; color: #e8ecf4; margin-bottom: 2px; }
.gd-recipe__body ul { margin: 0; padding-left: 1.1rem; }
.gd-recipe__note { margin-top: 6px; font-size: 12px; color: #8d97a8; }
.gd-clsbar { margin-bottom: 14px; }
.gd-clsbar { gap: 4px; }
.gd-clsbar .ml2-tab { padding: 3px 9px; font-size: 12px; min-width: 0; line-height: 1.4; }
/* --- Обычные крылья: карточка как у разделов Moss --- */
.gd-boxes--wings { grid-template-columns: repeat(auto-fill, minmax(min(250px, 100%), 1fr)); align-items: start; }
.gd-wbox .gd-box__head { margin-bottom: 2px; }
.gd-box__ico--wing { width: 76px; height: 76px; border-radius: 12px; }
.gd-box__ico--wing img { max-width: 68px; max-height: 68px; object-fit: contain; }
/* Квесты Gens: шаги по картам, монстры двух фракций рядом */
.gd-boxes--gsteps { grid-template-columns: repeat(auto-fit, minmax(min(260px, 100%), 1fr)); align-items: stretch; }
.gd-boxes--gsteps.gd-boxes--n4 { grid-template-columns: repeat(auto-fit, minmax(min(210px, 100%), 1fr)); }
.gd-gmobs { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin: 2px 0 4px; }
.gd-gmob { text-align: center; min-width: 0; }
.gd-gmob__pic { position: relative; height: 112px; display: flex; align-items: flex-end; justify-content: center; border-radius: 10px; }
.gd-gmob__over { position: absolute; top: 4px; left: 6px; display: flex; align-items: center; justify-content: center; width: 32px; height: 32px; border-radius: 8px; background: rgba(127,178,255,.10); border: 1px solid rgba(127,178,255,.25); }
.gd-gmob__pic .gd-gmob__over img { max-height: 26px; max-width: 26px; }
.gd-gmob__pic:empty { border: 1px dashed rgba(255,255,255,.15); }
.gd-gmob--d .gd-gmob__pic { background: radial-gradient(50% 60% at 50% 65%, rgba(224,90,79,.22), transparent 75%); }
.gd-gmob--v .gd-gmob__pic { background: radial-gradient(50% 60% at 50% 65%, rgba(95,191,106,.22), transparent 75%); }
.gd-gmob__pic img { max-height: 106px; max-width: 100%; object-fit: contain; }
.gd-gmob__pic--sm img { max-height: 60px; max-width: 70%; }
.gd-gmob__name { display: flex; align-items: center; justify-content: center; gap: 2px; margin-top: 4px; font-weight: 700; font-size: 13px; color: #fff; line-height: 1.2; }
.gd-gmob__name img { height: 28px; width: auto; flex: none; }
/* Gens: звания — две колонки компактных строк */
.gd-granks { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px 22px; margin: .6rem 0 1.2rem; }
@media (max-width: 576px) { .gd-granks { grid-template-columns: minmax(0, 1fr); } }
.gd-granks__title { font-weight: 800; color: var(--gc, #9fd0ff); font-size: 14px; padding: 0 4px 4px; border-bottom: 1px solid color-mix(in srgb, var(--gc, #9fd0ff) 45%, transparent); margin-bottom: 2px; }
.gd-grank { display: flex; align-items: center; gap: 8px; padding: 2px 4px; border-bottom: 1px solid rgba(255,255,255,.06); }
.gd-grank__mark { display: flex; flex: none; width: 22px; justify-content: center; }
.gd-grank__mark img { height: 30px; width: auto; }
.gd-grank__name { font-weight: 700; color: #fff; font-size: 14px; }
.gd-grank__cond { margin-left: auto; color: #ffd36b; font-size: 13px; white-space: nowrap; }
/* Боссы: сначала карточки боссов; клик — список прячется, показывается только выбранный босс (переключатели без JS) */
.gd-bs-radio { position: absolute; opacity: 0; pointer-events: none; }
.gd-bs-radio:not(#bs-r-list):checked ~ .gd-bs-home { display: none; }
.gd-bs-panel { display: none; }
#bs-r-balgass:checked ~ .gd-bs-panels #bs-p-balgass,
#bs-r-nightmare:checked ~ .gd-bs-panels #bs-p-nightmare,
#bs-r-medusa:checked ~ .gd-bs-panels #bs-p-medusa,
#bs-r-kundun:checked ~ .gd-bs-panels #bs-p-kundun,
#bs-r-nix:checked ~ .gd-bs-panels #bs-p-nix,
#bs-r-god:checked ~ .gd-bs-panels #bs-p-god,
#bs-r-silvester:checked ~ .gd-bs-panels #bs-p-silvester,
#bs-r-magriffy:checked ~ .gd-bs-panels #bs-p-magriffy,
#bs-r-ferea:checked ~ .gd-bs-panels #bs-p-ferea { display: block; }
.gd-bs-link { cursor: pointer; color: #9fd0ff; border-bottom: 1px dashed rgba(159,208,255,.6); margin: 0; }
.gd-bs-link:hover { color: #fff; }
.gd-bs-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(250px, 100%), 1fr)); gap: 10px; margin: .6rem 0 1rem; }
.gd-bs-item { display: flex; align-items: center; gap: 12px; margin: 0; padding: .6rem .75rem; border-radius: 12px; background: rgba(0,0,0,.32); border: 1px solid rgba(255,255,255,.1); color: inherit; text-decoration: none; cursor: pointer; transition: border-color .15s, transform .15s, background .15s; }
.gd-bs-item:hover { border-color: rgba(255,211,107,.7); background: rgba(255,211,107,.06); transform: translateY(-1px); color: inherit; text-decoration: none; }
.gd-bs-item--static { cursor: default; }
.gd-bs-item--static:hover { border-color: rgba(255,255,255,.1); background: rgba(0,0,0,.32); transform: none; }
.gd-bs-item__pic { flex: none; width: 64px; height: 64px; display: flex; align-items: center; justify-content: center; }
.gd-bs-item__pic img { max-width: 100%; max-height: 64px; object-fit: contain; }
.gd-bs-item__body { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.gd-bs-item__name { font-weight: 800; color: #fff; }
.gd-bs-item__meta { font-size: 12.5px; line-height: 1.4; color: rgba(255,255,255,.75); }
.gd-bs-item__ticket { font-size: 12px; color: #ffd36b; }
.gd-bs-back { display: inline-block; cursor: pointer; margin: 0 0 .6rem; padding: 3px 12px; border-radius: 999px; font-size: 13px; color: #9fd0ff; border: 1px solid rgba(159,208,255,.45); }
.gd-bs-back:hover { color: #fff; border-color: #fff; }
.gd-bs-weapon { max-width: 640px; }
.gd-bs-duo { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; align-items: stretch; max-width: 900px; margin: .6rem auto 1rem; }
@media (max-width: 767.98px) { .gd-bs-duo { grid-template-columns: minmax(0, 1fr); } }
.gd-bs-trio { grid-template-columns: repeat(3, minmax(0, 1fr)); max-width: 1000px; }
@media (max-width: 767.98px) { .gd-bs-trio { grid-template-columns: minmax(0, 1fr); } }
.gd-bs-card { height: 100%; }
.gd-bs-card--guard { opacity: .9; }
.gd-bs-card--guard .gd-gbox__pic { transform: scale(.85); }
.gd-badge-boss, .gd-badge-guard { position: absolute; top: 10px; right: 10px; z-index: 2; display: inline-flex; align-items: center; padding: 2px 10px; border-radius: 999px; font-size: 11.5px; font-weight: 800; line-height: 1.5; letter-spacing: .08em; }
.gd-badge-boss { color: #2a1d00; background: linear-gradient(180deg, #ffe08a, #e0a81e); box-shadow: 0 0 10px rgba(255,190,40,.35); }
.gd-badge-gp { display: inline-flex; align-items: center; gap: 4px; margin-left: 7px; padding-left: 7px; border-left: 1px solid rgba(42,29,0,.35); font: inherit; letter-spacing: inherit; line-height: inherit; }
.gd-badge-gp img { display: block; width: 13px; height: 13px; }
.gd-badge-guard { color: #cfe4f5; background: rgba(127,179,217,.18); border: 1px solid rgba(127,179,217,.5); }
.gd-bs-guard { display: flex; align-items: center; gap: 14px; max-width: 560px; margin: .2rem auto 1rem; padding: .6rem .9rem; border-radius: 12px; background: rgba(0,0,0,.28); border: 1px solid rgba(127,179,217,.3); }
.gd-bs-guard__pic { flex: none; width: 90px; height: 90px; display: flex; align-items: flex-end; justify-content: center; }
.gd-bs-guard__pic img { max-width: 100%; max-height: 90px; object-fit: contain; }
.gd-bs-guard__kicker { font-size: 11px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: #7fb3d9; }
.gd-bs-guard__name { font-weight: 800; color: #fff; }
.gd-bs-guard__text { font-size: 12.5px; color: #c9d1de; line-height: 1.4; }
@media (max-width: 480px) { .gd-bs-guard { flex-direction: column; text-align: center; } }
/* панель босса (21.10.2026): вход — шар | миникарта (Ferea); крупная карточка босса gd-bs-hero (Ferea, на пробу), скиллы — плашки; карточка босса — общая, как у Kundun */
.gd-bs-entry { display: grid; grid-template-columns: 190px minmax(0, 1fr); align-items: center; gap: 18px; max-width: 760px; margin: .6rem auto 1.2rem; padding: 1rem 1.2rem; border-radius: 16px; background: radial-gradient(90% 120% at 0% 50%, rgba(155,93,229,.16), transparent 60%), rgba(0,0,0,.25); border: 1px solid rgba(155,93,229,.35); }
.gd-bs-entry__side { text-align: center; }
.gd-bs-entry__kicker { font-size: 11px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: #c8a2ff; }
.gd-bs-entry__title { font-size: 1rem; font-weight: 800; color: #fff; }
.gd-bs-entry__text { font-size: 12px; line-height: 1.45; color: #c9d1de; }
.gd-bs-entry__map img { display: block; width: 100%; max-width: 420px; margin: 0 auto; border-radius: 12px; border: 1px solid rgba(255,255,255,.12); }
.gd-bs-entry__cap { margin-top: 6px; text-align: center; font-size: 12px; color: #9fb3c8; }
.gd-bs-orb__img { position: relative; width: 80px; height: 80px; margin: 22px auto .5rem; border-radius: 50%; }
.gd-bs-orb__img img { position: relative; z-index: 1; width: 100%; height: 100%; object-fit: contain; animation: gd-orb-spin 9s linear infinite, gd-orb-glow 2.6s ease-in-out infinite; }
.gd-bs-orb__img::before { content: ""; position: absolute; inset: -10px; border-radius: 50%; background: radial-gradient(circle, rgba(230,120,255,.45) 0%, rgba(160,80,240,.18) 45%, transparent 70%); animation: gd-orb-halo 2.6s ease-in-out infinite; }
.gd-bs-orb__img::after { content: ""; position: absolute; left: 50%; bottom: 62%; width: 46px; height: 46px; margin-left: -23px; border-radius: 50%; background: radial-gradient(circle, rgba(200,160,255,.55), transparent 70%); filter: blur(6px); animation: gd-orb-smoke 3.2s ease-out infinite; }
@keyframes gd-orb-spin { to { transform: rotate(360deg); } }
@keyframes gd-orb-glow { 0%, 100% { filter: drop-shadow(0 0 5px rgba(235,120,255,.6)); } 50% { filter: drop-shadow(0 0 18px rgba(245,150,255,1)); } }
@keyframes gd-orb-halo { 0%, 100% { transform: scale(.92); opacity: .7; } 50% { transform: scale(1.12); opacity: 1; } }
@keyframes gd-orb-smoke { 0% { transform: translateY(0) scale(.6); opacity: 0; } 25% { opacity: .9; } 100% { transform: translateY(-34px) scale(1.4); opacity: 0; } }
@media (prefers-reduced-motion: reduce) { .gd-bs-orb__img img, .gd-bs-orb__img::before, .gd-bs-orb__img::after { animation: none; } }
.gd-bs-fight { display: grid; grid-template-columns: minmax(0, 1fr) 250px; align-items: stretch; gap: 12px; max-width: 980px; margin: .6rem auto 1.2rem; }
.gd-bs-fight > .gd-bs-entry { max-width: none; margin: 0; }
.gd-bs-guardcol { display: grid; grid-auto-rows: 1fr; gap: 10px; }
.gd-bs-guardcol .gd-bs-card--guard { opacity: 1; padding: .5rem .8rem; }
.gd-bs-guardcol .gd-gbox > .gd-wv.on { display: flex; align-items: center; gap: 12px; }
.gd-bs-guardcol .gd-gbox__pic { flex: none; width: 96px; height: 96px; margin: 0; transform: none; }
.gd-bs-guardcol .gd-gbox__pic > img { max-height: 92px; }
.gd-bs-guardcol .gd-box__name { text-align: left; }
@media (max-width: 860px) { .gd-bs-entry, .gd-bs-fight { grid-template-columns: minmax(0, 1fr); } }
.gd-boxes--single.gd-bs-herowrap { grid-template-columns: minmax(min(280px, 100%), 380px); }
.gd-bs-herorow { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(280px, 100%), 380px)); justify-content: center; align-items: stretch; gap: 12px; margin: .6rem auto 1rem; }
.gd-bs-herorow > .gd-box { height: 100%; }
.gd-bs-herorow .gd-bs-card--guard { opacity: 1; }
.gd-bs-herorow .gd-bs-card--guard .gd-gbox__pic { height: 230px; transform: none; }
.gd-bs-herorow .gd-bs-card--guard .gd-gbox__pic > img { max-height: 222px; }
.gd-bs-guardrow { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(220px, 100%), 270px)); justify-content: center; gap: 10px; margin: .2rem auto 1.2rem; }
.gd-box.gd-bs-hero { box-shadow: 0 0 0 1px rgba(255,211,107,.55), 0 0 30px rgba(255,190,40,.22); }
.gd-bs-hero .gd-gbox__pic { height: 230px; }
.gd-bs-hero .gd-gbox__pic > img { max-height: 222px; }
.gd-bs-hero .gd-box__name { font-size: 1.35rem; color: #ffd36b; }
.gd-bs-skills { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(220px, 100%), 1fr)); gap: 8px; margin: .4rem 0 1.2rem; }
.gd-bs-skills--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
@media (max-width: 860px) { .gd-bs-skills--3 { grid-template-columns: minmax(0, 1fr); } }
.gd-bs-skill { display: flex; align-items: flex-start; gap: 10px; padding: .55rem .7rem; border-radius: 10px; background: rgba(255,255,255,.03); border: 1px solid rgba(255,255,255,.08); border-left: 3px solid var(--sk-c, #c45a8a); }
.gd-bs-skill__pic { flex: none; width: 56px; height: 56px; display: flex; align-items: center; justify-content: center; }
.gd-bs-skill__pic img { max-width: 56px; max-height: 56px; object-fit: contain; border-radius: 8px; }
.gd-bs-skill__name { font-size: .95rem; font-weight: 800; color: var(--sk-c, #c45a8a); }
.gd-bs-skill__text { font-size: 12px; line-height: 1.4; color: #c9d1de; }
.gd-pill { display: inline-block; padding: 1px 8px; border-radius: 999px; font-size: 12px; font-weight: 700; line-height: 1.6; white-space: nowrap; }
.gd-pill--opt { color: #7cf0a0; background: rgba(75,227,122,.12); border: 1px solid rgba(75,227,122,.45); }
.gd-pill--sock { color: #ffd36b; background: rgba(255,211,107,.12); border: 1px solid rgba(255,211,107,.5); }
/* 21.10.2026 её цвета меток: сокет — сиреневый, Mastery — жёлтый пунктир, Ancient — светло-зелёный с голубизной (Excellent — .gd-pill--opt) */
.gd-pill--socket { color: #d3b4ff; background: rgba(170,120,255,.12); border: 1px solid rgba(170,120,255,.5); }
.gd-pill--mastery { color: #ffd36b; background: rgba(255,211,107,.08); border: 1px dashed rgba(255,211,107,.75); }
.gd-pill--anc { color: #8ff0e0; background: rgba(90,220,200,.12); border: 1px solid rgba(90,220,200,.5); }
.gd-opts { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 4px; }
/* Treasure Goblin: камень в карточке гоблина и карточка босса */
.gd-tg-drop { display: flex; align-items: center; justify-content: center; gap: 6px; font-size: 13px; color: #fff; font-weight: 700; }
.gd-tg-drop img { height: 20px; width: auto; }
.gd-gcases--tg { align-items: stretch; }
.gd-gcases--tg .gd-gcase__pic { position: relative; }
.gd-tg-box { position: absolute; top: 2px; right: 2px; display: flex; align-items: center; justify-content: center; width: 38px; height: 38px; border-radius: 8px; background: rgba(0,0,0,.35); border: 1px solid color-mix(in srgb, var(--gc) 55%, transparent); }
.gd-gcase__pic .gd-tg-box img { max-width: 32px; max-height: 32px; }
.gd-gcases--tg .gd-gcase__places { flex-wrap: nowrap; gap: 3px; }
.gd-gcases--tg .gd-gcase__place { padding: 1px 5px; font-size: 10.5px; white-space: nowrap; }
.gd-gcases--tg .gd-gcase__ruud img { width: 28px; height: 28px; vertical-align: -9px; }
/* Greedy Miner: коллаж «оружие с охраны» — камень в центре, оружие кружит вокруг него */
.gd-gmloot { --gm-r: 250px; --gm-h: 150px; --gm-w: 110px; --gm-dy: 46px; position: relative; height: 380px; margin: .6rem 0 1.2rem; overflow: hidden; border-radius: 16px; border: 1px solid rgba(170,120,255,.45); background: radial-gradient(60% 70% at 50% 78%, rgba(120,60,220,.55), transparent 70%), radial-gradient(40% 30% at 50% 88%, rgba(60,140,255,.45), transparent 75%), linear-gradient(180deg, #07061a, #120a2c 60%, #05040f); isolation: isolate; }
.gd-gmloot::before { content: ""; position: absolute; inset: 0; z-index: 0; background-image: radial-gradient(1.5px 1.5px at 12% 22%, #fff, transparent), radial-gradient(1px 1px at 27% 61%, #c9b3ff, transparent), radial-gradient(1.5px 1.5px at 41% 14%, #9fd0ff, transparent), radial-gradient(1px 1px at 58% 33%, #fff, transparent), radial-gradient(1.5px 1.5px at 73% 18%, #ffb3e6, transparent), radial-gradient(1px 1px at 86% 52%, #fff, transparent), radial-gradient(1.5px 1.5px at 93% 27%, #b3c8ff, transparent), radial-gradient(1px 1px at 7% 72%, #fff, transparent); animation: gd-gm-twinkle 4s ease-in-out infinite alternate; }
.gd-gmloot__beams { position: absolute; left: 50%; bottom: 46px; z-index: 1; width: 460px; max-width: 90%; height: 320px; transform: translateX(-50%); background: repeating-linear-gradient(90deg, transparent 0 13px, rgba(255,150,170,.22) 13px 15px, transparent 15px 31px, rgba(200,130,255,.18) 31px 32px, transparent 32px 47px); background-size: 94px 100%; -webkit-mask-image: radial-gradient(50% 100% at 50% 100%, #000 20%, transparent 78%); mask-image: radial-gradient(50% 100% at 50% 100%, #000 20%, transparent 78%); animation: gd-gm-pulse 3.2s ease-in-out infinite alternate; }
.gd-gmloot__ring { position: absolute; left: 50%; bottom: 20px; z-index: 1; width: 340px; max-width: 86%; height: 62px; transform: translateX(-50%); border-radius: 50%; border: 2px solid rgba(255,150,190,.85); box-shadow: 0 0 16px 4px rgba(235,70,140,.7), inset 0 0 22px 6px rgba(170,90,255,.5); animation: gd-gm-ring 3.2s ease-in-out infinite alternate; }
.gd-gmloot__ring--2 { bottom: 30px; width: 230px; height: 40px; border-color: rgba(210,160,255,.8); animation-delay: -1.6s; }
.gd-gmloot__orbit { position: absolute; left: 50%; top: 150px; z-index: 2; width: var(--gm-w); height: var(--gm-h); margin: calc(var(--gm-h) / -2) 0 0 calc(var(--gm-w) / -2); animation: gd-gm-x 11s cubic-bezier(.37,0,.63,1) infinite alternate, gd-gm-z 22s step-end infinite; animation-delay: var(--gm-dx), var(--gm-d); }
.gd-gmloot__orbit img { position: absolute; left: 0; top: 0; width: 100%; height: 100%; object-fit: contain; margin: 0; transform-origin: 50% 50%; opacity: .92; filter: drop-shadow(0 0 10px var(--gm-c)) drop-shadow(0 0 22px var(--gm-c)); animation: gd-gm-y 11s cubic-bezier(.37,0,.63,1) infinite alternate; animation-delay: var(--gm-d); }
.gd-gmloot__orbit--ba { --gm-c: rgba(255,70,60,.85); }
.gd-gmloot__orbit--da { --gm-c: rgba(180,90,255,.9); }
.gd-gmloot__stone { position: absolute; left: 50%; bottom: 34px; z-index: 3; width: 190px; margin-left: -95px; filter: drop-shadow(0 0 16px rgba(120,190,255,.9)) drop-shadow(0 0 38px rgba(235,80,150,.7)); animation: gd-gm-stone 3.2s ease-in-out infinite alternate; }
.gd-gmloot__stone img { display: block; width: 100%; height: auto; max-width: none; -webkit-mask-image: linear-gradient(180deg, #000 58%, rgba(0,0,0,.55) 78%, transparent 97%); mask-image: linear-gradient(180deg, #000 58%, rgba(0,0,0,.55) 78%, transparent 97%); }
.gd-gmloot__pool { position: absolute; left: 50%; bottom: 22px; z-index: 3; width: 300px; max-width: 78%; height: 78px; transform: translateX(-50%); pointer-events: none; border-radius: 50%; background: radial-gradient(50% 50% at 50% 50%, rgba(255,235,220,.95), rgba(255,150,170,.75) 30%, rgba(225,80,170,.4) 58%, transparent 76%); filter: blur(7px); animation: gd-gm-pulse 3.2s ease-in-out infinite alternate; }
.gd-gmloot__ring--front { z-index: 3; clip-path: inset(50% -40px -40px -40px); }
.gd-gmloot__glow { position: absolute; left: 50%; bottom: 26px; z-index: 1; width: 330px; max-width: 86%; height: 330px; transform: translateX(-50%); pointer-events: none; background: radial-gradient(50% 100% at 50% 100%, rgba(255,205,170,.95), rgba(255,110,120,.6) 22%, rgba(225,70,160,.36) 46%, rgba(150,80,255,.16) 66%, transparent 80%); filter: blur(5px); animation: gd-gm-pulse 3.2s ease-in-out infinite alternate; }
.gd-gmloot__tags { position: absolute; left: 0; right: 0; top: 12px; z-index: 6; display: flex; justify-content: space-between; gap: 8px; padding: 0 14px; }
.gd-gmloot__tag { padding: 4px 12px; border-radius: 999px; font-size: 13px; font-weight: 800; color: #fff; background: rgba(0,0,0,.45); border: 1px solid var(--gm-c); box-shadow: 0 0 12px var(--gm-c); white-space: nowrap; }
.gd-gmloot__tag--ba { --gm-c: rgba(255,90,80,.9); }
.gd-gmloot__tag--da { --gm-c: rgba(180,110,255,.95); }
@keyframes gd-gm-x { from { transform: translateX(calc(var(--gm-r) * -1)); } to { transform: translateX(var(--gm-r)); } }
@keyframes gd-gm-y { from { transform: translateY(calc(var(--gm-dy) * -1)) scale(.62); opacity: .5; } to { transform: translateY(var(--gm-dy)) scale(1.06); opacity: .96; } }
@keyframes gd-gm-z { 0% { z-index: 2; } 25% { z-index: 4; } 75% { z-index: 2; } }
@keyframes gd-gm-stone { from { transform: translateY(0); filter: drop-shadow(0 0 12px rgba(120,190,255,.85)) drop-shadow(0 0 28px rgba(235,80,150,.55)); } to { transform: translateY(-8px); filter: drop-shadow(0 0 22px rgba(160,220,255,1)) drop-shadow(0 0 54px rgba(255,100,150,.9)); } }
@keyframes gd-gm-ring { from { opacity: .55; transform: translateX(-50%) scale(.96); } to { opacity: 1; transform: translateX(-50%) scale(1.03); } }
@keyframes gd-gm-pulse { from { opacity: .6; } to { opacity: 1; } }
@keyframes gd-gm-twinkle { from { opacity: .35; } to { opacity: 1; } }
@media (max-width: 576px) { .gd-gmloot { --gm-h: 140px; --gm-w: 62px; height: 330px; } .gd-gmloot__orbit { top: auto; bottom: 92px; margin: 0 0 0 calc(var(--gm-w) / -2); z-index: 2; animation: none; transform: rotate(var(--gm-a)); transform-origin: 50% 100%; } .gd-gmloot__orbit img { animation: none; transform: none; rotate: 0deg !important; opacity: .95; } .gd-gmloot__stone { width: 120px; margin-left: -60px; } .gd-gmloot__pool { height: 52px; } .gd-gmloot__ring { height: 50px; } .gd-gmloot__ring--2 { height: 32px; } .gd-gmloot__tags { flex-direction: column; align-items: center; gap: 5px; top: 10px; padding: 0 8px; } .gd-gmloot__tag { font-size: 11.5px; padding: 3px 10px; } }
@media (prefers-reduced-motion: reduce) { .gd-gmloot::before, .gd-gmloot__beams, .gd-gmloot__ring, .gd-gmloot__stone, .gd-gmloot__glow, .gd-gmloot__pool { animation: none; } }
.gd-tg-boss { display: flex; align-items: center; gap: 22px; padding: 1rem 1.2rem; margin: .6rem 0 1.2rem; border-radius: 16px; border: 1px solid rgba(255,211,107,.45); background: linear-gradient(120deg, rgba(255,200,60,.16), rgba(0,0,0,.35) 60%); }
@media (max-width: 576px) { .gd-tg-boss { flex-direction: column; text-align: center; } }
.gd-tg-boss__pic { flex: none; width: 220px; height: 220px; display: flex; align-items: flex-end; justify-content: center; background: radial-gradient(48% 55% at 50% 58%, rgba(255,205,70,.38), transparent 75%); }
.gd-tg-boss__pic { position: relative; }
.gd-tg-boss__pic > img { max-width: 100%; max-height: 210px; object-fit: contain; filter: sepia(.35) saturate(1.6) brightness(1.08); }
.gd-tg-boss__boxes { display: flex; gap: 4px; margin-bottom: 8px; --gc: #ffd36b; }
@media (max-width: 576px) { .gd-tg-boss__boxes { justify-content: center; } }
.gd-tg-boss__boxes .gd-tg-box { position: static; width: 34px; height: 34px; }
.gd-tg-boss__boxes .gd-tg-box img { max-width: 28px; max-height: 28px; }
.gd-tg-boss__badge { display: inline-block; padding: 2px 10px; border-radius: 999px; font-size: 12px; font-weight: 800; letter-spacing: .08em; color: #2a1d00; background: linear-gradient(180deg, #ffe08a, #e0a81e); }
.gd-tg-boss__name { margin: 6px 0 8px; font-size: 22px; font-weight: 800; color: #ffd36b; text-shadow: 0 0 12px rgba(255,190,40,.45); }
.gd-tg-items { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.gd-tg-item { display: flex; flex-direction: column; align-items: center; gap: 3px; width: 86px; padding: 6px 4px; border-radius: 8px; background: rgba(0,0,0,.28); border: 1px solid rgba(255,211,107,.22); font-size: 11.5px; color: #e8edf5; text-align: center; line-height: 1.2; }
.gd-tg-item img { height: 34px; width: auto; max-width: 44px; object-fit: contain; }
.gd-tg-boss__list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 5px; font-size: 14px; color: #e8edf5; text-align: left; }
/* Golden Invasion: монстры и Box of Kundun */
.gd-gcases.gd-gcases--gi { grid-template-columns: repeat(auto-fill, minmax(min(190px, 100%), 1fr)); align-items: stretch; }
.gd-gcases--gi .gd-gcase__pic { height: 110px; }
.gd-gcases--gi .gd-gcase__pic img { max-height: 100px; }
.gd-gcases--gi .gd-gcase__place { font-size: 11.5px; }
.gd-gcases.gd-gcases--5 { grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 6px; }
.gd-gcases--5 .gd-gcase { padding: .4rem .45rem; background: none; border: 0; }
.gd-gcases--5 .gd-gcase__pic { height: 72px; }
.gd-gcases--5 .gd-gcase__pic img { max-height: 66px; }
.gd-gcases--5 .gd-gcase__name { font-size: 12.5px; }
@media (max-width: 767.98px) { .gd-gcases.gd-gcases--5 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 480px) { .gd-gcases.gd-gcases--5 { grid-template-columns: minmax(0, 1fr); } }
/* шесть карточек в ряд (Лутбоксы → Старт-боксы): тот же вид, что --5; на планшете 3 в ряд, ниже — правила --5 */
@media (min-width: 992px) { .gd-gcases.gd-gcases--5.gd-gcases--6 { grid-template-columns: repeat(6, minmax(0, 1fr)); } }
@media (min-width: 768px) and (max-width: 991.98px) { .gd-gcases.gd-gcases--5.gd-gcases--6 { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.gd-gi-part { margin-top: 8px; font-size: 12px; font-weight: 700; color: #ffd36b; text-align: left; }
.gd-gi-names { font-size: 12px; line-height: 1.45; color: #dfe6f1; text-align: left; }
.gd-gi-part--anc { margin-top: 10px; font-size: 15px; font-weight: 800; color: #4be37a; }
.gd-gi-names--anc { font-size: 13.5px; font-weight: 700; color: #7cf0a0; }
/* Gens: шкатулки за рейтинг — 4 в ряд на всю ширину */
.gd-gcases { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; margin: .6rem 0 1.2rem; align-items: start; }
@media (max-width: 991.98px) { .gd-gcases { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 480px) { .gd-gcases { grid-template-columns: minmax(0, 1fr); } }
/* три карточки в ряд (Лутбоксы → Exp Jar) */
@media (min-width: 768px) { .gd-gcases.gd-gcases--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
/* Серьги: пара картинок-кнопок в карточке, по наведению — подсказка с опциями (.mi-pop); мягкая пульсация подсказывает, что на них можно навести */
.gd-earpair { display: flex; justify-content: center; gap: 10px; }
.gd-ear { position: relative; padding: 6px 8px; border: 1px dashed rgba(255,211,107,.45); border-radius: 12px; background: radial-gradient(60% 60% at 50% 55%, rgba(255,211,107,.16), transparent 75%); cursor: help; animation: gd-ear-pulse 2.4s ease-in-out infinite; transition: transform .15s ease, border-color .15s ease; }
.gd-ear:nth-child(2) { animation-delay: 1.2s; }
.gd-ear img { height: 84px; width: auto; display: block; filter: drop-shadow(0 4px 8px rgba(0,0,0,.6)); }
.gd-ear__side { display: block; margin-top: 3px; font-size: 11px; font-weight: 700; color: #ffd36b; letter-spacing: .3px; }
.gd-ear:hover, .gd-ear:focus { transform: translateY(-2px) scale(1.04); border-style: solid; border-color: #ffd36b; outline: none; animation: none; box-shadow: 0 0 14px rgba(255,211,107,.45); }
@keyframes gd-ear-pulse { 0%, 100% { box-shadow: 0 0 0 rgba(255,211,107,0); } 50% { box-shadow: 0 0 12px rgba(255,211,107,.4); } }
@media (prefers-reduced-motion: reduce) { .gd-ear { animation: none; } }
/* Ряд карточек с центровкой неполной строки (7 карточек = 4 + 3): страница артефактов */
.gd-cardrow { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px; margin: .6rem 0 1.2rem; }
.gd-cardrow > .gd-gcase { flex: 0 0 calc(25% - 9px); min-width: 0; }
@media (max-width: 991.98px) { .gd-cardrow > .gd-gcase { flex-basis: calc(50% - 6px); } }
@media (max-width: 480px) { .gd-cardrow > .gd-gcase { flex-basis: 100%; } }
/* Материалы улучшения серёг: ряд компактных плашек «иконка + рецепт» */
.gd-upmats { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; margin: .6rem 0 1rem; }
.gd-upmat { display: flex; align-items: center; gap: 8px; flex: 0 0 calc(25% - 6px); min-width: 0; padding: 6px 10px; border-radius: 10px; background: rgba(0,0,0,.35); border: 1px solid rgba(224,169,46,.4); font-size: 13px; line-height: 1.35; }
@media (max-width: 991.98px) { .gd-upmat { flex-basis: calc(50% - 4px); } }
@media (max-width: 575.98px) { .gd-upmat { flex-basis: 100%; } }
.gd-upmat img { height: 46px; width: auto; flex: 0 0 auto; }
.gd-upmat b { color: #ffd36b; }
.gd-gcase { --gc: #c9a24a; display: flex; flex-direction: column; gap: 8px; padding: .9rem .85rem; border-radius: 14px; text-align: center; background: linear-gradient(180deg, color-mix(in srgb, var(--gc) 16%, rgba(0,0,0,.35)), rgba(0,0,0,.35) 65%); border: 1px solid color-mix(in srgb, var(--gc) 45%, transparent); }
/* Ancient: бирюзовый круг под вещью с бегущим бликом, как свечение Ancient-вещей в игре (types.php) */
.gd-ancglow { position: relative; display: inline-flex; justify-content: center; padding-bottom: 10px; }
.gd-ancglow img { position: relative; z-index: 1; }
.gd-ancglow::before { content: ""; position: absolute; left: 50%; bottom: 0; width: 104px; height: 104px; margin-left: -52px; margin-bottom: -40px; border-radius: 50%;
    background: conic-gradient(from 0deg, transparent 0 55%, rgba(64,224,200,.35) 75%, #6ff5df 92%, #e6fffb 96%, transparent 100%);
    -webkit-mask: radial-gradient(circle, transparent 56%, #000 59%, #000 69%, transparent 72%); mask: radial-gradient(circle, transparent 56%, #000 59%, #000 69%, transparent 72%);
    transform: scaleY(.3) rotate(0deg); animation: gd-ancglow 2.4s linear infinite; filter: drop-shadow(0 0 6px rgba(80,240,210,.8)); }
.gd-ancglow::after { content: ""; position: absolute; left: 50%; bottom: 0; width: 104px; height: 32px; margin-left: -52px; margin-bottom: -6px; border-radius: 50%;
    background: radial-gradient(ellipse at center, rgba(64,224,200,.28), transparent 70%); }
@keyframes gd-ancglow { to { transform: scaleY(.3) rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .gd-ancglow::before { animation: none; } }
.gd-gcase__pic { height: 120px; display: flex; align-items: center; justify-content: center; background: radial-gradient(45% 55% at 50% 55%, color-mix(in srgb, var(--gc) 32%, transparent), transparent 75%); }
.gd-gcase__pic img { max-height: 110px; max-width: 100%; object-fit: contain; }
.gd-gcase__name { font-weight: 800; color: #fff; font-size: 15px; line-height: 1.2; }
.gd-gcase__places { display: flex; justify-content: center; flex-wrap: wrap; gap: 6px; }
.gd-gcase__place { padding: 2px 9px; border-radius: 999px; font-size: 12.5px; color: #e8edf5; background: rgba(255,255,255,.06); border: 1px solid color-mix(in srgb, var(--gc) 40%, transparent); }
.gd-gcase__place b { color: var(--gc); }
.gd-gcase__ruud { font-size: 13px; color: #c9d1de; }
.gd-gcase__ruud img { width: 18px; height: 18px; vertical-align: -4px; }
.gd-gcase__more summary { cursor: pointer; list-style: none; padding: 6px 8px; border-radius: 8px; font-weight: 700; font-size: 13.5px; color: #9fd0ff; background: rgba(255,255,255,.04); border: 1px solid rgba(255,255,255,.08); }
.gd-gcase__more summary::-webkit-details-marker { display: none; }
.gd-gcase__more summary::after { content: " ▾"; }
.gd-gcase__more[open] summary::after { content: " ▴"; }
.gd-gcase__items { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px; margin-top: 8px; }
.gd-gcase__item { display: flex; flex-direction: column; align-items: center; gap: 4px; padding: 7px 4px; border-radius: 8px; background: rgba(0,0,0,.28); font-size: 12px; color: #dfe6f1; line-height: 1.2; }
.gd-gcase__item img { height: 36px; width: auto; max-width: 46px; object-fit: contain; }
.gd-gcase__chance { color: #e8c14a; font-weight: 700; font-size: 11px; }
.gd-wbox .mi-egg__stats { margin-top: 8px; }
.gd-wbox__opt { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-top: 8px; font-size: 13px; color: #c9d1de; }
.gd-wbox__opt em { color: #8d97a8; font-style: normal; }
.gd-wbox .gd-wv__none { padding: 16px 0; }.mi-eggs--wings .mi-egg, .mi-eggs--wings .mi-egg:hover { transform: none; }
.gd-mat { height: 22px; width: auto; max-width: 26px; object-fit: contain; vertical-align: middle; margin-right: 4px; }
/* Рецепты крыльев — крупнее и свободнее */
.gd-recipe > summary { font-size: 14.5px; padding: 6px 0; }
.gd-recipe__body { font-size: 15px; line-height: 1.55; padding: 10px 14px; color: #dfe6f1; }
.gd-recipe__title { font-size: 15px; color: #ffd36b; margin-bottom: 4px; }
.gd-recipe__body ul { padding-left: 1.2rem; }
.gd-recipe__body li { margin: 3px 0; }
.gd-recipe__step + .gd-recipe__step { margin-top: 10px; padding-top: 10px; }
.gd-recipe__note { font-size: 13.5px; color: #aab4c4; margin-top: 8px; }
.gd-recipe .gd-mat { height: 26px; max-width: 30px; }/* Рецепт крыльев: кнопка под карточкой, содержимое — в панели под рядом */
.gd-recipe-btn { display: block; width: 100%; margin-top: 6px; padding: 5px 0; border: 0; background: none; font-size: 14.5px; font-weight: 700; color: #9fc6f5; cursor: pointer; }
.gd-recipe-btn::after { content: " ▾"; }
.gd-recipe-btn.active { color: #ffd36b; }
.gd-recipe-btn.active::after { content: " ▴"; }
.gd-recipe-btn:hover { color: #fff; }
.gd-recipe-panel { margin: -4px 0 18px; padding: 12px 16px; border-radius: 12px; background: rgba(0,0,0,.35); border: 1px solid rgba(255,211,107,.35); font-size: 15px; line-height: 1.55; color: #dfe6f1; }
.gd-recipe-panel__head { font-weight: 800; font-size: 16px; color: #fff; margin-bottom: 8px; }
/* панель внутри сетки — на всю ширину, сразу под рядом с нажатой карточкой */
.gd-recipe-panel--row { grid-column: 1 / -1; margin: 0; }
.gd-recipe-panel .gd-recipe__steps { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(240px, 100%), 1fr)); gap: 12px; }
.gd-recipe-panel .gd-recipe__step { padding: 8px 12px; border-radius: 10px; background: rgba(255,255,255,.04); border: 1px solid rgba(255,255,255,.08); }
.gd-recipe-panel .gd-recipe__step + .gd-recipe__step { margin-top: 0; padding-top: 8px; border-top: 1px solid rgba(255,255,255,.08); }
.gd-recipe-panel .gd-recipe__title { font-size: 15px; color: #ffd36b; margin-bottom: 4px; }
.gd-recipe-panel ul { margin: 0; padding-left: 1.2rem; }
.gd-recipe-panel li { margin: 3px 0; }
.gd-recipe-panel .gd-recipe__note { font-size: 13.5px; color: #aab4c4; margin-top: 10px; }
.gd-recipe-panel .gd-mat { height: 26px; max-width: 30px; }
/* --- Гвардианы: карточка переворачивается (обычный ⇄ Rare) --- */
.gd-boxes--pets { grid-template-columns: repeat(auto-fill, minmax(min(260px, 100%), 1fr)); align-items: stretch; }
.gd-boxes--pets.gd-boxes--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
@media (max-width: 1100px) { .gd-boxes--pets.gd-boxes--4 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 560px) { .gd-boxes--pets.gd-boxes--4 { grid-template-columns: minmax(0, 1fr); } }
/* шесть компактных плиток в ряд (обзор «Лутбоксы») */
.gd-boxes--pets.gd-boxes--6 { grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 10px; }
.gd-boxes--pets.gd-boxes--6 .gd-gbox { padding: .55rem .6rem; }
.gd-boxes--pets.gd-boxes--6 .gd-gbox__pic { height: 92px; }
.gd-boxes--pets.gd-boxes--6 .gd-gbox__pic > img { max-height: 86px; }
.gd-boxes--pets.gd-boxes--6 .gd-box__name { font-size: .92rem; }
.gd-boxes--pets.gd-boxes--6 .gd-box__price { font-size: 11.5px; line-height: 1.35; }
@media (max-width: 1100px) { .gd-boxes--pets.gd-boxes--6 { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 760px) { .gd-boxes--pets.gd-boxes--6 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.gd-boxes--pets.gd-boxes--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
@media (max-width: 760px) { .gd-boxes--pets.gd-boxes--3 { grid-template-columns: minmax(0, 1fr); } }
/* NPC: карточки шире, картинка и текст по центру */
.gd-boxes--npc { grid-template-columns: repeat(auto-fit, minmax(min(240px, 100%), 290px)); justify-content: center; }
/* NPC — без рамки и фона, чтобы не путались с карточками питомцев */
.gd-boxes--npc .gd-gbox, .gd-boxes--npc .gd-gbox:hover { text-align: center; border: 0; background: none; box-shadow: none; padding: .4rem .6rem; }
.gd-boxes--npc .gd-gbox__pic { background: radial-gradient(45% 60% at 50% 60%, color-mix(in srgb, var(--gp-c) 18%, transparent), transparent 75%); }
.gd-boxes--npc .gd-box__price { margin-bottom: 2px; color: var(--gp-c); }
.gd-boxes--npc .gd-popbtn { color: #fff; }
/* имя NPC-ссылкой (Moss → страница лотереи) */
.gd-main a.gd-npc-link { color: inherit; text-decoration: underline dotted; text-underline-offset: 3px; }
.gd-main a.gd-npc-link:hover { color: #fff; text-decoration-style: solid; }
.gd-boxes--npc .gd-popbtn:hover, .gd-boxes--npc .gd-popbtn:focus { color: #ffd36b; }
.gd-boxes--npc .gd-gbox__pic { height: 110px; }
.gd-boxes--npc .gd-gbox__pic > img { max-height: 104px; }
/* карточки в ряду одной высоты (по самой длинной), кнопка рецепта — снизу */
.gd-boxes--pets > .gd-wcard { display: flex; flex-direction: column; }
.gd-boxes--pets > .gd-wcard > .gd-gbox { flex: 1 1 auto; }
/* одна карточка по центру (боссы в «Где фармить») */
.gd-boxes--single { grid-template-columns: minmax(min(260px, 100%), 320px); justify-content: center; }
/* две широкие карточки по центру (Профессии: шаги квеста) */
.gd-boxes--2 { grid-template-columns: repeat(auto-fit, minmax(min(300px, 100%), 400px)); justify-content: center; gap: 14px; }
/* две карты рядом (Uruk Mountain | Nars), на узком экране — друг под другом */
.gd-maps2 { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(320px, 100%), 1fr)); gap: 24px; align-items: start; }
.gd-gbox { position: relative; --gp-c: #3fa9d8; display: grid; grid-template-columns: minmax(0, 1fr); border-color: color-mix(in srgb, var(--gp-c) 45%, transparent); transition: transform .16s ease, border-color .2s ease, box-shadow .2s ease; }
/* обе стороны лежат в одной ячейке: высота карточки = высоте большей стороны, при перевороте ничего не прыгает */
.gd-gbox > .gd-wv { display: block; grid-area: 1 / 1; visibility: hidden; }
.gd-gbox > .gd-wv.on { visibility: visible; }
.gd-gbox[data-flip] { cursor: pointer; }
.gd-gbox.is-rare { --gp-c: #c07be8; box-shadow: 0 0 16px -5px var(--gp-c); }
.gd-gbox.gd-flip-out { transform: perspective(700px) rotateY(90deg); }
.gd-gbox__pic { position: relative; display: flex; align-items: center; justify-content: center; height: 130px; margin: 2px 0 4px; border-radius: 10px;
  background: radial-gradient(60% 70% at 50% 45%, color-mix(in srgb, var(--gp-c) 22%, transparent), transparent 75%); }
.gd-gbox__pic > img { max-height: 124px; max-width: 100%; object-fit: contain; filter: drop-shadow(0 6px 12px rgba(0,0,0,.6)); }
.gd-gbox__pic--duo { gap: 6px; }
.gd-gbox__pic--duo > img { max-width: 47%; min-width: 0; }
/* иконка предмета из инвентаря — перед названием питомца */
.gd-gbox__item { height: 26px; width: auto; max-width: 30px; object-fit: contain; vertical-align: middle; margin-right: 6px; filter: drop-shadow(0 2px 4px rgba(0,0,0,.6)); }
.gd-gbox__flip { position: absolute; top: 8px; right: 8px; z-index: 1; padding: 1px 9px; border-radius: 999px; font-size: 11.5px; font-weight: 800;
  color: #fff; background: rgba(0,0,0,.5); border: 1px solid var(--gp-c); }
.gd-gbox__flip:hover { background: var(--gp-c); }
.gd-gbox .gd-box__name { color: var(--gp-c); font-size: 1.05rem; }
.gd-gbox.is-rare .gd-box__name::after { content: "Rare"; margin-left: 6px; padding: 0 7px; border-radius: 9px; font-size: 11px; vertical-align: 2px; color: #fff; background: var(--gp-c); }
/* Особая опция на +15 — главное в карточке */
.gd-gspec { margin-top: 4px; padding: 8px 10px; border-radius: 10px; border: 1px solid color-mix(in srgb, var(--gp-c) 70%, transparent);
  background: linear-gradient(135deg, color-mix(in srgb, var(--gp-c) 26%, transparent), rgba(0,0,0,.35) 70%);
  box-shadow: 0 0 14px -6px var(--gp-c), inset 0 1px 0 rgba(255,255,255,.08); }
.gd-gspec__label { display: flex; align-items: center; justify-content: space-between; gap: 6px; font-size: 11px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; color: #d9e4f2; }
.gd-gspec__lvl { padding: 0 8px; border-radius: 9px; color: #1b1b1b; background: #ffd36b; letter-spacing: 0; }
.gd-gspec__val { margin-top: 3px; font-size: 1.02rem; font-weight: 800; color: #fff; text-shadow: 0 0 10px color-mix(in srgb, var(--gp-c) 80%, transparent); }
.gd-gbox__foot { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-top: 4px; font-size: 12.5px; color: #8d97a8; }
.gd-noopt { display: inline-flex; align-items: center; font-weight: 700; color: #7d8696; line-height: 22px; }
.gd-wcard:has(.gd-wv--none.on) { display: none; }
.gd-wcore { display: flex; align-items: center; gap: 8px; margin-top: 8px; padding: 6px 8px; border-radius: 10px; background: rgba(127,178,255,.07); border: 1px solid rgba(127,178,255,.18); font-size: 13px; color: #dfe6f1; text-align: left; }
.gd-wcore img { width: 36px; height: 36px; object-fit: contain; flex: none; }
.gd-wcore small { display: block; font-size: 11px; color: #8d97a8; }
.gd-wcore { flex-direction: column; align-items: stretch; gap: 4px; }
.gd-wcore__row { display: flex; align-items: center; gap: 8px; }