.article-community { margin-block-start: 2rem; padding-block-start: 1.5rem; border-block-start: 1px solid rgba(255,255,255,.3); }
.article-community h2, .article-community h3 { color: #4f453e; }
.article-like-row, .article-comment header { display: flex; align-items: center; justify-content: space-between; gap: .75rem; }
.article-like-row form, .article-comment form { margin: 0; }
.article-comment-list { display: grid; gap: .75rem; margin-block: .75rem 1rem; }
.article-comment { padding: 1rem; border: 1px solid rgba(255,255,255,.3); border-radius: 14px; background: rgba(255,255,255,.34); box-shadow: 0 8px 24px rgba(69,55,43,.1); backdrop-filter: blur(14px) saturate(1.02); overflow-wrap: anywhere; }
.article-comment p { white-space: normal; }
.article-comment-form { display: grid; gap: .65rem; margin-block-start: 1rem; }
.article-comment-form textarea { box-sizing: border-box; inline-size: 100%; resize: vertical; }
.article-community :is(a,button,textarea):focus-visible { outline: 3px solid rgba(154,88,56,.42); outline-offset: 3px; }
@media (max-width: 480px) { .article-like-row, .article-comment header { align-items: flex-start; flex-wrap: wrap; } .article-comment { padding: .85rem; } }