/* ─────────────────────────────────────────────────────────────────────────────
   41-v2-project.css — 새 셸 프로젝트 화면 = 방 (web/v2/project-view.ts, #1757 v5).
   구도: **잉크 문패**(딥 네이비 히어로 — 제목·상태·굵은 숫자 현황이 빛으로 뜬다) → 방(본문=문서 시트 | 코멘트=게시판 /
        세션=작업대) → 공유 폴더=선반(가로, 파일 종류별 색 아이콘) → 바닥(리브 대화, 위로 뜬 그림자).
   재질 위계: 문패(어두움·초점) ▸ 구역 카드(흰색·경계) ▸ 바닥 틴트. 한 화면에 초점은 하나다.
   토큰은 01-base 것만(--dark-1/2·--dark-sub 는 admin-preview 전례). 채운 파랑은 화면당 하나(입력칸 보내기).
   ───────────────────────────────────────────────────────────────────────────── */

.pv-wrap { --pv-chat-h: 320px; flex: 1; min-height: 0; display: flex; flex-direction: column; background: var(--bg); }
.pv-top { flex: 1 1 auto; min-height: 0; display: flex; flex-direction: column; padding: 16px 22px 14px; background: var(--bg-tint); }

/* ══ 잉크 문패 — 이 화면의 유일한 어두운 면. 방문(門)이자 초점. ══════════════════ */
.pv-door { flex: none; padding: 15px 22px 14px; border-radius: 16px; color: var(--on-fill);
  background: linear-gradient(132deg, var(--dark-1) 0%, var(--dark-2) 100%);
  box-shadow: 0 8px 24px rgba(var(--shadow-ink), .18), 0 2px 6px rgba(var(--shadow-ink), .12); }
.pv-eyebrow { display: flex; align-items: center; gap: 10px; font-size: 11.5px; color: var(--dark-sub); line-height: 1.4; }
.pv-idchip { font-size: 11px; letter-spacing: .05em; opacity: .9; }
.pv-listname::before { content: '·'; opacity: .5; margin-right: 10px; }
.pv-eyebrow-sp { flex: 1; }
.pv-when { font-size: 11px; color: var(--dark-foot); }

.pv-title-line { display: flex; align-items: baseline; gap: 12px; margin-top: 5px; min-width: 0; }
.pv-title { margin: 0; font-size: 25px; font-weight: 800; letter-spacing: -.55px; line-height: 1.28; color: var(--on-fill); word-break: keep-all; min-width: 0; }
/* 상태 알약 — 어두운 면 위의 유리 칩. */
.pv-stpill { flex: none; display: inline-flex; align-items: center; gap: 6px; font-size: 11.5px; font-weight: 700; line-height: 1;
  padding: 5px 10px; border-radius: 999px; background: rgba(255, 255, 255, .09); border: 1px solid rgba(255, 255, 255, .14);
  color: var(--on-fill); transform: translateY(-2px); }
.pv-stpill .d { width: 6px; height: 6px; border-radius: 50%; }
.pv-stpill.run .d { background: var(--mint-bright); box-shadow: 0 0 8px color-mix(in srgb, var(--mint-bright) 70%, transparent); animation: v2pulse 1.1s ease-in-out infinite; }
.pv-stpill.done { color: var(--mint-bright); }
.pv-stpill.done .d { background: var(--mint-bright); }
.pv-stpill.todo { color: var(--dark-sub); }
.pv-stpill.todo .d { background: var(--dark-sub); }

/* 현황 — 어두운 면 위의 굵은 숫자(목업의 "세션 3 · 지식 4 · 할 일 8"). */
.pv-vitals { display: flex; align-items: center; flex-wrap: wrap; row-gap: 10px; margin-top: 14px; }
.pv-live { display: inline-flex; align-items: center; gap: 7px; font-size: 12px; font-weight: 700; color: var(--mint-bright);
  background: color-mix(in srgb, var(--mint-bright) 10%, transparent); border: 1px solid color-mix(in srgb, var(--mint-bright) 28%, transparent);
  border-radius: 999px; padding: 7px 12px; margin-right: 20px; }
