/**
 * バトル履歴 · 直近対戦 — スコア/日時の見切れ防止
 * Load AFTER battle-demo-mirror.css
 */

@media (max-width: 960px) {
  .phone-battle-history-list,
  .phone-battle-history-row,
  .phone-pk-list,
  .phone-pk-row {
    min-width: 0;
    max-width: 100%;
  }

  .phone-battle-history-row {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) minmax(4.2rem, 40%);
    gap: 0.12rem 0.16rem;
    padding: 0.18rem 0.16rem;
    align-items: center;
  }

  .phone-battle-history-row__badge {
    grid-row: 1 / 3;
    align-self: center;
    flex-shrink: 0;
    font-size: 0.58rem !important;
    font-weight: 700;
  }

  .phone-battle-history-row__main {
    grid-column: 2;
    grid-row: 1 / 3;
    min-width: 0;
    overflow: hidden;
    align-self: center;
  }

  .phone-battle-history-row__opp {
    display: block;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 0.68rem !important;
    font-weight: 600;
    line-height: 1.3;
  }

  .phone-battle-history-row__score {
    grid-column: 3;
    grid-row: 1;
    align-self: end;
    font-size: clamp(0.58rem, 2.5vw, 0.66rem) !important;
    font-weight: 700;
    line-height: 1.15;
    text-align: right;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 100%;
    font-variant-numeric: tabular-nums;
  }

  .phone-battle-history-row__time {
    grid-column: 3;
    grid-row: 2;
    align-self: start;
    font-size: 0.5rem !important;
    line-height: 1.2;
    text-align: right;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 100%;
    color: rgba(255, 255, 255, 0.42) !important;
  }

  #liver-shell.mobile-tab-mode .phone-pk-row,
  #lp-phone-demo .phone-pk-row,
  .phone--demo .phone-pk-row {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) minmax(4rem, 38%);
    grid-template-rows: auto auto;
    gap: 0.06rem 0.16rem;
    padding: 0.18rem 0.16rem;
    align-items: start;
  }

  #liver-shell.mobile-tab-mode .phone-pk-row span:first-child,
  #lp-phone-demo .phone-pk-row span:first-child,
  .phone--demo .phone-pk-row span:first-child {
    grid-column: 1;
    grid-row: 1 / 3;
    font-size: 0.58rem !important;
    font-weight: 700;
    align-self: center;
  }

  #liver-shell.mobile-tab-mode .phone-pk-row span:nth-child(2),
  #lp-phone-demo .phone-pk-row span:nth-child(2),
  .phone--demo .phone-pk-row span:nth-child(2) {
    grid-column: 2;
    grid-row: 1 / 3;
    font-size: 0.68rem !important;
    font-weight: 600;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    align-self: center;
  }

  #liver-shell.mobile-tab-mode .phone-pk-row small,
  #lp-phone-demo .phone-pk-row small,
  .phone--demo .phone-pk-row small {
    grid-column: 3;
    grid-row: 1 / 3;
    display: block;
    font-size: 0.52rem !important;
    line-height: 1.3;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 100%;
    text-align: right;
    align-self: center;
    color: rgba(255, 255, 255, 0.42) !important;
  }

  #liver-shell.mobile-tab-mode .home-pk-card,
  #lp-phone-demo .home-pk-card,
  .phone--demo .home-pk-card {
    min-width: 0;
    overflow: hidden;
  }

  #liver-shell.mobile-tab-mode .home-pk-card__meta,
  #lp-phone-demo .home-pk-card__meta,
  .phone--demo .home-pk-card__meta {
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
}
