/* menacasino.com — хабы главной (этап 08b). Палитра и радиусы скина /preview/style.css */
.mna-more{margin:10px 0 26px;font-size:.88rem;font-weight:700}
.mna-more a{color:var(--gold);text-decoration:none}
.mna-more a:hover{color:var(--gold-light)}
.mna-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
[class^="mna-"] img{max-width:100%}

/* 1. игры — фото-мозаика */
.mna-gm{display:grid;grid-template-columns:repeat(5,1fr);grid-auto-rows:150px;gap:10px;margin:22px 0 4px}
.mna-gm-c{position:relative;display:flex;flex-direction:column;justify-content:flex-end;padding:10px 12px;overflow:hidden;border-radius:var(--radius-lg);border:1px solid var(--border);text-decoration:none;background:var(--bg-card)}
.mna-gm-c img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .35s}
.mna-gm-c::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(7,11,20,.94) 0%,rgba(7,11,20,.55) 45%,rgba(7,11,20,0) 75%)}
.mna-gm-c:hover img{transform:scale(1.05)}
.mna-gm-c:hover{border-color:var(--gold-dim)}
.mna-gm-t,.mna-gm-f{position:relative;z-index:1;min-width:0}
.mna-gm-t{margin-bottom:4px;color:#fff;font-weight:800;font-size:.95rem;line-height:1.35}
.mna-gm-f{color:var(--gold-light);font-size:.74rem;line-height:1.4;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mna-gm-big{grid-column:span 2;grid-row:span 3}
.mna-gm-big{padding:14px 16px}
.mna-gm-big .mna-gm-t{font-size:1.35rem}
.mna-gm-big .mna-gm-f{font-size:.88rem;white-space:normal}

/* 2. гайды — нумерованный топ с фото */
.mna-gd{margin:26px 0 30px;padding:20px;border-radius:var(--radius-lg);background:linear-gradient(160deg,var(--bg-card),var(--bg-dark));border:1px solid var(--border-light)}
.mna-gd-h{margin:0 0 14px!important;font-weight:800;color:var(--gold);font-size:1rem}
.mna-gd-l{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:10px 22px;counter-reset:gd}
.mna-gd-l li{counter-increment:gd}
.mna-gd-l a{display:flex;align-items:center;gap:12px;text-decoration:none;padding:8px 0;border-bottom:1px dashed var(--border-light)}
.mna-gd-l a::before{content:counter(gd,decimal-leading-zero);flex:0 0 34px;font-size:1.45rem;font-weight:800;color:var(--gold-dim);line-height:1}
.mna-gd-l img{flex:0 0 84px;width:84px;height:56px;object-fit:cover;border-radius:var(--radius)}
.mna-gd-x{display:flex;flex-direction:column;min-width:0}
.mna-gd-t{color:var(--text);font-weight:700;font-size:.9rem;line-height:1.4}
.mna-gd-f{color:var(--mna-dim);font-size:.76rem;line-height:1.45}
.mna-gd-l a:hover .mna-gd-t{color:var(--gold-light)}
.mna-gd-l a:hover::before{color:var(--gold)}

/* 3. провайдеры — стена логотипов */
.mna-pv{display:grid;grid-template-columns:repeat(5,1fr);gap:10px;margin:18px 0 4px}
.mna-pv-c{display:flex;flex-direction:column;text-decoration:none;border:1px solid var(--border);border-radius:var(--radius);background:var(--bg-card);overflow:hidden}
.mna-pv-l{display:flex;align-items:center;justify-content:center;height:74px;background:#f4f6fa;padding:10px}
.mna-pv-l img{max-height:54px;width:auto;object-fit:contain}
.mna-pv-t{padding:9px 10px 0;color:var(--text);font-weight:700;font-size:.85rem}
.mna-pv-f{padding:2px 10px 0;color:var(--mna-dim);font-size:.74rem;line-height:1.45;flex:1}
.mna-pv-n{margin:8px 10px 10px;align-self:flex-start;font-size:.7rem;font-weight:700;color:var(--gold);border:1px solid var(--gold-dim);border-radius:20px;padding:1px 9px}
.mna-pv-c:hover{border-color:var(--gold-dim)}

/* 4. кассы — CSS-вкладки */
.mna-pt{margin:18px 0 4px;border:1px solid var(--border-light);border-radius:var(--radius-lg);background:var(--bg-dark);padding:14px}
.mna-pt>input{position:absolute;opacity:0;pointer-events:none}
.mna-pt-tabs{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:14px}
.mna-pt-tabs label{cursor:pointer;padding:7px 18px;border-radius:20px;border:1px solid var(--border-light);color:var(--text-muted);font-weight:700;font-size:.85rem;background:var(--bg-card)}
.mna-pt-p{display:none;grid-template-columns:repeat(2,1fr);gap:8px}
#mna-pt-global:checked~.mna-pt-tabs label[for=mna-pt-global],
#mna-pt-crypto:checked~.mna-pt-tabs label[for=mna-pt-crypto],
#mna-pt-local:checked~.mna-pt-tabs label[for=mna-pt-local]{background:var(--gold);border-color:var(--gold);color:#0d1221}
#mna-pt-global:checked~.mna-pt-ps .mna-pt-p-global,
#mna-pt-crypto:checked~.mna-pt-ps .mna-pt-p-crypto,
#mna-pt-local:checked~.mna-pt-ps .mna-pt-p-local{display:grid}
.mna-pt>input:focus-visible~.mna-pt-tabs{outline:2px solid var(--gold);outline-offset:3px}
.mna-pt-c{display:flex;align-items:center;gap:12px;padding:8px;border-radius:var(--radius);background:var(--bg-card);border:1px solid var(--border);text-decoration:none}
.mna-pt-c:hover{border-color:var(--gold-dim)}
.mna-pt-l{flex:0 0 96px;height:48px;display:flex;align-items:center;justify-content:center;background:#fff;border-radius:6px;padding:4px}
.mna-pt-l img{max-height:40px;width:auto;object-fit:contain}
.mna-pt-x{display:flex;flex-direction:column;min-width:0}
.mna-pt-t{color:var(--text);font-weight:700;font-size:.88rem}
.mna-pt-f{color:var(--mna-dim);font-size:.75rem}
.mna-pt-all{border-style:dashed;border-color:var(--gold-dim);min-height:66px}
.mna-pt-all .mna-pt-t{color:var(--gold)}

/* 5. бонусы — таблица сравнения с миниатюрами */
.mna-bt{margin:18px 0 26px;border:1px solid var(--border-light);border-radius:var(--radius-lg);overflow:hidden}
.mna-bt table{width:100%;border-collapse:collapse;font-size:.86rem}
.mna-bt thead th{background:var(--bg-dark);color:var(--gold);text-align:right;font-weight:700;padding:10px 12px;font-size:.78rem;border-bottom:1px solid var(--border-light)}
.mna-bt tbody tr{border-bottom:1px solid var(--border)}
.mna-bt tbody tr:last-child{border-bottom:0}
.mna-bt tbody tr:nth-child(odd){background:rgba(18,25,41,.6)}
.mna-bt th[scope=row]{padding:8px 12px;text-align:right;font-weight:700;width:40%}
.mna-bt th[scope=row] a{display:flex;align-items:center;gap:10px;color:var(--text);text-decoration:none}
.mna-bt th[scope=row] img{flex:0 0 66px;width:66px;height:44px;object-fit:cover;border-radius:6px}
.mna-bt td{padding:8px 12px;color:var(--text-muted);line-height:1.5}
.mna-bt-go{white-space:nowrap;width:1%}
.mna-bt-go a{color:var(--gold);font-weight:700;text-decoration:none;font-size:.8rem}
.mna-bt tbody tr:hover th[scope=row] a{color:var(--gold-light)}

/* 6. страны — лента с флагами */
.mna-ct{list-style:none;margin:18px 0 26px;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:0 24px;border-top:1px solid var(--border)}
.mna-ct a{display:flex;align-items:center;gap:12px;padding:10px 2px;border-bottom:1px solid var(--border);text-decoration:none}
.mna-ct img{flex:0 0 42px;width:42px;height:28px;object-fit:cover;border-radius:3px;box-shadow:0 0 0 1px rgba(255,255,255,.12)}
.mna-ct-x{display:flex;flex-direction:column;min-width:0}
.mna-ct-t{color:var(--text);font-weight:700;font-size:.9rem}
.mna-ct-t b{margin-inline-start:8px;font-size:.68rem;color:var(--gold);border:1px solid var(--gold-dim);border-radius:4px;padding:0 5px;font-weight:700;letter-spacing:.04em}
.mna-ct-f{color:var(--mna-dim);font-size:.75rem;line-height:1.45}
.mna-ct a:hover .mna-ct-t{color:var(--gold-light)}

/* 7. лайв — горизонтальная лента */
.mna-lv{display:flex;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;padding:4px 0 12px;margin:18px 0 22px;-webkit-overflow-scrolling:touch}
.mna-lv-c{flex:0 0 300px;scroll-snap-align:start;position:relative;display:block;aspect-ratio:3/2;border-radius:var(--radius-lg);overflow:hidden;text-decoration:none;border:1px solid var(--border)}
.mna-lv-c img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.mna-lv-x{position:absolute;inset:auto 0 0 0;padding:28px 14px 12px;background:linear-gradient(to top,rgba(7,11,20,.95),rgba(7,11,20,0));display:flex;flex-direction:column}
.mna-lv-t{color:#fff;font-weight:800;font-size:1rem}
.mna-lv-t::before{content:"";display:inline-block;width:8px;height:8px;border-radius:50%;background:#e11d48;margin-inline-end:7px;vertical-align:middle;box-shadow:0 0 0 3px rgba(225,29,72,.25)}
.mna-lv-f{color:var(--gold-light);font-size:.76rem}
.mna-lv-c:hover{border-color:var(--gold-dim)}

/* 8. рейтинги — крупная карточка + список */
.mna-rk-i{color:var(--text-muted);font-size:.9rem;line-height:1.8;margin:0 0 16px}
.mna-rk{display:grid;grid-template-columns:5fr 7fr;gap:14px;align-items:start}
.mna-rk-big{position:relative;display:block;border-radius:var(--radius-lg);overflow:hidden;border:1px solid var(--gold-dim);text-decoration:none;min-height:330px;height:100%}
.mna-rk-big img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.mna-rk-big .mna-rk-x{position:absolute;inset:auto 0 0 0;padding:60px 18px 18px;background:linear-gradient(to top,rgba(7,11,20,.97) 30%,rgba(7,11,20,0))}
.mna-rk-x{display:flex;flex-direction:column;min-width:0}
.mna-rk-k{align-self:flex-start;background:var(--gold);color:#0d1221;font-size:.7rem;font-weight:800;border-radius:4px;padding:1px 8px;margin-bottom:8px}
.mna-rk-big .mna-rk-t{color:#fff;font-size:1.3rem;font-weight:800}
.mna-rk-big .mna-rk-f{color:var(--text);font-size:.85rem;line-height:1.6}
.mna-rk-l{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:8px}
.mna-rk-l a{display:flex;align-items:center;gap:10px;padding:7px;border-radius:var(--radius);background:var(--bg-card);border:1px solid var(--border);text-decoration:none;height:100%}
.mna-rk-l img{flex:0 0 58px;width:58px;height:58px;object-fit:cover;border-radius:6px}
.mna-rk-l .mna-rk-t{color:var(--text);font-weight:700;font-size:.84rem;line-height:1.35}
.mna-rk-l .mna-rk-f{color:var(--mna-dim);font-size:.72rem;line-height:1.4}
.mna-rk-l a:hover{border-color:var(--gold-dim)}

/* атрибуция фото CC BY / BY-SA */
.mna-cred{margin:26px 0 10px;font-size:.72rem;color:var(--text-muted)}
.mna-cred summary{cursor:pointer;color:var(--mna-dim)}
.mna-cred ul{margin:8px 0;padding-inline-start:18px;columns:2;column-gap:24px}
.mna-cred li{break-inside:avoid;margin-bottom:3px}
.mna-cred a{color:var(--mna-dim)}
@media (max-width:640px){.mna-cred ul{columns:1}}

@media (max-width:900px){
  .mna-gm{grid-template-columns:repeat(3,1fr)}
  .mna-pv{grid-template-columns:repeat(3,1fr)}
  .mna-rk{grid-template-columns:1fr}
  .mna-rk-big{min-height:260px}
}
@media (max-width:640px){
  .mna-gm{grid-template-columns:1fr 1fr;grid-auto-rows:130px}
  .mna-gm-big{grid-column:span 2;grid-row:span 2}
  .mna-gm-c:last-child{grid-column:span 2}
  .mna-gd{padding:14px}
  .mna-gd-l,.mna-ct,.mna-rk-l{grid-template-columns:1fr}
  .mna-pv{grid-template-columns:1fr 1fr}
  .mna-pt-p{grid-template-columns:1fr}
  .mna-bt thead{display:none}
  .mna-bt table,.mna-bt tbody,.mna-bt tr,.mna-bt th,.mna-bt td{display:block;width:auto}
  .mna-bt tbody tr{display:grid;grid-template-columns:1fr auto;padding:8px 10px}
  .mna-bt th[scope=row]{padding:0;grid-column:1/-1;width:auto}
  .mna-bt td{padding:4px 0 0 0;font-size:.8rem}
  .mna-bt td:not(.mna-bt-go){padding-inline-start:76px}
  .mna-lv-c{flex-basis:78%}
}
@media (max-width:420px){
  .mna-gm{grid-auto-rows:132px}
  .mna-gm-t{font-size:.84rem}
  .mna-gm-f{font-size:.68rem;white-space:normal;line-height:1.3;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
  .mna-pv-l{height:62px}
}
