@charset "UTF-8";
/* The companion portraits keep their native frame and aspect ratio. The
   mother's live collection and capacity values share the paper below it. */
#app .game-shell[data-page="team"] .animal-card .animal-card-specialty {
  display: grid; grid-template-columns: minmax(0,1fr); align-content: center;
  justify-items: stretch; gap: 2px; min-height: 68px;
  padding: 7px 10px; font-size: 11px; line-height: 17px;
}
#app .game-shell[data-page="team"] .animal-card-specialty-copy { display: block; text-align: center; }
#app .game-shell[data-page="team"] .animal-card-metrics {
  display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 2px 10px;
  min-width: 0; color: #426536; font-variant-numeric: tabular-nums;
}
#app .game-shell[data-page="team"] .animal-card-metrics .team-metric {
  display: inline-flex; align-items: center; gap: 2px;
  white-space: nowrap; font-size: 11px; line-height: 22px;
}
#app .game-shell[data-page="team"] .team-metric > b { font-size: 17px; line-height: 22px; }
#app .game-shell[data-page="team"] .team-metric > em { font-size: 10px; font-style: normal; }
#app .game-shell[data-page="team"] .animal-card-metrics :is(.resource-icon,.ui-icon) {
  flex: 0 0 18px; width: 18px; height: 22px; max-width: none; max-height: 22px;
  object-fit: contain;
}
#app .game-shell[data-page="team"] .animal-card-invite-preview { display: block; font-size: 11px; line-height: 18px; }
#app .game-shell[data-page="team"] .animal-card-invite-preview > b { font-size: 13px; }
#app .game-shell[data-page="team"] .animal-card-invite-status { display: block; color: #8a6b42; font-size: 10px; line-height: 17px; }
#app .game-shell[data-page="team"] .animal-card.is-recruitable .animal-card-state { color: #375b26; }
#app .game-shell[data-page="team"] .animal-card.is-recruitable .animal-card-invite-status { color: #375b26; font-weight: bold; }
@container (max-width: 350px) {
  #app .game-shell[data-page="team"] .animal-card .animal-card-specialty { padding-inline: 7px; }
  #app .game-shell[data-page="team"] .animal-card-metrics { gap: 2px 5px; }
  #app .game-shell[data-page="team"] .team-metric > b { font-size: 15px; }
  #app .game-shell[data-page="team"] .animal-card-metrics :is(.resource-icon,.ui-icon) { flex-basis: 16px; width: 16px; height: 20px; }
}