/* The whole automatic battle must stay visible until its brief result finishes. */
.combat-stats>div{min-width:0}
.combat-stats dt{flex-shrink:0}
.combat-stats dd{min-width:0;overflow-wrap:break-word;overflow-wrap:anywhere;text-align:right}
.combat-stats dd.long-stat{font-size:12px;letter-spacing:0}
.battle-reward{flex-wrap:wrap;--minitool-row-gap:4px;--minitool-column-gap:14px;grid-gap:4px 14px;gap:4px 14px;text-align:center}
@media(max-width:360px){
  .combat-stats.minitool-has-long-stat>div{display:grid;grid-template-columns:minmax(0,1fr);--minitool-row-gap:1px;--minitool-column-gap:1px;grid-gap:1px;gap:1px}
  .combat-stats:has(.long-stat)>div{display:grid;grid-template-columns:minmax(0,1fr);--minitool-row-gap:1px;--minitool-column-gap:1px;grid-gap:1px;gap:1px}
  .combat-stats.minitool-has-long-stat dt{font-size:9px;text-align:left}
  .combat-stats:has(.long-stat) dt{font-size:9px;text-align:left}
}
@media(max-height:480px){
  .battle-backdrop{padding:10px 12px}
  .battle-sheet{width:100%;width:min(700px,100%);max-height:calc(100vh - 20px - var(--safe-area-inset-top,0px) - var(--safe-area-inset-bottom,0px));max-height:calc(calc(var(--minitool-vh,1vh) * 100) - 20px - var(--safe-area-inset-top,0px) - var(--safe-area-inset-bottom,0px));max-height:calc(100dvh - 20px - var(--safe-area-inset-top,env(safe-area-inset-top,0px)) - var(--safe-area-inset-bottom,env(safe-area-inset-bottom,0px)));padding:10px 14px;overflow:hidden}
  .battle-sheet>*{flex-shrink:0}
  .battle-sheet .modal-header{padding-bottom:6px;margin-bottom:8px}
  .battle-sheet .modal-header h2{font-size:14px;line-height:1.3}
  .combat-arena{grid-template-columns:minmax(0,1fr) 34px minmax(0,1fr);--minitool-row-gap:8px;--minitool-column-gap:8px;grid-gap:8px;gap:8px}
  .combatant h3{font-size:12px;line-height:1.4;min-height:17px;margin-bottom:4px}.combat-portrait,.combat-portrait img,.combat-portrait canvas{height:48px;height:clamp(48px,18dvh,70px)}.combat-portrait img,.combat-portrait canvas{width:48px;width:clamp(48px,18dvh,70px)}
  .combat-portrait:after{width:48px;height:6px;bottom:0}
  .combat-versus{padding-top:38px}
  .combat-versus span{font-size:19px}
  .combat-versus i{font-size:14px;margin-top:4px}
  .combat-health-track{height:5px;margin:6px 0}
  .combat-stats{--minitool-row-gap:3px;--minitool-column-gap:3px;grid-gap:3px;gap:3px;padding:0 3px}
  .combat-stats>div{line-height:1.3}
  .combat-stats dt{font-size:10px}
  .combat-stats dd{font-size:13px}
  .battle-caption{min-height:0;--minitool-row-gap:3px;--minitool-column-gap:3px;grid-gap:3px;gap:3px;margin-top:8px;padding:7px 0 6px}
  .battle-status{font-size:12px;line-height:1.4}
  .battle-round{font-size:10px;line-height:1.4}
  .battle-won .battle-status{font-size:16px;line-height:1.25;letter-spacing:3px}
  .battle-reward{padding:6px 5px;font-size:11px;line-height:1.4}
  .combat-damage{top:3px;font-size:16px}
}
@media(min-width:540px) and (max-height:300px){
  .battle-backdrop{padding-top:8px;padding-bottom:8px;padding-block:8px}
  .battle-sheet{max-height:calc(100vh - 16px - var(--safe-area-inset-top,0px) - var(--safe-area-inset-bottom,0px));max-height:calc(calc(var(--minitool-vh,1vh) * 100) - 16px - var(--safe-area-inset-top,0px) - var(--safe-area-inset-bottom,0px));max-height:calc(100dvh - 16px - var(--safe-area-inset-top,env(safe-area-inset-top,0px)) - var(--safe-area-inset-bottom,env(safe-area-inset-bottom,0px)));padding:8px 12px}
  .battle-sheet .modal-header{margin-bottom:6px;padding-bottom:4px}
  .combatant{display:grid;grid-template-columns:54px minmax(0,1fr);grid-template-rows:auto auto auto;--minitool-row-gap:0;--minitool-column-gap:8px;grid-gap:0 8px;gap:0 8px;align-items:center}
  .combatant h3{grid-column:1 / -1;margin-bottom:4px}
  .combat-portrait{grid-column:1;grid-row:2;height:48px}.combat-portrait img,.combat-portrait canvas{width:48px;height:48px}
  .combat-health-track{grid-column:1;grid-row:3;margin:4px 0 0}
  .combat-stats{grid-column:2;grid-row:2 / 4;--minitool-row-gap:4px;--minitool-column-gap:4px;grid-gap:4px;gap:4px;padding:0}
  .combat-versus{padding-top:24px}
  .battle-caption{margin-top:6px;padding-top:5px;padding-bottom:5px;padding-block:5px}
  .battle-reward{padding-top:5px;padding-bottom:5px;padding-block:5px}
}
