* { box-sizing: border-box; margin: 0; padding: 0; }
        body { font-family: 'Pretendard', 'Malgun Gothic', sans-serif; background-color: #f7f9fa; color: #333; line-height: 1.6; }
        a { text-decoration: none; color: inherit; }

        .navbar { background: #fff; border-bottom: 1px solid #eaeaea; padding: 15px 0; }
        .nav-container { max-width: 900px; margin: 0 auto; display: flex; align-items: center; justify-content: space-between; padding: 0 20px; }
        .logo { font-size: 20px; font-weight: 800; color: #ff5722; }

        .container { max-width: 900px; margin: 30px auto; padding: 0 20px; }
        .card { background: #fff; border-radius: 12px; border: 1px solid #eaeaea; padding: 30px; box-shadow: 0 2px 8px rgba(0,0,0,0.02); margin-bottom: 25px; }

        .post-title { font-size: 22px; font-weight: 800; color: #1e293b; margin-bottom: 12px; }
        .post-meta { display: flex; gap: 15px; font-size: 13px; color: #64748b; border-bottom: 1px solid #f0f0f0; padding-bottom: 15px; margin-bottom: 20px; }
        .post-content { font-size: 15px; color: #334155; min-height: 150px; line-height: 1.7; white-space: pre-line; margin-bottom: 30px; }
        .post-media { max-width: 100%; border-radius: 10px; margin: 14px 0; display: block; background: #f1f5f9; }
        .attach-list { list-style: none; border-top: 1px dashed #e2e8f0; padding-top: 14px; margin-bottom: 20px; }
        .attach-list li { margin-bottom: 6px; }
        .attach-list a { display: inline-flex; align-items: center; gap: 6px; font-size: 14px; color: #2b374e; background: #f8fafc; border: 1px solid #e2e8f0; border-radius: 8px; padding: 7px 12px; }
        .attach-list a:hover { border-color: #ff5722; color: #ff5722; }
        .attach-size { color: #94a3b8; font-size: 12px; }

        .btn-box { display: flex; justify-content: space-between; align-items: center; border-top: 1px solid #f0f0f0; padding-top: 20px; }
        .btn { padding: 8px 16px; border-radius: 6px; font-size: 14px; font-weight: 600; cursor: pointer; border: none; }
        .btn-like { background: #fff0f0; color: #e53935; border: 1px solid #ffcdd2; display: inline-flex; align-items: center; gap: 6px; }
        .btn-like.active { background: #e53935; color: #fff; border-color: #e53935; }
        .btn-list { background: #f1f5f9; color: #475569; }

        .comment-section { background: #fff; border-radius: 12px; border: 1px solid #eaeaea; padding: 25px; }
        .comment-header { font-size: 18px; font-weight: 700; margin-bottom: 18px; color: #1e293b; }
        .comment-form { display: flex; gap: 10px; margin-bottom: 25px; }
        .comment-textarea { flex: 1; height: 75px; padding: 12px; border: 1px solid #e2e8f0; border-radius: 8px; resize: none; font-size: 14px; font-family: inherit; }
        .comment-textarea:focus { outline: none; border-color: #ff5722; }
        .btn-comment-submit { background: #ff5722; color: #fff; border: none; border-radius: 8px; width: 90px; font-weight: 700; cursor: pointer; }

        .comment-list { list-style: none; }
        .comment-item { border-bottom: 1px solid #f1f5f9; padding: 15px 0; }
        .comment-item:last-child { border-bottom: none; }
        .comment-top { display: flex; justify-content: space-between; margin-bottom: 6px; }
        .comment-writer { font-weight: 700; font-size: 14px; color: #334155; }
        .comment-date { font-size: 12px; color: #94a3b8; }
        .comment-text { font-size: 14px; color: #475569; white-space: pre-line; }
        .btn-comment-del { font-size: 11px; color: #ef4444; margin-left: 8px; cursor: pointer; background: none; border: none; }

/* 댓글 수정 */
.btn-comment-edit { font-size: 11px; color: #64748b; margin-left: 8px; cursor: pointer; background: none; border: none; }
.comment-edit-form { margin-top: 6px; }
.comment-edit-form .comment-textarea { width: 100%; box-sizing: border-box; }
.comment-edit-actions { display: flex; justify-content: flex-end; gap: 6px; margin-top: 6px; }
.btn-comment-cancel, .btn-comment-save { font-size: 12px; padding: 6px 12px; border-radius: 6px; border: none; cursor: pointer; }
.btn-comment-cancel { background: #f1f5f9; color: #475569; }
.btn-comment-save { background: #2b374e; color: #fff; }

/* 에디터로 작성한 글 */
.post-content.rich { white-space: normal; }
.post-content.rich::after { content: ""; display: block; clear: both; }
.post-content.rich p { margin: 0 0 8px; }
.post-content.rich img { max-width: 100%; height: auto; border-radius: 8px; }
.post-content.rich img[style*="float: left"] { margin: 4px 16px 8px 0; }
.post-content.rich img[style*="float: right"] { margin: 4px 0 8px 16px; }
.post-content.rich table { border-collapse: collapse; width: 100%; margin: 10px 0; }
.post-content.rich td, .post-content.rich th { border: 1px solid #e2e8f0; padding: 6px 8px; }
.post-content.rich blockquote { border-left: 4px solid #e2e8f0; margin: 10px 0; padding: 4px 12px; color: #64748b; }
.post-content.rich ul, .post-content.rich ol { padding-left: 22px; }
.post-content.rich a { color: #2563eb; text-decoration: underline; }
@media (max-width: 768px) {
    .post-content.rich img[style*="float"] { float: none !important; width: auto !important; max-width: 100% !important; margin: 8px 0 !important; }
}

/* 본문·댓글의 링크 */
.post-content a, .comment-text a { color: #2563eb; text-decoration: underline; word-break: break-all; }
.post-content a:hover, .comment-text a:hover { color: #1d4ed8; }

/* 관리자 상단 고정 */
.btn-pin { background: #fff7ed; color: #c2410c; }
.btn-pin.pinned { background: #ffedd5; }
.pin-badge { display: inline-block; font-size: 13px; font-weight: 700; color: #c2410c; background: #ffedd5; border-radius: 6px; padding: 3px 8px; vertical-align: middle; }