/* ---------- 프로젝트 채널 · 슬랙형 게시글 확장(.pj-acts 등) + 쓰레드 패널(.th-) + 아티팩트(.art-) ---------- */
/* 게시글: hover 액션 · 선택 강조 · 답글 요약(아바타 스택) · 고정 표시 */
.pj-post{position:relative}
.pj-post.sel{background:#FDF6EE}
.pj-post.sel:hover{background:#FCF1E3}
.pj-post.clickable{cursor:pointer}
.pj-acts{position:absolute;top:-13px;right:12px;display:none;gap:2px;background:#fff;border:1px solid var(--border);border-radius:9px;padding:3px;box-shadow:0 2px 8px rgba(0,0,0,.06);z-index:2}
.pj-post:hover .pj-acts{display:flex}
.pj-acts button{display:inline-flex;align-items:center;gap:5px;height:26px;padding:0 8px;border-radius:6px;font-size:12px;color:#3C3C3A;white-space:nowrap}
.pj-acts button:hover{background:var(--hover)}
.pj-acts svg{flex:none}
.pj-pin{display:inline-flex;align-items:center;gap:4px;font-size:11px;color:#B45816}
.pj-treply{display:inline-flex;align-items:center;gap:8px;margin-top:8px;font-size:12.5px;color:#B45816;font-weight:500;cursor:pointer;border:1px solid transparent;border-radius:8px;padding:4px 9px 4px 5px}
.pj-treply:hover{background:#fff;border-color:var(--border)}
.pj-treply b{font-weight:600}
.pj-treply em{color:#9C9C9A;font-style:normal;font-weight:400}
.pj-tavas{display:inline-flex;align-items:center}
.pj-tavas .pj-mini{width:22px;height:22px;border:2px solid #fff;box-sizing:content-box;margin-right:-7px;border-radius:6px;overflow:hidden}
.pj-tavas .pj-mini:last-child{margin-right:0}
.pj-mini.user{background:#F4F4F2;overflow:hidden;display:inline-grid;place-items:center;font-family:inherit;font-style:normal;font-size:9px;color:#55554F}
.pj-mini.user img{width:100%;height:100%;display:block;object-fit:cover}
.pjf-pin{display:grid;place-items:center;width:22px;height:18px;color:#B45816}
/* 컴포저 툴바(슬랙: + · Aa · 이모지 · @) + 멘션 팝업 */
.ctb{height:26px;min-width:26px;padding:0 6px;border-radius:7px;display:grid;place-items:center;color:#6B6B69;font-size:12.5px;font-weight:600;transition:background .15s}
.ctb:hover{background:var(--hover);color:#3C3C3A}
.ccard{position:relative}
.pj-mpop{position:absolute;left:10px;bottom:calc(100% + 6px);background:#fff;border:1px solid var(--border);border-radius:10px;box-shadow:0 6px 20px rgba(0,0,0,.08);padding:5px;z-index:5;min-width:220px}
.pj-mpop button{display:flex;align-items:center;gap:9px;padding:6px 10px;border-radius:7px;font-size:13px;width:100%;text-align:left}
.pj-mpop button:hover{background:var(--hover)}
.pj-mpop button b{font-weight:600}
.pj-mpop button span{font-size:11.5px;color:#9C9C9A;margin-left:auto}
.pj-mpop .pj-mini{width:18px;height:18px}
/* 쓰레드 패널 */
.th{width:600px;flex:none;border-left:1px solid var(--border-soft);background:#fff;display:flex;flex-direction:column;height:100vh}
.th-h{display:flex;align-items:center;gap:6px;padding:14px 14px 12px 22px;border-bottom:1px solid var(--border-soft);flex:none}
.th-h b{font-size:15.5px}
.th-h span{font-size:12.5px;color:#9C9C9A;margin-left:6px}
.th-h .icbtn{margin-left:auto}
.th-body{flex:1;min-height:0;overflow-y:auto;padding:12px 22px 16px}
.th-body::-webkit-scrollbar{width:8px}
.th-body::-webkit-scrollbar-thumb{background:#E3E3E1;border-radius:99px;border:2px solid #fff}
.th-body .pj-post{padding:8px 0;cursor:default}
.th-body .pj-post:hover{background:transparent}
.th-div{display:flex;align-items:center;gap:10px;margin:8px 0 4px;font-size:12px;color:#8A8A88}
.th-div::after{content:"";flex:1;height:1px;background:var(--border-soft)}
.th-r{display:flex;gap:11px;padding:9px 0}
.th-rb{flex:1;min-width:0}
.th-rt .pj-text{margin-top:2px}
.th-comp{flex:none;padding:8px 18px 18px}
.th-comp .pj-hint{margin-top:7px}
/* 아티팩트 카드 — 헤더(배지 · 제목 · 툴/파일) · GUI 본문 · 하단 버튼 */
.art{margin-top:8px;border:1px solid var(--border);border-radius:12px;background:#fff;overflow:hidden}
.art-h{display:flex;align-items:center;gap:9px;padding:9px 12px;border-bottom:1px solid var(--border-soft);background:#FCFCFB;min-width:0}
.art-h b{font-size:13px;font-weight:600;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.art-h .art-tool{font-size:11px;color:#9C9C9A;margin-left:auto;white-space:nowrap;flex:0 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis}
.art-h .ed-badge svg{width:11px;height:11px}
.art-b{padding:12px 14px}
.art-f{display:flex;gap:8px;padding:8px 12px 10px;border-top:1px solid var(--border-soft)}
.art-f button{height:30px;padding:0 12px;border:1px solid var(--border);border-radius:8px;font-size:12.5px;font-weight:500;transition:background .15s}
.art-f button:hover{background:var(--hover)}
.art-f button.pri{background:#1F1F1D;color:#fff;border-color:#1F1F1D}
.art-f button.pri:hover{background:#333331}
/* 문서 */
.art-k-doc .art-b{padding:0}
.art-doc{background:#F1F1EF;padding:14px}
.art-page{background:#fff;border:1px solid var(--border-soft);border-radius:4px;padding:22px 26px;box-shadow:0 1px 3px rgba(0,0,0,.05);font-size:12.5px;line-height:1.7;color:#2A2A28}
.art-page h4{font-size:16px;font-weight:700;margin:0 0 2px}
.art-page .meta{font-size:11px;color:#9C9C9A;margin-bottom:10px}
.art-page h5{font-size:12.5px;font-weight:700;margin:10px 0 3px}
.art-page p{margin:0}
.art-table{width:100%;border-collapse:collapse;margin:6px 0;font-size:11.5px}
.art-table th,.art-table td{border:1px solid #E3E3E1;padding:4px 7px;text-align:left}
.art-table th{background:#F7F7F5;font-weight:600}
.art-page .more{color:#9C9C9A;font-size:11.5px;margin-top:8px}
/* 문제 세트 */
.art-quiz ol{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:8px}
.art-quiz li{display:flex;gap:10px;font-size:13px;line-height:1.6;color:#2A2A28}
.art-quiz .n{flex:none;width:22px;height:22px;border-radius:50%;background:#FDEEE0;color:#B45816;font-size:11.5px;font-weight:700;display:grid;place-items:center;margin-top:2px}
.art-quiz .more{margin-top:10px;font-size:12px;color:#9C9C9A}
/* 문제 풀이 */
.art-solve .prob{background:#F7F7F5;border-radius:8px;padding:9px 12px;font-size:13px;line-height:1.6;color:#2A2A28}
.art-steps{margin-top:10px;display:flex;flex-direction:column;gap:8px}
.art-step{display:flex;gap:10px;align-items:flex-start}
.art-step .n{flex:none;width:22px;height:22px;border-radius:6px;background:#1F1F1D;color:#fff;font-size:11.5px;font-weight:700;display:grid;place-items:center}
.art-step b{display:block;font-size:12.5px;font-weight:600}
.art-step span{display:block;font-size:12.5px;color:#3C3C3A;font-family:ui-monospace,Menlo,monospace;margin-top:2px;line-height:1.6}
.art-ans{margin-top:10px;border:1px solid #F2C29B;background:#FDF6EE;border-radius:8px;padding:8px 12px;font-size:13px;font-weight:600;color:#B45816}
/* 도식 */
.art-fig svg{display:block;width:100%;height:auto;max-height:270px}
.art-fig .cap{font-size:11.5px;color:#9C9C9A;margin-top:6px;text-align:center}
/* PPT */
.art-ppt{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}
.art-slide{position:relative;border:1px solid var(--border);border-radius:6px;overflow:hidden;aspect-ratio:16/9;background:#fff}
.art-slide svg{width:100%;height:100%;display:block}
.art-slide i{position:absolute;left:6px;bottom:5px;font-style:normal;font-size:10px;background:rgba(255,255,255,.92);border:1px solid var(--border);border-radius:99px;padding:1px 6px;color:#3C3C3A}
.art-ppt-cap{grid-column:1/-1;font-size:11.5px;color:#9C9C9A}
/* 표 */
.art-sheet{width:100%;border-collapse:collapse;font-size:12px}
.art-sheet th,.art-sheet td{border:1px solid #E3E3E1;padding:5px 8px;text-align:right;font-family:ui-monospace,Menlo,monospace}
.art-sheet th{background:#F7F7F5;font-weight:600;text-align:center;font-family:inherit}
.art-sheet td:first-child{text-align:left;font-family:inherit}
.art-note{font-size:11.5px;color:#9C9C9A;margin-top:8px}
/* 분석 */
.art-ana{display:flex;flex-direction:column;gap:8px}
.art-bar{display:grid;grid-template-columns:130px 1fr 40px;align-items:center;gap:10px;font-size:12.5px}
.art-bar i{display:block;height:8px;border-radius:99px;background:#EFEFED;overflow:hidden}
.art-bar i b{display:block;height:100%;background:var(--brand);border-radius:99px}
.art-bar em{font-style:normal;color:#55554F;text-align:right}
.art-ana .note{font-size:12px;color:#55554F;margin-top:4px;line-height:1.5}
/* 게시글 첨부(파일 칩 묶음) · 지워진 파일 칩 */
.pj-files{display:flex;flex-wrap:wrap;gap:6px;margin-top:2px}
.pj-files .file-chip{margin-top:6px}
.file-chip.gone{opacity:.55;text-decoration:line-through}