
/* v201 — 카드상점/부스터 동일 높이 · 카드연출창 축소 · 모바일 전투열/상태 보정 */

/* 공통: 카드 상점/부스터팩 모달 높이 동일 */
.card-shop-box,
#boosterPackModal .modalbox{
  height:min(92vh,860px)!important;
  max-height:min(92vh,860px)!important;
}
.top-card-actions .btn,
#mobileDeckMenu .mobile-menu-actions .btn{
  min-height:31px!important;
  height:31px!important;
  max-height:31px!important;
}

/* PC: 카드 연출창 10% 축소 + 전투열 카드 하단 가림 보정 */
@media (min-width:851px){
  body.unified-left-layout:not(.ui-mode-mobile-preview) .left-card-effect-body{
    height:251px!important;
    min-height:251px!important;
    max-height:251px!important;
  }
  body.unified-left-layout:not(.ui-mode-mobile-preview) .battle-panel .battlefield-layout>.board>.lane:not(.hq-defense-lane),
  body.unified-left-layout:not(.ui-mode-mobile-preview) .battle-panel .hq-defense-lane.active{
    height:auto!important;
    min-height:calc(var(--v193-card-h,132px) + 14px)!important;
    padding-top:3px!important;
    padding-bottom:5px!important;
    overflow:visible!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,
  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,
  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{
    overflow:visible!important;
  }
}
@media (min-width:851px) and (max-height:900px){
  body.unified-left-layout:not(.ui-mode-mobile-preview) .left-card-effect-body{
    height:238px!important;
    min-height:238px!important;
    max-height:238px!important;
  }
}

/* 모바일 실기기 + PC 미리보기 공통 보정 */
@media (max-width:850px){
  :root{
    --v201-mobile-gap:2px;
    --v201-mobile-side:8px;
    --v201-mobile-card-w:calc((100vw - (var(--v201-mobile-side) * 2) - (var(--v201-mobile-gap) * 4)) / 5);
    --v201-mobile-card-h:calc(var(--v201-mobile-card-w) * 48 / 33);
    --v201-mobile-hand-height:calc(var(--v201-mobile-card-h) + 28px);
    --v201-mobile-status-h:68px;
  }
  body.ui-mode-mobile:not(.prebattle) .mobile-combat-summary,
  body.ui-mode-mobile:not(.prebattle) #enemyHqMount,
  body.ui-mode-mobile:not(.prebattle) .enemy-hq-mount,
  body.ui-mode-mobile:not(.prebattle) .enemy-hq-row,
  body.ui-mode-mobile-preview:not(.prebattle) .mobile-combat-summary,
  body.ui-mode-mobile-preview:not(.prebattle) #enemyHqMount,
  body.ui-mode-mobile-preview:not(.prebattle) .enemy-hq-mount,
  body.ui-mode-mobile-preview:not(.prebattle) .enemy-hq-row{
    display:none!important;
  }

  body.ui-mode-mobile:not(.prebattle) .battlefield-layout>.board,
  body.ui-mode-mobile-preview:not(.prebattle) .battlefield-layout>.board{
    gap:4px!important;
  }
  body.ui-mode-mobile:not(.prebattle) .battlefield-layout>.board>.lane:not(.hq-defense-lane),
  body.ui-mode-mobile-preview:not(.prebattle) .battlefield-layout>.board>.lane:not(.hq-defense-lane),
  body.ui-mode-mobile:not(.prebattle) .hq-defense-lane.active,
  body.ui-mode-mobile-preview:not(.prebattle) .hq-defense-lane.active{
    box-sizing:border-box!important;
    min-height:calc(var(--v201-mobile-card-h) + 10px)!important;
    height:auto!important;
    padding:3px 4px 5px!important;
    overflow:visible!important;
  }

  body.ui-mode-mobile:not(.prebattle) .battlefield-layout .slots,
  body.ui-mode-mobile-preview:not(.prebattle) .battlefield-layout .slots,
  body.ui-mode-mobile:not(.prebattle) .battlefield-layout .hq-battlefield-grid,
  body.ui-mode-mobile-preview:not(.prebattle) .battlefield-layout .hq-battlefield-grid{
    width:100%!important;
    max-width:100%!important;
    margin:0 auto!important;
    gap:var(--v201-mobile-gap)!important;
    padding:0!important;
    justify-content:space-between!important;
    align-items:stretch!important;
    overflow:visible!important;
    box-sizing:border-box!important;
  }
  body.ui-mode-mobile:not(.prebattle) .battlefield-layout .slots.n5,
  body.ui-mode-mobile-preview:not(.prebattle) .battlefield-layout .slots.n5,
  body.ui-mode-mobile:not(.prebattle) .battlefield-layout .hq-battlefield-grid,
  body.ui-mode-mobile-preview:not(.prebattle) .battlefield-layout .hq-battlefield-grid{
    grid-template-columns:repeat(5,var(--v201-mobile-card-w))!important;
  }
  body.ui-mode-mobile:not(.prebattle) .battlefield-layout .slots.n4,
  body.ui-mode-mobile-preview:not(.prebattle) .battlefield-layout .slots.n4{grid-template-columns:repeat(4,var(--v201-mobile-card-w))!important;}
  body.ui-mode-mobile:not(.prebattle) .battlefield-layout .slots.n3,
  body.ui-mode-mobile-preview:not(.prebattle) .battlefield-layout .slots.n3{grid-template-columns:repeat(3,var(--v201-mobile-card-w))!important;}
  body.ui-mode-mobile:not(.prebattle) .battlefield-layout .slots.n2,
  body.ui-mode-mobile-preview:not(.prebattle) .battlefield-layout .slots.n2{grid-template-columns:repeat(2,var(--v201-mobile-card-w))!important;}

  body.ui-mode-mobile:not(.prebattle) .battlefield-layout .slot,
  body.ui-mode-mobile-preview:not(.prebattle) .battlefield-layout .slot,
  body.ui-mode-mobile:not(.prebattle) .battlefield-layout .hq-field-slot,
  body.ui-mode-mobile-preview:not(.prebattle) .battlefield-layout .hq-field-slot,
  body.ui-mode-mobile:not(.prebattle) .mobile-hand-mount #hand.hand .card,
  body.ui-mode-mobile-preview:not(.prebattle) .mobile-hand-mount #hand.hand .card{
    width:var(--v201-mobile-card-w)!important;
    min-width:var(--v201-mobile-card-w)!important;
    max-width:var(--v201-mobile-card-w)!important;
    height:var(--v201-mobile-card-h)!important;
    min-height:var(--v201-mobile-card-h)!important;
    max-height:var(--v201-mobile-card-h)!important;
    aspect-ratio:33 / 48!important;
    overflow:visible!important;
  }
  body.ui-mode-mobile:not(.prebattle) .battlefield-layout .slot>.unit,
  body.ui-mode-mobile-preview:not(.prebattle) .battlefield-layout .slot>.unit,
  body.ui-mode-mobile:not(.prebattle) .battlefield-layout .hq-field-slot>.unit,
  body.ui-mode-mobile-preview:not(.prebattle) .battlefield-layout .hq-field-slot>.unit{
    overflow:visible!important;
  }

  /* 핸드도 동일 크기 */
  body.ui-mode-mobile:not(.prebattle) .mobile-hand-mount,
  body.ui-mode-mobile-preview:not(.prebattle) .mobile-hand-mount{
    height:var(--v201-mobile-hand-height)!important;
    min-height:var(--v201-mobile-hand-height)!important;
    max-height:var(--v201-mobile-hand-height)!important;
  }
  body.ui-mode-mobile:not(.prebattle) .mobile-hand-mount #hand.hand,
  body.ui-mode-mobile-preview:not(.prebattle) .mobile-hand-mount #hand.hand{
    height:var(--v201-mobile-card-h)!important;
    min-height:var(--v201-mobile-card-h)!important;
    max-height:var(--v201-mobile-card-h)!important;
    gap:var(--v201-mobile-gap)!important;
    padding:0 var(--v201-mobile-side)!important;
    justify-content:flex-start!important;
    overflow:hidden!important;
    box-sizing:border-box!important;
  }

  /* 모바일 상태를 버튼 위에 표시하고 버튼은 더 작게 */
  body.ui-mode-mobile:not(.prebattle) .bottom-hud,
  body.ui-mode-mobile-preview:not(.prebattle) .bottom-hud{
    display:grid!important;
    grid-template-rows:26px 34px!important;
    gap:4px!important;
    height:var(--v201-mobile-status-h)!important;
    min-height:var(--v201-mobile-status-h)!important;
    max-height:var(--v201-mobile-status-h)!important;
    padding:4px 6px!important;
    bottom:var(--v201-mobile-hand-height)!important;
    overflow:hidden!important;
  }
  body.ui-mode-mobile:not(.prebattle) .bottom-hud .mobile-bottom-status-row,
  body.ui-mode-mobile-preview:not(.prebattle) .bottom-hud .mobile-bottom-status-row{
    display:grid!important;
    grid-template-columns:1fr 1fr!important;
    gap:4px!important;
    width:100%!important;
    height:26px!important;
    min-height:26px!important;
    max-height:26px!important;
  }
  body.ui-mode-mobile:not(.prebattle) .bottom-hud .mini-quickbar,
  body.ui-mode-mobile-preview:not(.prebattle) .bottom-hud .mini-quickbar{
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;
    gap:3px!important;
    min-width:0!important;
    padding:2px 4px!important;
    border:1px solid rgba(255,255,255,.12)!important;
    border-radius:6px!important;
    background:rgba(0,0,0,.34)!important;
    overflow:hidden!important;
  }
  body.ui-mode-mobile:not(.prebattle) .bottom-hud .mini-quickbar-label,
  body.ui-mode-mobile-preview:not(.prebattle) .bottom-hud .mini-quickbar-label{font-size:8px!important;}
  body.ui-mode-mobile:not(.prebattle) .bottom-hud .mini-quick-stat,
  body.ui-mode-mobile-preview:not(.prebattle) .bottom-hud .mini-quick-stat{font-size:7px!important;gap:1px!important;}
  body.ui-mode-mobile:not(.prebattle) .bottom-hud .mini-quick-stat b,
  body.ui-mode-mobile-preview:not(.prebattle) .bottom-hud .mini-quick-stat b{font-size:8px!important;}
  body.ui-mode-mobile:not(.prebattle) .bottom-hud .hud-status,
  body.ui-mode-mobile-preview:not(.prebattle) .bottom-hud .hud-status{
    display:block!important;
    height:34px!important;
    padding:0!important;
    background:transparent!important;
  }
  body.ui-mode-mobile:not(.prebattle) .bottom-hud .hud-status>:not(.hud-actions),
  body.ui-mode-mobile-preview:not(.prebattle) .bottom-hud .hud-status>:not(.hud-actions){display:none!important;}
  body.ui-mode-mobile:not(.prebattle) .bottom-hud .hud-actions,
  body.ui-mode-mobile-preview:not(.prebattle) .bottom-hud .hud-actions{
    display:grid!important;
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    gap:4px!important;
    width:100%!important;
    height:34px!important;
  }
  body.ui-mode-mobile:not(.prebattle) .bottom-hud .hud-actions .btn,
  body.ui-mode-mobile-preview:not(.prebattle) .bottom-hud .hud-actions .btn{
    min-height:30px!important;
    height:30px!important;
    max-height:30px!important;
    padding:2px 4px!important;
    font-size:9px!important;
  }
  body.ui-mode-mobile:not(.prebattle),
  body.ui-mode-mobile:not(.prebattle) .app,
  body.ui-mode-mobile-preview:not(.prebattle),
  body.ui-mode-mobile-preview:not(.prebattle) .app{
    padding-bottom:calc(var(--v201-mobile-hand-height) + var(--v201-mobile-status-h) + 8px + env(safe-area-inset-bottom,0px))!important;
  }
}

