/* Cartas do site: o .tc dá tamanho/animação; dentro dele vai a carta do campo de batalha (carta-campo.css). */
.tc { background: none !important; border-radius: 0; overflow: visible; container-type: inline-size; aspect-ratio: 5 / 7; }
.tc::before, .tc::after { content: none !important; display: none !important; }
.tc > .tcCard { position: absolute; inset: 0; display: block; padding: 0; margin: 0; gap: 0; pointer-events: none; }
.tc > .tcCard > .card.duel { position: absolute; inset: 0; width: 100% !important; height: 100% !important; margin: 0; transform: none !important; transition: none; cursor: inherit; display: block; }
.tc > .tcCard > .card.duel:hover { transform: none !important; }
.wall .tc .tc-foot, .wall .tc .tc-name { opacity: 1; }

/* Cartas grandes o bastante para o layout completo do combate (habilidades, ícones de ataque/dano): abaixo de ~110px o jogo usa o layout reduzido. */
.wall { grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)) !important; gap: 16px !important; }
.wall .tc { width: 100%; }
.evo-strip { display: grid !important; grid-template-columns: auto minmax(0, 1fr) auto !important; grid-auto-flow: row !important; overflow: visible !important; align-items: center; gap: 8px !important; padding: 0 !important; }
.evo-view { grid-column: 2; grid-row: 1; display: grid; justify-items: center; }
.evo-strip .evo-fig { grid-area: 1 / 1; display: none; justify-items: center; gap: 8px; margin: 0; }
.evo-strip .evo-fig.on { display: grid; animation: evoIn .35s ease-out both; }
.evo-fig .tc { width: min(100%, 200px) !important; }
.evo-arrow { grid-row: 1; width: 40px; height: 40px; border-radius: 50%; border: 1px solid #e8c98b88; background: #1b1424e6; color: #ffe7a8; font: 700 26px/1 system-ui, sans-serif; cursor: pointer; }
.evo-arrow.prev { grid-column: 1; } .evo-arrow.next { grid-column: 3; }
.evo-arrow:hover { background: #2a1e3a; box-shadow: 0 0 14px #e8c98b55; }
.evo-dots { grid-column: 1 / -1; display: flex; justify-content: center; gap: 7px; }
.evo-dots i { width: 8px; height: 8px; border-radius: 50%; background: #e8c98b44; }
.evo-dots i.on { background: #ffe7a8; box-shadow: 0 0 8px #ffd36b; }
@keyframes evoIn { from { opacity: 0; transform: translateX(14px) scale(.96); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) { .evo-fig.on { animation: none; } }
@media (max-width: 860px) { .wall { grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)) !important; gap: 12px !important; } }

/* Miniaturas do mural: só arte, nome e os números de ataque e dano (sem habilidades, clã e estrelas). A carta grande e as evoluções mantêm tudo. */
.wall .tc .cardText :is(p.ability, p.clanAbility, .clanName, .stars) { display: none !important; }
.wall .tc .cardStats { display: flex !important; justify-content: space-between; }
.wall { grid-template-columns: repeat(auto-fill, minmax(120px, 1fr)) !important; gap: 12px !important; }
@media (max-width: 860px) { .wall { grid-template-columns: repeat(auto-fill, minmax(110px, 1fr)) !important; gap: 10px !important; } }

/* Ícone do clã alinhado verticalmente com o nome do personagem (centro do ícone = centro da plaqueta do nome). */
.tc .card.duel .clanIcon {}

/* Evoluções: carta na largura toda da coluna; setas por cima, nas laterais. */
.evo-strip { display: block !important; position: relative; padding: 0 !important; }
.evo-view { display: block; }
.evo-fig .tc { width: min(100%, 290px) !important; margin: 0 auto; }
.evo-arrow { position: absolute; top: 38%; width: 32px; height: 32px; font-size: 22px; z-index: 3; }
.evo-arrow.prev { left: -6px; } .evo-arrow.next { right: -6px; }
.evo-dots { margin-top: 8px; }
.evo-view { width: 100%; } .evo-strip .evo-fig { width: 100%; justify-self: stretch; }
.evo-fig .tc { width: min(94%, 290px) !important; }

/* Mesma fonte do nome de todas as cartas do jogo (regra: visual da carta igual em todo lugar). */
html:not(#fonteA):not(#fonteB) .card.duel .art h4.cardName { font-family: "Alegreya Sans", system-ui, sans-serif !important; font-weight: 800 !important; letter-spacing: .02em !important; font-style: normal !important; }

/* Ícones de ATAQUE (luva dourada) e DANO (explosão) no lugar dos símbolos ⚔ e ✹, em todo lugar onde a carta mostra os números. */
.ico-atk,.ico-dmg{display:inline-block;width:1.2em;height:1.2em;vertical-align:-.26em;margin-right:.08em;background:center / contain no-repeat;font-size:inherit;filter:drop-shadow(0 1px 1px #0008)}
.ico-atk{background-image:url('../assets/icones/ataque.webp')}
.ico-dmg{background-image:url('../assets/icones/dano.webp')}