.pv-live .v2-dot.busy { background: var(--mint-bright); }
.pv-vital { display: inline-flex; flex-direction: column; gap: 2px; padding: 0 20px; border-left: 1px solid rgba(255, 255, 255, .13); text-decoration: none; }
.pv-live + .pv-vital, .pv-vitals > .pv-vital:first-child { border-left: 0; padding-left: 0; }
.pv-vital .n { font-size: 18px; font-weight: 800; color: var(--on-fill); line-height: 1.1; font-variant-numeric: tabular-nums; letter-spacing: -.3px; }
.pv-vital .k { font-family: var(--mono, ui-monospace, monospace); font-size: 9.5px; letter-spacing: .1em; text-transform: uppercase; color: var(--dark-sub); }
a.pv-vital:hover .n { color: var(--mint-bright); }
.pv-minibar { width: 48px; height: 3px; border-radius: 2px; background: rgba(255, 255, 255, .18); overflow: hidden; margin-top: 3px; }
.pv-minibar .f { display: block; height: 100%; border-radius: 2px; background: var(--mint-bright); }
.pv-faces { display: inline-flex; align-items: center; margin-left: 20px; padding-left: 20px; border-left: 1px solid rgba(255, 255, 255, .13); }
.pv-face-s { width: 26px; height: 26px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center;
  font-size: 10.5px; font-weight: 700; color: var(--on-fill); border: 2px solid var(--dark-2); margin-left: -7px; }
.pv-faces .pv-face-s:first-child { margin-left: 0; }
.pv-face-more { margin-left: 6px; font-size: 11px; color: var(--dark-sub); }

/* ══ 방 — 본문(왼쪽 통짜) | 코멘트 / 세션 ══════════════════════════════════════ */
.pv-room { flex: 1 1 auto; min-height: 150px; display: grid; gap: 12px; margin-top: 14px;
  grid-template-columns: minmax(0, 8fr) minmax(0, 5fr); grid-template-rows: minmax(0, 1fr) minmax(0, 1fr);
  grid-template-areas: 'doc cmt' 'doc sess'; }
.pv-zone { min-height: 0; display: flex; flex-direction: column; border: 1px solid var(--line); border-radius: 13px;
  background: var(--bg); overflow: hidden; box-shadow: 0 1px 2px rgba(var(--shadow-ink), .04); }
.pv-z-doc { grid-area: doc; }
.pv-z-cmt { grid-area: cmt; }
.pv-z-sess { grid-area: sess; }

.pv-z-h { flex: none; display: flex; align-items: center; gap: 7px; padding: 10px 12px 9px 15px; }
.pv-z-ic { display: inline-flex; color: var(--muted-2); }
.pv-z-ic .v2-ic, .pv-z-ic .fic { width: 14px; height: 14px; stroke-width: 1.9; display: block; }
.pv-z-k { margin: 0; font-size: 12.5px; font-weight: 800; letter-spacing: -.1px; color: var(--ink); }
.pv-z-n { font-size: 11.5px; color: var(--muted); font-variant-numeric: tabular-nums; }
.pv-z-acts { margin-left: auto; display: inline-flex; align-items: center; gap: 5px; }
.pv-z-b { flex: 1; min-height: 0; overflow-y: auto; }
.pv-z-f { flex: none; display: flex; align-items: center; gap: 6px; padding: 9px 12px; border-top: 1px solid var(--line-row); }
.pv-z-f[hidden] { display: none; }

/* 버튼 — 주 버튼(새 세션)은 틴트, 나머지는 고스트. 채운 파랑은 안 쓴다(그건 입력칸 몫). */
.pv-btn { display: inline-flex; align-items: center; font: inherit; font-size: 12px; font-weight: 600; line-height: 1; padding: 6px 9px;
  border: 1px solid var(--line); border-radius: 7px; background: var(--bg); color: var(--ink-sub); cursor: pointer; text-decoration: none; white-space: nowrap; }
