/* === 프로젝트 목록(클릭업식 리스트) === */
/* 카드 대신 태스크 리스트 톤 재사용 + 프로젝트 전용 보강 */
.pjv-proj-card .pjv-tgroup:first-child { margin-top: 4px; }
/* 너비 마진 축소(#339) — 리스트보드 카드 좌우 패딩을 24→16 으로 줄여 제목에 폭을 더 준다(세로 24 유지). */
.pjv-proj-card { padding-left: 16px; padding-right: 16px; }
/* 창이 좁아 메타 컬럼이 minmax(0,W) 로 줄 때 셀 내용이 밖으로 새지 않게 클립 — 제목셀(.pjv-trow-title-cell)은 .pjv-tcell 이 아니라 제외됨. */
.pjv-proj-card .pjv-tcell { overflow: hidden; }
/* 프로젝트 행 — '박스'가 아니라 평평한 클릭업 리스트로 존재감을 살림:
   큰·굵은 제목 + 넉넉한 행 높이 + 행 사이 옅은 하이라인 + hover 틴트/좌측 액센트.
   (테두리·그림자로 행마다 박스 두르던 방식은 컬럼 정렬과 충돌·과해서 폐기.) */
/* 세로 패딩 0(높이는 min-height 46px 로 유지) → 호버 셀 박스가 키운 행 높이를 꽉 채움. 가로 8px(#339) 는 헤더 정렬 유지. */
.pjv-proj-card .pjv-proj-wrap > .pjv-proj-row { min-height: 46px; padding: 0 8px; border-radius: 8px; transition: background .14s ease, box-shadow .14s ease; }
/* 행 사이 옅은 구분선(박스 아님) — 그룹 본문 안에서만, 마지막 행 제외 */
.pjv-proj-card .pjv-tgroup-body .pjv-proj-wrap:not(:last-child) { border-bottom: 1px solid var(--line-row); }
.pjv-proj-card .pjv-proj-row:hover { background: var(--bg-tint); box-shadow: inset 3px 0 0 var(--blue); }
.pjv-proj-card .pjv-proj-row .pjv-trow-title.clickable { font-size: 15px; font-weight: 600; letter-spacing: -.1px; }
/* 인라인 추가행(편집 상태)을 위 프로젝트 행과 픽셀·타이포 정확히 일치 — 좌우 패딩·행높이·글자크기·볼드·자간을 행과 동일하게,
   입력칸 내부 패딩 0 으로 제목 텍스트 시작점(캐럿+점+gap)을 행과 픽셀 단위로 맞춤. */
.pjv-proj-card .pjv-addrow.editing { padding: 0 8px; min-height: 46px; }
.pjv-proj-card .pjv-addrow.editing .pjv-addrow-input { font-size: 15px; font-weight: 600; letter-spacing: -.1px; padding: 0; line-height: 1.3; }
/* 병합 컬럼헤더 좌우 패딩을 행 콘텐츠 시작점(8px·#339)과 맞춰 컬럼 정렬 보존 */
.pjv-proj-card .pjv-tgroup-head-cols { padding-left: 8px; padding-right: 8px; }
/* 프로젝트 펼침 — 그 안의 태스크 행. 프로젝트 행과 같은 좌우 패딩(8px·#339)·그리드(pjvProjGridTemplate)라 컬럼 정렬 일치.
   titleCell 의 depth*22px 들여쓰기로 중첩 표현. 펼친 영역은 아주 옅은 틴트로 묶어 보이게. */
/* 고정 높이로 핀 — 담당자(아바타 26px) 있고 없고(아이콘 20px)에 따라 행 높이가 달라지지 않게.
   grid align-items:center 라 내용은 가운데 정렬, 행은 항상 44px. (프로젝트 행 46px 보다 살짝 작아 위계도 생김) */
