/* PC 배치 — .m-app.m-desktop 일 때만 (desktop-layout.js, URL ?layout=desktop · 세팅 화면 「PC 화면으로 보기」). 기본(폰 카드)에선 이 파일이 아무것도 안 바꾼다.
   담당: 수연 (R5) 폴더 · 작성: 준형 (R4), 2026-09-20
   왼쪽 420px 설정 패널(SetupScreen 그대로) + 오른쪽 영상 무대(CaptureScreen/SaveScreen 그대로). 폰 카드용 규칙 중
   무대에서 어긋나는 것(16:9 프레임이 폭 기준이라 넓은 무대에서 눌리는 것)만 여기서 덮는다. */

.m-app.m-desktop {
  max-width: min(100% - 32px, 1440px);
  height: min(100dvh - 32px, 960px);
  margin: 16px auto;
}
.m-app.m-desktop .d-cols { display: flex; flex: 1; min-height: 0; min-width: 0; width: 100%; }

/* ── 왼쪽: 설정 패널. SetupScreen(.m-screen-light) 이 그 안에서 스크롤된다. 등록 화면·시트(absolute inset:0)도 패널 안에 뜬다 ── */
.d-panel {
  position: relative; flex: 0 0 420px; min-width: 0; display: flex; flex-direction: column;
  border-right: 2px solid var(--color-divider); background: var(--color-bg);
}
.d-panel > .m-screen { flex: 1; min-height: 0; }
.d-panel-locked > .m-screen { opacity: .55; }
.d-panel-lock {
  position: absolute; left: 0; right: 0; bottom: 0; z-index: 3;
  padding: 12px 18px; background: var(--color-neutral-900); color: #fff;
  font: 700 12px/1.45 var(--font-heading);
}

/* ── 오른쪽: 무대 ── */
.d-stage { flex: 1; min-width: 0; min-height: 0; display: flex; flex-direction: column; background: var(--color-neutral-900); }
.d-stage > .m-screen { flex: 1; min-height: 0; }
/* 저장 진행률 화면은 밝은 카드라 무대 가운데 띄운다 */
.d-stage > .m-screen.m-screen-light { max-width: 720px; width: 100%; align-self: center; margin: 24px 0; flex: 0 1 auto; max-height: calc(100% - 48px); }

.d-idle {
  flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 12px;
  padding: 32px; text-align: center; color: rgba(255,255,255,.78);
}
.d-idle .wm { color: #fff; font-size: 30px; }
.d-idle p { font: 400 14px/1.6 var(--font-body); max-width: 32em; }
.d-idle .d-idle-sub { font-size: 12px; color: rgba(255,255,255,.5); }

/* 촬영 화면 프레임은 style.css 기본 규칙이 폭·높이 중 모자라는 쪽에 맞춘다(--frame-ar, cqh) — 넓은 무대도 그대로 */
/* 첫 방문 카드(onboarding.css .m-ob)는 앱 전체(두 단)를 덮는다. 글줄이 폰 폭 기준이라 틀만 가운데로 모은다 */
.m-app.m-desktop .m-ob-frame { max-width: 640px; width: 100%; margin: auto; }

/* 상단 배지·지연 카드와 가림 로그는 폰 폭에 맞춘 글자라 넓은 무대에선 그대로 두되 좌우 여백만 더 준다 */
.m-app.m-desktop .m-topbar { padding: 0 20px; }
.m-app.m-desktop .m-controlbar { padding: 14px 20px; }