/* =====================================================================
   v230 — 전투필드 우측 잘림 + 숨김 스크롤 최종 보정

   1) 핸드 카드와 전투필드 카드의 폭/높이를 동일한 v216 변수로 고정한다.
   2) 이전 v229의 1fr 슬롯 축소 규칙을 제거하고 카드가 찌그러지지 않게 한다.
   3) boardwrap/layout/board에 남은 height:100% + overflow:hidden 조합을 해제한다.
   4) battle-panel만 세로 스크롤 컨테이너로 사용하고 스크롤바는 숨긴다.
   ===================================================================== */
@media (min-width:851px){
  /* 이전 낮은 화면용 app 폭(1048px)과 최신 401px + 822px 열의 충돌 제거 */
  body.unified-left-layout:not(.ui-mode-mobile-preview) .app,
  body.unified-left-layout:not(.ui-mode-mobile-preview) .app[style]{
    display:grid!important;
    grid-template-columns:401px minmax(0,1fr)!important;
    column-gap:0!important;
    gap:0!important;
    width:100%!important;
    min-width:0!important;
    max-width:none!important;
    height:100vh!important;
    min-height:720px!important;
    margin:0!important;
    padding:4px!important;
    overflow:hidden!important;
    box-sizing:border-box!important;
  }

  /* 실제 스크롤 담당: 전투 패널 하나만 사용 */
  body.unified-left-layout:not(.ui-mode-mobile-preview) .battle-panel{
    display:flex!important;
    flex-direction:column!important;
    align-items:stretch!important;
    width:100%!important;
    min-width:0!important;
    max-width:none!important;
    height:calc(100vh - 8px)!important;
    min-height:0!important;
    overflow-x:hidden!important;
    overflow-y:auto!important;
    overscroll-behavior-y:contain!important;
    touch-action:pan-y!important;
    scrollbar-width:none!important;
    -ms-overflow-style:none!important;
  }
  body.unified-left-layout:not(.ui-mode-mobile-preview) .battle-panel::-webkit-scrollbar{
    width:0!important;
    height:0!important;
    display:none!important;
  }

  /* 중첩 overflow/고정 높이를 해제하여 전체 보드 높이가 패널 스크롤에 반영되게 한다. */
  body.unified-left-layout:not(.ui-mode-mobile-preview) .battle-panel .boardwrap{
    position:relative!important;
    flex:0 0 auto!important;
    align-self:stretch!important;
    width:100%!important;
    min-width:0!important;
    max-width:none!important;
    height:auto!important;
    min-height:100%!important;
    max-height:none!important;
    margin:0!important;
    padding:0!important;
    overflow:visible!important;
    box-sizing:border-box!important;
  }
  body.unified-left-layout:not(.ui-mode-mobile-preview) .battle-panel .battlefield-layout{
    display:block!important;
    width:100%!important;
    min-width:0!important;
    max-width:none!important;
    height:auto!important;
    min-height:0!important;
    max-height:none!important;
    margin:0!important;
    padding:0!important;
    overflow:visible!important;
    box-sizing:border-box!important;
  }
  body.unified-left-layout:not(.ui-mode-mobile-preview) .battle-panel .battlefield-layout>.board{
    display:flex!important;
    flex-direction:column!important;
    align-items:stretch!important;
    justify-content:flex-start!important;
    width:100%!important;
    min-width:0!important;
    max-width:none!important;
    height:auto!important;
    min-height:0!important;
    max-height:none!important;
    margin:0!important;
    padding:8px 6px 20px!important;
    gap:6px!important;
    overflow:visible!important;
    box-sizing:border-box!important;
  }

  /* 모든 행의 오른쪽 테두리가 board 안쪽에서 끝나도록 고정한다. */
  body.unified-left-layout:not(.ui-mode-mobile-preview) .battle-panel .battlefield-layout>.board>.lane,
  body.unified-left-layout:not(.ui-mode-mobile-preview) .battle-panel .battlefield-layout>.board>.hq-battle-row,
  body.unified-left-layout:not(.ui-mode-mobile-preview) .battle-panel .battlefield-layout>.board>.hq-defense-lane,
  body.unified-left-layout:not(.ui-mode-mobile-preview) .battle-panel .battlefield-layout>.board>.enemy-hq-row,
  body.unified-left-layout:not(.ui-mode-mobile-preview) .battle-panel .battlefield-layout>.board>.ally-hq-row,
  body.unified-left-layout:not(.ui-mode-mobile-preview) .battle-panel .battlefield-layout>.board>#enemyBaseDefenseLane,
  body.unified-left-layout:not(.ui-mode-mobile-preview) .battle-panel .battlefield-layout>.board>#allyBaseDefenseLane,
  body.unified-left-layout:not(.ui-mode-mobile-preview) .battle-panel .battlefield-layout>.board>.lane[data-row]{
    align-self:stretch!important;
    width:100%!important;
    min-width:0!important;
    max-width:none!important;
    margin-left:0!important;
    margin-right:0!important;
    box-sizing:border-box!important;
  }
  body.unified-left-layout:not(.ui-mode-mobile-preview) .battle-panel .battlefield-layout>.board>.lane{
    overflow:visible!important;
  }

  /* 핸드와 필드가 반드시 같은 카드 크기를 사용하도록 공통 변수로 고정 */
  body.unified-left-layout:not(.ui-mode-mobile-preview) .left-hand-host #hand.hand .card,
  body.unified-left-layout:not(.ui-mode-mobile-preview) .battle-panel .battlefield-layout .slot,
  body.unified-left-layout:not(.ui-mode-mobile-preview) .battle-panel .battlefield-layout .hq-field-slot{
    flex:0 0 var(--v216-card-w,129.789px)!important;
    width:var(--v216-card-w,129.789px)!important;
    min-width:var(--v216-card-w,129.789px)!important;
    max-width:var(--v216-card-w,129.789px)!important;
    height:var(--v216-card-h,201.894px)!important;
    min-height:var(--v216-card-h,201.894px)!important;
    max-height:var(--v216-card-h,201.894px)!important;
    aspect-ratio:2.7 / 4.2!important;
    box-sizing:border-box!important;
  }

  /* 슬롯 그리드는 카드 자체를 줄이지 않고 필요한 고정 폭만 차지한다. */
  body.unified-left-layout:not(.ui-mode-mobile-preview) .battle-panel .battlefield-layout .slots,
  body.unified-left-layout:not(.ui-mode-mobile-preview) .battle-panel .battlefield-layout .hq-battlefield-grid{
    --v230-field-gap:2px;
    display:grid!important;
    height:var(--v216-card-h,201.894px)!important;
    min-height:var(--v216-card-h,201.894px)!important;
    max-height:var(--v216-card-h,201.894px)!important;
    padding:0!important;
    gap:var(--v230-field-gap)!important;
    justify-content:center!important;
    justify-items:center!important;
    align-items:stretch!important;
    align-content:stretch!important;
    margin-left:auto!important;
    margin-right:auto!important;
    overflow:visible!important;
    box-sizing:border-box!important;
  }
  body.unified-left-layout:not(.ui-mode-mobile-preview) .battle-panel .battlefield-layout .slots.n5,
  body.unified-left-layout:not(.ui-mode-mobile-preview) .battle-panel .battlefield-layout .hq-battlefield-grid{
    grid-template-columns:repeat(5,var(--v216-card-w,129.789px))!important;
    width:calc((var(--v216-card-w,129.789px) * 5) + (var(--v230-field-gap) * 4))!important;
    min-width:calc((var(--v216-card-w,129.789px) * 5) + (var(--v230-field-gap) * 4))!important;
    max-width:calc((var(--v216-card-w,129.789px) * 5) + (var(--v230-field-gap) * 4))!important;
  }
  body.unified-left-layout:not(.ui-mode-mobile-preview) .battle-panel .battlefield-layout .slots.n4{
    grid-template-columns:repeat(4,var(--v216-card-w,129.789px))!important;
    width:calc((var(--v216-card-w,129.789px) * 4) + (var(--v230-field-gap) * 3))!important;
    min-width:calc((var(--v216-card-w,129.789px) * 4) + (var(--v230-field-gap) * 3))!important;
    max-width:calc((var(--v216-card-w,129.789px) * 4) + (var(--v230-field-gap) * 3))!important;
  }
  body.unified-left-layout:not(.ui-mode-mobile-preview) .battle-panel .battlefield-layout .slots.n3{
    grid-template-columns:repeat(3,var(--v216-card-w,129.789px))!important;
    width:calc((var(--v216-card-w,129.789px) * 3) + (var(--v230-field-gap) * 2))!important;
    min-width:calc((var(--v216-card-w,129.789px) * 3) + (var(--v230-field-gap) * 2))!important;
    max-width:calc((var(--v216-card-w,129.789px) * 3) + (var(--v230-field-gap) * 2))!important;
  }
  body.unified-left-layout:not(.ui-mode-mobile-preview) .battle-panel .battlefield-layout .slots.n2{
    grid-template-columns:repeat(2,var(--v216-card-w,129.789px))!important;
    width:calc((var(--v216-card-w,129.789px) * 2) + var(--v230-field-gap))!important;
    min-width:calc((var(--v216-card-w,129.789px) * 2) + var(--v230-field-gap))!important;
    max-width:calc((var(--v216-card-w,129.789px) * 2) + var(--v230-field-gap))!important;
  }

  body.unified-left-layout:not(.ui-mode-mobile-preview) .battle-panel .battlefield-layout .slot,
  body.unified-left-layout:not(.ui-mode-mobile-preview) .battle-panel .battlefield-layout .hq-field-slot{
    margin:0!important;
    padding:0!important;
    overflow:hidden!important;
  }
  body.unified-left-layout:not(.ui-mode-mobile-preview) .battle-panel .battlefield-layout .slot>.unit,
  body.unified-left-layout:not(.ui-mode-mobile-preview) .battle-panel .battlefield-layout .hq-field-slot>.unit,
  body.unified-left-layout:not(.ui-mode-mobile-preview) .battle-panel .battlefield-layout .hq-field-slot>.base-unit{
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    height:100%!important;
    min-height:0!important;
    max-height:100%!important;
    box-sizing:border-box!important;
  }
}
