/* MOON_GAMES — 셸 보정 레이어
 * 게임 전용 style.css 뒤에 로드되어, 통합 사이트에서만 필요한 요소를 더한다.
 *   ① 헤더 게임 전환 셀렉터(.game-select)
 *   ② 광고 매체 정합 전환(.ad-pc/.ad-mo/.ad-any) — 8개 게임 CSS 상태가 제각각이라 여기서 통일
 * 게임 고유 스타일은 건드리지 않는다(구 프로젝트 원본 유지). */

/* ---------- 헤더: 게임 전환 ---------- */
.game-select {
  appearance: none;
  border: 1px solid var(--line, #ECECEC);
  background: var(--surface-2, #F6F6F6);
  color: var(--ink, #111);
  height: 34px;
  padding: 0 24px 0 9px;
  border-radius: 7px;
  font: inherit;
  font-size: 14px;
  font-weight: 500;
  max-width: 190px;
  cursor: pointer;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%239AA1AD' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 8px center;
}
.game-select:hover { border-color: var(--line-strong, #D4D4D4); }
[dir="rtl"] .game-select { padding: 0 9px 0 24px; background-position: left 8px center; }

@media (max-width: 600px) {
  .game-select { max-width: 132px; font-size: 13px; }
}

/* ---------- 광고: 매체 정합 ----------
 * PC·모바일 단위를 DOM 에 모두 삽입하고 화면에 맞는 행만 노출한다(심사 봇 대응).
 * .ad-any = 한쪽 매체 인벤토리만 있는 폴백 → 항상 노출. */
.ad-row.ad-mo { display: none; }
.ad-row.ad-pc { display: flex; }
.ad-row.ad-any { display: flex; }
@media (max-width: 719px) {
  .ad-row.ad-pc { display: none; }
  .ad-row.ad-mo { display: flex; }
}

/* 래퍼 규정(§4-1): border-radius·overflow 금지. 폭 제한만 둔다. */
.ad-wrap { margin: 30px auto 0; }
.ad-grid { display: flex; flex-direction: column; align-items: center; gap: 14px; width: 100%; max-width: 672px; margin: 0 auto; }
.ad-grid[data-ad-layout="mixed"] { max-width: 780px; }
.ad-row { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px; width: 100%; }
.ad-cell { max-width: 100%; }