/* ============================================================
   MaGamers — шлюз контенту 18+ (badge / veil / кнопка «Показати»)
   Картинки 18+ приходять через /adult/?i=<токен> і за замовчуванням
   приходять РОЗМИТИМИ; оригінал віддається після підтвердження віку.
   ============================================================ */

/* ── бейдж «18+» у списках карток ─────────────────────────────────── */
.mm-badge--adult {
  background: rgba(15, 17, 21, .84);
  color: #fff;
  border: 1px solid rgba(255, 255, 255, .18);
  letter-spacing: .08em;
  backdrop-filter: blur(6px);
}
.mm-badge--adult:hover { color: #fff; }

/* ── завіса поверх картинки ───────────────────────────────────────── */
.mg-adult-veil {
  position: absolute;
  inset: 0;
  z-index: 3;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 12px;
  background: rgba(9, 11, 14, .48);
  backdrop-filter: blur(3px);
  -webkit-backdrop-filter: blur(3px);
  animation: mg-adult-fade var(--t-slow) both;
}

.mg-adult-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  max-width: 240px;
  padding: 14px 18px;
  border-radius: var(--r-2xl, 14px);
  background: rgba(14, 16, 20, .9);
  border: 1px solid rgba(255, 255, 255, .12);
  box-shadow: 0 18px 46px rgba(0, 0, 0, .5);
  text-align: center;
}

.mg-adult-card__icon {
  width: 26px;
  height: 26px;
  display: block;
  color: rgba(255, 255, 255, .82);
  stroke: currentColor;
  fill: none;
  stroke-width: 1.6;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.mg-adult-card__title {
  color: #fff;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .04em;
  line-height: 1.3;
}

.mg-adult-card__hint {
  color: rgba(255, 255, 255, .62);
  font-size: 10px;
  line-height: 1.35;
}

.mg-adult-card__btn {
  appearance: none;
  border: 0;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 8px 18px;
  border-radius: 999px;
  background: #fff;
  color: #14161a;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .02em;
  transition: transform var(--t-base), background var(--t-base), opacity var(--t-base);
}
.mg-adult-card__btn:hover { background: #f1f2f4; transform: translateY(-1px); }
.mg-adult-card__btn:active { transform: scale(.97); }
.mg-adult-card__btn:focus-visible { outline: 2px solid rgba(255, 255, 255, .7); outline-offset: 2px; }
.mg-adult-card__btn[disabled] { opacity: .55; cursor: progress; }

/* ── на картці каталогу завіса з'являється з hover-ом, але текст видно завжди ── */
.shortstory .scard-media .mg-adult-veil { opacity: 1; }
.shortstory .scard-media .mg-adult-card {
  padding: 10px 14px;
  gap: 6px;
  transform: scale(.94);
  transition: transform var(--t-slow), opacity var(--t-slow);
}
.shortstory:hover .scard-media .mg-adult-card { transform: scale(1); }

/* ── блок скріншотів: одна завіса на всю сітку ────────────────────── */
.screenshots-block { position: relative; }
.screenshots-block .screenshots-grid { position: relative; }
.screenshots-block .mg-adult-veil { border-radius: var(--r-lg, 12px); }

/* ── коли вміст показано — завіси зникають, картинки перезавантажуються ── */
.mg-adult-revealed .mg-adult-veil { display: none !important; }
.mg-adult-revealed .mg-adult-card__btn { display: none; }

@keyframes mg-adult-fade {
  from { opacity: 0; }
  to   { opacity: 1; }
}

@media (prefers-reduced-motion: reduce) {
  .mg-adult-veil { animation: none; }
  .shortstory .scard-media .mg-adult-card { transition: none; }
}