/* ================================================================
   지도 화면 배치 정리 (features/map-chrome) — 2026-10-13 신설
   운영자 지시: 「메인지도의 광고·노선표·지도 중심·알림·레이어 위치가 최적인지」 → 검토 추천안 승인
   (① 오른쪽 아래 출처 겹침 ② 폰 광고가 수도권을 가림 ③ 폰 피더 카드 단추 잘림 · A 광고·피더 카드 한 칸 · B PC 지도 단추 오른쪽 세로).
   ⛔ 원래 모듈(shell.css #mapCtl · sponsor.css .cps · feeder-recruit 주입 CSS)은 고치지 않고 **여기서 덮는다** —
      공용 파일을 여러 세션이 동시에 고치므로 배치 결정을 한 파일에 모은다. 되돌리기 = 이 파일·JS를 빼면 종전 배치.
   ⚠ 이 CSS는 sponsor.css·feeder-recruit 주입 CSS보다 **뒤에서 이겨야** 한다 — 선택자 앞에 html을 붙여 특이도를 올린다.
   ================================================================ */

/* ① 지도 라이브러리 기본 출처(「Leaflet | © OpenStreetMap contributors」)가 오른쪽 아래 저작권 줄과 겹쳐 둘 다 안 읽혔다.
      같은 출처(지도 © OpenStreetMap contributors · 위성 VWorld)는 왼쪽 아래 출처 줄(.credit)이 이미 말한다 → 중복을 숨긴다. */
html .leaflet-control-attribution { display: none !important; }

/* B — PC: 지도 조작(중심·＋·－·내 위치·맞춤)을 왼쪽 아래 가로줄에서 **오른쪽 가장자리 세로 가운데**로.
      오른쪽 위 「레이어·뉴스·회항」과 한 기둥이 되고, 왼쪽 아래는 광고 칸 하나만 남는다. 폰(≤760px)은 이미 오른쪽 세로다. */
@media (min-width: 761px) {
  html #mapCtl, html body.drawer-closed #mapCtl {
    left: auto; right: calc(var(--gap, 14px) + var(--sa-r, 0px));
    top: 50%; bottom: auto; transform: translateY(-50%);
    flex-direction: column; align-items: stretch; gap: 6px;
    transition: right var(--transition-smooth, .25s);
  }
  html #mapCtl .mb { min-width: 40px; text-align: center; }
  html #mapCtl .mb.icon { width: auto; }
  /* 기체 상세(인스펙터)가 열리면 레이어 단추와 같은 식으로 비켜선다 (map-layers.css .mlp-btn과 같은 값) */
  html body.inspector-open #mapCtl { right: calc(var(--insp-w, 430px) + var(--gap, 14px) * 2 + var(--sa-r, 0px)); }

  /* A — 광고 칸: 지도 단추가 빠졌으니 출처 줄 바로 위로 내린다 */
  html .cps { bottom: calc(32px + var(--sa-b, 0px)); }
  /* A — 피더 모집 카드도 **같은 칸**(왼쪽 아래)에 — 둘이 함께 있으면 map-chrome.js가 번갈아 보인다.
     ⚠ feeder-recruit.js가 style.bottom을 직접 쓴다(liftFor) — 그래서 !important로 자리를 고정한다. */
  html .frc-card {
    left: calc(var(--rail-w, 58px) + var(--gap, 14px)); right: auto; width: 300px;
    bottom: calc(32px + var(--sa-b, 0px)) !important;
  }
}

/* 폰(≤760px): 지도 단추 기둥을 한 단(48px) 위로 (2026-10-24 운영자 「아이콘 위치를 조금 더 위로」) — 종전 탭바 위 14px(shell.css #mapCtl) */
@media (max-width: 760px) {
  html #mapCtl, html body.drawer-closed #mapCtl { bottom: calc(var(--tabbar-total, 58px) + var(--gap, 14px) + 48px); }
}

/* ② 폰: 광고를 지도 맨 위(수도권을 가리던 자리)에서 **아래 메뉴 바로 위**로. 오른쪽 60px은 지도 단추 기둥 몫. */
@media (max-width: 640px) {
  html .cps { top: auto; bottom: calc(var(--tabbar-total, 58px) + 8px + var(--sa-b, 0px)); }
}
/* 폰의 피더 배너도 같은 칸(아래 메뉴 위) — 함께 있으면 번갈아 */
@media (max-width: 460px) {
  html .frc-card { bottom: calc(var(--tabbar-total, 58px) + 8px + var(--sa-b, 0px)) !important; }
  /* ③ 단추 넷이 한 줄에 안 들어가 「커버리지」가 잘렸다 → 두 줄로 접는다 */
  html .frc-card .frc-acts { flex-wrap: wrap; row-gap: 4px; }
}

/* 번갈아 보이기 — 지금 차례가 아닌 카드 (map-chrome.js가 붙였다 뗀다) */
html .mc-slot-off { display: none !important; }

/* ④ 방문자 수 — 헤더 알약 (2026-10-13 23:00 운영자 「누적은 지도에서 지우고 상단에 누적을 추가」).
   지도 오른쪽 아래 #visitLine(범례와 겹치던 줄 — v3 에서 범례를 올려 피했다)을 헤더 「인천 FIR N대」 알약 옆 #visitPill 로 옮겼다.
   상자 모양은 shell.css .hdr-pill 이 정본 — 여기서는 글자만 한 단 작게(주인공은 옆의 교통 건수다).
   폰은 헤더 폭이 모자라 감춘다(관리자만 보는 숫자 — 관리자 통계 「방문」에 같은 값이 있다). */
html .visitPill { font-size: var(--fs-sm); cursor: default; }
@media (max-width: 760px) {
  html .visitPill { display: none !important; }
}