.pjv-proj-card .pjv-proj-taskrow { padding: 0 8px; height: 44px; min-height: 44px; }
.pjv-proj-card .pjv-proj-subs { background: color-mix(in srgb, var(--bg-tint) 50%, var(--bg)); }
.pjv-proj-card .pjv-proj-subnote { padding: 8px 12px 9px 50px; color: var(--muted-2); font-size: 12.5px; }
.pjv-proj-when { color: var(--muted-2); font-size: 13px; }
/* 내 세션 컬럼(프로젝트 목록 전용) — 표준 컬럼처럼 아이콘 가운데 정렬 + 세션 바로가기 팝업 */
.pjv-sess-cell { justify-content: center; }
/* 터미널 아이콘은 사각형(창)이라 같은 크기여도 선아이콘보다 꽉 차 보임 → 셀 아이콘만 살짝 축소(다른 컬럼 20px 유지). */
.pjv-sess-cell .pjv-cell-ico { width: 20px; height: 20px; }
/* '내 세션' 활성(내 세션 있음) — 컬러(틸) 터미널 아이콘 + 우상단 작은 라이브 점(민트). 없으면 .empty 로 옅게(비활성). */
.pjv-sess-ico-wrap { position: relative; display: inline-flex; align-items: center; justify-content: center; }
.pjv-cell-btn.pjv-sess-active .pjv-cell-ico,
.pjv-cell-btn.pjv-sess-active:hover .pjv-cell-ico { color: var(--teal); }
.pjv-sess-dot { position: absolute; top: -2px; right: -3px; width: 6px; height: 6px; border-radius: 50%; background: var(--mint); box-shadow: 0 0 0 1.5px var(--bg); }
.pjv-sess-menu { min-width: 224px; }
.pjv-sess-menu .pjv-menu-item { gap: 9px; }
.pjv-sess-ico { flex: none; display: inline-flex; align-items: center; color: var(--muted); }
.pjv-sess-ico svg { width: 16px; height: 16px; }
.pjv-sess-name { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
/* 메뉴의 '새 세션 만들기' — ＋ 아이콘을 세션 아이콘 자리에 맞춰 파란 강조. */
.pjv-sess-add { color: var(--blue); }
.pjv-sess-add-ico { width: 16px; justify-content: center; font-size: 15px; font-weight: 700; color: var(--blue); }
.pjv-proj-noface { color: var(--muted-3); font-size: 13px; }

/* ════ 클릭업식 행 호버 컨트롤 + 다중선택 하단 바 ════ */
/* 좌측 체크박스 — 평소 숨김(자리 유지, 헤더엔 동폭 spacer 로 정렬), 행 호버/선택 시 표시. */
.pjv-row-check { position: relative; flex: none; width: 16px; height: 16px; border-radius: 4px; border: 1.6px solid var(--muted-3); background: var(--bg); cursor: pointer; display: inline-flex; align-items: center; justify-content: center; padding: 0; color: #fff; font-size: 11px; line-height: 1; opacity: 0; transition: opacity .12s ease, background-color .12s ease, border-color .12s ease; }
/* 클릭 판정 확대(#366) — 16px 박스는 너무 예민하니 주변 셀까지 히트영역을 넓힌다(보이는 크기는 그대로). */
.pjv-row-check::before { content: ''; position: absolute; top: -9px; bottom: -9px; left: -8px; right: -6px; }
.pjv-row-check-spacer { flex: none; width: 16px; }
.pjv-trow:hover .pjv-row-check, .pjv-row-check.on { opacity: 1; }
/* 그룹 헤더 전체선택(#664) — 그룹 헤더 호버 시 표시(행 체크박스와 동일 결). */
.pjv-tgroup-head:hover .pjv-group-check { opacity: 1; }
.pjv-row-check:hover { border-color: var(--blue); }
.pjv-row-check.on { background: var(--blue); border-color: var(--blue); }
.pjv-row-check.on::after { content: '✓'; }
.pjv-trow-wrap.pjv-row-selected > .pjv-trow { background: var(--bg-sel); box-shadow: inset 2px 0 0 var(--blue); }
/* 드래그 다중선택(#366) — 끄는 동안 텍스트 선택 방지 + 지나온 행 체크박스는 계속 보이게. */
body.pjv-dragging { user-select: none; -webkit-user-select: none; cursor: grabbing; }
body.pjv-dragging .pjv-row-check { opacity: 1; }
/* 드래그 재정렬 핸들(#366) — 체크박스 왼쪽 여백에 절대배치(레이아웃 불변). 행 호버 시 표시, 잡으면 grabbing. */
.pjv-trow-title-cell { position: relative; }
/* 이름 컬럼 폭 조절 핸들(#483) — 컬럼 헤더 제목칸 오른쪽 경계에 얹어 col-resize 로 잡아 끈다. 레이아웃 불변(절대배치).
   행이 아니라 '컬럼 헤더'(.pjv-tgroup-head-cols / .pjv-list-colhead)의 제목칸에만 붙는다. */
.pjv-col-resize { position: absolute; top: 0; right: -4px; width: 10px; height: 100%; cursor: col-resize; z-index: 4; }
/* 모든 컬럼 폭 핸들(#666) — 기본/커스텀 컬럼 헤더 셀에도 이름칸과 같은 핸들. 셀이 앵커가 되도록 relative. */
.pjv-tcell.pjv-colhead, .pjv-tcell.pjv-thcol { position: relative; }
/* ⚠ 핸들은 **셀 안에** 둔다(#1067) — 예전처럼 right:-5px 로 셀 밖으로 내밀면 DOM 상 뒤에 오는 옆 컬럼 헤더 셀이
   그 위를 덮어(둘 다 position:relative 라 나중 요소가 위) 실제 마우스가 핸들에 닿지 않는다. 그러면 폭 조절 대신
   열 순서 드래그(.pjv-col-draggable)가 걸려 "폭 조절 기능이 사라졌다"로 보인다(합성 이벤트로는 통과해 못 잡던 버그).
   제목 열만 멀쩡했던 건 그 셀이 sticky+z-index 라 옆 셀보다 위에 그려졌기 때문. 선 위치(경계)는 그대로 유지. */
.pjv-col-resize-col { right: 0; }
.pjv-col-resize-col::after { right: 0; }
.pjv-col-resize::after { content: ''; position: absolute; top: 3px; bottom: 3px; right: 4px; width: 2px; border-radius: 2px; background: transparent; transition: background-color .12s ease; }
/* 컬럼 경계선은 **헤더에서 늘 얕게 보인다**(#1067) — 이게 '여기를 잡으면 열 폭이 바뀐다'는 유일한 단서다.
   예전처럼 호버할 때만 나타나면 기능이 통째로 사라진 것으로 읽힌다(실제 사용자 신고: "드래그 기능 없어짐?").
   덤으로 열과 열 사이에 리듬이 생겨 라벨이 다닥다닥 붙어 보이던 것도 해소된다. 호버=진하게, 잡는 중=파랑. */
.pjv-tgroup-head-cols .pjv-col-resize::after, .pjv-list-colhead .pjv-col-resize::after { background: var(--line-soft, #e9ecf1); }
.pjv-tgroup-head-cols:hover .pjv-col-resize::after, .pjv-list-colhead:hover .pjv-col-resize::after, .pjv-col-resize:hover::after,
body.pjv-col-resizing .pjv-col-resize::after { background: var(--line-net); }
.pjv-col-resize:hover::after, body.pjv-col-resizing .pjv-col-resize::after { background: var(--blue); }
body.pjv-col-resizing { cursor: col-resize; user-select: none; -webkit-user-select: none; }
.pjv-row-grip { position: absolute; left: -14px; top: 50%; transform: translateY(-50%); width: 13px; height: 22px;
  display: inline-flex; align-items: center; justify-content: center; border: none; background: none; padding: 0; margin: 0;
  color: var(--muted-3); font-size: 12px; line-height: 1; cursor: grab; opacity: 0; transition: opacity .12s ease; touch-action: none; }
.pjv-trow:hover .pjv-row-grip, body.pjv-dragging .pjv-row-grip { opacity: .6; }
.pjv-row-grip:hover { opacity: 1; color: var(--blue); }
.pjv-row-grip:active { cursor: grabbing; }
.pjv-reorder-src { opacity: .4; }
/* 놓일 자리 가로 삽입선 + 커서 따라다니는 고스트('N개 태스크'). */
.pjv-reorder-marker { height: 2px; margin: -1px 0; background: var(--blue); border-radius: 2px; box-shadow: 0 0 0 1px rgba(45,107,240,.25); pointer-events: none; }
.pjv-reorder-ghost { position: fixed; z-index: 10000; pointer-events: none; background: var(--blue); color: #fff;
  padding: 3px 11px; border-radius: 7px; font-size: 12.5px; font-weight: 600; box-shadow: 0 6px 20px rgba(0,0,0,.28);
  white-space: nowrap; max-width: 260px; overflow: hidden; text-overflow: ellipsis; }
/* 제목 우측 아이콘 3개 — margin-left:auto 로 제목셀 우측 끝에. 평소 숨김, 행 호버 시 표시. */
/* 제목 우측 호버 아이콘 — ⋯ 버튼과 동일 언어(테두리 없음·작게·muted). 담당자 컬럼과 겹치지 않게 우측 여백. */
.pjv-row-actions { flex: none; margin-left: auto; display: inline-flex; align-items: center; gap: 1px; padding-left: 8px; margin-right: 12px; opacity: 0; transition: opacity .12s ease; }
.pjv-trow:hover .pjv-row-actions { opacity: 1; }
.pjv-row-act { flex: none; width: 24px; height: 24px; display: inline-flex; align-items: center; justify-content: center; border: none; background: none; border-radius: 6px; cursor: pointer; color: var(--muted-2); padding: 0; transition: background-color .12s ease, color .12s ease; }
.pjv-row-act:hover { color: var(--ink); background: var(--bg-tint); }
.pjv-act-ic { width: 16px; height: 16px; display: block; }
/* 태스크는 조금, 프로젝트 목록은 좀 많이 크게 — 프로젝트 행은 더 큰 버튼·아이콘. */
.pjv-proj-row .pjv-row-act { width: 30px; height: 28px; border-radius: 7px; }
.pjv-proj-row .pjv-act-ic { width: 19px; height: 19px; }
/* 제목 우측 호버 액션을 '절대배치'로 빼 제목 폭을 상시 점유하지 않게(#339) — 숨김(opacity 0) 상태에서도 ~112px 를 먹어 제목을 짓누르던 문제 제거.
   평소: 클릭 통과(pointer-events:none)라 제목 어디를 눌러도 상세로 이동. 행 호버 시에만 우측에 살짝 겹쳐 뜨고 버튼만 클릭 가능.
   배경 그라데이션(투명→호버틴트)으로 제목 글자 위에서도 아이콘이 또렷하게 보인다(클릭업식). */
.pjv-proj-row .pjv-trow-title-cell { position: relative; }
.pjv-proj-row .pjv-row-actions {
  position: absolute; right: 0; top: 0; bottom: 0; margin: 0; padding-left: 30px;
  background: linear-gradient(to right, transparent, var(--bg-tint) 24px);
  pointer-events: none;
}
.pjv-proj-row:hover .pjv-row-actions .pjv-row-act { pointer-events: auto; }
/* 태스크 리스트(.pjv-tasks-card — 프로젝트 보드와 달리 .pjv-proj-card 없음)도 같은 패턴(#339) —
   제목 우측 호버 액션을 절대배치로 빼 제목 폭을 상시 점유하지 않게 + 메타 셀 클립. 좁은 창에서 태스크 제목 보호. */
.pjv-tasks-card:not(.pjv-proj-card) .pjv-tcell { overflow: hidden; }
.pjv-tasks-card:not(.pjv-proj-card) .pjv-trow-title-cell { position: relative; }
.pjv-tasks-card:not(.pjv-proj-card) .pjv-row-actions {
  position: absolute; right: 0; top: 0; bottom: 0; margin: 0; padding-left: 28px;
  background: linear-gradient(to right, transparent, var(--bg-tint) 22px);
  pointer-events: none;
}
.pjv-tasks-card:not(.pjv-proj-card) .pjv-trow:hover .pjv-row-actions .pjv-row-act { pointer-events: auto; }
/* 개수 칩 — 숫자 왼쪽에 하위태스크 아이콘(프로젝트 행·태스크 행·펼침 태스크 행 공통). */
.pjv-subcount-ico { display: inline-flex; align-items: center; gap: 3px; }
.pjv-subcount-ico .pjv-subtask-ic { width: 12px; height: 12px; flex: none; }
/* 하위 태스크 아이콘 배지(클릭하여 펼침) — 클릭 어포던스(커서·호버·키보드 포커스) */
.pjv-subcount-ico.clickable { cursor: pointer; transition: background .12s, color .12s; }
.pjv-subcount-ico.clickable:hover { background: var(--bg-sel); color: var(--blue); }
.pjv-subcount-ico.clickable:focus-visible { outline: 2px solid var(--blue); outline-offset: 1px; }
/* 팀원 보기전용 팝오버 — 목록만(토글·체크 없음). 행은 버튼이 아니라 정적 표시. */
.pjv-team-view { min-width: 180px; }
.pjv-team-view-row { display: flex; align-items: center; gap: 9px; padding: 6px 12px; font-size: 13px; color: var(--ink); }
.pjv-team-view-hint { padding: 7px 12px 8px; font-size: 11.5px; color: var(--muted-2); border-top: 1px solid var(--line); margin-top: 3px; }
/* 하단 일괄작업 바 — 어두운 알약, 화면 하단 중앙 고정. 선택 1개 이상이면 .show. */
.pjv-bulkbar { position: fixed; left: 50%; bottom: 28px; transform: translateX(-50%) translateY(16px); z-index: 1200; display: none; align-items: center; gap: 6px; padding: 10px 12px 10px 20px; background: #1B2942; color: #fff; border-radius: 16px; box-shadow: 0 14px 40px rgba(13,22,40,.4); opacity: 0; transition: opacity .16s ease, transform .16s ease; max-width: calc(100vw - 32px); }
.pjv-bulkbar.show { display: inline-flex; opacity: 1; transform: translateX(-50%) translateY(0); }
.pjv-bulk-count { display: inline-flex; align-items: center; gap: 9px; font-size: 15px; font-weight: 600; padding-right: 8px; }
.pjv-bulk-n { display: inline-flex; align-items: center; justify-content: center; min-width: 26px; height: 26px; padding: 0 8px; border-radius: 8px; background: var(--blue); color: #fff; font-size: 14px; font-weight: 700; }
.pjv-bulk-lbl { color: #C7D2E6; font-weight: 500; white-space: nowrap; }
.pjv-bulk-x { width: 28px; height: 28px; border: none; background: rgba(255,255,255,.08); color: #C7D2E6; border-radius: 8px; cursor: pointer; font-size: 14px; line-height: 1; }
.pjv-bulk-x:hover { background: rgba(255,255,255,.16); color: #fff; }
.pjv-bulk-actions { display: inline-flex; align-items: center; gap: 3px; padding-left: 8px; border-left: 1px solid rgba(255,255,255,.12); }
.pjv-bulk-btn { display: inline-flex; align-items: center; gap: 8px; height: 40px; padding: 0 14px; border: none; background: none; color: #E4EAF4; border-radius: 10px; cursor: pointer; font-size: 14.5px; font-weight: 500; white-space: nowrap; }
.pjv-bulk-btn:hover { background: rgba(255,255,255,.12); color: #fff; }
.pjv-bulk-btn.danger:hover { background: rgba(228,117,107,.22); color: #FFB3AC; }
.pjv-bulk-btn svg { width: 19px; height: 19px; flex: none; color: currentColor; }
.pjv-bulkbar .pjv-cell-ico { color: currentColor; }
/* 메인 액션 — 선택 태스크를 클로드로 실행. 어두운 바 위에서 확 튀게: 밝은 그라데이션 + 글로우 + 은은한 펄스. 보조 버튼들과 간격으로 분리. */
.pjv-bulk-run { display: inline-flex; align-items: center; gap: 9px; height: 40px; margin-left: 14px; padding: 0 18px; border: none; border-radius: 11px; cursor: pointer; font-size: 14.5px; font-weight: 700; letter-spacing: -.1px; white-space: nowrap; color: #fff; background: linear-gradient(135deg, #4F8CFF 0%, #8A5CFF 100%); box-shadow: 0 4px 18px rgba(110,99,255,.5); animation: pjvBulkRunPulse 2.4s ease-in-out infinite; transition: transform .12s ease, box-shadow .12s ease, filter .12s ease; }
.pjv-bulk-run:hover { animation: none; transform: translateY(-1px); box-shadow: 0 9px 28px rgba(110,99,255,.72); filter: brightness(1.07); }
.pjv-bulk-run:active { transform: translateY(0); box-shadow: 0 4px 14px rgba(110,99,255,.5); }
.pjv-bulk-run:disabled { opacity: .6; cursor: default; animation: none; transform: none; }
.pjv-bulk-run svg { width: 18px; height: 18px; flex: none; }
@keyframes pjvBulkRunPulse { 0%, 100% { box-shadow: 0 4px 18px rgba(110,99,255,.45); } 50% { box-shadow: 0 6px 26px rgba(110,99,255,.85); } }
/* 보조 액션 — '클로드로 실행' 기본값 설정. 실행 버튼보다 덜 강조(펄스·그라데이션 없음, 은은한 고스트로 살짝 빠지게). */
.pjv-bulk-cfg { display: inline-flex; align-items: center; gap: 7px; height: 40px; margin-left: 8px; padding: 0 13px; border: 1px solid rgba(255,255,255,.16); background: rgba(255,255,255,.05); color: #C7D2E6; border-radius: 11px; cursor: pointer; font-size: 13.5px; font-weight: 600; white-space: nowrap; transition: background .12s ease, color .12s ease, border-color .12s ease; }
.pjv-bulk-cfg:hover { background: rgba(255,255,255,.12); color: #fff; border-color: rgba(255,255,255,.3); }
.pjv-bulk-cfg svg { width: 18px; height: 18px; flex: none; color: currentColor; }
.pjv-menu-head { padding: 6px 12px 4px; font-size: 11.5px; font-weight: 700; color: var(--muted-2); letter-spacing: .2px; }
.pjv-bulk-sep-h { height: 1px; background: var(--line); margin: 4px 0; }
.pjv-bulk-apply { color: var(--blue); font-weight: 600; }
.pjv-rowtag-input { width: calc(100% - 16px); margin: 2px 8px 6px; box-sizing: border-box; font-size: 13px; padding: 6px 8px; border: 1px solid var(--line); border-radius: 7px; outline: none; }
.pjv-rowtag-input:focus { border-color: var(--blue); }
.pjv-proj-faces .project-face { width: 24px; height: 24px; font-size: 10px; }
.pjv-proj-empty { padding: 12px 8px; color: var(--muted-2); font-size: 13px; }
/* 선택(일괄삭제) 모드 체크박스 — 상태 동그라미 자리 */
.pjv-proj-check { flex: none; width: 18px; height: 18px; border-radius: 6px; border: 1.6px solid var(--muted-3); background: var(--bg); cursor: pointer; display: inline-flex; align-items: center; justify-content: center; padding: 0; color: #fff; font-size: 11px; line-height: 1; }
.pjv-proj-check:hover { border-color: var(--blue); }
.pjv-proj-check.on { background: var(--blue); border-color: var(--blue); }
.pjv-proj-check.disabled { cursor: default; opacity: .4; }

/* ── 세션 주입 지도(injectionMap) — 주입 시점별 블록 + 조각 + 딥링크 (2026-06-26) ── */
.inj-moments { display: flex; flex-direction: column; gap: 14px; margin-top: 6px; }
.inj-moment { border: 1px solid var(--line); border-radius: 12px; padding: 14px 16px; background: var(--bg); }
.inj-moment-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; margin-bottom: 8px; }
.inj-moment-h { min-width: 0; }
.inj-moment-title { margin: 0; font-size: 15px; font-weight: 800; color: var(--ink); }
.inj-sub { margin: 2px 0 0; color: var(--ink-sub); }
.inj-toggle { flex: none; white-space: nowrap; }
.inj-pieces { display: flex; flex-direction: column; gap: 2px; margin: 6px 0 4px; }
.inj-piece { display: flex; align-items: center; gap: 10px; padding: 7px 8px; border-radius: 8px; }
.inj-piece:hover { background: var(--line-row); }
.inj-n { flex: none; width: 22px; text-align: center; color: var(--muted); font-weight: 700; }
.inj-piece-body { flex: 1 1 auto; min-width: 0; }
.inj-piece-label { font-weight: 600; color: var(--ink); }
.inj-custom { display: flex; flex-direction: column; gap: 4px; margin-top: 6px; }
.inj-custom-row { display: flex; align-items: baseline; gap: 8px; padding: 4px 8px; border-left: 2px solid var(--line-net); }
.inj-preview { margin-top: 8px; }

/* ════ 팀 기능(2026-06-26) — 사이드바 공간 통합(우리 팀 접이식) + 분류체계 오너 + 팀 관리 ════ */
/* 사이드바 카테고리 그룹(<details>) — 우리 팀 상단 펼침(★), 나머지 space별 접이식 */
.tree-group { margin: 2px 0; }
.tree-group > summary {
  list-style: none; cursor: pointer; display: flex; align-items: center; gap: 6px;
  padding: 6px 10px; border-radius: 8px; user-select: none;
  font-size: 11px; font-weight: 700; letter-spacing: 1px; text-transform: uppercase; color: var(--muted-head);
}
.tree-group > summary::-webkit-details-marker { display: none; }
.tree-group > summary::before {
  content: '▸'; font-size: 9px; color: var(--muted-2); transition: transform .12s; display: inline-block; flex: none;
}
.tree-group[open] > summary::before { transform: rotate(90deg); }
.tree-group > summary:hover { background: var(--bg-tint); color: var(--ink-sub); }
.tree-grouptitle { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tree-groupcount { font-weight: 600; color: var(--muted-2); letter-spacing: 0; }
.tree-groupstar { color: var(--blue); font-size: 11px; flex: none; }
.tree-group-mine > summary { color: var(--blue); }
.tree-group-mine { margin-bottom: 6px; }
.tree-group .tree-item { padding-left: 20px; } /* 그룹 내 들여쓰기 */
/* 우리 팀 하위 — 사업/제품/시스템 대분류(#338). 항상 보이는 가벼운 하위 헤더 + 한 단계 더 들여쓴 항목 */
.tree-group-mine .tree-subhead {
  display: flex; align-items: center; gap: 6px; margin-top: 3px;
  padding: 4px 10px 4px 22px;
  font-size: 10px; font-weight: 700; letter-spacing: .8px; text-transform: uppercase; color: var(--muted-2);
}
.tree-subtitle { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tree-subcount { font-weight: 600; color: var(--muted-2); letter-spacing: 0; }
.tree-group-mine .tree-item { padding-left: 30px; } /* 하위그룹 항목 — 우리 팀 일반 항목(20px)보다 한 단계 더 */

/* 분류체계 관리 — 카테고리별 오너 팀(드롭다운/표시) */
.wikicat-owner { display: inline-flex; align-items: center; gap: 5px; font-size: 12px; }
.wikicat-owner-label { font-size: 10.5px; font-weight: 700; letter-spacing: .5px; text-transform: uppercase; color: var(--muted-2); }
.wikicat-owner-name { font-weight: 700; color: var(--blue); }
.wikicat-owner-sel { font-size: 12px; padding: 2px 6px; border: 1px solid var(--line-net-2, #d9dee6); border-radius: 6px; background: var(--bg-soft, #fff); color: var(--ink-sub); }

/* 팀 관리 — 팀원 체크 + 역할 select */
.team-members-wrap { display: flex; flex-direction: column; gap: 2px; max-height: 280px; overflow-y: auto; padding: 2px; }
.team-member-opt { display: flex; align-items: center; gap: 8px; font-size: 13.5px; font-weight: 600; color: var(--ink-sub); padding: 5px 6px; border-radius: 7px; }
.team-member-opt:hover { background: var(--bg-tint); }
/* 한 줄: [체크박스] [이름(가운데 채움)] [역할(우측)]. 이름은 진한 색·항상 보임(길면 말줄임). */
.team-member-name { flex: 1 1 auto; min-width: 60px; color: var(--ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
/* .field select{width:100%}(styles.css:569)를 이 행에선 무력화 — 역할 select 는 내용폭으로 우측에. 특이도 (0,2,0) > (0,1,1). */
.team-members-wrap .team-role-sel { width: auto; min-width: 92px; flex: 0 0 auto; margin-left: auto; font-size: 12px; padding: 3px 6px; border: 1px solid var(--line-net-2, #d9dee6); border-radius: 6px; background: var(--bg-soft, #fff); }

/* 세션 주입 지도 — 가이드 템플릿 안 ${} 자식(들여쓰기) */
.inj-subpieces { margin: 2px 0 2px 18px; padding-left: 12px; border-left: 2px dashed var(--line-net); }
.inj-subpiece { padding: 5px 8px; }
.inj-token { flex: none; min-width: 92px; font-size: 12px; font-weight: 700; color: var(--ink-note); background: var(--line-row); padding: 1px 6px; border-radius: 5px; }

/* ============================================================
   프로젝트 보드(#/projects2) — '보기' 팝오버(영역/상태 스위치) + 영역 사이드바
   (옛 리스트›상태/리스트/상태 세그먼트 + 층위강조/사이드바 레이아웃 토글을 통합)
   ============================================================ */

/* '보기' 버튼 — 헤더 좌측. .pjv-subtask-btn 톤 + caret. */
.pjv-view-btn { display: inline-flex; align-items: center; gap: 4px; height: 26px; box-sizing: border-box; line-height: 1; border: 1px solid var(--line); background: var(--bg); cursor: pointer; padding: 0 8px 0 7px; border-radius: 7px; font-size: 12px; font-weight: 600; color: var(--ink-sub); }
.pjv-view-btn:hover { background: var(--bg-tint); color: var(--ink); }
.pjv-view-btn.active { color: var(--blue); border-color: var(--blue); background: var(--bg-tint); }
.pjv-view-ic { width: 13px; height: 13px; flex: none; }
.pjv-view-btn-label { letter-spacing: -.1px; }
.pjv-view-btn-caret { font-size: 9px; line-height: 1; color: var(--muted-2); margin-left: 1px; }
.pjv-view-btn.active .pjv-view-btn-caret { color: var(--blue); }
/* 지금 스코프에선 못 쓰는 버튼(#1067 — 예: 폴더·전체 범위의 '그룹'). 흐리게 보여 주되 누르면 이유를 토스트로 알려준다. */
.pjv-view-btn.is-off { opacity: .45; }
.pjv-view-btn.is-off:hover { background: var(--bg); color: var(--ink-sub); }
/* 영역 사이드바 토글 — 아이콘 전용 정사각 버튼('보기' 톤 공유). */
.pjv-side-toggle { padding: 5px 8px; }

/* 스코프 칩(#662) — 사이드바를 닫고 고른 리스트/폴더만 보는 중임을 표시. × 로 전체 보기 복귀. */
.pjv-scope-chip { display: inline-flex; align-items: center; gap: 5px; height: 26px; box-sizing: border-box; padding: 0 4px 0 9px; border: 1px solid var(--blue); border-radius: 999px; background: color-mix(in srgb, var(--blue) 9%, var(--bg)); font-size: 12px; font-weight: 600; color: var(--blue); max-width: 220px; }
.pjv-scope-chip-name { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; letter-spacing: -.1px; }
.pjv-scope-chip-x { flex: none; width: 18px; height: 18px; display: inline-flex; align-items: center; justify-content: center; border: none; background: transparent; border-radius: 50%; cursor: pointer; font-size: 14px; line-height: 1; color: var(--blue); padding: 0; }
.pjv-scope-chip-x:hover { background: color-mix(in srgb, var(--blue) 18%, transparent); }

/* '보기' 팝오버 — 스위치 행 2개(영역으로 / 상태로). */
.pjv-view-pop { min-width: 272px; padding: 5px; }
.pjv-view-pop-head { font-size: 11.5px; font-weight: 700; color: var(--muted-2); padding: 6px 9px 5px; letter-spacing: .2px; }
.pjv-view-item { justify-content: space-between; gap: 12px; align-items: center; padding: 8px 9px; }
.pjv-view-item:hover { background: var(--bg-tint-2); }
.pjv-view-item-main { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.pjv-view-item-label { font-size: 13.5px; font-weight: 600; color: var(--ink); }
.pjv-view-item.on .pjv-view-item-label { color: var(--blue); }
.pjv-view-item-hint { font-size: 11.5px; color: var(--muted-2); line-height: 1.35; white-space: normal; }

/* 토글 스위치(iOS 형) */
.pjv-switch { flex: none; width: 34px; height: 20px; border-radius: 999px; background: var(--line-net, #d9dee6); position: relative; transition: background .15s ease; }
.pjv-view-item.on .pjv-switch { background: var(--blue); }
.pjv-switch-knob { position: absolute; top: 2px; left: 2px; width: 16px; height: 16px; border-radius: 50%; background: #fff; box-shadow: 0 1px 2px rgba(20,35,59,.28); transition: transform .15s ease; }
.pjv-view-item.on .pjv-switch-knob { transform: translateX(14px); }

/* ＋ 글리프(새 영역 버튼 안) */
.pjv-newlist-plus { font-size: 13px; font-weight: 700; line-height: 1; }

/* 툴바(프로젝트·폴더·필터·… / 내 할당만·Closed)와 아래 본문 사이 여백 — 붙어 보이던 문제 해소, 모든 뷰 일관(#473 후속). */
.pjv-listboard .card-head { margin-bottom: 20px; }
/* 폴더 사이드바 — 좌측 폴더 네비 + 본문(선택 폴더의 프로젝트). */
/* #541 — 사이드바 폭은 CSS 변수(--pjv-side-w). 경계 드래그로 조절·localStorage 저장. */
.pjv-side-wrap { display: grid; grid-template-columns: var(--pjv-side-w, 240px) minmax(0, 1fr); margin-top: 0; }
/* nav = 본문 높이만큼 늘어나는 레일(구분선이 끝까지 이어짐). 항목은 inner 가 sticky 로 들고 스크롤 따라온다. */
.pjv-side-nav { padding: 2px 14px 8px 0; border-right: 1px solid var(--line); position: relative; }
/* 사이드바 폭 조절 핸들(#541) — 오른쪽 경계 위에 얹는 얇은 col-resize 존. */
.pjv-side-resize { position: absolute; top: 0; right: -4px; width: 8px; height: 100%; cursor: col-resize; z-index: 4; }
.pjv-side-resize::after { content: ''; position: absolute; top: 0; left: 3px; width: 2px; height: 100%; background: transparent; transition: background .12s; }
.pjv-side-resize:hover::after, body.pjv-side-resizing .pjv-side-resize::after { background: var(--accent, #5b6cff); }
body.pjv-side-resizing { cursor: col-resize; user-select: none; -webkit-user-select: none; }
/* top=72 는 상단 고정 topbar(64px)를 비켜 사이드바가 그 밑에 깔리지 않게(#504). */
.pjv-side-nav-inner { position: sticky; top: 72px; display: flex; flex-direction: column; gap: 2px;
  /* #541 — 사이드바 독립 스크롤: 항목이 화면보다 길어도 본문 끝까지 안 내려가고 자체 스크롤 */
  max-height: calc(100vh - 88px); overflow-y: auto; overscroll-behavior: contain; }
.pjv-side-nav-head { display: flex; align-items: center; justify-content: space-between; gap: 6px; padding: 2px 4px 2px 8px; }
.pjv-side-nav-head-label { font-size: 14.5px; font-weight: 800; letter-spacing: -.2px; color: var(--ink); }
/* #req: 폴더·리스트 검색창 — 트리 위. 돋보기 + input + ×(입력 시). */
.pjv-side-search { display: flex; align-items: center; gap: 6px; margin: 8px 2px 6px; padding: 5px 9px; border: 1px solid var(--line); border-radius: 9px; background: var(--bg); transition: border-color .12s, box-shadow .12s; }
.pjv-side-search:focus-within { border-color: var(--accent, #5b6cff); box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent, #5b6cff) 12%, transparent); }
.pjv-side-search-ic { flex: none; width: 15px; height: 15px; color: var(--muted-2); }
.pjv-side-search-input { flex: 1 1 auto; min-width: 0; border: none; background: none; outline: none; font-size: 13px; font-family: inherit; color: var(--ink); padding: 0; }
.pjv-side-search-input::placeholder { color: var(--muted-2); }
.pjv-side-search-clear { flex: none; display: none; width: 18px; height: 18px; align-items: center; justify-content: center; border: none; background: var(--bg-tint-2); color: var(--muted); cursor: pointer; border-radius: 50%; font-size: 13px; line-height: 1; padding: 0; }
.pjv-side-search-clear:hover { background: var(--line); color: var(--ink); }
.pjv-side-search.has-q .pjv-side-search-clear { display: inline-flex; }
/* (#1154) 트리 검색 결과 건수 — 검색창이 상시 노출이라 검색어가 남은 채 화면을 옮기기 쉽다.
   트리가 좁아진 이유를 트리 맨 위 한 줄로 알린다(실제 매칭 수 — 표시는 리스트당 8개까지). */
.pjv-side-searchcount { padding: 2px 9px 6px; font-size: 11.5px; font-weight: 700; color: var(--muted-2); letter-spacing: -.1px; }
.pjv-side-tree { display: flex; flex-direction: column; gap: 0; }
.pjv-side-empty { padding: 14px 8px; font-size: 12.5px; color: var(--muted-2); text-align: center; }
/* 📦 아카이브(#1067) — 휴지통 바로 위 고정 폴더. 구분선은 이 항목이 짊어진다(아래 휴지통과 한 '고정 유틸' 구역).
   휴지통과 같은 무채 톤이되 파괴적이지 않으므로 danger 색은 쓰지 않는다. */
.pjv-side-archive { margin-top: 4px; padding-top: 9px; border-top: 1px solid var(--line-soft, var(--bg-tint-2)); }
.pjv-side-archive .pjv-side-archive-ico { display: inline-flex; width: 20px; justify-content: center; font-size: 14px; line-height: 1; filter: grayscale(.35); }
.pjv-side-archive .pjv-side-navlabel { color: var(--muted); font-weight: 600; }
.pjv-side-archive:hover .pjv-side-navlabel, .pjv-side-archive.active .pjv-side-navlabel { color: var(--ink); }
.pjv-side-archive .pjv-side-navcount { color: var(--muted-2); }
/* 아카이브 드롭 오버 — 삭제가 아니라 '이동'이라 휴지통(빨강)과 달리 이동(파랑) 신호를 쓴다. */
.pjv-side-archive.pjv-side-archive-over { background-color: var(--bg-tint); box-shadow: inset 0 0 0 2px var(--blue); border-radius: 8px; }
.pjv-side-archive.pjv-side-archive-over .pjv-side-archive-ico { filter: none; transform: scale(1.18); }
.pjv-side-archive.pjv-side-archive-over .pjv-side-navlabel { color: var(--blue); }
/* 휴지통 — 사이드바 맨 아래 폴더형 항목(#670). 상단 헤더 줄에서 내림. 무채(조용한 유틸).
   구분선은 바로 위 아카이브(#1067)가 담당하므로 여기선 선을 겹치지 않는다. */
.pjv-side-trash { margin-top: 0; padding-top: 2px; text-decoration: none; }
.pjv-side-trash .pjv-side-navtrash-ico { display: inline-flex; width: 20px; justify-content: center; font-size: 14px; line-height: 1; filter: grayscale(.35); }
.pjv-side-trash .pjv-side-navlabel { color: var(--muted); font-weight: 600; }
.pjv-side-trash:hover .pjv-side-navlabel { color: var(--ink); }
/* 휴지통 드롭 오버(#1020) — 리스트·폴더·프로젝트를 끌어와 올렸을 때. 파괴적 동작이라 이동(파랑) 대신 danger 빨강으로 신호. */
.pjv-side-trash.pjv-side-trash-over { background-color: var(--bg-danger, #FDECEC); box-shadow: inset 0 0 0 2px var(--danger, #D6453C); border-radius: 8px; }
.pjv-side-trash.pjv-side-trash-over .pjv-side-navtrash-ico { filter: none; transform: scale(1.18); }
.pjv-side-trash.pjv-side-trash-over .pjv-side-navlabel { color: var(--danger, #D6453C); }
/* 검색 결과 프로젝트 행(#665) — 리스트 아래 들여쓴 결과. 리스트 항목보다 살짝 작고 옅게, 클릭=상세. */
.pjv-side-navproj { padding-top: 4px; padding-bottom: 4px; font-size: 13px; font-weight: 500; gap: 7px; }
.pjv-side-navproj .pjv-status-ic { flex: none; }
.pjv-side-navproj.done .pjv-side-navlabel { color: var(--muted-2); text-decoration: line-through; }
.pjv-side-navproj-more { padding: 2px 10px 6px; font-size: 12px; color: var(--muted-2); }
/* (#1154) 'N개 더'는 눌러서 그 리스트로 간다(검색어를 가지고) — 누를 수 있음을 색·커서로 알린다.
   ⚠ 배경은 background-color 로만(위 격자선 background-image 를 shorthand 가 지운다). */
.pjv-side-navproj-more.clickable { cursor: pointer; color: var(--blue); font-weight: 600; }
.pjv-side-navproj-more.clickable:hover { background-color: var(--bg-tint-2); }
/* 사이드바를 열었을 때만 보이는 안내(#456 재작성). */
.pjv-side-nav-hint { padding: 0 8px 11px; margin-top: 3px; font-size: 12px; line-height: 1.5; color: var(--ink-sub); }
.pjv-side-collapse { flex: none; width: 22px; height: 22px; display: inline-flex; align-items: center; justify-content: center; border: none; background: none; cursor: pointer; color: var(--muted-2); font-size: 15px; line-height: 1; border-radius: 6px; padding: 0 0 2px; }
.pjv-side-collapse:hover { background: var(--bg-tint-2); color: var(--ink); }
/* 헤더 줄 도구(#1067, 클릭업 파리티) — 두 부류로 나뉜다.
   ① [◀ 접기] = 무지 아이콘, **호버로 드러난다**(평소엔 라벨만 조용히). 키보드 포커스에도 노출.
   ② [＋ ⌄ 새로 만들기] = **항상 보이는 흰 알약**(테두리 + 얕은 그림자) — 클릭업도 이것만 상시 노출한다.
   (#1154) 🔍 토글은 폐지 — 검색창이 트리 위에 상시 노출된다. 그와 함께 .pjv-side-head-btn 규칙도 사용처가 없어져 정리했다. */
.pjv-side-head-btns { flex: none; display: inline-flex; align-items: center; gap: 1px; }
.pjv-side-collapse { opacity: 0; transition: opacity .12s ease, background .12s ease, color .12s ease; }
.pjv-side-nav:hover .pjv-side-collapse,
.pjv-side-nav-inner:focus-within .pjv-side-collapse { opacity: 1; }
/* 터치·펜 등 호버가 없는 환경에선 늘 보이게(호버 노출은 마우스 전제). */
@media (hover: none) { .pjv-side-collapse { opacity: 1; } }
/* ＋ 알약 — 상시 노출이라 호버 페이드 규칙에서 제외(위 셀렉터에 안 걸리게 클래스도 따로 쓴다). */
.pjv-side-head-add { flex: none; display: inline-flex; align-items: center; justify-content: center; gap: 1px; height: 26px; padding: 0 4px 0 6px; margin-left: 3px;
  border: 1px solid var(--line); border-radius: 9px; background: var(--bg); cursor: pointer; color: var(--ink);
  box-shadow: 0 1px 2px rgba(20, 35, 59, .07); transition: background .12s ease, border-color .12s ease, box-shadow .12s ease; }
.pjv-side-head-add:hover { background: var(--bg-tint); border-color: var(--line-strong, var(--muted-3, #c7cdd8)); box-shadow: 0 1px 3px rgba(20, 35, 59, .12); }
.pjv-side-head-add:active { background: var(--bg-tint-2); box-shadow: none; }
.pjv-side-head-add svg:last-child { color: var(--muted-2); }
.pjv-side-navitem { display: flex; align-items: center; gap: 9px; width: 100%; text-align: left; border: none; background: none; cursor: pointer; padding: 7px 10px; border-radius: 7px; font-size: 14px; font-weight: 600; color: var(--ink-sub); }
/* 위계 세로선(#1067, 클릭업 파리티) — 항목의 깊이만큼 왼쪽에 **헤어라인**을 그어 '같은 위계'가 눈에 보이게.
   트리는 중첩 DOM 이 아니라 평평한 목록(항목마다 padding-left 로 깊이 표현)이라, 조상 박스 테두리 대신
   항목 자신의 배경 그라디언트로 긋는다: --pjv-guide-n = 조상 수, 선 x = 19 + k*18(부모 아이콘 중심선).
   격자(18px)는 JS 의 PJV_SIDE_STEP 과 **반드시 같은 값** — 어긋나면 선이 아이콘을 스치며 격자처럼 어색해진다
   (실제로 14px 계단 + 리스트 .sub 30px 특례가 뒤섞여 그렇게 보였고, 한 격자로 통일해 고쳤다).
   색은 본문 구분선보다 더 옅게(면이 아니라 '실'로 읽히게) — 짙으면 표처럼 보인다.
   ⚠ 항목 배경색은 shorthand(background) 대신 background-color 로만 칠한다 — shorthand 는 이 선을 지운다.
   트리 gap 이 0 인 것도 이 때문(항목 사이가 벌어지면 선이 끊긴다). */
.pjv-side-navitem, .pjv-side-navproj-more {
  --pjv-guide-color: color-mix(in srgb, var(--line, #dfe4ec) 55%, transparent);
  background-image: repeating-linear-gradient(to right, var(--pjv-guide-color) 0 1px, transparent 1px 18px);
  background-repeat: no-repeat; background-position: 19px 0;
  background-size: calc(var(--pjv-guide-n, 0) * 18px) 100%;
}
/* 선택된 행에선 선을 지운다 — 파란 알약 위를 실선이 가로지르면 지저분하다(위·아래 행이 이어 주므로 끊겨 보이지 않는다). */
.pjv-side-navitem.active { background-image: none; }
.pjv-side-navitem:hover { background-color: var(--bg-tint-2); color: var(--ink); }
.pjv-side-navitem.active { background-color: var(--bg-sel); color: var(--ink); font-weight: 700; }
.pjv-side-navlabel { flex: 1 1 auto; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
/* 개수는 고정폭 우측정렬 — 자릿수(1↔2)가 달라도 리스트 이름·카테고리 태그가 좌우로 밀리지 않게(정렬 통일). */
.pjv-side-navcount { flex: none; min-width: 1.6em; text-align: right; font-size: 12.5px; font-weight: 600; color: var(--muted-2); font-variant-numeric: tabular-nums; }
.pjv-side-navitem.active .pjv-side-navcount { color: var(--ink-sub); }
.pjv-side-dot { flex: none; width: 9px; height: 9px; border-radius: 50%; background: var(--muted-2); }
.pjv-side-dot.all { background: linear-gradient(135deg, var(--blue), #8b5cf6); }
.pjv-side-dot.none { background: transparent; box-shadow: inset 0 0 0 1.5px var(--muted-3, #aab1bd); }
/* 묶음 폴더 아이콘 — 동그란 점 대신 '색을 채운 폴더'로 상위 분류 느낌(#356). */
.pjv-bundle-ic { flex: none; width: 18px; height: 18px; display: block; }
.pjv-side-navitem.active .pjv-bundle-ic.none path { stroke: var(--blue); }
.pjv-side-newlist { display: inline-flex; align-items: center; gap: 6px; margin-top: 7px; border: 1px dashed var(--line-net, #d9dee6); background: none; cursor: pointer; padding: 6px 9px; border-radius: 7px; font-size: 12.5px; font-weight: 600; color: var(--muted); align-self: flex-start; }
.pjv-side-newlist:hover { border-color: var(--blue); color: var(--blue); background: var(--bg-tint); }
/* 본문이 짧아도 뷰포트만큼 채워, sticky 사이드바가 스크롤 내내 상단에 고정될 이동 여지를 준다(#504 — 본문<사이드바면 sticky 가 안 먹어 사이드바(+새 리스트)가 같이 밀려 내려가던 문제). */
.pjv-side-main { padding-left: 16px; min-width: 0; min-height: calc(100vh - 24px); }
.pjv-side-main > .pjv-tgroup:first-child { margin-top: 0; }

/* ── #607 사이드바 켜짐 = WIKI(.kn-shell/.kn-side) 형 풀블리드 셸 — 좌측 끝 도킹 사이드바(풀하이트) + 우측 컬럼(제목·하위탭·툴바·보드). ── */
.pjv-board-wrap { min-width: 0; }
/* 셸 카드 — 카드 크롬 제거 + 보드 라우트 main 패딩(상 32 / 좌우 16) 상쇄해 뷰포트 좌우 끝·topbar 바로 아래(y=64)까지 붙인다. */
.pjv-listboard.pjv-has-side {
  border: none; border-radius: 0; padding: 0; background: none;
  margin: -32px -16px 0; /* top: main padding-top(32) 상쇄 → 셸 상단이 topbar 바로 아래(y=64) / 좌우: main padding(16) 상쇄 → 뷰포트 끝 */
}
.pjv-has-side .pjv-tasks-body { min-width: 0; }
/* #1067 — 셸은 사이드바 여닫이와 무관하게 항상 같다. 접으면 nav 컬럼만 빠지고(=main 하나), 본문 컬럼의
   패딩·시작 y 는 펼침과 동일해 '사이드바만 사라진' 것으로 보인다. (예전의 :not(.pjv-has-side) 카드형 배치 폐기.) */
.pjv-shell-host { min-width: 0; }
.pjv-side-main-nonav { min-height: calc(100vh - 64px); }
/* 사이드바 컬럼 — WIKI(.kn-side)처럼 좌측 끝 도킹 · border-right · 자체 배경. 상위 카테고리 레일 느낌. */
.pjv-has-side .pjv-side-nav { padding: 0; border-right: 1px solid var(--line); background: var(--bg); }
/* inner 를 y=64(=셸 상단=topbar 바로 아래)부터 풀하이트 sticky 자체 스크롤로. 셸 상단==sticky top 정렬이라
   언핀 상태에서도 스크롤 박스가 뷰포트(64~100vh)에 딱 맞아 아래로 넘치지 않음 = #608 스크롤 트랩 해소. */
.pjv-has-side .pjv-side-nav-inner { top: 64px; max-height: calc(100vh - 64px); padding: 20px 12px 28px 24px; }
/* 우측 컬럼 — 제목·하위탭·툴바·보드가 자체 패딩 안에서(WIKI .kn-main 처럼). */
/* 위 여백 24→10 (#1067) — 브레드크럼 줄이 이미 자체 높이(38px)를 갖고 있어 위에 24px 를 더 두면
   화면 맨 위가 허전하게 비었다. 사이드바 첫 항목과 눈높이도 이쪽이 더 맞는다. */
.pjv-has-side .pjv-side-main { --pjv-main-padl: 28px; --pjv-main-padr: 32px; padding: 10px var(--pjv-main-padr) 48px var(--pjv-main-padl); min-height: calc(100vh - 64px); }
.pjv-has-side .pjv-board-chrome { margin-bottom: 2px; }
.pjv-has-side .pjv-board-toolbar { margin-bottom: 14px; }
/* #req: 툴바가 좁아지면 버튼 라벨이 글자 단위로 세로로 접히던 문제 — 버튼은 안 찌그러지게(flex:none) +
   라벨 nowrap, 대신 툴바 전체가 여러 줄로 자연스럽게 줄바꿈(wrap)되게. 좌측 버튼군·우측 토글군 모두. */
.pjv-board-toolbar { flex-wrap: wrap; align-items: center; row-gap: 8px; }
.pjv-board-toolbar .pjv-tasks-head-left { flex-wrap: wrap; row-gap: 8px; flex: 1 1 auto; }
.pjv-board-toolbar .pjv-view-btn,
.pjv-board-toolbar .pjv-subtask-btn,
.pjv-board-toolbar .pjv-closed-btn { flex: none; }
.pjv-board-toolbar .pjv-view-btn-label,
.pjv-board-toolbar .pjv-subtask-btn-label { white-space: nowrap; }

/* ── #607 필드 많을 때 가로 스크롤 — 컬럼을 찌그러뜨리지 않고(고정 폭) 다 못 담으면 보드만 가로로 스크롤. ── */
/*  박스 높이는 auto(내용에 맞음)라 세로 스크롤은 안 생기고(페이지가 세로 담당), 가로만 스크롤된다. */
/*  스코프 없는 전체 보기의 표 컨테이너(.pjv-tasks-body)도 같은 스크롤 박스 클래스를 달고 나온다(#1067). */
.pjv-board-scroll { overflow-x: auto; }
/* 그리드 행/헤더는 최소 콘텐츠 폭(제목 최소 + 고정 메타열들) 이상으로 — 컨테이너보다 넓으면 스크롤 박스가 가로 스크롤. */
.pjv-board-scroll > .pjv-trow, .pjv-board-scroll .pjv-tgroup-head-cols, .pjv-board-scroll .pjv-list-colhead,
.pjv-board-scroll .pjv-tgroup-body > .pjv-trow-wrap > .pjv-trow, .pjv-board-scroll .pjv-proj-wrap > .pjv-trow,
.pjv-board-scroll .pjv-addrow, .pjv-board-scroll .pjv-proj-subs > .pjv-trow-wrap > .pjv-trow { min-width: min-content; }
/* 스크롤 박스 안의 그룹/본문도 최소 콘텐츠 폭 이상이라야 행이 잘리지 않고 함께 늘어난다. */
.pjv-board-scroll .pjv-tgroup, .pjv-board-scroll .pjv-tgroup-body, .pjv-board-scroll .pjv-flat-body,
.pjv-board-scroll .pjv-trow-wrap, .pjv-board-scroll .pjv-proj-wrap { min-width: min-content; }

/* ── #req 제목(첫 열) 고정 — 필드가 많아 가로 스크롤할 때 제목 열을 엑셀 1열 고정처럼 왼쪽에 붙여 둔다. ── */
/*  가로 스크롤 컨테이너(.pjv-board-scroll — 스코프 본문·전체 보기 표 공용) 안의 모든 제목칸을 sticky left:0. */
/*  불투명 배경(--bg)이라 스크롤되는 메타 셀들이 제목칸 뒤로 숨는다. 행 호버/선택 시 배경색도 맞춰 준다. */
.pjv-board-scroll .pjv-trow-title-cell { position: sticky; left: 0; z-index: 3; background: var(--bg); }
.pjv-board-scroll .pjv-trow:hover > .pjv-trow-title-cell { background: var(--bg-tint); }
.pjv-board-scroll .pjv-trow-wrap.pjv-row-selected > .pjv-trow > .pjv-trow-title-cell { background: var(--bg-sel); }
/* 실제로 가로 스크롤된 상태(is-xscroll)일 때만 고정 열 우측에 얕은 그림자 — 고정 경계 표시(엑셀 느낌). */
.pjv-board-scroll.is-xscroll .pjv-trow-title-cell,
.pjv-tasks-body.is-xscroll .pjv-trow-title-cell { box-shadow: 8px 0 9px -8px rgba(21, 35, 59, .2); }

/* ── #607 열 정렬 통일 토글 — 카드에 .pjv-align-left(좌측)/기본(중앙). 모든 값 셀 + 헤더를 한 방향으로(제목·추가 제외). ── */
/*  기존에 nth-child·필드별로 좌/중이 뒤섞이던 것(우선순위 좌측 등)을 이 변수 규칙으로 통일. 헤더 행도 동일 방향. */
.pjv-proj-card { --pjv-cjust: center; --pjv-ctext: center; }
.pjv-proj-card.pjv-align-left { --pjv-cjust: flex-start; --pjv-ctext: left; }
.pjv-proj-card .pjv-trow > .pjv-tcell:not(.pjv-trow-title-cell):not(.pjv-tcell-add),
.pjv-proj-card .pjv-addrow.editing > .pjv-tcell:not(.pjv-trow-title-cell):not(.pjv-tcell-add) { justify-content: var(--pjv-cjust); }
.pjv-proj-card .pjv-fcell-wrap, .pjv-proj-card .pjv-cell-btn { justify-content: var(--pjv-cjust); }
.pjv-proj-card .pjv-thcol, .pjv-proj-card .pjv-colhead.pjv-stdcol { justify-content: var(--pjv-cjust); text-align: var(--pjv-ctext); }
.pjv-proj-card .pjv-thcol .pjv-thcol-name, .pjv-proj-card .pjv-colhead.pjv-stdcol .pjv-thcol-name { text-align: var(--pjv-ctext); }
/* 툴바의 'h2 프로젝트'는 탭 제목과 중복 — 펼침/접힘 양쪽 다 숨겨 군더더기 제거(툴바 버튼은 유지). #670 통일감 */
.pjv-board-toolbar .pjv-tasks-head-left > h2 { display: none; }

/* 영역 목록 접힘 — 얇은 레일(▶ 펼치기 + 영역 색점 아이콘). 영역 묶음은 유지, 본문은 그대로. */
.pjv-side-wrap.pjv-side-collapsed { grid-template-columns: 44px minmax(0, 1fr); }
.pjv-side-rail { border-right: 1px solid var(--line); }
.pjv-side-rail-inner { position: sticky; top: 8px; display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 4px 0 10px; }
.pjv-side-expand { width: 26px; height: 26px; display: inline-flex; align-items: center; justify-content: center; border: 1px solid var(--line); background: var(--bg); cursor: pointer; color: var(--muted); font-size: 10px; border-radius: 7px; padding: 0; margin-bottom: 2px; }
.pjv-side-expand:hover { border-color: var(--blue); color: var(--blue); background: var(--bg-tint); }
.pjv-side-raildot { width: 28px; height: 28px; display: inline-flex; align-items: center; justify-content: center; border: none; background: none; cursor: pointer; border-radius: 7px; padding: 0; }
.pjv-side-raildot:hover { background: var(--bg-tint-2); }
.pjv-side-raildot.active { background: var(--bg-sel); box-shadow: inset 0 0 0 1.5px var(--blue); }
.pjv-side-raildot .pjv-side-dot { width: 11px; height: 11px; }
.pjv-side-raildot .pjv-bundle-ic { width: 20px; height: 20px; }

/* ── 폴더 설정 ⋯ (사이드바 항목 호버, #453/#454) — 카운트 자리에 겹쳐 뜬다(레이아웃 안 밀림) ── */
.pjv-side-navitem { position: relative; }
.pjv-side-navmore { position: absolute; right: 5px; top: 50%; transform: translateY(-50%); width: 22px; height: 22px; display: inline-flex; align-items: center; justify-content: center; border: none; border-radius: 6px; background: none; color: var(--muted-2); cursor: pointer; font-size: 14px; line-height: 1; padding: 0; opacity: 0; transition: opacity .12s ease; }
.pjv-side-navitem:hover .pjv-side-navmore, .pjv-side-navmore:focus-visible { opacity: 1; background: var(--bg); }
.pjv-side-navitem:hover .pjv-side-navcount { opacity: 0; }   /* 호버 시 개수 숨기고 ⋯ 노출 */
.pjv-side-navmore:hover { background: var(--bg-tint); color: var(--ink); }
/* ⭐ 즐겨찾기 별 토글(#670) — ⋯(right:5) 왼쪽. 호버 시 노출, 즐겨찾기(.on)면 금색으로 항상 표시.
   프로젝트 탭 사이드바는 행 별을 제거(#1115 — 토글은 ⋯ 리스트 설정 메뉴로), 지금은 WIKI 사이드바(.fav-blue)만 쓴다. */
.pjv-side-navfav { position: absolute; right: 30px; top: 50%; transform: translateY(-50%); width: 21px; height: 21px; display: inline-flex; align-items: center; justify-content: center; border: none; border-radius: 6px; background: none; color: var(--muted-3); cursor: pointer; font-size: 12.5px; line-height: 1; padding: 0; opacity: 0; transition: opacity .12s ease, color .12s ease, background .12s ease; }
.pjv-side-navitem:hover .pjv-side-navfav, .pjv-side-navfav:focus-visible { opacity: 1; }
.pjv-side-navfav:hover { background: var(--bg); color: #f5a623; }
.pjv-side-navfav.on { opacity: 1; color: #f5a623; }
/* WIKI '내 소유 카테고리'(#670 후속) — 프로젝트 탭 즐겨찾기(노란 별)와 완전히 같은 컴포넌트·로직, 색만 파란색. */
.pjv-side-navfav.fav-blue:hover { color: var(--blue); }
.pjv-side-navfav.fav-blue.on { color: var(--blue); }
.pjv-side-favhead.fav-blue .pjv-side-favhead-ic { color: var(--blue); }
/* (#1115) 구 '.pjv-side-navitem.is-fav .pjv-side-navcount { opacity:0 }'(즐겨찾기 행 개수 숨김) 삭제 —
   행 별이 사라져 겹칠 게 없고, 즐겨찾기 리스트도 개수를 항상 보여준다. WIKI 는 .kn-nav-cat.is-fav 전용 규칙이 담당. */
.pjv-side-navfolder .pjv-side-navfav { right: 56px; } /* 폴더는 ⋯(right:32)·캐럿 자리 감안 — (폴더엔 별 없지만 방어) */
/* '내 소유 카테고리' 구역 헤더 — WIKI 사이드바 전용(작은 캡스 라벨).
   ⚠ 프로젝트 탭 즐겨찾기는 여기서 갈라져 .pjv-side-favsec(아래 섹션 헤더)를 쓴다(#1113 후속 — 위계 승격).
   WIKI 도 같은 언어로 올릴 값은 있으나 라벨·구조가 달라(접힘 없음) 이번 범위에서 제외했다. */
.pjv-side-favhead { display: flex; align-items: center; gap: 6px; padding: 4px 10px 3px; margin-top: 2px; font-size: 11px; font-weight: 800; letter-spacing: .3px; color: var(--muted-2); text-transform: uppercase; }
.pjv-side-favhead-ic { font-size: 11px; }
.pjv-side-favsep { height: 1px; margin: 5px 8px 6px; background: var(--line-soft, var(--bg-tint-2)); }

/* ⭐ 즐겨찾기 섹션 헤더(#1113 후속) — 트리 최상위 구역임이 읽히도록 스페이스급 무게(700/ink)로 올린다.
   자식(즐겨찾기 리스트)은 sub/depth 1 로 들여써 격자·세로선이 소속을 그린다 — 폴더›리스트와 같은 위계 언어.
   별은 이모지가 아니라 우리 SVG 별(pjvTbIcon 'star-on' — 브레드크럼 ★ 토글과 같은 도형)이고, 금색은 기존 별 색과 동일. */
.pjv-side-favsec { font-weight: 700; color: var(--ink); margin-top: 2px; cursor: pointer; }
.pjv-side-favsec .pjv-side-favsec-ic { flex: none; width: 17px; height: 17px; color: #f5a623; }
.pjv-side-favsec:hover { background: var(--bg-tint); }
/* 개수는 호버에도 유지 — 전역 규칙은 호버 시 개수를 숨겨 ⋯ 자리를 내주지만, 이 헤더엔 ⋯ 가 없어 숨길 이유가 없다. */
.pjv-side-favsec .pjv-side-navcount, .pjv-side-favsec:hover .pjv-side-navcount { opacity: 1; color: var(--muted-2); }
/* 캐럿은 개수 오른쪽(폴더 규칙의 margin-left:auto 를 개수가 이미 밀어냈으므로 0 으로 되돌린다). */
.pjv-side-favsec .pjv-side-folder-caret { margin-left: 0; }

/* ── 프로젝트 → 폴더 드래그(#454) ── */
body.pjv-folder-dragging { cursor: grabbing; }
body.pjv-folder-dragging .pjv-proj-wrap { cursor: grabbing; }
.pjv-proj-drag-src { opacity: .45; }
/* 드롭 타깃 하이라이트 — 사이드바 항목/레일 점/인라인 폴더 구역 공통. */
.pjv-side-navitem.pjv-folder-drop-over { background-color: var(--bg-tint); box-shadow: inset 0 0 0 2px var(--blue); }
.pjv-side-raildot.pjv-folder-drop-over { background: var(--bg-tint); box-shadow: inset 0 0 0 2px var(--blue); }
.pjv-list-group.pjv-folder-drop-over { outline: 2px dashed var(--blue); outline-offset: -2px; border-radius: 8px; background: var(--bg-tint); }

/* ── 폴더 프로젝트 관리 모달(#454) ── */
.pjv-foldman { min-width: 420px; max-width: 520px; }
.pjv-foldman-sec-h { font-size: 12.5px; font-weight: 700; color: var(--muted-2); letter-spacing: .2px; margin-bottom: 6px; }
.pjv-foldman-list { display: flex; flex-direction: column; gap: 2px; max-height: 260px; overflow: auto; }
.pjv-foldman-row { display: flex; align-items: center; gap: 8px; padding: 6px 8px; border-radius: 7px; }
.pjv-foldman-row:hover { background: var(--bg-tint-2); }
.pjv-foldman-name { flex: 1 1 auto; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-size: 13.5px; color: var(--ink); }
.pjv-foldman-name.done { color: var(--muted-2); text-decoration: line-through; }
.pjv-foldman-cur { flex: none; font-size: 11px; font-weight: 600; color: var(--muted-2); background: var(--bg-tint); border: 1px solid var(--line-net, #d9dee6); border-radius: 999px; padding: 1px 8px; }
.pjv-foldman-btn { flex: none; border: 1px solid var(--line-net, #d9dee6); background: var(--bg); cursor: pointer; padding: 3px 10px; border-radius: 7px; font-size: 12px; font-weight: 600; color: var(--ink-sub); }
.pjv-foldman-btn:hover { border-color: var(--muted-2); color: var(--ink); }
.pjv-foldman-btn.add { color: var(--blue); border-color: var(--line-net, #d9dee6); }
.pjv-foldman-btn.add:hover { border-color: var(--blue); background: var(--bg-tint); }

