/* A origem de cada caixa e o centro inferior; efeitos animam dentro dela. */
#screen #battle.emerald-battle .battle-field.anchored-battle .combatant {
  position:absolute;right:auto;bottom:auto;margin:0;padding:0;
  translate:-50% -100%;transform-origin:50% 100%;
}
#screen #battle.emerald-battle .battle-field.anchored-battle .ally {
  left:var(--player-x);top:var(--player-y);width:var(--player-size);height:var(--player-size);
}
#screen #battle.emerald-battle .battle-field.anchored-battle .enemy {
  left:var(--enemy-x);top:var(--enemy-y);width:var(--enemy-size);height:var(--enemy-size);
}
#screen #battle.emerald-battle .battle-field.anchored-battle .combatant canvas {
  width:100%!important;height:100%!important;object-fit:contain;object-position:center bottom;transform-origin:50% 100%;
}
#screen #battle.emerald-battle .battle-field.anchored-battle .health-box {
  width:min(43%,360px);max-width:43%;min-width:0;box-sizing:border-box;
  padding:4px 7px;font-size:clamp(10px,1.6cqw,15px);overflow-wrap:anywhere;
}
#screen #battle.emerald-battle .battle-field.anchored-battle .ally-health {
  left:auto;right:3%;top:auto;bottom:28px;
}
#screen #battle.emerald-battle .battle-field.anchored-battle .enemy-health {
  left:3%;right:auto;top:3%;bottom:auto;
}
#screen #battle.emerald-battle .battle-field.anchored-battle .capture-notice {
  bottom:3px;max-height:20px;overflow:hidden;margin:0;
}
/* Recorta somente o excesso do cenário ampliado dentro da área de batalha. */
#screen .verdant-field { overflow:hidden; }