/**
 * 通算戦績 — セクション分離 · 対戦相手別リストの可読性
 * Load AFTER liver-compact-redesign.css / battle-demo-mirror.css
 */

@media (max-width: 960px) {
  /* ── セクションカード共通 ── */
  #liver-shell.mobile-tab-mode .phone-vs-block--card,
  #lp-phone-demo .phone-vs-block--card,
  .phone--demo .phone-vs-block--card {
    margin-top: 0.42rem !important;
    padding: 0.3rem 0.32rem 0.38rem !important;
    border-radius: 8px !important;
    border: 1px solid rgba(255, 255, 255, 0.08) !important;
    background: rgba(255, 255, 255, 0.025) !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.03);
  }

  #liver-shell.mobile-tab-mode .phone-vs-block--card + .phone-vs-block--card,
  #lp-phone-demo .phone-vs-block--card + .phone-vs-block--card,
  .phone--demo .phone-vs-block--card + .phone-vs-block--card {
    margin-top: 0.52rem !important;
  }

  #liver-shell.mobile-tab-mode .phone-vs-block > .phone-section-label,
  #lp-phone-demo .phone-vs-block > .phone-section-label,
  .phone--demo .phone-vs-block > .phone-section-label {
    font-size: 0.68rem !important;
    font-weight: 600;
    letter-spacing: 0.04em;
    color: rgba(255, 255, 255, 0.52) !important;
    margin: 0 0 0.34rem;
    line-height: 1.35;
    padding-bottom: 0.16rem;
    border-bottom: 1px solid rgba(255, 255, 255, 0.06);
  }

  /* ── 最近よく戦う相手（独立カード） ── */
  #liver-shell.mobile-tab-mode .phone-vs-block--recent-rivals,
  #lp-phone-demo .phone-vs-block--recent-rivals,
  .phone--demo .phone-vs-block--recent-rivals {
    border-color: rgba(34, 211, 238, 0.18) !important;
    background: linear-gradient(180deg, rgba(34, 211, 238, 0.05), rgba(255, 255, 255, 0.02)) !important;
  }

  #liver-shell.mobile-tab-mode .phone-vs-recent-rivals,
  #lp-phone-demo .phone-vs-recent-rivals,
  .phone--demo .phone-vs-recent-rivals {
    gap: 0.28rem !important;
  }

  #liver-shell.mobile-tab-mode .phone-vs-recent-rivals li,
  #lp-phone-demo .phone-vs-recent-rivals li,
  .phone--demo .phone-vs-recent-rivals li {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0.1rem;
    padding: 0.26rem 0.22rem !important;
    border-radius: 6px;
    background: rgba(255, 255, 255, 0.02);
    border: 1px solid rgba(255, 255, 255, 0.04);
  }

  #liver-shell.mobile-tab-mode .phone-vs-recent-rival__name,
  #lp-phone-demo .phone-vs-recent-rival__name,
  .phone--demo .phone-vs-recent-rival__name,
  #liver-shell.mobile-tab-mode .phone-vs-recent-rivals li > span,
  #lp-phone-demo .phone-vs-recent-rivals li > span,
  .phone--demo .phone-vs-recent-rivals li > span {
    font-size: 0.84rem !important;
    font-weight: 600;
    line-height: 1.45;
    color: rgba(255, 255, 255, 0.9) !important;
    min-width: 0;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  #liver-shell.mobile-tab-mode .phone-vs-recent-rival__stat,
  #lp-phone-demo .phone-vs-recent-rival__stat,
  .phone--demo .phone-vs-recent-rival__stat,
  #liver-shell.mobile-tab-mode .phone-vs-recent-rivals em,
  #lp-phone-demo .phone-vs-recent-rivals em,
  .phone--demo .phone-vs-recent-rivals em {
    font-size: 0.62rem !important;
    font-style: normal;
    line-height: 1.45;
    color: rgba(255, 255, 255, 0.52) !important;
    white-space: nowrap;
  }

  /* ── 対戦相手別 · 通算（独立カード） ── */
  #liver-shell.mobile-tab-mode .phone-vs-block--opponent-all,
  #lp-phone-demo .phone-vs-block--opponent-all,
  .phone--demo .phone-vs-block--opponent-all {
    border-color: rgba(168, 85, 247, 0.2) !important;
    background: linear-gradient(180deg, rgba(168, 85, 247, 0.05), rgba(255, 255, 255, 0.02)) !important;
  }

  #liver-shell.mobile-tab-mode .phone-vs-opponent-list,
  #lp-phone-demo .phone-vs-opponent-list,
  .phone--demo .phone-vs-opponent-list {
    gap: 0.36rem !important;
  }

  #liver-shell.mobile-tab-mode .phone-vs-opponent,
  #lp-phone-demo .phone-vs-opponent,
  .phone--demo .phone-vs-opponent {
    gap: 0.16rem;
    padding: 0.24rem 0.1rem;
    border-bottom: 1px solid rgba(255, 255, 255, 0.05);
  }

  #liver-shell.mobile-tab-mode .phone-vs-opponent:last-child,
  #lp-phone-demo .phone-vs-opponent:last-child,
  .phone--demo .phone-vs-opponent:last-child {
    border-bottom: none;
  }

  #liver-shell.mobile-tab-mode .phone-vs-opponent__name,
  #lp-phone-demo .phone-vs-opponent__name,
  .phone--demo .phone-vs-opponent__name {
    font-size: 0.84rem !important;
    font-weight: 600;
    line-height: 1.45;
    color: rgba(255, 255, 255, 0.9) !important;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  #liver-shell.mobile-tab-mode .phone-vs-opponent__stat,
  #lp-phone-demo .phone-vs-opponent__stat,
  .phone--demo .phone-vs-opponent__stat {
    font-size: 0.62rem !important;
    line-height: 1.45;
    color: rgba(255, 255, 255, 0.52) !important;
    white-space: nowrap;
  }

  #liver-shell.mobile-tab-mode .phone-vs-opponent__rank,
  #lp-phone-demo .phone-vs-opponent__rank,
  .phone--demo .phone-vs-opponent__rank {
    font-size: 0.78rem;
    margin-bottom: 0.04rem;
  }

  /* ── VS戦績 · 対戦相手別テーブル ── */
  #liver-shell.mobile-tab-mode .phone-opponent-table,
  #lp-phone-demo .phone-opponent-table,
  .phone--demo .phone-opponent-table {
    font-size: 0.64rem !important;
  }

  #liver-shell.mobile-tab-mode .phone-opponent-table th,
  #lp-phone-demo .phone-opponent-table th,
  .phone--demo .phone-opponent-table th,
  #liver-shell.mobile-tab-mode .phone-opponent-table td,
  #lp-phone-demo .phone-opponent-table td,
  .phone--demo .phone-opponent-table td {
    padding: 0.32rem 0.24rem !important;
    line-height: 1.45;
  }

  #liver-shell.mobile-tab-mode .phone-opponent-table th,
  #lp-phone-demo .phone-opponent-table th,
  .phone--demo .phone-opponent-table th {
    font-size: 0.56rem !important;
    color: rgba(255, 255, 255, 0.48) !important;
    white-space: nowrap;
  }

  #liver-shell.mobile-tab-mode .phone-opponent-table td:first-child,
  #lp-phone-demo .phone-opponent-table td:first-child,
  .phone--demo .phone-opponent-table td:first-child {
    max-width: 5.5rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-weight: 600;
    color: rgba(255, 255, 255, 0.86) !important;
  }

  #liver-shell.mobile-tab-mode .phone-opponent-table td:nth-child(5),
  #lp-phone-demo .phone-opponent-table td:nth-child(5),
  .phone--demo .phone-opponent-table td:nth-child(5) {
    font-weight: 600;
    color: rgba(255, 255, 255, 0.72) !important;
    white-space: nowrap;
  }
}