.battle-lineup-view {
  position: fixed;
  inset: auto;
  left: calc(var(--battle-lineup-center-x, 50vw) - var(--battle-lineup-width, min(366px, calc(100vw - 24px))) / 2);
  top: calc(var(--battle-lineup-center-y, 50dvh) - var(--battle-lineup-height, min(600px, calc(100dvh - 24px))) / 2);
  width: var(--battle-lineup-width, min(366px, calc(100vw - 24px)));
  max-width: calc(100vw - 16px);
  height: var(--battle-lineup-height, min(600px, calc(100dvh - 24px)));
  min-height: var(--battle-lineup-height, min(600px, calc(100dvh - 24px)));
  max-height: var(--battle-lineup-height, min(600px, calc(100dvh - 24px)));
  margin: 0;
  padding: 0;
  overflow: hidden;
  border: 1px solid #e3e5e7;
  border-radius: 0;
  color: #29323e;
  background: #fff;
  overscroll-behavior: contain;
  transform: none;
}

.battle-lineup-view[open] { display: flex; flex-direction: column; }
.battle-lineup-view::backdrop { background: rgb(25 33 43 / 62%); }
.battle-lineup-view [hidden] { display: none !important; }
.battle-lineup-view__header {
  position: relative;
  z-index: 2;
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 12px 14px;
  border-bottom: 1px solid #f3d2dc;
  background: #fff;
}
.battle-lineup-view__header > div { min-width: 0; }
.battle-lineup-view__header small { color: #ee7396; font-size: 11px; }
.battle-lineup-view__header h2 { margin: 3px 0 0; font-size: 18px; line-height: 1.35; overflow-wrap: anywhere; }
.battle-lineup-view__header button {
  flex: 0 0 36px;
  height: 36px;
  border: 1px solid #e3e5e7;
  border-radius: 0;
  color: #757d89;
  background: #fff;
  font-size: 26px;
  cursor: pointer;
}
.battle-lineup-view__main, .battle-lineup-view__detail {
  flex: 1 1 auto;
  min-width: 0;
  min-height: 0;
  padding: 10px 12px 12px;
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  overflow-anchor: none;
  scrollbar-width: none;
}
.battle-lineup-view__main::-webkit-scrollbar,
.battle-lineup-view__detail::-webkit-scrollbar { display: none; }
.battle-lineup-view__main { display: flex; flex-direction: column; gap: 8px; }
.battle-lineup-view .lineup-slots { flex: 0 0 auto; gap: 6px; padding: 2px 1px 4px; }
.battle-lineup-view .lineup-slot,
.battle-lineup-view .lineup-system-slot { flex: 0 0 44px; width: 44px; height: 44px; }
.battle-lineup-view .lineup-slot--substitute { margin-left: 4px; }
.battle-lineup-view .lineup-slot--substitute:not(.has-member)::after { content: none; }
.battle-lineup-view .lineup-system-slot { padding: 3px 2px; }
.battle-lineup-view .lineup-main-pet__icon { width: 24px; height: 24px; }
.battle-lineup-view .lineup-system-slot > small { font-size: 8px; }
.battle-lineup-view .lineup-page__header { flex: 0 0 auto; height: 34px; gap: 8px; margin: 0; padding-bottom: 6px; }
.battle-lineup-view .lineup-page__header h3 { margin: 0; font-size: 13px; white-space: nowrap; }
.battle-lineup-view [data-battle-lineup-count] { margin-left: 4px; color: #9096a0; font-size: 11px; font-weight: 400; }
.battle-lineup-view .lineup-page__tools { gap: 6px; }
.battle-lineup-view .lineup-environment-card { min-width: 54px; padding-inline: 6px; font-size: 11px; }
.battle-lineup-view .lineup-member { display: flex; flex-direction: column; flex: 1 0 182px; min-height: 182px; max-height: 310px; margin: 0; }
.battle-lineup-view .lineup-member__art { flex: 1 1 140px; min-height: 140px; height: auto; }
.battle-lineup-view .lineup-member__art img { width: 96%; height: 96%; max-height: 96%; }
.battle-lineup-view .lineup-member__info { flex: 0 0 40px; height: 40px; gap: 8px; padding: 0 10px; }
.battle-lineup-view .lineup-member__info strong { flex: 1; font-size: 14px; }
.battle-lineup-view .lineup-member__info span { margin-left: 0; font-size: 11px; }
.battle-lineup-view .lineup-attribute { flex-basis: 54px; width: 54px; margin-left: 0; height: 28px; }
.battle-lineup-view .lineup-actions { flex: 0 0 34px; height: 34px; margin: 0; grid-template-columns: repeat(4, minmax(0, 1fr)); }
.battle-lineup-view__skin, .battle-lineup-view__note {
  flex: 0 0 auto;
  margin: 0;
  color: #8c929d;
  font-size: 11px;
  line-height: 1.5;
}
.battle-lineup-view__back {
  padding: 9px 12px;
  border: 1px solid #f5b4c8;
  border-radius: 0;
  color: #ee7396;
  background: #fff;
  font-size: 13px;
  cursor: pointer;
}
.battle-lineup-view__detail h3 { margin: 18px 0; font-size: 18px; }
.battle-lineup-view__detail > div > p { font-size: 13px; line-height: 1.6; }
.battle-lineup-view__info-card {
  min-height: 56px;
  margin: 10px 0;
  padding: 12px;
  border: 1px solid #e7e9ed;
  overflow: hidden;
}
.battle-lineup-view__info-card h4 { margin: 0 0 7px; font-size: 13px; line-height: 1.6; }
.battle-lineup-view__info-card p { margin: 0; color: #68717e; font-size: 12px; line-height: 1.8; }
.battle-lineup-view__info-card.is-locked { background: #f7f8fa; }
.battle-lineup-view__equipment-icon { float: left; width: 58px; height: 58px; margin: 0 12px 8px 0; object-fit: contain; }
.battle-lineup-view .lineup-member__stats { margin: 0 0 16px; }
.battle-lineup-view .lineup-member__stats > div { min-height: 50px; }
.battle-lineup-view button:focus-visible { outline: 2px solid #f17b9d; outline-offset: 2px; }
.pvp-settlement__actions #pvp-settlement-opponent-lineup { grid-column: 1 / -1; color: #fff; background: #fa7298; }
@media (max-width: 600px), (pointer: coarse) {
  .battle-lineup-view__header h2 { font-size: 20px; }
  .battle-lineup-view__header button { flex-basis: 40px; height: 40px; }
  .battle-lineup-view .lineup-member { flex-basis: 220px; max-height: 380px; }
  .battle-lineup-view .lineup-member__info strong { font-size: 16px; }
  .battle-lineup-view .lineup-member__info span,
  .battle-lineup-view__skin, .battle-lineup-view__note { font-size: 13px; }
  .battle-lineup-view .lineup-actions { flex-basis: 40px; height: 40px; }
  .battle-lineup-view__info-card h4, .battle-lineup-view__info-card p { font-size: 14px; }
}