/* Pokédex › Mega Evoluções. Em cima da data-table e do callout do site; o dourado é o das Mega Stones no jogo. */
.mg-como { max-width: 900px; margin: 16px 0 0; border-left-color: #ffd34d; line-height: 1.55; }
.mg-filtros { align-items: center; }
.mg-busca { width: 240px; color: var(--text); }
.mg-busca::placeholder { color: #858b96; }
.mg-conta { margin: 0 0 0 4px; }

.mg-tabela { min-width: 1080px; }
.mg-tabela tbody tr { cursor: pointer; }
.mg-tabela tbody tr:hover td { background: #20242c; }
.mg-n { color: #8d939e; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 12px; }
.mg-nome { display: inline-flex; align-items: center; gap: 10px; border: 0; padding: 4px 0; background: none; color: var(--text); text-align: left; font: inherit; }
.mg-nome b { font-size: 13px; }
.mg-nome small { display: block; color: var(--muted); font-size: 11px; }
.mg-nome:focus-visible { outline: 2px solid #ffd34d; outline-offset: 2px; border-radius: 4px; }
.mg-tipo-novo { display: block; margin-top: 3px; color: #ffd34d; font-size: 10px; font-weight: 700; }
.mg-num { text-align: right !important; font-variant-numeric: tabular-nums; }
.mg-bst { color: var(--text) !important; font-weight: 800; }
.mg-delta { display: block; font-size: 10px; font-weight: 700; }
.mg-sobe { color: var(--green); }
.mg-desce { color: #ff6675; }
.mg-pedra { color: #ffd34d !important; font-weight: 600; }
.mg-vazio { padding: 2rem !important; color: #858b95 !important; text-align: center; }
.mg-erro { border-left-color: #ff6675; }

/* A ficha: por cima de tudo, fecha com ✕, Esc ou clique fora. */
.mg-fundo { position: fixed; inset: 0; z-index: 999; display: flex; align-items: center; justify-content: center; padding: 16px; background: rgba(0, 0, 0, .75); }
.mg-fundo[hidden] { display: none; }
body.mg-travado { overflow: hidden; }
.mg-ficha { position: relative; width: 100%; max-width: 640px; max-height: 90vh; overflow-y: auto; border: 1px solid #343a46; border-radius: 10px; padding: 20px; background: #15181e; color: var(--text); }
.mg-fechar { position: absolute; top: 14px; right: 14px; border: 0; background: transparent; color: #858b95; font-size: 20px; }
.mg-fechar:hover { color: var(--text); }
.mg-ficha-topo { display: flex; align-items: center; gap: 16px; padding-right: 28px; }
.mg-ficha-topo .xpc-sprite-caixa { border: 1px solid #ffd34d66; border-radius: 12px; background: radial-gradient(circle at 50% 55%, #ffd34d33, #1b1e26 72%); }
.mg-ficha h2 { margin: 2px 0; font-size: 22px; }
.mg-de { margin: 0 0 6px; color: var(--muted); font-size: 12px; }
.mg-tipos-ficha { display: flex; align-items: center; gap: 8px; }
.mg-seta { color: #ffd34d; font-weight: 800; }
.mg-obter { margin-top: 16px; border-left-color: #ffd34d; }
.mg-ficha h3 { margin: 18px 0 8px; border-bottom: 1px solid #292e37; padding-bottom: 6px; font-size: 14px; }
.mg-ficha h3 small { color: var(--subtle); font-weight: 600; }
.mg-ficha .data-table { min-width: 0; }
.mg-ficha .data-table td { height: 34px; padding: 0 12px; }
.mg-ficha .data-table th { padding: 0 12px; }
.mg-stats .mg-delta { display: inline; font-size: 12px; }

@media (max-width: 580px) {
  .mg-busca { width: 100%; }
  .mg-ficha { padding: 16px; }
  .mg-ficha-topo { align-items: flex-start; }
  .mg-golpes th:nth-child(3), .mg-golpes td:nth-child(3) { display: none; }
}