/* shot_split.css — 컷·에셋 상세 6:4 (링고 10-11 · shot_split.js · 새 파일)
   왼쪽 6 = 머리(작은 썸네일 + 세부 정보) · 태스크 · 나머지 카드 / 오른쪽 4 = 최신 버전 크게 → 리뷰·대화 → 히스토리.
   상세 칸(컨테이너 tdetail)이 좁으면(화면 1200 아래) 위아래로 쌓는다. 옛 꼴(`sv-split` 없음)은 title_view.css·shot_view.css 그대로. */

/* ⚠ 10-12 · 칸 나누기는 detail_split.css(5:5 · 손잡이)가 이긴다 — 아래 6:4 줄은 DS_ON=false 일 때만 산다 */
.tv-wrap.sv-split { grid-template-columns: minmax(0, 6fr) minmax(0, 4fr); }
.sv-split > .tv-right { overflow-y: auto; overscroll-behavior: contain; scrollbar-gutter: stable; }
.sv-split > .tv-right > .tv-card { flex: none; }
.sv-split > .tv-right > .sv-talk-card { max-height: none; }
.sv-split > .tv-right > .sv-talk-card > .tv-body { overflow: visible; }
@container tdetail (max-width: 1150px) {
  .tv-wrap.sv-split { grid-template-columns: minmax(0, 1fr); }
  .sv-split > .tv-right { position: static; max-height: none; overflow: visible; }
}

/* 머리 — 썸네일 작게 · 옆 칸 높이만큼 늘어난다(빈 자리 없음) · 단계 띠·다음 할 일은 아래 온 폭 */
.sv-split .sv-hero.hero { grid-template-columns: clamp(150px, 28%, 240px) minmax(0, 1fr); gap: 8px 14px; align-items: stretch; padding: 12px; }
.sv-split .sv-hero.hero > .sv-band,
.sv-split .sv-hero.hero > .sv-todo-box { grid-column: 1 / -1; }
.sv-split .sv-hero .sv-thumb { aspect-ratio: auto; height: 100%; min-height: 96px; max-height: 190px; }
.sv-split .sv-hero .sv-side { gap: 6px; }
.sv-split .sv-hero .sv-title { font-size: 18px; }
.sv-split .sv-hero .sv-facts { gap: 6px; }
.sv-split .sv-hero .sv-fact { padding: 5px 9px; }
.sv-split .sv-hero .sv-todo-box { margin: 0; padding: 7px 10px; }
.sv-split .sv-hero .sv-todo-box h3 { display: inline; margin-right: 8px; }
.sv-split .sv-hero .sv-todo { display: inline-flex; flex-wrap: wrap; gap: 0 16px; vertical-align: middle; }
@container tvleft (max-width: 560px) { .sv-split .sv-hero.hero { grid-template-columns: minmax(0, 1fr); } .sv-split .sv-hero .sv-thumb { max-height: 220px; aspect-ratio: 16 / 9; height: auto; } }

/* 오른쪽 위 「최신 버전」 */
.sv-now-card > .tv-head { gap: 6px; }
.sv-now-card.old > .tv-head h2 { color: var(--st-retake, #e3b341); }
.sv-now-pick { font-size: 12px; padding: 2px 6px; max-width: 46%; }
.sv-now-card > .tv-body { padding: 10px 12px; }
.sv-now { display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.sv-now .sv-viewer-slot.hidden { display: none; }
.sv-now .sv-viewer-slot .player { max-height: 58vh; }
.sv-now .pdfv-stage { height: clamp(240px, 50vh, 760px); }      /* PDF 쪽 — 세로 쪽이 오른쪽 칸을 다 먹지 않게(대화가 첫 화면에 보이게) · 큰 화면에서는 pdf_view.css 그대로 */
.sv-now .sv-viewer-slot .hint { display: none; }          /* 긴 안내 글은 풍선 대신 숨김 — 큰 화면(Enter)에서는 그대로 보인다 */
.sv-now-bar { flex-direction: row; flex-wrap: wrap; align-items: center; gap: 6px 8px; font-size: 13px; }
.sv-now-bar .spacer { flex: 1; }
.sv-now-bar .sv-now-step { font-weight: 600; }
.sv-now-bar .sv-now-who { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0; max-width: 16em; }
.sv-now-bar .sv-vacts { display: inline-flex; gap: 6px; }
.sv-now-bar .tv-ibtn.off { opacity: .45; cursor: not-allowed; display: inline-flex; align-items: center; justify-content: center; }
.sv-now-bar .sv-thumbset.on { border-color: var(--st-done); }

/* 오른쪽 아래 「히스토리」 — 작은 줄 */
.sv-hist-card > .tv-body { padding: 6px 8px; }
.sv-htable { width: 100%; max-width: none; font-size: 12px; }
.sv-htable td { padding: 3px 6px; }
.sv-htable td.sv-hpic { width: 52px; padding: 2px 4px; }
.sv-hthumb { width: 48px; height: 27px; object-fit: cover; border-radius: 4px; display: block; background: var(--bg); }
.sv-hthumb.none { border: 1px solid var(--line); }
.sv-htable td.sv-vfile { min-width: 60px; }
.sv-hempty { margin: 6px 4px; font-size: 13px; }