/* Games Hub — HotelsCasa v2.0 (AliExpress-style, mobile-first)
   Белый фон, компактные 3D-плитки, сайдбар партнёров, 3D-новости */

/* Самодостаточная светлая панель — выглядит правильно и на тёмных
   страницах темы (фон страницы может быть чёрным) */
.ghub2 {
    max-width: 1080px; margin: 0 auto; padding: 10px 8px 16px;
    background: #f6f4ee;
    border-radius: 18px;
    font-family: 'Poppins', 'Segoe UI', system-ui, sans-serif;
    color: #222;
}
.ghub2 * { box-sizing: border-box; }

/* ═══════════ ПОЛКА НАГРАД (trophy shelf, coin shelf, safe) ═══════════ */
.ghub2-shelf {
    background: #fff;
    border: 1px solid #efe9dc;
    border-radius: 16px;
    padding: 10px 10px 8px;
    margin-bottom: 10px;
    box-shadow: 0 2px 12px rgba(0,0,0,.06);
    overflow: hidden;
}

/* Секция полки: кубки или монеты */
.ghub2-shelf-section {
    margin-bottom: 4px;
}
.ghub2-shelf-head {
    font-size: 11px; font-weight: 700; color: #8a8470;
    text-transform: uppercase; letter-spacing: .5px;
    margin-bottom: 6px; padding: 0 2px;
}
.ghub2-shelf-items {
    display: flex; align-items: flex-end; gap: 6px;
    overflow-x: auto; -webkit-overflow-scrolling: touch;
    scrollbar-width: none; padding-bottom: 6px; min-height: 62px;
}
.ghub2-shelf-items::-webkit-scrollbar { display: none; }