.pv-btn:hover { border-color: var(--muted-3); color: var(--ink); }
.pv-btn:disabled { opacity: .55; cursor: default; }
.pv-btn-main { display: inline-flex; align-items: center; font: inherit; font-size: 12px; font-weight: 700; line-height: 1; padding: 6px 10px;
  border: 1px solid var(--line-note); border-radius: 7px; background: var(--bg-punch); color: var(--blue-deep); cursor: pointer; white-space: nowrap; }
.pv-btn-main:hover { border-color: var(--blue); }
.pv-btn-main:disabled { opacity: .55; cursor: default; }
.pv-btn:focus-visible, .pv-btn-main:focus-visible { outline: 2px solid var(--blue); outline-offset: 1px; }

/* ── 본문 = 문서 시트 ── */
.pv-z-doc .pv-z-h { border-bottom: 1px solid var(--line-row); }
.pv-sheet { padding: 16px 24px 22px; font-size: 14.5px; line-height: 1.78; color: var(--ink-note); max-width: 76ch; word-break: keep-all; overflow-wrap: anywhere; }
.pv-sheet .md > :first-child { margin-top: 0; }
.pv-sheet .md > :last-child { margin-bottom: 0; }
.pv-sheet .md p { margin: 0 0 .6em; }
.pv-sheet .md h1, .pv-sheet .md h2, .pv-sheet .md h3 { margin: 1.2em 0 .35em; font-size: 11.5px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; color: var(--muted-head); }
.pv-sheet .md h1:first-child, .pv-sheet .md h2:first-child, .pv-sheet .md h3:first-child { margin-top: 0; }
.pv-sheet .md ul, .pv-sheet .md ol { margin: 0 0 .6em; padding-left: 1.3em; }
.pv-sheet .md li { margin: .14em 0; }
.pv-sheet .md li::marker { color: var(--muted-2); }
.pv-sheet .md a { color: var(--blue); text-decoration: none; }
.pv-sheet .md a:hover { text-decoration: underline; }
.pv-sheet .md hr { border: 0; border-top: 1px solid var(--line); margin: 1em 0; }
.pv-sheet .md blockquote { margin: 0 0 .6em; padding: 2px 0 2px 12px; border-left: 2px solid var(--line-net-2); color: var(--ink-sub); }
.pv-link { font: inherit; font-size: inherit; color: var(--blue-deep); background: none; border: 0; padding: 0; cursor: pointer; font-weight: 600; }
.pv-link:hover { text-decoration: underline; text-underline-offset: 3px; }

.pv-edit { height: 100%; display: flex; padding: 10px 12px; box-sizing: border-box; }
.pv-edit-ta { flex: 1; min-height: 0; resize: none; font-family: inherit; font-size: 13.5px; line-height: 1.7; color: var(--ink);
  padding: 10px 12px; border: 1px solid var(--line-net); border-radius: 10px; background: var(--bg); }
.pv-edit-ta:focus-visible { outline: none; border-color: var(--blue); box-shadow: 0 0 0 3px var(--bg-punch); }
.pv-hint { flex: 1; min-width: 0; font-size: 11.5px; color: var(--muted); line-height: 1.5; }

/* ── 코멘트 = 게시판 — 말은 부드러운 버블, 쓰는 칸은 바닥 ── */
.pv-z-cmt .pv-z-b { padding: 2px 10px 8px; }
.pv-cmt { display: flex; gap: 9px; padding: 4px 2px; }
.pv-cmt + .pv-cmt { margin-top: 4px; }
.pv-cface { flex: none; width: 26px; height: 26px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center;
  font-size: 10.5px; font-weight: 700; color: var(--on-fill); margin-top: 3px; }
