/* MU GAME Classic: vitrine do Market na página inicial (os últimos itens à venda, com preço, e o caminho para o Market) */
.mkh .card-h .js-mkh-n { margin-left: 2px; margin-right: auto; }
.mkh .card-h a.aux { margin-left: 0; }
.mkh .js-mkh-n b { color: var(--gold-hi); font-weight: 700; }
.mkh-palco { position: relative; padding: 14px 44px 6px; }
.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 128px; display: grid; justify-items: center; align-content: start; gap: 5px; padding: 0 0 8px; scroll-snap-align: start; text-decoration: none; color: inherit;
  background: linear-gradient(180deg, #160d0c, #0b0607); border: 1px solid rgba(227, 180, 94, .16); border-radius: 6px; transition: border-color .2s, transform .2s, box-shadow .2s; }
a.mkh-it:hover { border-color: rgba(227, 180, 94, .6); transform: translateY(-2px); box-shadow: 0 10px 22px -12px rgba(255, 122, 69, .55); }
a.mkh-it:focus-visible, .mkh-seta:focus-visible, .mkh-bt:focus-visible { outline: 2px solid var(--gold-hi); outline-offset: 2px; }
.mkh-slot { position: relative; display: grid; place-items: center; width: 100%; height: 108px; border: 8px solid transparent;
  border-image: url(../mercado/ui/item_back01.png) 34 22 24 22 / 14px 10px 11px 10px;
  background: radial-gradient(60% 60% at 50% 48%, rgba(255, 110, 60, .16), transparent 70%), linear-gradient(180deg, #1a100e, #0c0707); background-clip: padding-box; }
.mkh-it.exc .mkh-slot { background: radial-gradient(60% 60% at 50% 48%, rgba(110, 240, 150, .14), transparent 70%), linear-gradient(180deg, #121510, #080a07); background-clip: padding-box; }
.mkh-slot img { max-width: 96px; max-height: 88px; object-fit: contain; filter: drop-shadow(0 4px 6px rgba(0, 0, 0, .8)); }
.mkh-it.exc .mkh-slot img { filter: drop-shadow(0 0 7px rgba(110, 240, 150, .55)) drop-shadow(0 4px 6px rgba(0, 0, 0, .8)); }
.mkh-lv { position: absolute; top: -2px; right: -2px; padding: 1px 5px; font: 700 12px/1.3 var(--f-display); color: #fff; background: rgba(0, 0, 0, .7); border: 1px solid rgba(227, 180, 94, .5); border-radius: 3px; }
.mkh-promo { position: absolute; left: -2px; top: -2px; padding: 1px 5px; font: 700 11px/1.3 var(--f-body); color: #1d0b04; background: linear-gradient(180deg, #ffc27a, #ff7a45); border-radius: 3px; }
.mkh-nome { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; min-height: 32px; padding: 0 8px; text-align: center; font: 600 12.5px/1.3 var(--f-body); color: #e9e2df; }
.mkh-it.exc .mkh-nome { color: #7ef09a; }
.mkh-it.alto .mkh-nome { color: #f6d391; }
.mkh-preco { display: inline-flex; align-items: center; gap: 5px; padding: 3px 9px; font: 700 14px var(--f-body); color: #fff; background: rgba(0, 0, 0, .35); border: 1px solid rgba(255, 255, 255, .07); border-radius: 20px; font-variant-numeric: tabular-nums; }
.mkh-preco img { width: 18px; height: 18px; object-fit: contain; }
.mkh-preco small { font: 500 11.5px var(--f-body); color: var(--tx-3); }
.mkh-preco s { font-size: 11.5px; font-weight: 500; color: var(--tx-4); }
.mkh-vend { font-size: 11px; color: var(--tx-4); }
.mkh-mais { justify-content: center; align-content: center; gap: 8px; padding: 14px 10px; text-align: center; background: radial-gradient(80% 60% at 50% 30%, rgba(255, 90, 50, .18), transparent 70%), linear-gradient(180deg, #1c1110, #0b0607); border-color: rgba(227, 180, 94, .35); }
.mkh-mais .i { width: 30px; height: 30px; color: var(--gold-hi); }
.mkh-mais b { font: 700 14px/1.25 var(--f-display); color: #fff; }
.mkh-mais small { font-size: 12px; color: var(--tx-3); }
.mkh-ph { height: 186px; background: linear-gradient(100deg, #120a0a 30%, #1d1211 50%, #120a0a 70%) 0 0 / 300% 100%; animation: mkh-carga 1.4s linear infinite; }
@keyframes mkh-carga { to { background-position: -150% 0; } }
html.leve .mkh-ph { animation: none; }
.mkh-seta { position: absolute; top: 50%; z-index: 2; display: grid; place-items: center; width: 34px; height: 56px; margin-top: -32px; padding: 0; cursor: pointer; color: var(--gold-hi);
  background: linear-gradient(180deg, #24150f, #120a08); border: 1px solid rgba(227, 180, 94, .4); border-radius: 5px; transition: opacity .2s, border-color .2s; }
.mkh-seta:hover:not(:disabled) { border-color: var(--gold-hi); }
.mkh-seta:disabled { opacity: .25; 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: 14px; color: var(--tx-3); }
.mkh-vazio a { color: var(--gold-hi); }
.mkh-pe { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 10px 16px 14px; border-top: 1px solid var(--line-soft); }
.mkh-pe p { margin: 0; font-size: 13px; line-height: 1.45; color: var(--tx-3); }
.mkh-bt { flex: none; display: inline-flex; align-items: center; height: 38px; padding: 0 18px; border-radius: 3px; font: 700 13.5px var(--f-body); color: #1d1204; text-decoration: none;
  background: linear-gradient(180deg, #ffe6ad, #c99640); box-shadow: 0 0 0 1px #000, 0 0 18px -6px rgba(242, 193, 78, .9); }
.mkh-bt:hover { filter: brightness(1.07); }
@media (max-width: 620px) { .mkh-palco { padding: 12px 10px 4px; } .mkh-seta { display: none; } .mkh-pe { flex-direction: column; align-items: stretch; text-align: center; } .mkh-bt { justify-content: center; } }