/* MU GAME Hard: vitrine do Market na página inicial (os últimos itens à venda, com preço, e o caminho para o Market) */
.mkh .pn-h .js-mkh-n { font-size: 12px; color: var(--ink-3); white-space: nowrap; }
.mkh .js-mkh-n b { color: var(--ink); font-weight: 600; }
.mkh-palco { position: relative; padding: 14px 44px 4px; }
.mkh-trilho { display: flex; gap: 10px; overflow-x: auto; scroll-snap-type: x mandatory; scroll-behavior: smooth; overscroll-behavior-x: contain; scrollbar-width: none; padding: 2px 0 10px; }
.mkh-trilho::-webkit-scrollbar { display: none; }
.mkh-it { position: relative; flex: 0 0 130px; display: grid; justify-items: center; align-content: start; gap: 6px; padding: 6px 6px 10px; scroll-snap-align: start; color: inherit;
  background: var(--plate); border: 1px solid var(--line); transition: border-color .15s, transform .15s, box-shadow .15s; }
a.mkh-it:hover { border-color: var(--red); transform: translateY(-2px); box-shadow: 0 12px 22px -16px rgba(20, 26, 32, .6); }
a.mkh-it:focus-visible, .mkh-seta:focus-visible { outline: 2px solid var(--red); outline-offset: 2px; }
/* o slot: um fundo mais escuro só atrás do item, para o ícone aparecer bem */
.mkh-slot { position: relative; display: grid; place-items: center; width: 100%; height: 104px;
  background: radial-gradient(60% 60% at 50% 46%, #3a434d, #20272e 75%); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .06), inset 0 -18px 30px -18px rgba(0, 0, 0, .6); }
.mkh-it.exc .mkh-slot { background: radial-gradient(60% 60% at 50% 46%, #2f4a3a, #18241d 75%); }
.mkh-it.alto .mkh-slot { background: radial-gradient(60% 60% at 50% 46%, #4a3d28, #241d12 75%); }
.mkh-slot img { max-width: 92px; max-height: 86px; object-fit: contain; filter: drop-shadow(0 4px 6px rgba(0, 0, 0, .7)); }
.mkh-it.exc .mkh-slot img { filter: drop-shadow(0 0 7px rgba(110, 240, 150, .5)) drop-shadow(0 4px 6px rgba(0, 0, 0, .7)); }
.mkh-lv { position: absolute; top: 4px; right: 4px; padding: 0 5px; font: 700 13px/1.4 var(--f-disp); color: #fff; background: rgba(0, 0, 0, .55); border: 1px solid rgba(255, 255, 255, .25); }
.mkh-promo { position: absolute; left: 4px; top: 4px; padding: 0 5px; font: 700 11px/1.5 var(--f-body); color: #fff; background: var(--red); }
.mkh-nome { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; min-height: 32px; padding: 0 2px; text-align: center; font: 600 12px/1.3 var(--f-body); color: var(--ink); }
.mkh-it.exc .mkh-nome { color: #0f8a4c; }
.mkh-it.alto .mkh-nome { color: var(--gold); }
.mkh-preco { display: inline-flex; align-items: center; gap: 5px; padding: 2px 8px 2px 4px; font: 700 15px/1.3 var(--f-disp); color: var(--ink); background: var(--plate-2); border: 1px solid var(--line); font-variant-numeric: tabular-nums; }
.mkh-preco img { width: 18px; height: 18px; object-fit: contain; }
.mkh-gc { display: grid; place-items: center; width: 18px; height: 18px; border-radius: 50%; font: 700 8px/1 var(--f-body); color: #fff; background: radial-gradient(circle at 35% 30%, #ff6b7f, var(--red) 60%, var(--red-2)); box-shadow: inset 0 0 0 1.5px rgba(255, 255, 255, .45); }
.mkh-preco small { font: 500 11px var(--f-body); color: var(--ink-3); }
.mkh-preco s { font: 500 11px var(--f-body); color: var(--ink-3); }
.mkh-vend { font-size: 10.5px; color: var(--ink-3); }
.mkh-mais { justify-content: center; align-content: center; gap: 8px; padding: 14px 10px; text-align: center; background: var(--plate-2); border-style: dashed; border-color: var(--line-2); }
.mkh-mais .i { width: 28px; height: 28px; color: var(--red); }
.mkh-mais b { font: 600 16px/1.15 var(--f-disp); letter-spacing: .04em; text-transform: uppercase; color: var(--ink); }
.mkh-mais small { font-size: 11.5px; color: var(--ink-3); }
.mkh-ph { height: 188px; background: linear-gradient(100deg, #f1f3f5 30%, #e4e8ec 50%, #f1f3f5 70%) 0 0 / 300% 100%; animation: mkh-carga 1.4s linear infinite; }
@keyframes mkh-carga { to { background-position: -150% 0; } }
.mkh-seta { position: absolute; top: 50%; z-index: 2; display: grid; place-items: center; width: 32px; height: 56px; margin-top: -30px; padding: 0; cursor: pointer; color: var(--ink);
  background: var(--plate); border: 1px solid var(--line-2); transition: opacity .2s, border-color .2s, color .2s, background .2s; }
.mkh-seta:hover:not(:disabled) { color: #fff; background: var(--red); border-color: var(--red); }
.mkh-seta:disabled { opacity: .3; cursor: default; }
.mkh-seta.ant { left: 6px; } .mkh-seta.ant .i { transform: scaleX(-1); }
.mkh-seta.prox { right: 6px; }
.mkh-vazio { flex: 1; margin: 0; padding: 26px 16px; text-align: center; font-size: 13px; color: var(--ink-3); }
.mkh-vazio a { color: var(--red); font-weight: 500; }
@media (max-width: 620px) { .mkh-palco { padding: 12px 10px 4px; } .mkh-seta { display: none; } }