.pv-cmt-main { flex: 1; min-width: 0; background: var(--bg-tint); border-radius: 4px 12px 12px 12px; padding: 7px 11px 8px; }
.pv-cmt-h { display: flex; align-items: baseline; gap: 7px; }
.pv-cmt-h b { font-size: 12px; font-weight: 700; color: var(--ink); }
.pv-cmt-h .ts { font-size: 10.5px; color: var(--muted-2); }
.pv-cmt-b { margin-top: 1px; font-size: 13px; line-height: 1.6; color: var(--ink-sub); white-space: pre-wrap; word-break: break-word; }
.pv-cmt-compose { flex: 1; display: flex; align-items: flex-end; gap: 6px; }
.pv-cmt-in { flex: 1; min-width: 0; resize: none; font-family: inherit; font-size: 13px; line-height: 1.5; color: var(--ink);
  padding: 8px 12px; border: 1px solid var(--line); border-radius: 10px; background: var(--bg-tint); }
.pv-cmt-in::placeholder { color: var(--muted-2); }
.pv-cmt-in:focus-visible { outline: none; border-color: var(--blue); background: var(--bg); box-shadow: 0 0 0 3px var(--bg-punch); }
.pv-cmt-send { flex: none; width: 32px; height: 32px; display: inline-flex; align-items: center; justify-content: center; font-size: 13px;
  border: 1px solid var(--line); border-radius: 9px; background: var(--bg); color: var(--ink-sub); cursor: pointer; }
.pv-cmt-send:hover { border-color: var(--blue); color: var(--blue-deep); }
.pv-cmt-send:disabled { opacity: .5; cursor: default; }

/* ── 세션 = 작업대 ── */
.pv-z-sess .pv-z-b { padding: 2px 8px 6px; }
.pv-row { position: relative; display: flex; align-items: center; gap: 10px; width: 100%; text-align: left; font: inherit; padding: 8px 10px;
  border: 0; border-radius: 10px; background: none; color: inherit; text-decoration: none; cursor: pointer; }