/* Деревянная полочка */
.ghub2-plank {
    height: 6px; border-radius: 4px;
    background: linear-gradient(180deg, #c8a96e 0%, #a07840 60%, #7a5c28 100%);
    box-shadow: 0 3px 6px rgba(100,60,10,.3);
    margin: 0 -2px 8px;
}

/* Кубки */
.ghub2-cup {
    display: flex; flex-direction: column; align-items: center; gap: 2px;
    flex-shrink: 0;
}
.ghub2-cup-img {
    width: 42px; height: 54px;
    object-fit: contain;
    filter: drop-shadow(0 3px 6px rgba(0,0,0,.3));
    animation: ghubCupShine 4s ease-in-out infinite;
}
.ghub2-cup--next .ghub2-cup-img {
    filter: grayscale(.75) opacity(.45);
    animation: none;
}
.ghub2-cup--legend {
    font-size: 28px; line-height: 54px;
    filter: drop-shadow(0 2px 8px rgba(247,201,72,.9));
    animation: ghubCupShine 2s ease-in-out infinite;
}
.ghub2-cup-lbl {
    font-size: 9px; font-weight: 700; color: #8a6510; text-align: center; max-width: 46px;
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.ghub2-cup-prog { color: #aaa; }
.ghub2-cups-empty {
    font-size: 11px; color: #bbb; padding: 10px 4px; white-space: nowrap;
}
@keyframes ghubCupShine {
    0%, 65%, 100% { filter: drop-shadow(0 3px 6px rgba(0,0,0,.3)); }
    35% { filter: drop-shadow(0 3px 16px rgba(247,201,72,.9)) brightness(1.08); }
}

/* ──── 3D Монетка (CSS perspective flip) ──── */
.ghub2-shelf-items--coins { align-items: center; min-height: 50px; }
.ghub2-coins-empty { font-size: 11px; color: #bbb; padding: 8px 4px; white-space: nowrap; }

.ghub2-coin-wrap {
    flex-shrink: 0;
    perspective: 260px;
    display: inline-block;
    --ci: 0; /* coin index for staggered delay */
}
.ghub2-coin-inner {
    width: 38px; height: 38px;
    position: relative;
    transform-style: preserve-3d;
    animation: ghubCoinFlip 3.2s linear infinite;
    /* stagger: each coin slightly offset — set via --ci */
    animation-delay: calc(var(--ci) * -0.31s);
}
.ghub2-coin-wrap--hero .ghub2-coin-inner {
    width: 72px; height: 72px;
    animation-duration: 2.4s;
}
.ghub2-coin-face {
    position: absolute; top:0; left:0;
    width: 100%; height: 100%;
    border-radius: 50%;
    object-fit: cover;
    backface-visibility: hidden;
}
.ghub2-coin-back { transform: rotateY(180deg); }
@keyframes ghubCoinFlip {
    from { transform: rotateY(0deg); }
    to   { transform: rotateY(360deg); }
}

/* Средняя полоса: монеты + сейф рядом */
.ghub2-shelf-middle {
    display: flex; gap: 10px; align-items: flex-start;
}
.ghub2-shelf-section--coins { flex: 1 1 auto; min-width: 0; overflow: hidden; }

/* ──── Сейф SVG ──── */
.ghub2-safe-wrap {
    flex-shrink: 0; display: flex; flex-direction: column; align-items: center;
    gap: 2px; padding-bottom: 4px;
}
.ghub2-safe-svg {
    width: 90px; height: auto; display: block; overflow: visible;
}
.ghub2-safe-eur {
    font-size: 18px; font-weight: 800;
    background: linear-gradient(135deg, #b8860b, #f7c948, #b8860b);
    -webkit-background-clip: text; -webkit-text-fill-color: transparent;
    background-clip: text; line-height: 1;
}
.ghub2-safe-label { font-size: 9px; color: #aaa; text-transform: uppercase; letter-spacing: .4px; }

/* Анимации сейфа */
.ghub-safe-door {
    transform-box: fill-box; transform-origin: left center;
    animation: ghubSafeDoor 6s ease-in-out infinite;
}
.ghub-safe-coins {
    opacity: 0; transform-box: fill-box; transform-origin: center;
    animation: ghubSafeCoins 6s ease-in-out infinite;
}
@keyframes ghubSafeDoor {
    0%,18%  { transform: perspective(500px) rotateY(0deg); }
    32%,58% { transform: perspective(500px) rotateY(-62deg); }
    72%,100%{ transform: perspective(500px) rotateY(0deg); }
}
@keyframes ghubSafeCoins {
    0%,20%  { opacity:0; transform:scale(.92); }
    32%,58% { opacity:1; transform:scale(1); }
    75%,100%{ opacity:0; transform:scale(.92); }
}

/* ──── Гостевой блок ──── */
.ghub2-shelf--guest {
    display: flex; align-items: center; gap: 12px; flex-wrap: wrap;
    padding: 12px;
}
.ghub2-guest-coin-link {
    display: block; flex-shrink: 0;
    filter: drop-shadow(0 4px 12px rgba(247,201,72,.6));
    transition: transform .18s ease;
    -webkit-tap-highlight-color: transparent;
}
.ghub2-guest-coin-link:active { transform: scale(.92); }
.ghub2-guest-body { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; gap: 5px; }
.ghub2-guest-title {
    font-size: 14px; font-weight: 800; color: #3f3f28; line-height: 1.2;
}
.ghub2-guest-sub { font-size: 11px; color: #888; }
.ghub2-guest-session { flex-shrink: 0; }

/* ═══════════ Блок наград под header (СТАРЫЙ — оставить для совместимости) ═══════════ */
.ghub2-rewards {
    background: #fff;
    border: 1px solid #efe9dc;
    border-radius: 14px;
    padding: 8px 10px;
    margin-bottom: 10px;
    box-shadow: 0 2px 10px rgba(0,0,0,.05);
}
.ghub2-rw-chips {
    display: flex; gap: 6px; align-items: center;
    overflow-x: auto; -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
}
.ghub2-rw-chips::-webkit-scrollbar { display: none; }
.ghub2-rw-chip {
    flex-shrink: 0;
    display: inline-flex; align-items: center; gap: 4px;
    background: #f6f4ee; border: 1px solid #e8e2d6;
    border-radius: 20px; padding: 5px 10px;
    font-size: 11.5px; font-weight: 700; color: #4a4a3d;
    white-space: nowrap;
}
.ghub2-rw-chip--gold {
    background: linear-gradient(135deg, #fff3d6, #ffe5ad);
    border-color: #ecd9a8; color: #8a6510;
}
.ghub2-rw-chip--btn {
    cursor: pointer;
    background: linear-gradient(135deg, #3d3d3d, #101010);
    border-color: #101010; color: #fff;
    -webkit-tap-highlight-color: transparent; touch-action: manipulation;
}
.ghub2-rw-chip--btn:active { transform: scale(.95); }

/* Гость: призыв + переливающаяся кнопка */
.ghub2-rewards--guest {
    display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
}
.ghub2-rw-guest-text { font-size: 13px; font-weight: 800; color: #3f3f28; }
.ghub2-rw-register {
    display: inline-block;
    background: linear-gradient(110deg, #e8920a 20%, #ffd97a 40%, #e8920a 60%);
    background-size: 200% 100%;
    animation: ghub2Shimmer 2.2s linear infinite;
    color: #fff !important; text-decoration: none;
    font-size: 12.5px; font-weight: 800;
    border-radius: 24px; padding: 8px 16px;
    box-shadow: 0 3px 10px rgba(232,146,10,.4);
    -webkit-tap-highlight-color: transparent;
}
.ghub2-rw-register:active { transform: scale(.96); }
@keyframes ghub2Shimmer {
    from { background-position: 200% 0; }
    to   { background-position: -200% 0; }
}

/* Мини-форма выплат */
.ghub2-payout {
    margin-top: 8px; padding-top: 8px; border-top: 1px dashed #e8e2d6;
    display: flex; flex-direction: column; gap: 6px;
}
.ghub2-payout-status { font-size: 11.5px; color: #8a8470; }
.ghub2-payout input {
    border: 1px solid #e0d7bd; border-radius: 9px;
    padding: 8px 10px; font-size: 12.5px; background: #fffdf8; color: #333;
}
.ghub2-payout input:focus { outline: none; border-color: #d8a93c; }
.ghub2-payout-btns { display: flex; gap: 8px; }
.ghub2-payout-btns button {
    border: none; border-radius: 20px; padding: 8px 14px;
    font-size: 12px; font-weight: 700; cursor: pointer;
    -webkit-tap-highlight-color: transparent; touch-action: manipulation;
}
#ghub2-payout-save { background: #f0ead9; color: #6b531e; }
.ghub2-payout-request {
    background: linear-gradient(135deg, #1f9e54, #157a3e); color: #fff;
}
.ghub2-payout-msg { font-size: 11.5px; min-height: 14px; }

/* ═══════════ Новостное 3D-окно ═══════════ */
.ghub2-news {
    display: flex; align-items: center; gap: 8px;
    background: #fff;
    border: 1px solid #efe9dc;
    border-radius: 14px;
    padding: 8px 10px;
    margin-bottom: 12px;
    box-shadow: 0 2px 10px rgba(0,0,0,.05);
}
.ghub2-news-tag {
    flex-shrink: 0;
    background: linear-gradient(135deg, #ff7a3d, #ff4d4d);
    color: #fff; font-size: 10.5px; font-weight: 700;
    border-radius: 20px; padding: 5px 10px; white-space: nowrap;
}
.ghub2-news-tag i { margin-right: 3px; }

.ghub2-news-stage {
    flex: 1; min-width: 0;
    perspective: 700px;            /* глубина для 3D-листа */
    height: 52px; overflow: hidden;
}
.ghub2-news-flip {
    display: flex; align-items: center; gap: 9px;
    height: 100%;
    text-decoration: none;
    transform-origin: 50% 0;       /* ось — верхняя кромка: лист идёт сверху вниз */
    transition: transform .45s ease, opacity .45s ease;
    backface-visibility: hidden;
}
.ghub2-flip-out { transform: rotateX(-88deg); opacity: 0; }
.ghub2-flip-in  { transform: rotateX(88deg);  opacity: 0; transition: none; }

.ghub2-news-thumb {
    width: 40px; height: 40px; border-radius: 9px;
    object-fit: cover; flex-shrink: 0;
}
.ghub2-news-thumb--ico {
    display: flex; align-items: center; justify-content: center;
    background: #fff4e3; color: #d8862a; font-size: 16px;
}
.ghub2-news-body { min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.ghub2-news-title {
    font-size: 13px; font-weight: 700; color: #222; line-height: 1.25;
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.ghub2-news-meta {
    font-size: 11px; color: #999;
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.ghub2-news-count {
    flex-shrink: 0; font-size: 10.5px; color: #bbb; min-width: 30px; text-align: right;
}

/* ═══════════ Основная зона: игры + сайдбар ═══════════ */
.ghub2-main {
    display: flex; gap: 10px; align-items: flex-start;
    flex-wrap: nowrap;
}

.ghub2-games { flex: 1 1 auto; min-width: 0; overflow: hidden; }
.ghub2-games-head {
    display: flex; align-items: center; justify-content: space-between;
    margin: 2px 2px 10px;
}
.ghub2-games-title {
    font-size: 16px; font-weight: 800; color: #222;
}
.ghub2-prize {
    font-size: 11px; font-weight: 700; color: #b06a00;
    background: linear-gradient(135deg, #fff3d6, #ffe5ad);
    border-radius: 20px; padding: 4px 10px;
}
.ghub2-prize i { color: #e8a200; }

/* Ряды по 4 плитки; появляются при прокрутке */
.ghub2-row {
    display: grid; grid-template-columns: repeat(4, 1fr);
    gap: 8px; margin-bottom: 8px;
    opacity: 0; transform: translateY(16px);
    transition: opacity .45s ease, transform .45s ease;
}
.ghub2-row.is-in { opacity: 1; transform: none; }

/* ─── 3D-плитка игры (компактная, как иконки AliExpress) ─── */
.ghub2-tile {
    display: flex; flex-direction: column; align-items: center; gap: 4px;
    background: transparent; border: none; border-radius: 12px;
    padding: 4px 2px;
    cursor: pointer;
    -webkit-tap-highlight-color: transparent; touch-action: manipulation;
    transition: transform .12s ease;
    min-width: 0; max-width: 100%;
}
.ghub2-tile:active { transform: scale(.9); }
.ghub2-tile--empty { visibility: hidden; pointer-events: none; }

.ghub2-tile-ico {
    width: 38px; height: 38px; border-radius: 11px;
    display: flex; align-items: center; justify-content: center;
    color: #fff; font-size: 16px;
    /* База: ЧЁРНАЯ кнопка с белой иконкой — любой grad без своего
       стиля видим (раньше g5+ были белым по белому) */
    background: linear-gradient(160deg, #3d3d3d, #101010);
    /* 3D: блик сверху + тень снизу */
    box-shadow:
        inset 0 2px 3px rgba(255,255,255,.45),
        inset 0 -3px 5px rgba(0,0,0,.22),
        0 3px 6px rgba(0,0,0,.16);
}
.ghub2-tile--g1 .ghub2-tile-ico { background: linear-gradient(160deg, #ffc24d, #e8920a); }
.ghub2-tile--g2 .ghub2-tile-ico { background: linear-gradient(160deg, #5fdb8a, #1f9e54); }
.ghub2-tile--g3 .ghub2-tile-ico { background: linear-gradient(160deg, #6ea8ff, #2f63d8); }
.ghub2-tile--g4 .ghub2-tile-ico { background: linear-gradient(160deg, #ff8a70, #e04a2f); }

.ghub2-tile-label {
    font-size: 10.5px; font-weight: 600; color: #333; line-height: 1.1;
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%;
}

/* ═══════════ Сайдбар партнёров (справа) ═══════════ */
.ghub2-side {
    flex: 0 0 104px; width: 104px; max-width: 32%;
    display: flex; flex-direction: column; gap: 8px;
}
.ghub2-side-head {
    display: flex; flex-direction: column; gap: 3px;
    font-size: 12px; font-weight: 800; color: #222; padding: 0 2px;
}
.ghub2-side-head--2 { margin-top: 18px; border-top: 1px solid #ece6d8; padding-top: 14px; }

/* Overlay a pantalla completa para juegos inline (forest/ops/submarine/shooter/fps) */
.ghub2-inline-overlay { position: fixed; inset: 0; z-index: 2147483000; background: #0a0a12; overflow: auto; -webkit-overflow-scrolling: touch; }
.ghub2-inline-overlay[hidden] { display: none; }
.ghub2-inline-host { min-height: 100%; display: block; }
.ghub2-inline-host .ghub2-launcher { position: static !important; left: auto !important; top: auto !important; width: 100%; max-width: 1040px; margin: 0 auto; display: block; }
.ghub2-inline-close { position: fixed; top: 12px; right: 14px; z-index: 2147483001; width: 44px; height: 44px; border-radius: 50%; border: none; background: rgba(0,0,0,.65); color: #fff; font-size: 20px; line-height: 1; cursor: pointer; box-shadow: 0 2px 10px rgba(0,0,0,.4); }
.ghub2-inline-close:hover { background: rgba(0,0,0,.85); }
.ghub2-pub-badge {
    align-self: flex-start;
    font-size: 8.5px; font-weight: 700; letter-spacing: .6px; text-transform: uppercase;
    color: #b3a888; border: 1px solid #e0d7bd; border-radius: 16px; padding: 1px 7px;
}
.ghub2-side-empty {
    display: flex; flex-direction: column; align-items: center; gap: 6px;
    background: #fbf9f3; border: 1px dashed #e0d7bd; border-radius: 12px;
    padding: 16px 6px; color: #b3a888; font-size: 10.5px; text-align: center;
    opacity: 0; transform: translateY(16px);
    transition: opacity .45s ease, transform .45s ease;
}
.ghub2-side-empty.is-in { opacity: 1; transform: none; }
.ghub2-side-empty i { font-size: 18px; }

/* ─── Карточки рекламы ─── */
.ghub2-ad {
    text-decoration: none;
    background: #fff; border: 1px solid #f0ece2; border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 2px 8px rgba(0,0,0,.06);
    opacity: 0; transform: translateY(16px);
    transition: opacity .45s ease, transform .45s ease, box-shadow .15s ease;
}
.ghub2-ad.is-in { opacity: 1; transform: none; }
.ghub2-ad:active { box-shadow: 0 1px 4px rgba(0,0,0,.1); }

/* мини (sidebar): картинка сверху, текст снизу */
.ghub2-ad--mini { display: flex; flex-direction: column; }
.ghub2-ad--mini .ghub2-ad-img {
    width: 100%; height: 76px; object-fit: cover; display: block;
}
.ghub2-ad--mini .ghub2-ad-img--ph {
    display: flex; align-items: center; justify-content: center;
    background: #fff4e3; color: #d8862a; font-size: 22px;
}
.ghub2-ad--mini .ghub2-ad-body { padding: 7px 8px 9px; display: flex; flex-direction: column; gap: 3px; }
.ghub2-ad--mini .ghub2-ad-title {
    font-size: 11px; font-weight: 700; color: #222; line-height: 1.25;
    display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.ghub2-ad--mini .ghub2-ad-desc { display: none; }
.ghub2-ad--mini .ghub2-ad-promo {
    font-size: 9.5px; font-weight: 700; color: #c25700;
    background: #fff0e3; border-radius: 6px; padding: 2px 6px; align-self: flex-start;
}

/* широкая (footer): картинка слева, текст справа */
.ghub2-ad--wide { display: flex; align-items: stretch; }
.ghub2-ad--wide .ghub2-ad-img {
    width: 92px; min-height: 80px; object-fit: cover; flex-shrink: 0;
}
.ghub2-ad--wide .ghub2-ad-img--ph {
    display: flex; align-items: center; justify-content: center;
    background: #fff4e3; color: #d8862a; font-size: 24px;
}
.ghub2-ad--wide .ghub2-ad-body {
    padding: 10px 12px; display: flex; flex-direction: column; gap: 4px; min-width: 0;
}
.ghub2-ad--wide .ghub2-ad-title { font-size: 13px; font-weight: 700; color: #222; }
.ghub2-ad--wide .ghub2-ad-desc {
    font-size: 11.5px; color: #888; line-height: 1.4;
    display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.ghub2-ad--wide .ghub2-ad-promo {
    font-size: 10.5px; font-weight: 700; color: #c25700;
    background: #fff0e3; border-radius: 6px; padding: 2px 8px; align-self: flex-start;
}

/* ═══════════ Рекламное окно перед Footer ═══════════ */
.ghub2-footer-ads {
    margin-top: 18px;
    background: #fff; border: 1px solid #efe9dc; border-radius: 14px;
    padding: 12px;
    box-shadow: 0 2px 10px rgba(0,0,0,.05);
}
.ghub2-footer-ads-head {
    display: flex; align-items: center; justify-content: space-between;
    font-size: 14px; font-weight: 800; color: #222; margin-bottom: 10px;
}
.ghub2-footer-ads-grid {
    display: grid; grid-template-columns: 1fr 1fr; gap: 10px;
}
/* Banner HTML / embed (código completo): ocupa TODO el ancho, sin marco de
   tarjeta y siempre visible. En el footer abarca las dos columnas. */
.ghub2-ad--raw {
    display: block; width: 100%;
    background: none; border: 0; box-shadow: none;
    opacity: 1; transform: none; overflow: visible;
}
.ghub2-ad--raw img { display: block; width: 100%; height: auto; border-radius: 12px; }
/* El píxel de seguimiento 1×1 (CJ/afiliado) NO debe agrandarse: se mantiene
   oculto. Si no, la URL «image-…» devuelve un creativo y aparece un 2º banner. */
.ghub2-ad--raw img[width="1"],
.ghub2-ad--raw img[height="1"] {
    position: absolute !important; left: -9999px !important;
    width: 1px !important; height: 1px !important;
    border-radius: 0 !important; opacity: 0 !important; pointer-events: none !important;
}
.ghub2-footer-ads-grid .ghub2-ad--raw { grid-column: 1 / -1; }
.ghub2-footer-empty {
    display: flex; align-items: center; justify-content: center; gap: 8px;
    background: #fbf9f3; border: 1px dashed #e0d7bd; border-radius: 12px;
    padding: 18px 10px; color: #b3a888; font-size: 12px;
}
.ghub2-footer-empty i { font-size: 16px; }

/* ═══════════ Скрытые лаунчеры игр ═══════════
   НЕ display:none: внутри живут модалки position:fixed — они должны
   открываться. Уносим за экран; fixed-элементы не клиппятся ancestor'ом */
.ghub2-launchers {
    position: absolute; left: -9999px; top: 0;
    width: 1px; height: 1px; overflow: hidden;
}

/* ═══════════ Десктоп ═══════════ */
@media (min-width: 720px) {
    .ghub2 { padding: 10px 12px 28px; }
    .ghub2-main { gap: 16px; }
    .ghub2-side { flex-basis: 200px; width: 200px; max-width: 200px; }
    .ghub2-ad--mini .ghub2-ad-img { height: 104px; }
    .ghub2-tile { padding: 8px 4px; }
    .ghub2-tile-ico { width: 48px; height: 48px; font-size: 20px; border-radius: 14px; }
    .ghub2-tile-label { font-size: 12px; }
    .ghub2-news-stage { height: 58px; }
    .ghub2-news-title { font-size: 14.5px; }
    .ghub2-footer-ads-grid { grid-template-columns: repeat(4, 1fr); }
    .ghub2-ad--wide { flex-direction: column; }
    .ghub2-ad--wide .ghub2-ad-img { width: 100%; height: 96px; }
}
@media (max-width: 719px) {
    .ghub2-footer-ads-grid { grid-template-columns: 1fr; }

    /* ── Полка наград: мобильные правки ── */

    /* Кубки: меньше прозрачность у «следующего», читаемее текст */
    .ghub2-cup--next .ghub2-cup-img {
        filter: grayscale(.5) opacity(.65);
    }
    .ghub2-cup-lbl { font-size: 10px; }
    .ghub2-cups-empty { font-size: 12px; white-space: normal; }

    /* Средний ряд (монеты + сейф): на узких экранах складываем вертикально */
    .ghub2-shelf-middle {
        flex-direction: column;
        gap: 4px;
    }
    .ghub2-shelf-section--coins { overflow: visible; }

    /* Сейф: уже на мобиле */
    .ghub2-safe-svg { width: 72px; }
    .ghub2-safe-eur { font-size: 15px; }

    /* Ensure shelf section never collapses */
    .ghub2-shelf-section { min-height: 80px; display: block; }
    .ghub2-shelf-items { min-height: 68px !important; }
}

/* ═══════════ MODAL: ¿Cómo ganar? ═══════════ */
.ghub2-howto-overlay {
    position: fixed; inset: 0; z-index: 999990;
    background: rgba(0,0,0,.55);
    display: flex; align-items: center; justify-content: center;
    padding: 16px;
    overscroll-behavior: contain;
}
.ghub2-howto-modal {
    background: #fff;
    border-radius: 20px;
    max-width: 520px; width: 100%;
    max-height: 92dvh; overflow-y: auto;
    position: relative;
    box-shadow: 0 20px 60px rgba(0,0,0,.3);
    overscroll-behavior: contain;
}
.ghub2-howto-close {
    position: absolute; top: 12px; right: 14px;
    background: none; border: none;
    font-size: 20px; cursor: pointer; color: #888;
    line-height: 1; padding: 4px 8px; border-radius: 50%;
}
.ghub2-howto-close:hover { background: #f0ece4; color: #333; }

.ghub2-howto-header {
    background: linear-gradient(135deg, #1a1c18 0%, #2b2b1c 100%);
    color: #f6f4ee;
    padding: 28px 28px 22px;
    border-radius: 20px 20px 0 0;
    text-align: center;
}
.ghub2-howto-icon { font-size: 44px; display: block; margin-bottom: 10px; }
.ghub2-howto-header h2 { margin: 0 0 8px; font-size: 20px; color: #e8c87a; }
.ghub2-howto-header p { margin: 0; font-size: 14px; color: #c8c0aa; line-height: 1.5; }

.ghub2-howto-body {
    padding: 22px 24px 28px;
}
.ghub2-howto-row {
    display: flex; gap: 14px; align-items: flex-start;
    margin-bottom: 18px;
    padding-bottom: 18px;
    border-bottom: 1px solid #f0ece4;
}
.ghub2-howto-row:last-of-type { border-bottom: none; margin-bottom: 0; padding-bottom: 0; }
.ghub2-howto-ico {
    font-size: 28px; min-width: 36px; text-align: center;
    flex-shrink: 0; margin-top: 2px;
}
.ghub2-howto-row div strong { display: block; font-size: 14px; color: #1a1a1a; margin-bottom: 4px; }
.ghub2-howto-row div p { margin: 0; font-size: 13px; color: #555; line-height: 1.5; }

.ghub2-howto-coins {
    margin-top: 20px;
    background: linear-gradient(135deg, #1f9e54 0%, #186e3c 100%);
    border-radius: 14px;
    padding: 18px 20px;
    text-align: center;
    color: #fff;
}
.ghub2-howto-coins-eq { display: block; font-size: 18px; margin-bottom: 8px; }
.ghub2-howto-coins p { margin: 0; font-size: 13px; opacity: .9; line-height: 1.5; }

/* ═══════════ [lc_news_promo] — фронтенд /news-promo/ ═══════════ */
.lc-news-promo-title {
    max-width: 1080px;
    margin: 24px auto 0;
    padding: 0 8px;
    font-size: 20px;
    font-weight: 700;
}
.lc-news-promo-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
    padding: 32px 0;
    max-width: 1080px;
    margin: 0 auto;
}
.lc-np-card {
    background: #1c1c1e;
    border: 1px solid rgba(226,196,142,.18);
    border-radius: 16px;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    transition: transform .2s ease, box-shadow .2s ease;
}
.lc-np-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 16px 40px rgba(0,0,0,.45);
}
.lc-np-img-wrap {
    aspect-ratio: 16/9;
    overflow: hidden;
}
.lc-np-img {
    width: 100%; height: 100%;
    object-fit: cover;
    display: block;
    transition: transform .3s ease;
}
.lc-np-card:hover .lc-np-img { transform: scale(1.04); }
.lc-np-body {
    padding: 20px;
    display: flex;
    flex-direction: column;
    flex: 1;
    gap: 10px;
}
.lc-np-title {
    margin: 0;
    font-size: 18px;
    font-weight: 700;
    color: #E2C48E;
    line-height: 1.3;
}
.lc-np-text {
    margin: 0;
    font-size: 14px;
    color: #ccc;
    line-height: 1.65;
    flex: 1;
}
.lc-np-btn {
    display: inline-block;
    align-self: flex-start;
    margin-top: 6px;
    background: #E2C48E;
    color: #1a1a1a;
    padding: 10px 26px;
    border-radius: 9px;
    font-size: 14px;
    font-weight: 700;
    text-decoration: none;
    transition: background .2s;
}
.lc-np-btn:hover { background: #c9a86e; color: #000; text-decoration: none; }

@media (max-width: 900px) {
    .lc-news-promo-grid { grid-template-columns: 1fr 1fr; gap: 16px; padding: 20px 0; }
}
@media (max-width: 600px) {
    .lc-news-promo-grid { grid-template-columns: 1fr; gap: 12px; padding: 12px 8px; }
}

/* ═══ [lc_news_promo] — TIRA en una línea, se desliza con el dedo (scroll manual) ═══ */
.lc-news-promo-scroll {
    max-width: 1080px;
    margin: 12px auto;
    display: flex;
    gap: 16px;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scroll-snap-type: x mandatory;
    scrollbar-width: thin;
    scrollbar-color: rgba(226,196,142,.4) transparent;
    padding: 4px 8px 10px;
}
.lc-news-promo-scroll::-webkit-scrollbar { height: 5px; }
.lc-news-promo-scroll::-webkit-scrollbar-thumb { background: rgba(226,196,142,.4); border-radius: 3px; }
.lc-news-promo-scroll .lc-np-card {
    flex: 0 0 260px;
    width: 260px;
    scroll-snap-align: start;
}
/* En móvil las tarjetas son más estrechas → se ven varias y se deslizan con el dedo */
@media (max-width: 600px) {
    .lc-news-promo-scroll { gap: 10px; }
    .lc-news-promo-scroll .lc-np-card { flex: 0 0 200px; width: 200px; border-radius: 12px; }
    .lc-news-promo-scroll .lc-np-body { padding: 10px; gap: 6px; }
    .lc-news-promo-scroll .lc-np-title { font-size: 13px; line-height: 1.25; }
    .lc-news-promo-scroll .lc-np-text {
        font-size: 11.5px; line-height: 1.45;
        display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden;
    }
    .lc-news-promo-scroll .lc-np-btn { padding: 7px 14px; font-size: 12px; border-radius: 8px; align-self: stretch; text-align: center; }
    .lc-news-promo-title { font-size: 15px; padding: 0 8px; }
}

/* ═══════════ Admin — Banners Promo editor ═══════════ */
.lcb-promo-slots {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 16px;
    margin-bottom: 0;
}
.lcb-promo-card {
    background: #f8f9fa;
    border: 1px solid #dde1e7;
    border-radius: 12px;
    padding: 16px;
    display: flex;
    flex-direction: column;
    gap: 0;
}
.lcb-promo-num {
    font-size: 13px;
    font-weight: 700;
    color: #0073aa;
    margin-bottom: 14px;
    padding-bottom: 10px;
    border-bottom: 1px solid #e0e4ea;
}
.lcb-promo-img-field { margin-bottom: 12px; }
.lcb-char-limit {
    font-weight: 400;
    color: #aaa;
    font-size: 10px;
    margin-left: 6px;
    letter-spacing: .01em;
}
.lcb-char-count { font-weight: 700; color: #1d2327; }
@media (max-width: 900px) { .lcb-promo-slots { grid-template-columns: 1fr; } }