/* ============================================================
   BIGWINNER — 방송 화면 10칸 격자 (형 지시 0913: "방송 노출 10개가 다 같이")
   폰/태블릿(<1024) 전용. PC(>=1024)는 css/pc.css 의 html.pc 규칙이 담당한다.
   기존 DOM/데이터 그대로, 배치만 2열 × 5줄로 통일. 문구 0.
   ============================================================ */

@media (max-width:1023px){
  .bwLiveGrid{
    --bg-gap:10px;
    --bg-r:12px;
    --bg-ar:16 / 9;
    --bg-fs-name:12px;
    --bg-fs-sub:10px;
    --bg-fs-badge:8px;
    --bg-play:34px;

    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:var(--bg-gap);
    align-items:start;
    margin-bottom:14px;
  }

  /* 기존 1 + 2 + 3 + 4 줄 컨테이너를 격자에 녹여서 카드 10장이 직접 칸을 차지 */
  .bwLive2, .bwLive3, .bwLive4{ display:contents !important; }

  .bwLiveCard{
    min-width:0; margin:0 !important;
    transition:transform 200ms cubic-bezier(.2,.7,.2,1);
  }
  .bwLiveCard:active{ transform:scale(.985); }

  /* 미리보기 칸 — 전부 16:9 */
  .bwLiveCard > div:first-child{
    height:auto !important; aspect-ratio:var(--bg-ar);
    margin-bottom:6px !important; border-radius:var(--bg-r) !important;
  }
  .bwLiveCard > div:first-child video{ object-fit:cover; }

  /* 이름 줄 */
  .bwLiveCard > div:nth-child(2){
    font-size:var(--bg-fs-name) !important; text-align:left !important;
    line-height:1.35; padding:0 2px;
  }
  .bwLiveCard > div:nth-child(2) span{ font-size:var(--bg-fs-sub) !important; }

  /* 1번 칸(피처드)은 원래 크게 보이던 카드 — 같은 크기로 맞추고 겉치레만 축소 */
  .bwLiveFeat{ border-radius:var(--bg-r) !important; }
  .bwLiveFeat > div:first-child > div:nth-child(3){ top:6px !important; left:6px !important; gap:4px !important; }
  .bwLiveFeat > div:first-child > div:nth-child(3) > div{ padding:3px 6px !important; border-radius:6px !important; }
  .bwLiveFeat > div:first-child > div:nth-child(3) span{ font-size:var(--bg-fs-badge) !important; }
  .bwLiveFeat > div:first-child > div:nth-child(3) svg{ width:9px; height:9px; }
  /* 칸이 좁아 LIVE·시청자 뱃지와 겹친다 — 격자에서는 파트너 뱃지를 숨긴다(큰 화면/플레이어에는 그대로) */
  .bwLiveFeat > div:first-child > div:nth-child(4){ display:none !important; }
  .bwLiveFeat > div:first-child > div:nth-child(5){
    width:var(--bg-play) !important; height:var(--bg-play) !important; top:42% !important;
  }
  .bwLiveFeat > div:first-child > div:nth-child(5) svg{ width:13px; height:13px; }
  .bwLiveFeat > div:first-child > div:nth-child(6){ bottom:6px !important; left:8px !important; right:8px !important; }
  .bwLiveFeat > div:first-child > div:nth-child(6) > div:first-child{
    font-size:var(--bg-fs-name) !important; margin-bottom:1px !important;
  }
  .bwLiveFeat > div:first-child > div:nth-child(6) > div:last-child{ font-size:9px !important; }

  /* 2칸짜리였던 카드의 LIVE·시청자 뱃지도 같은 눈금으로 */
  .bwLive2 .bwLiveCard > div:first-child > span{ font-size:var(--bg-fs-badge) !important; padding:2px 6px !important; }
}

@media (prefers-reduced-motion:reduce){
  .bwLiveCard{ transition:none !important; }
  .bwLiveCard:active{ transform:none !important; }
}