.yc-site .issue-comments { padding: 0; color: #243c32; }
.comment-composer { padding: 22px; background: #f6f8f1; border: 1px solid #e0e7d7; border-radius: 12px; }
.comment-composer-heading { display: flex; align-items: center; gap: 12px; margin-bottom: 18px; }
.comment-avatar { display: inline-flex; align-items: center; justify-content: center; width: 38px; height: 38px; flex: 0 0 38px; border-radius: 50%; background: #e7eddf; color: #52734b; font-size: .85rem; font-weight: 600; }
.comment-composer-heading label { font-size: .9rem; font-weight: 600; }
.comment-composer-heading p { font-size: .76rem; margin: 4px 0 0; color: #68765f; }
.yc-site .comment-input { padding: 14px 16px; font-size: .88rem; line-height: 1.75; resize: vertical; min-height: 112px; border-color: #dbe3d1; }
.comment-input::placeholder { color: #8a9482; }
.comment-composer-footer { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 14px; margin-top: 14px; }
.comment-composer-footer p { margin: 0; font-size: .69rem; color: #6c7863; }
.comment-composer-footer p i { margin-right: 4px; }
.comment-composer-footer .btn { gap: 8px; font-size: .78rem; padding: 10px 16px; }
.comment-join { display: flex; align-items: flex-start; gap: 16px; background: #f2f5eb; border: 1px solid #e0e7d7; padding: 24px; border-radius: 12px; }
.comment-join-icon { display: inline-flex; align-items: center; justify-content: center; width: 42px; height: 42px; flex: 0 0 42px; background: #e4ebd9; color: #52734b; border-radius: 11px; font-size: 1.25rem; }
.comment-join h3 { font-size: 1.05rem; font-weight: 600; margin-bottom: 7px; }
.comment-join p { color: #68765f; font-size: .8rem; line-height: 1.65; margin-bottom: 16px; }
.comment-join-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 18px; }
.comment-join-actions .btn { font-size: .78rem; padding: 9px 16px; }
.yc-site .comment-register { color: #52734b; text-decoration: none; font-size: .78rem; font-weight: 500; }
.yc-site .comment-register:hover { text-decoration: underline; }
.comment-list-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin: 28px 0 18px; }
.comment-list-heading h3 { font-size: .88rem; font-weight: 600; margin: 0; }
.comment-list-heading > span { font-size: .7rem; color: #7c8873; }
.comment-empty { text-align: center; padding: 30px 18px; border: 1px dashed #e0e6d8; border-radius: 10px; color: #748168; }
.comment-empty > i { font-size: 1.6rem; color: #91a184; display: block; margin-bottom: 12px; }
.comment-empty h4 { font-size: .85rem; color: #53684b; margin: 0 0 7px; }
.comment-empty p { font-size: .78rem; line-height: 1.65; margin: 0; }
.comment-empty .btn { margin-top: 14px; }
.comment-list { list-style: none; padding: 0; margin: 0; }
.comment-item { display: flex; align-items: flex-start; gap: 12px; padding: 20px 0; border-top: 1px solid #e9ede3; }
.comment-item:first-child { border-top: 0; padding-top: 4px; }
.comment-content { flex: 1; min-width: 0; }
.comment-meta { display: flex; align-items: baseline; flex-wrap: wrap; gap: 8px 12px; }
.comment-meta strong { font-size: .82rem; font-weight: 600; color: #354e3b; }
.comment-meta time { color: #8a9481; font-size: .66rem; }
.comment-content > p { font-size: .85rem; color: #53634d; line-height: 1.8; white-space: pre-wrap; overflow-wrap: anywhere; margin: 7px 0 0; }
.comment-delete { border: 0; background: transparent; color: #9a877a; width: 34px; height: 34px; border-radius: 7px; flex: 0 0 34px; }
.comment-delete:hover { background: #faf0eb; color: #a2463e; }
.comment-feedback { padding: 12px 16px; border-radius: 8px; background: #edf3e7; color: #52734b; font-size: .8rem; line-height: 1.65; margin: 14px 0 0; }
.comment-feedback--error { background: #faf0eb; color: #943f37; }
.yc-site [data-comment-count] { background: #edf1e6; color: #52734b; }
@media (max-width: 575.98px) {
    .comment-composer, .comment-join { padding: 18px; }
    .comment-join { flex-direction: column; gap: 14px; }
    .comment-join h3 { font-size: 1rem; }
    .comment-composer-heading label { font-size: .85rem; }
    .comment-composer-heading p { font-size: .71rem; }
    .comment-composer-footer .btn { width: 100%; }
    .comment-meta { flex-direction: column; gap: 4px; }
    .comment-item { gap: 10px; }
    .comment-item .comment-avatar { width: 32px; height: 32px; flex-basis: 32px; }
}