/* 열째 편(PCOFF)만의 규칙. 뼈대는 ../common/style.css 를 그대로 쓴다.

   화면 갈무리가 한 칸을 지는 장은 넷째 편(eval/style.css)과 같은 짜임을 쓴다 — 제품 표가
   넓어 공용 두 칸(1.15 : 1, 키 62mm)에 걸면 글자가 깨알이 된다. 두 편이 같은 값을 가지므로
   한쪽을 고치면 다른 쪽도 함께 고친다(pcoff.test.mjs 가 대조한다).
   번호 장은 열셋이라 머리 물결은 공용 CSS 의 스무 벌 안에 든다. */
@media print, screen and (min-width: 900px) {
  .page .split.wide { grid-template-columns: 1fr 1.8fr; gap: calc(8 * var(--mm)); }
  .flip .page .split.wide { grid-template-columns: 1.8fr 1fr; }
  .page .split.wide .art.shot img { width: 100%; max-height: calc(112 * var(--mm)); object-fit: contain; }
}

/* 06 장 — 확인 창 둘을 나란히. 08 장 — 세로로 긴 상태창은 칸 폭이 아니라 키로 묶는다. */
.duo { display: grid; grid-template-columns: 1fr 1fr; gap: var(--s5); margin: var(--s6) 0; }
.duo figure { margin: 0; text-align: center; }
.duo img { width: 100%; height: auto; border: 1px solid var(--line); border-radius: var(--r-card); }
.duo figcaption { margin-top: var(--s2); font-size: var(--fs-chip); color: var(--faint); }
@media print, screen and (min-width: 900px) {
  .page .duo { margin: auto 0; gap: calc(8 * var(--mm)); }
  .page .duo figcaption { font-size: calc(3 * var(--tp)); margin-top: calc(2 * var(--mm)); }
  .page .split .art.shot.tall img { width: auto; max-width: 100%; max-height: calc(118 * var(--mm)); margin: 0 auto; }
}
