.devPostWrap{
  max-width:800px;
  margin:0 auto;
}

.devPostCard{
  background:rgba(255,255,255,0.04);
  border:1px solid rgba(255,255,255,0.05);
  border-radius:14px;
  padding:20px;
  margin-bottom:20px;
}

.devPostTitle{
  font-size:22px;
  font-weight:900;
  margin-bottom:8px;
}

.devPostMeta{
  font-size:12px;
  color:#9bb3c9;
  margin-bottom:14px;
}

.devPostBody{
  line-height:1.8;
}

.devPostImage{
  max-width:100%;
  margin-top:12px;
  border-radius:12px;
  cursor:pointer;
}

.devCommentHeader{
  font-weight:800;
  margin-bottom:10px;
}

.devCommentCard{
  background:rgba(255,255,255,0.03);
  border:1px solid rgba(255,255,255,0.05);
  border-radius:12px;
  padding:12px;
  margin-bottom:10px;
}

.devCommentTop{
  display:flex;
  justify-content:space-between;
  font-size:12px;
  color:#9bb3c9;
}

.devCommentBody{
  margin-top:6px;
}

.devCommentImage{
  margin-top:6px;
  width:120px;
  height:120px;
  object-fit:cover;
  border-radius:8px;
}

.devCommentWrite{
  margin-top:20px;
  padding:16px;
  border-radius:12px;
  background:rgba(255,255,255,0.03);
}

.devCommentWrite textarea{
  width:100%;
  min-height:70px;
  padding:10px;
  border-radius:10px;
  border:1px solid rgba(255,255,255,.1);
  background:rgba(0,0,0,0.3);
  color:#fff;
  resize:none;
}

.devCommentBottom{
  display:flex;
  justify-content:space-between;
  align-items:center;
}

.devCommentBottom button{
  padding:8px 14px;
  border:none;
  border-radius:8px;
  background:#4ea1ff;
  color:#fff;
  cursor:pointer;
}

.devCommentBottom button:hover{
  background:#3b8de0;
}

.devEmpty{
  color:#888;
  padding:10px;
}

.devCommentAction{
  margin-top:10px;
  display:flex;
  justify-content:space-between;
  align-items:center;
}

.fileLabel{
  font-size:13px;
  cursor:pointer;
  color:#9bb3c9;
}

.fileLabel input{
  display:none;
}

.devCommentAction button{
  padding:8px 16px;
  border:none;
  border-radius:8px;
  background:#4ea1ff;
  color:#fff;
  font-weight:700;
  cursor:pointer;
}

.devCommentAction button:hover{
  background:#3b8de0;
}

.devBack{
  margin-bottom:14px;
}

.devBackBtn{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:6px 12px;
  font-size:13px;
  border-radius:8px;
  border:1px solid rgba(255,255,255,0.1);
  background:rgba(255,255,255,0.05);
  color:#ddd;
  cursor:pointer;
  transition:all 0.2s ease;
}

.devBackBtn:hover{
  background:rgba(255,255,255,0.1);
  color:#fff;
  transform:translateY(-1px);
}

.devBackBtn:active{
  transform:scale(0.97);
}

/* 🔥 대댓글 전용 */
.devCommentReply{
  margin-left:40px;
  border-left:2px solid rgba(255,255,255,0.1);
  padding-left:12px;
  position:relative;
}

/* ㄴ 대신 선 + 포인트 */
.devCommentReply::before{
  content:'';
  position:absolute;
  left:-2px;
  top:14px;
  width:10px;
  height:2px;
  background:rgba(255,255,255,0.2);
}

/* 작성자 강조 */
.devCommentAuthor{
  font-weight:800;
  color:#4ea1ff;
}

/* 시간 더 흐리게 */
.devCommentTime{
  font-size:11px;
  color:#6f8aa3;
}

/* 본문 가독성 개선 */
.devCommentBody{
  margin-top:6px;
  font-size:14px;
  line-height:1.6;
  color:#e6edf3;
}

/* 🔥 대댓글 표시 (현재 구조에 맞춤) */
.devCommentCard.depth-1{
  margin-left:40px;
  padding-left:12px;
  border-left:2px solid rgba(255,255,255,0.15);
  position:relative;
  background:rgba(255,255,255,0.02);
}

/* 연결선 */
.devCommentCard.depth-1::before{
  content:'';
  position:absolute;
  left:-2px;
  top:14px;
  width:10px;
  height:2px;
  background:rgba(255,255,255,0.3);
}

/* 작성자 강조 */
.devCommentCard.depth-1 .devCommentTop b{
  color:#4ea1ff;
}
.fileLabel{
  display:inline-flex;
  align-items:center;
  gap:6px;
  cursor:pointer;
  color:#9bb3c9;
  font-size:13px;
}

.fileLabel input{
  display:none;
}

/* 🔥 파일명 (버튼 옆) */
.fileNameInline{
  margin-left:10px;
  font-size:13px;
  color:#ddd;

  max-width:140px;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

/* 전체 */
.devCommentAction{
  margin-top:10px;
  display:flex;
  justify-content:space-between;
  align-items:center;
}

/* 🔥 왼쪽 묶음 */
.fileGroup{
  display:flex;
  align-items:center;
  gap:10px;
}

/* 파일 버튼 */
.fileLabel{
  cursor:pointer;
  color:#9bb3c9;
  font-size:13px;
}

.fileLabel input{
  display:none;
}

/* 파일명 */
.fileNameInline{
  font-size:13px;
  color:#ddd;

  max-width:140px;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.devLikeWrap{
  margin-top:10px;
}

.likeBtn{
  padding:6px 12px;
  border-radius:8px;
  border:1px solid rgba(255,255,255,0.1);
  background:rgba(255,255,255,0.05);
  color:#aaa;
  cursor:pointer;
  transition:0.2s;
}

.likeBtn:hover{
  background:rgba(255,255,255,0.1);
  color:#fff;
}

/* 🔥 내가 누른 상태 */
.likeBtn.active{
  background:#4ea1ff;
  color:#fff;
  border-color:#4ea1ff;
}

.deleteBtn{
  margin-left:8px;
  background:#ff4d4f;
  border:none;
  color:#fff;
  padding:6px 10px;
  border-radius:8px;
  cursor:pointer;
}

.noDelete{
  margin-left:8px;
  color:#888;
  font-size:12px;
}

.commentActionRow{
  display:flex;
  gap:10px;
  margin-top:6px;
}

.deleteCommentBtn{
  color:#ff4d4f;
  cursor:pointer;
  font-size:13px;
}

.deleteCommentBtn:hover{
  text-decoration:underline;
}

.commentActionRow{
  display:flex;
  gap:12px;
  margin-top:8px;
  align-items:center;
}

/* 공통 버튼 스타일 */
.replyBtn,
.deleteCommentBtn{
  font-size:13px;
  cursor:pointer;
  padding:4px 6px;
  border-radius:6px;
  transition:all 0.15s ease;
}

/* 🔵 답글 */
.replyBtn{
  color:#4ea1ff;
}

.replyBtn:hover{
  background:rgba(78,161,255,0.1);
}

/* 🔴 삭제 */
.deleteCommentBtn{
  color:#ff4d4f;
}

.deleteCommentBtn:hover{
  background:rgba(255,77,79,0.1);
}