.pv-row:hover { background: var(--bg-tint); }
.pv-row:focus-visible { outline: 2px solid var(--blue); outline-offset: -2px; }
.pv-row.dim .t { color: var(--ink-sub); font-weight: 600; }
.pv-row.acc-busy { box-shadow: inset 3px 0 0 var(--blue); }
.pv-row.acc-waiting { box-shadow: inset 3px 0 0 var(--warn-deep); }
.pv-row-main { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 1px; }
.pv-row-main .t { font-size: 13.5px; font-weight: 700; color: var(--ink); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pv-row-main .m { font-size: 11.5px; color: var(--muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pv-row-main .m .st-busy { color: var(--blue-deep); font-weight: 600; }
.pv-row-main .m .st-waiting { color: var(--warn-deep); font-weight: 600; }
.pv-row-go { flex: none; width: 10px; color: var(--muted-2); opacity: 0; transition: opacity .1s; }
.pv-row:hover .pv-row-go { opacity: 1; }

.pv-blank { padding: 18px 16px; }
.pv-blank .h { margin: 0; font-size: 13px; font-weight: 700; line-height: 1.6; color: var(--ink-sub); }
.pv-blank .sub { margin: 4px 0 0; font-size: 12.5px; line-height: 1.65; color: var(--muted); }

/* ══ 공유 폴더 = 선반 — 파일 종류가 색으로 읽힌다 ═══════════════════════════════ */
.pv-shelf { flex: none; margin-top: 12px; border: 1px solid var(--line); border-radius: 13px; background: var(--bg);
  box-shadow: 0 1px 2px rgba(var(--shadow-ink), .04); overflow: hidden; }
.pv-shelf > .pv-z-h { padding-bottom: 6px; }
.pv-shelf-b { display: flex; align-items: stretch; gap: 8px; overflow-x: auto; padding: 2px 15px 13px; scrollbar-width: thin; }
.pv-file { flex: none; width: 102px; display: flex; flex-direction: column; align-items: center; gap: 5px; font: inherit; text-align: center;
  padding: 12px 8px 9px; border: 1px solid transparent; border-radius: 11px; background: var(--bg-tint); color: inherit; cursor: pointer; }
.pv-file:hover { border-color: var(--line-net-2); background: var(--bg-tint-2); }
.pv-file:focus-visible { outline: 2px solid var(--blue); outline-offset: 1px; }
.pv-file .ic { display: inline-flex; }
.pv-file .ic .fic { width: 25px; height: 25px; stroke-width: 1.5; }
.pv-file .fic-dir { color: var(--muted-head); }
.pv-file .fic-image { color: var(--mint-deep); }
.pv-file .fic-video { color: var(--coral); }
.pv-file .fic-audio { color: var(--teal); }
.pv-file .fic-code { color: var(--blue); }
.pv-file .fic-archive { color: var(--muted-head); }
.pv-file .fic-file { color: var(--muted); }
.pv-file .nm { font-size: 11.5px; font-weight: 600; line-height: 1.35; color: var(--ink); word-break: break-all;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.pv-file .mt { font-size: 10.5px; color: var(--muted); font-variant-numeric: tabular-nums; }
.pv-shelf-blank { flex: 1; padding: 16px 4px 20px; font-size: 12.5px; color: var(--muted); line-height: 1.6; }
.pv-shelf.drop-active { border-color: var(--blue); box-shadow: 0 0 0 3px var(--bg-punch); }

.pv-crumbs { display: inline-flex; align-items: center; gap: 2px; margin-left: 6px; min-width: 0; overflow: hidden; }
.pv-crumb { font: inherit; font-size: 11.5px; color: var(--ink-sub); background: none; border: 0; padding: 1px 5px; border-radius: 5px; cursor: pointer; white-space: nowrap; }
.pv-crumb:hover { background: var(--bg-tint-2); color: var(--ink); }
.pv-crumb.cur { color: var(--ink); font-weight: 700; cursor: default; background: none; }
.pv-crumb-sep { font-size: 10.5px; color: var(--muted-3); }
.pv-upprog:not(:empty) { margin-left: 10px; flex: 1; min-width: 120px; }

/* ══ 바닥 — 리브 대화. 위로 살짝 뜬 흰 면(그림자가 경계를 만든다). ══════════════ */
.pv-wrap > .v2-split-y { display: none; }
.pv-wrap.has-turns > .v2-split-y { display: block; }
.pv-chat { flex: none; display: flex; background: var(--bg); position: relative; z-index: 1;
  box-shadow: 0 -1px 0 var(--line), 0 -10px 24px rgba(var(--shadow-ink), .05); }
.pv-wrap.has-turns .pv-chat { height: var(--pv-chat-h); min-height: 170px; }
.pv-chat > .livc-wrap { flex: 1; min-width: 0; }
.pv-wrap:not(.has-turns) .pv-chat .livc-scroller { min-height: 0; }
.pv-wrap:not(.has-turns) .pv-chat .livc-list { padding-top: 10px; padding-bottom: 0; }

.pv-open { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; padding: 2px 0 4px; }
.pv-open-lede { flex: 1 1 320px; min-width: 0; font-size: 12.5px; line-height: 1.6; color: var(--muted); }
.pv-open-lede b { color: var(--ink-sub); font-weight: 700; }
.pv-chips { display: inline-flex; flex-wrap: wrap; gap: 6px; }
.pv-chip { font: inherit; font-size: 12.5px; font-weight: 600; padding: 6px 11px; border: 1px solid var(--line); border-radius: 999px; background: var(--bg); color: var(--ink-sub); cursor: pointer; white-space: nowrap; }
.pv-chip:hover { border-color: var(--blue); color: var(--ink); background: var(--bg-tint); }

.pv-bar-note { font-size: 11.5px; color: var(--muted); }
.pv-bar-r { display: inline-flex; gap: 2px; }
.pv-bar-btn { font: inherit; font-size: 12px; font-weight: 600; color: var(--ink-sub); background: none; border: 0; padding: 3px 8px; border-radius: 6px; cursor: pointer; }
.pv-bar-btn:hover { background: var(--bg-tint); color: var(--ink); }

@media (max-width: 1280px) { .pv-room { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); } }
@media (max-width: 1100px) {
  .pv-top { padding-left: 16px; padding-right: 16px; }
  .pv-room { grid-template-columns: minmax(0, 1fr); grid-template-rows: none; grid-auto-rows: minmax(150px, 1fr);
    grid-template-areas: 'doc' 'cmt' 'sess'; }
}