/* 발표(송출) 화면(10-24 SPEC 106장) - 참가자 뷰어(body.pv) · 발표자 화면(body.pr). 검정 바탕 도구 화면 - 포스터 몰입형 공개 문법은 쓰지 않는다.
   읽는 토큰: design-tokens.css 의 --wf-control-public(참가자 규격 52px) · --wf-brand-gold(지금 장 · 포커스) · 행사 테마의 --sd-font · --sd-stage · --sd-on-stage(대기화면 폴백 - 무대색 + 행사명)뿐.
   그 밖의 회색 단계 · 상태색은 검정 바탕 도구 화면의 상수로 이 파일 안에 적는다(참가자 토큰 --sd-* 는 행사 테마의 흰 시트 기준 - DESIGN-SYSTEM 11.12 예외, 10-24 검토 기록).
   cockpit.css · admin-ops.css · admin.css · public.css 의 셀렉터는 쓰지도 재정의하지도 않는다. (C 담당 소유) */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
html, body { margin: 0; height: 100%; }
body.pv, body.pr { background: #000; color: #f2f0eb; font-family: var(--sd-font, system-ui, 'Apple SD Gothic Neo', 'Malgun Gothic', sans-serif); font-size: 16px; line-height: 1.5; word-break: keep-all; overflow-wrap: anywhere; }
[hidden] { display: none !important; }
button, input { font: inherit; }
img { max-width: 100%; }
.pv-noscript, .pr-noscript { margin: 0; padding: 24px; text-align: center; color: #b3c6ba; }

/* ══════════ 참가자 뷰어 - 늘 가로(세로면 무대를 90도 돌린다) · 조작 없음 ══════════ */
body.pv { position: fixed; inset: 0; overflow: hidden; touch-action: none; overscroll-behavior: none; -webkit-user-select: none; user-select: none; -webkit-touch-callout: none; }
.pv-root { position: fixed; inset: 0; background: #000; }
/* 무대 - JS 가 가로 · 세로 크기를 px 로 넣고(100vh 의 휴대폰 주소창 문제를 피함) 세로 뷰포트면 .pv-stage--rot 로 돌린다 */
.pv-stage { position: absolute; left: 50%; top: 50%; width: 100%; height: 100%; transform: translate(-50%, -50%); transform-origin: center center; background: #000; overflow: hidden; }
.pv-stage--rot { transform: translate(-50%, -50%) rotate(90deg); }
/* 큰 화면(가로)은 화면에 그대로 붙인다 - 반 화소 옮김 없이 장 그림을 1:1 로(presentation-viewer.js layout, 10-30) */
.pv-stage--flat { left: 0; top: 0; transform: none; }
.pv-slide, .pv-idle-img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; display: block; background: #000; }
/* 장 그림에는 받은 주소만 넣는다(presentation-viewer.js swapIn - 10-30). 그래도 깨지면 alt 글이 무대 위에 찍히지 않게 글자색을 지운다 */
.pv-slide { color: transparent; }
.pv-idle { position: absolute; inset: 0; }
.pv-idle-fallback { position: absolute; inset: 0; display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 12px; padding: 24px; text-align: center; background: var(--sd-stage, #0d1c17); color: var(--sd-on-stage, #ffffff); }
.pv-idle-kicker { margin: 0; font-size: clamp(13px, 2vmin, 18px); font-weight: 600; letter-spacing: .04em; opacity: .8; }
.pv-idle-title { margin: 0; font-size: clamp(28px, 7vmin, 72px); font-weight: 800; line-height: 1.2; }
.pv-idle-sub { margin: 0; font-size: clamp(14px, 2.4vmin, 22px); opacity: .85; }
/* 기본 대기화면 그림과 같은 알약(10-24 오후 SPEC 106장 ⑪) - 그림을 못 받았을 때의 HTML 폴백에도 같은 문구. 무대 위 글자색 바탕 · 무대색 글자(서로 대비 4.5 이상 - lib/theme.ts posterLook) */
.pv-idle-soon { margin: 12px 0 0; display: inline-flex; align-items: center; padding: .42em .9em; border-radius: 999px; background: var(--sd-on-stage, #ffffff); color: var(--sd-stage, #0d1c17); font-size: clamp(16px, 3.6vmin, 40px); font-weight: 900; line-height: 1.2; white-space: nowrap; }
.pv-caption { position: absolute; left: 16px; bottom: 16px; margin: 0; padding: 8px 14px; border-radius: 999px; background: rgba(0, 0, 0, .72); color: #fff; font-size: 15px; font-weight: 600; max-width: calc(100% - 32px); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pv-notice { position: absolute; inset: 0; display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 8px; padding: 24px; text-align: center; background: #000; }
.pv-notice-title { margin: 0; font-size: clamp(22px, 5vmin, 40px); font-weight: 800; line-height: 1.25; }
.pv-notice-text { margin: 0; color: #b3c6ba; font-size: clamp(14px, 2.4vmin, 20px); }
/* 전체 화면이 풀렸을 때 오른쪽 아래 작은 단추 하나 */
.pv-fs-btn { position: fixed; right: calc(16px + env(safe-area-inset-right, 0px)); bottom: calc(16px + env(safe-area-inset-bottom, 0px)); z-index: 5; height: var(--wf-control-public, 52px); padding: 0 20px; border-radius: var(--wf-radius-action); letter-spacing: var(--wf-action-track); border: 1px solid rgba(255, 255, 255, .35); background: rgba(0, 0, 0, .7); color: #fff; font-weight: 700; cursor: pointer; }
/* 마우스가 2.5초 가만히 있으면(presentation-viewer.js uiWake - 큰 화면 모드 · 마우스로 움직인 화면, 10-30) 커서와 [전체 화면] 단추를 숨긴다. 움직이면 다시 */
body.pv.pv--still, body.pv.pv--still * { cursor: none !important; }
body.pv.pv--still .pv-fs-btn { visibility: hidden; opacity: 0; }
/* 첫 화면 - 화면 전체가 단추 */
.pv-gate { position: fixed; inset: 0; z-index: 10; display: flex; justify-content: center; align-items: center; padding: 24px; background: rgba(0, 0, 0, .94); cursor: pointer; }
.pv-gate-card { max-width: 560px; display: flex; flex-direction: column; align-items: center; gap: 10px; text-align: center; }
.pv-gate-kicker { margin: 0; font-size: 14px; font-weight: 600; color: #b3c6ba; letter-spacing: .04em; }
.pv-gate-title { margin: 0; font-size: clamp(22px, 5vmin, 36px); font-weight: 800; line-height: 1.25; }
.pv-gate-cta { margin: 12px 0 0; display: inline-flex; align-items: center; height: var(--wf-control-public, 52px); padding: 0 28px; border-radius: var(--wf-radius-action); letter-spacing: var(--wf-action-track); background: #fff; color: #000; font-weight: 800; font-size: 18px; }
.pv-gate-tip { margin: 0; font-size: 14px; color: #b3c6ba; }

/* ══════════ 발표자 화면 - 폰 · 태블릿 · 노트북 공통 ══════════ */
.pr-root { min-height: 100vh; min-height: 100dvh; display: flex; flex-direction: column; }
.pr-head { flex: none; display: flex; align-items: baseline; flex-wrap: wrap; gap: 4px 12px; padding: 12px 16px; border-bottom: 1px solid #2c2c2c; }
.pr-head-title { font-weight: 750; font-size: 16px; }
.pr-head-sub { font-size: 13px; color: #b3c6ba; }
.pr-panel { width: 100%; max-width: 560px; margin: 0 auto; padding: 24px 16px 40px; display: flex; flex-direction: column; gap: 12px; }
.pr-kicker { margin: 0; font-size: 13px; font-weight: 600; color: #b3c6ba; letter-spacing: .02em; }
.pr-h1 { margin: 0; font-size: 26px; line-height: 1.3; font-weight: 800; }
.pr-org, .pr-title, .pr-text { margin: 0; color: #dedfd5; }
.pr-title { font-weight: 600; }
.pr-file { margin: 0; font-weight: 700; }
.pr-status { margin: 4px 0 0; padding: 12px 14px; border-radius: 12px; border: 1px solid #2c2c2c; background: #141414; color: #dedfd5; font-weight: 600; }
.pr-status--on { border-color: #1f6f4a; color: #a9d9bf; }
.pr-status--off { border-color: #9e2a2a; color: #ff9c9c; }
.pr-status--busy { border-color: #8a6d1f; color: #ffd98a; }
.pr-actions { display: flex; flex-direction: column; gap: 10px; margin-top: 8px; }
/* 단추 - 참가자 규격 52px 알약 */
.pr-btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; height: var(--wf-control-public, 52px); min-height: var(--wf-control-public, 52px); padding: 0 24px; border-radius: var(--wf-radius-action); letter-spacing: var(--wf-action-track); min-width: var(--wf-eq-w, auto); border: 1px solid #3a3a3a; background: #1a1a1a; color: #f2f0eb; font-weight: 700; font-size: 16px; cursor: pointer; white-space: nowrap; text-decoration: none; }
.pr-btn--primary { background: #00754a; border-color: #00754a; color: #fff; }
.pr-btn--primary:hover { background: #008553; border-color: #008553; }
.pr-btn--big { height: 64px; min-height: 64px; font-size: 20px; }
.pr-btn--block { width: 100%; }
.pr-btn--muted { opacity: .6; }
/* 조용한 단추(나가기) - 테두리만, 본 행동과 구분 */
.pr-btn--quiet { background: transparent; border-color: #2c2c2c; color: #b3c6ba; font-size: 14px; margin-top: 8px; }
.pr-btn[disabled] { opacity: .45; cursor: not-allowed; }
.pr-btn:focus-visible, .pr-tool:focus-visible, .pr-input:focus-visible, .pr-thumb:focus-visible, .pv-fs-btn:focus-visible, .pv-gate:focus-visible { outline: 2px solid var(--wf-brand-gold, #cba258); outline-offset: 2px; }
.pr-form { display: flex; flex-direction: column; gap: 8px; }
.pr-label { font-weight: 600; font-size: 15px; }
.pr-input { width: 100%; height: var(--wf-control-public, 52px); padding: 0 14px; border-radius: var(--wf-radius-action); border: 1px solid #3a3a3a; background: #111; color: #fff; font-size: 20px; letter-spacing: .12em; font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; text-transform: uppercase; }
.pr-input::placeholder { color: #666; letter-spacing: .12em; }
.pr-error { margin: 0; color: #ff9c9c; font-weight: 600; font-size: 14px; }
.pr-info { margin: 0; color: #a9d9bf; font-weight: 600; font-size: 14px; }
.pr-tip { margin: 8px 0 0; font-size: 13px; line-height: 1.6; color: #a1b9aa; }
/* 공용 화면(발표자 통합 링크 - 10-25 SPEC 106장 ⑫ · ⑭) - 준비 화면 = 발표자 목록. 줄마다 [번호][이름 · 소속 / 제목][상태 알약][발표 시작 · 연습] - 어느 줄이든 골라 시작.
   '다음' 줄 = 금 테두리 · 금 번호(11.2 금 = 현재 위치), 발표 중 = 초록, 자기 기기 발표 = 노랑, 준비 안 된 줄은 흐림. 단상 PC 는 멀리서도 읽히게 이름 20px, 휴대폰은 단추가 둘째 줄.
   단추 칸은 넓은 폭에서 212px 고정([발표 시작] 132 + [연습]) - 단추가 없는 줄(변환 중 · 파일 없음)도 상태 알약 끝선이 다른 줄과 맞게 */
.pr-pick { max-width: 1040px; }
.pr-pick-head { display: grid; gap: 8px; }
.pr-pick-h1 { margin: 0; font-size: 15px; font-weight: 700; color: #b3c6ba; letter-spacing: .02em; }
.pr-pick-status { margin: 0; }
.pr-pick-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.pr-pick-row { display: grid; grid-template-columns: 44px minmax(0, 1fr) auto 272px; grid-template-areas: "no who state acts"; align-items: center; gap: 8px 16px; min-height: 76px; padding: 12px 16px; border: 1px solid #2c2c2c; border-radius: 12px; background: #0e0e0e; }
.pr-pick-row:focus { outline: none; }
/* 키보드 초점 = 흰 바깥선 3px(10-26 고침 - 금색이던 초점이 '다음' 줄의 금 테두리와 같아 어느 줄에 초점이 있는지 가를 수 없었다). 목록 화면 안 초점 표시는 모두 같게 */
.pr-pick-row:focus-visible, .pr-pick .pr-btn:focus-visible, .pr-pick .pr-keys summary:focus-visible { outline: 3px solid #f2f0eb; outline-offset: 3px; }
.pr-pick-no { grid-area: no; display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; border-radius: 999px; border: 1px solid #3a3a3a; background: #161616; color: #f2f0eb; font-size: 18px; font-weight: 800; font-variant-numeric: tabular-nums; }
.pr-pick-who { grid-area: who; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.pr-pick-line { font-size: 20px; line-height: 1.35; }
.pr-pick-name { font-weight: 800; }
.pr-pick-org { color: #a1b9aa; font-size: 16px; font-weight: 600; }
.pr-pick-title { color: #dedfd5; font-size: 15px; font-weight: 600; line-height: 1.4; }
.pr-pick-state { grid-area: state; justify-self: end; display: inline-flex; align-items: center; min-height: 30px; padding: 2px 12px; border-radius: 999px; border: 1px solid #3a3a3a; background: #161616; color: #dedfd5; font-size: 14px; font-weight: 700; white-space: nowrap; font-variant-numeric: tabular-nums; }
.pr-pick-state--next { border-color: var(--wf-brand-gold, #cba258); background: #2a2110; color: #f3d99a; }
.pr-pick-state--live { border-color: #1f6f4a; background: #0f2a1f; color: #a9d9bf; }
.pr-pick-state--own { border-color: #8a6d1f; background: #241c08; color: #ffd98a; }
.pr-pick-state--done { color: #a1b9aa; }
.pr-pick-state--conv { border-color: #2f5b8a; background: #0f1d2c; color: #a9c9f0; }
.pr-pick-state--fail { border-color: #9e2a2a; background: #2a0f0f; color: #ff9c9c; }
.pr-pick-state--none { color: #8d8d86; }
.pr-pick-acts { grid-area: acts; display: flex; align-items: center; justify-content: flex-end; gap: 8px; }
/* [발표 시작] · [연습] = 한 줄의 같은 위계 - 높이 52px · 폭 132px 한 폭(11-01 대표님 통합 발표 화면 '배치 오류': eq-width 가 [연습]을 [발표 시작] 폭으로 늘려 212px 칸을 넘쳐
   '다음' 알약을 덮었다 - 칸 = 132 × 2 + 8). [연습]은 테두리만 남은 보조 색으로 구분 */
.pr-pick-acts .pr-btn { min-width: max(132px, var(--wf-eq-w, 0px)); }
.pr-pick-acts .pr-pick-practice { height: var(--wf-control-public, 52px); min-height: var(--wf-control-public, 52px); padding: 0 24px; font-size: 16px; }
/* 줄의 작은 보조 단추([연습]) - 발표 조작 최소 44px, 테두리만 */
.pr-btn--sub { height: 44px; min-height: 44px; padding: 0 16px; font-size: 14px; background: transparent; border-color: #3a3a3a; color: #dedfd5; }
.pr-pick-row.is-next { border-color: var(--wf-brand-gold, #cba258); background: #15130d; }
.pr-pick-row.is-next .pr-pick-no { border-color: var(--wf-brand-gold, #cba258); background: var(--wf-brand-gold, #cba258); color: #000; }
.pr-pick-row.is-live { border-color: #00754a; background: #0b1d15; }
.pr-pick-row.is-live .pr-pick-no { border-color: #00754a; background: #00754a; color: #fff; }
.pr-pick-row.is-own { border-color: #8a6d1f; }
.pr-pick-row.is-done .pr-pick-no { color: #a1b9aa; }
.pr-pick-row.is-off .pr-pick-who, .pr-pick-row.is-off .pr-pick-no { opacity: .6; }
.pr-pick-empty { margin: 8px 0; }
.pr-pick-foot { display: flex; align-items: flex-start; justify-content: space-between; flex-wrap: wrap; gap: 8px 16px; margin-top: 8px; }
.pr-pick-leave { height: 44px; min-height: 44px; margin-top: 0; }
/* 키보드 · 클리커 안내 - 접어 둔다(R14 설명 최소) */
.pr-keys summary { display: inline-flex; align-items: center; gap: 6px; min-height: 44px; cursor: pointer; color: #a1b9aa; font-size: 14px; font-weight: 600; list-style: none; }
.pr-keys summary::-webkit-details-marker { display: none; }
.pr-keys summary::before { content: "▸"; font-size: 12px; }
.pr-keys[open] summary::before { content: "▾"; }
.pr-keys-text { margin: 0 0 4px; max-width: 720px; color: #a1b9aa; font-size: 14px; line-height: 1.6; }
/* 바꿔 시작 확인 창(<dialog> - 기본 초점 [취소]) */
.pr-dialog { width: min(520px, calc(100vw - 32px)); max-width: none; padding: 24px; border: 1px solid #3a3a3a; border-radius: 16px; background: #141414; color: #f2f0eb; }
.pr-dialog::backdrop { background: rgba(0, 0, 0, .72); }
.pr-dialog-text { margin: 0 0 20px; font-size: 18px; font-weight: 700; line-height: 1.5; }
.pr-dialog-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px; }
@media (max-width: 699px) {
  /* 상태 알약은 이름 아래 줄로(10-26 고침 - 'auto' 열의 nowrap 알약이 이름 칸을 짓눌러 이름 · 소속 · 제목이 여러 줄로, 320 폭은 한 글자씩 접혔다).
     줄 사이 틈은 칸의 margin 으로 - 알약이 없는 줄(빈 state 칸)에 틈이 두 번 생기지 않게 */
  .pr-pick-row { grid-template-columns: 36px minmax(0, 1fr); grid-template-areas: "no who" "no state" "acts acts"; gap: 0 12px; padding: 12px; }
  .pr-pick-row.is-off { grid-template-areas: "no who" "no state"; }
  .pr-pick-no { width: 36px; height: 36px; font-size: 16px; align-self: start; }
  .pr-pick-state { justify-self: start; align-self: start; margin-top: 6px; max-width: 100%; white-space: normal; }
  .pr-pick-line { font-size: 17px; }
  .pr-pick-org { font-size: 15px; }
  .pr-pick-acts { justify-content: stretch; margin-top: 10px; }
  .pr-pick-acts .pr-btn { flex: 1; min-width: 0; }
}

/* 발표 화면 - 화면 전체 */
body.pr--live { overflow: hidden; position: fixed; inset: 0; }
body.pr--live .pr-head { display: none; }
.pr-live { position: fixed; inset: 0; z-index: 2; display: flex; flex-direction: column; background: #000; touch-action: none; overscroll-behavior: none; -webkit-user-select: none; user-select: none; -webkit-touch-callout: none; }
.pr-band { flex: none; margin: 0; padding: 8px 16px; text-align: center; font-weight: 700; font-size: 14px; }
.pr-band--practice { background: #ffd23f; color: #000; }
.pr-band--offline { background: #9e0a0a; color: #fff; }
/* 송출 꺼짐(데스크가 스위치를 끔) - 발표자 폰에도 보여야 한다(발표자 보기의 '송출' 글자는 폰에서 안 보임) */
.pr-band--off { background: #9e2a2a; color: #fff; }
.pr-band--info { background: #1e3932; color: #a9d9bf; }
.pr-stage { flex: 1; min-height: 0; display: flex; }
.pr-main { position: relative; flex: 1; min-width: 0; min-height: 0; cursor: default; }
.pr-slide { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; display: block; background: #000; }
/* 탭 구역(왼쪽 1/3 이전 · 오른쪽 1/3 다음 · 가운데 도구 띠) - 그림만 있을 뿐 조작은 JS 가 좌표로 가른다 */
.pr-tap { position: absolute; top: 0; bottom: 0; width: 33.333%; pointer-events: none; }
.pr-tap--prev { left: 0; }
.pr-tap--next { right: 0; }
/* 발표자 보기 - 오른쪽 열(다음 장 · 시계 · 보는 사람 · 송출), 아래 쪽 띠 */
.pr-side { display: none; flex: none; width: 30%; min-width: 220px; max-width: 420px; padding: 16px; border-left: 1px solid #2c2c2c; flex-direction: column; gap: 16px; overflow: hidden; background: #000; }
.pr-live--side .pr-side { display: flex; }
.pr-side-label { margin: 0 0 4px; font-size: 13px; font-weight: 600; color: #b3c6ba; }
.pr-next-img { display: block; width: 100%; aspect-ratio: 16 / 9; object-fit: contain; background: #111; border: 1px solid #2c2c2c; }
.pr-next-none { margin: 0; padding: 20px 0; text-align: center; color: #b3c6ba; border: 1px dashed #2c2c2c; }
.pr-meta { display: flex; flex-direction: column; gap: 8px; }
.pr-meta-row { margin: 0; display: flex; justify-content: space-between; align-items: baseline; gap: 12px; }
.pr-meta-row b { font-weight: 700; }
.pr-clock { font-size: 32px; font-weight: 800; font-variant-numeric: tabular-nums; }
.pr-now { font-size: 20px; font-variant-numeric: tabular-nums; }
.pr-thumbs { flex: none; display: flex; gap: 8px; padding: 8px 12px; overflow-x: auto; overflow-y: hidden; background: #0a0a0a; border-top: 1px solid #2c2c2c; touch-action: pan-x; scrollbar-width: thin; }
.pr-thumb { flex: none; width: 128px; height: 72px; padding: 0; border: 2px solid transparent; border-radius: 6px; background: #111; cursor: pointer; overflow: hidden; position: relative; }
.pr-thumb img { display: block; width: 100%; height: 100%; object-fit: contain; }
.pr-thumb[aria-current="true"] { border-color: var(--wf-brand-gold, #cba258); }
.pr-thumb-no { position: absolute; left: 4px; bottom: 2px; font-size: 11px; font-weight: 700; color: #fff; background: rgba(0, 0, 0, .7); padding: 0 5px; border-radius: 4px; }
/* 도구 띠 - 52px 알약, 좁으면 가로 스크롤 */
.pr-tools { flex: none; display: flex; align-items: center; gap: 8px; padding: 8px 12px; background: rgba(0, 0, 0, .94); border-top: 1px solid #2c2c2c; overflow-x: auto; scrollbar-width: thin; }
.pr-tool { flex: none; display: inline-flex; align-items: center; justify-content: center; min-width: max(var(--wf-control-public, 52px), var(--wf-eq-w, 0px)); letter-spacing: var(--wf-action-track); height: var(--wf-control-public, 52px); padding: 0 16px; border-radius: var(--wf-radius-action); border: 1px solid #3a3a3a; background: #1a1a1a; color: #fff; font-weight: 700; font-size: 16px; cursor: pointer; white-space: nowrap; }
.pr-tool--text { font-size: 14px; }
.pr-tool--danger { border-color: #9e2a2a; color: #ff9c9c; }
.pr-tool[aria-pressed="true"] { background: #1e3932; border-color: #70ae8e; color: #a9d9bf; }
.pr-counter { flex: none; min-width: 64px; text-align: center; font-size: 18px; font-weight: 800; font-variant-numeric: tabular-nums; }
.pr-tool-text { flex: none; font-size: 14px; color: #dedfd5; font-variant-numeric: tabular-nums; }
.pr-tool-text b { color: #fff; }
@media (hover: hover) {
  .pr-tool:hover, .pr-btn:not([disabled]):hover { border-color: #777; }
  .pr-btn--primary:not([disabled]):hover { border-color: #008553; }
}
/* 좁은 화면(휴대폰)에서 발표자 보기를 켜면 오른쪽 열이 아래로 내려간다 */
@media (max-width: 699px) {
  .pr-live--side .pr-stage { flex-direction: column; }
  .pr-side { width: 100%; max-width: none; min-width: 0; max-height: 44%; border-left: 0; border-top: 1px solid #2c2c2c; flex-direction: row; }
  .pr-next { flex: 1; min-width: 0; }
  .pr-meta { flex: 1; }
  .pr-clock { font-size: 24px; }
  .pr-thumb { width: 96px; height: 54px; }
  /* 도구 띠는 가로 스크롤 대신 두 줄 - [끝내기]가 화면 밖으로 밀리지 않게 */
  .pr-tools { flex-wrap: wrap; overflow-x: visible; row-gap: 8px; }
}
/* 큐카드(11-01 대표님 "1:1로 좌우를 나누고 아래는 지금처럼 슬라이드 나열 … 좌측은 큐카드 세로타입 … 우측은 … 아래 스톱워치도 리셋 버튼 … 모바일에서는 상단 피티 하단 큐카드").
   개인 발표에서 내 큐카드가 있을 때만(presenter.js layout - .pr-live--card): 왼쪽 큐카드 칸(한 장씩 보기 iframe + ◀ n/N ▶) | 오른쪽 장 그림 + 경과 시계 · [0부터], 아래 쪽 띠.
   세로 화면은 위 장 그림 · 경과 · 아래 큐카드. 오른쪽 열(발표자 보기)은 큐카드를 끄면 예전처럼 */
.pr-card, .pr-watch { display: none; }
.pr-live--card .pr-stage { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); grid-template-rows: minmax(0, 1fr) auto; grid-template-areas: "card main" "card watch"; }
.pr-live--card .pr-side { display: none; }
.pr-live--card .pr-main { grid-area: main; }
.pr-live--card .pr-card { grid-area: card; display: flex; flex-direction: column; min-width: 0; min-height: 0; background: #111; border-right: 1px solid #2c2c2c; }
.pr-live--card .pr-watch { grid-area: watch; display: flex; align-items: center; justify-content: center; gap: 16px; padding: 8px 16px; border-top: 1px solid #2c2c2c; }
.pr-card-frame { position: relative; flex: 1; min-height: 0; }
/* 큐카드 문서는 누름 · 초점을 받지 않는다 - 키보드 · 클리커가 늘 PT 로 가게(넘김은 아래 ◀ ▶ · 칸 쓸기) */
.pr-card-doc { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; display: block; pointer-events: none; background: #111; }
.pr-card-nav { flex: none; display: flex; align-items: center; justify-content: center; gap: 12px; padding: 8px 12px; border-top: 1px solid #2c2c2c; }
.pr-card-count { flex: none; min-width: 72px; text-align: center; font-size: 18px; font-weight: 800; font-variant-numeric: tabular-nums; }
.pr-tool:disabled { opacity: .4; cursor: default; }
.pr-watch-time { font-size: 32px; font-weight: 800; font-variant-numeric: tabular-nums; }
.pr-watch .pr-side-label { margin: 0; }
.pr-clock-wrap { display: inline-flex; align-items: center; gap: 8px; }
.pr-clock-reset { height: 36px; padding: 0 10px; font-size: 13px; }
@media (orientation: portrait) {
  /* 위 PT(16:9 가 들어가는 높이) · 경과 · 아래 큐카드. 큐카드 칸은 손가락으로 위아래로 밀어 읽고 옆으로 쓸어 넘긴다(그 문서가 받음 - 키는 바깥으로 넘김) */
  .pr-live.pr-live--card { touch-action: pan-y; }
  .pr-live--card .pr-stage { grid-template-columns: minmax(0, 1fr); grid-template-rows: minmax(0, min(34%, 60vw)) auto minmax(0, 1fr); grid-template-areas: "main" "watch" "card"; }
  .pr-live--card .pr-card { border-right: 0; border-top: 1px solid #2c2c2c; }
  .pr-live--card .pr-card-doc { pointer-events: auto; }
  .pr-live--card .pr-watch { padding: 4px 12px; }
  .pr-watch-time { font-size: 26px; }
  .pr-live--card .pr-card-nav { padding: 6px 12px; }
}
@media (prefers-reduced-motion: no-preference) {
  .pv-caption, .pr-band { transition: opacity var(--wf-duration, 200ms); }
  .pv-fs-btn { transition: opacity var(--wf-duration, 200ms), visibility var(--wf-duration, 200ms); }
}