/* PC에서 보는 모바일 미리보기 폭 기준 동일 계산 */
body.ui-mode-mobile-preview:not(.prebattle){
  --v201-mobile-gap:2px;
  --v201-mobile-side:8px;
  --v201-mobile-card-w:calc((var(--mobile-play-width,430px) - (var(--v201-mobile-side) * 2) - (var(--v201-mobile-gap) * 4)) / 5);
  --v201-mobile-card-h:calc(var(--v201-mobile-card-w) * 48 / 33);
  --v201-mobile-hand-height:calc(var(--v201-mobile-card-h) + 28px);
  --v201-mobile-status-h:68px;
}


/* PC에서 모바일 미리보기에도 동일 레이아웃 강제 */
body.ui-mode-mobile-preview:not(.prebattle) .mobile-combat-summary,
body.ui-mode-mobile-preview:not(.prebattle) #enemyHqMount,
body.ui-mode-mobile-preview:not(.prebattle) .enemy-hq-mount,
body.ui-mode-mobile-preview:not(.prebattle) .enemy-hq-row{display:none!important;}
body.ui-mode-mobile-preview:not(.prebattle) .battlefield-layout>.board{gap:4px!important;}
body.ui-mode-mobile-preview:not(.prebattle) .battlefield-layout>.board>.lane:not(.hq-defense-lane),
body.ui-mode-mobile-preview:not(.prebattle) .hq-defense-lane.active{box-sizing:border-box!important;min-height:calc(var(--v201-mobile-card-h) + 10px)!important;height:auto!important;padding:3px 4px 5px!important;overflow:visible!important;}
body.ui-mode-mobile-preview:not(.prebattle) .battlefield-layout .slots,
body.ui-mode-mobile-preview:not(.prebattle) .battlefield-layout .hq-battlefield-grid{width:100%!important;max-width:100%!important;margin:0 auto!important;gap:var(--v201-mobile-gap)!important;padding:0!important;justify-content:space-between!important;align-items:stretch!important;overflow:visible!important;box-sizing:border-box!important;}
body.ui-mode-mobile-preview:not(.prebattle) .battlefield-layout .slots.n5,
body.ui-mode-mobile-preview:not(.prebattle) .battlefield-layout .hq-battlefield-grid{grid-template-columns:repeat(5,var(--v201-mobile-card-w))!important;}
body.ui-mode-mobile-preview:not(.prebattle) .battlefield-layout .slots.n4{grid-template-columns:repeat(4,var(--v201-mobile-card-w))!important;}
body.ui-mode-mobile-preview:not(.prebattle) .battlefield-layout .slots.n3{grid-template-columns:repeat(3,var(--v201-mobile-card-w))!important;}
body.ui-mode-mobile-preview:not(.prebattle) .battlefield-layout .slots.n2{grid-template-columns:repeat(2,var(--v201-mobile-card-w))!important;}
body.ui-mode-mobile-preview:not(.prebattle) .battlefield-layout .slot,
body.ui-mode-mobile-preview:not(.prebattle) .battlefield-layout .hq-field-slot,
body.ui-mode-mobile-preview:not(.prebattle) .mobile-hand-mount #hand.hand .card{width:var(--v201-mobile-card-w)!important;min-width:var(--v201-mobile-card-w)!important;max-width:var(--v201-mobile-card-w)!important;height:var(--v201-mobile-card-h)!important;min-height:var(--v201-mobile-card-h)!important;max-height:var(--v201-mobile-card-h)!important;aspect-ratio:33 / 48!important;overflow:visible!important;}
body.ui-mode-mobile-preview:not(.prebattle) .mobile-hand-mount{height:var(--v201-mobile-hand-height)!important;min-height:var(--v201-mobile-hand-height)!important;max-height:var(--v201-mobile-hand-height)!important;}
body.ui-mode-mobile-preview:not(.prebattle) .mobile-hand-mount #hand.hand{height:var(--v201-mobile-card-h)!important;min-height:var(--v201-mobile-card-h)!important;max-height:var(--v201-mobile-card-h)!important;gap:var(--v201-mobile-gap)!important;padding:0 var(--v201-mobile-side)!important;justify-content:flex-start!important;overflow:hidden!important;box-sizing:border-box!important;}
body.ui-mode-mobile-preview:not(.prebattle) .bottom-hud{display:grid!important;grid-template-rows:26px 34px!important;gap:4px!important;height:var(--v201-mobile-status-h)!important;min-height:var(--v201-mobile-status-h)!important;max-height:var(--v201-mobile-status-h)!important;padding:4px 6px!important;bottom:var(--v201-mobile-hand-height)!important;overflow:hidden!important;}
body.ui-mode-mobile-preview:not(.prebattle) .bottom-hud .mobile-bottom-status-row{display:grid!important;grid-template-columns:1fr 1fr!important;gap:4px!important;width:100%!important;height:26px!important;min-height:26px!important;max-height:26px!important;}
body.ui-mode-mobile-preview:not(.prebattle) .bottom-hud .mini-quickbar{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:3px!important;min-width:0!important;padding:2px 4px!important;border:1px solid rgba(255,255,255,.12)!important;border-radius:6px!important;background:rgba(0,0,0,.34)!important;overflow:hidden!important;}
body.ui-mode-mobile-preview:not(.prebattle) .bottom-hud .mini-quickbar-label{font-size:8px!important;}
body.ui-mode-mobile-preview:not(.prebattle) .bottom-hud .mini-quick-stat{font-size:7px!important;gap:1px!important;}
body.ui-mode-mobile-preview:not(.prebattle) .bottom-hud .mini-quick-stat b{font-size:8px!important;}
body.ui-mode-mobile-preview:not(.prebattle) .bottom-hud .hud-status{display:block!important;height:34px!important;padding:0!important;background:transparent!important;}
body.ui-mode-mobile-preview:not(.prebattle) .bottom-hud .hud-status>:not(.hud-actions){display:none!important;}
body.ui-mode-mobile-preview:not(.prebattle) .bottom-hud .hud-actions{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:4px!important;width:100%!important;height:34px!important;}
body.ui-mode-mobile-preview:not(.prebattle) .bottom-hud .hud-actions .btn{min-height:30px!important;height:30px!important;max-height:30px!important;padding:2px 4px!important;font-size:9px!important;}
body.ui-mode-mobile-preview:not(.prebattle),
body.ui-mode-mobile-preview:not(.prebattle) .app{padding-bottom:calc(var(--v201-mobile-hand-height) + var(--v201-mobile-status-h) + 8px)!important;}
