/* 고향·지역구 고르기의 폰 배치(2026-10-20). 지도와 도 9개를 나란히, 그 아래 구를 2열 작은 칸으로 두어 한 화면에 들어가게 한다.
   PC(601px 이상)는 css/geo.css 배치 그대로. 같은 틀을 쓰는 '지역구 옮기기' 창(.in-sheet)도 함께 바뀐다. */
.geo-pick { display: none; }
@media (max-width: 600px) {
  .geo-create { grid-template-columns: minmax(0, 38%) minmax(0, 1fr); grid-template-areas: "map regs" "info info" "dists dists" "pick pick"; gap: 8px 10px; }
  .geo-create .geo-left { grid-area: map; }
  .geo-create .geo-right { display: contents; }
  .geo-create .geo-regs { grid-area: regs; display: grid; grid-template-columns: 1fr 1fr; gap: 5px; align-content: start; }
  .geo-create .geo-reg { justify-content: flex-start; min-width: 0; padding: 6px 7px; border-radius: 9px; font-size: 12.5px; line-height: 1.15; text-align: left; overflow-wrap: break-word; }   /* 영어 'Taegyeong Special City'처럼 긴 이름은 칸 안에서 줄을 바꾼다 */
  .geo-create .geo-reg::before { flex: none; }
  :lang(en) .geo-create { grid-template-columns: minmax(0, 33%) minmax(0, 1fr); }
  :lang(en) .geo-create .geo-reg { font-size: 11px; padding: 5px 6px; gap: 4px; letter-spacing: -.01em; }
  .geo-create .geo-info { grid-area: info; font-size: 12px; }
  .geo-create .geo-dists, .geo-create .choices { grid-area: dists; }
  .geo-create .geo-dists { grid-template-columns: 1fr 1fr; gap: 6px; }
  .geo-create .geo-opt { padding: 8px 10px; border-radius: 10px; gap: 1px; }
  .geo-create .geo-opt b { font-size: 15px; }
  .geo-create .geo-opt small { font-size: 11px; }
  .geo-create .geo-opt .geo-type { display: none; }
  .geo-pick { grid-area: pick; display: block; margin: 0; font-size: 12.5px; color: var(--muted); } .geo-pick b { color: var(--ink); }
  .geo-leg { gap: 2px 8px; font-size: 10.5px; }
  .intro[data-scene="1"] .intro-stage { aspect-ratio: 16 / 6; }   /* 고향 장면은 그림과 대사 칸을 낮춰 지도와 구 목록을 위로 */
  .intro[data-scene="1"] .intro-line { min-height: 2.2em; font-size: 15px; }
}
@media (max-width: 370px) {   /* 360·320px 폰: 지도를 더 좁히고 도 이름을 줄인다 */
  .geo-create, :lang(en) .geo-create { grid-template-columns: minmax(0, 31%) minmax(0, 1fr); gap: 8px; }
  .geo-create .geo-reg { font-size: 11.5px; padding: 5px 5px; gap: 4px; }
  .geo-create .geo-reg::before { width: 7px; height: 7px; }
  :lang(en) .geo-create .geo-reg { font-size: 9.5px; letter-spacing: -.035em; padding: 5px 4px; }
}