.article-comments { margin-top: 64px; border-top: 1px solid var(--line); padding-top: 12px; }
.reader-comment { margin: 24px 0; padding: 20px; border: 1px solid var(--line); border-radius: 12px; overflow-wrap: anywhere; }
.reader-comment h3 { margin: 0; font-size: 1rem; }
.reader-comment .comment-date { font-size: .8rem; margin-top: 4px; }
.comment-text { white-space: pre-wrap; }
.article-comment-form { display: grid; gap: 10px; margin: 20px 0; }
.article-comment-form label { font-weight: 700; }
.article-comment-form input, .article-comment-form textarea { box-sizing: border-box; width: 100%; min-width: 0; color: var(--text); background: #0c1d19; border: 1px solid var(--line); border-radius: 8px; padding: 12px; font: inherit; }
.article-comment-form textarea { resize: vertical; }
.article-comment-form button { justify-self: start; border: 0; border-radius: 8px; padding: 12px 20px; background: var(--cyan); color: #07110f; font: inherit; font-weight: 750; cursor: pointer; }
.article-comment-form button:disabled { opacity: .6; cursor: wait; }
.article-comment-form :focus-visible { outline: 2px solid var(--cyan); outline-offset: 3px; }
.article-comment-form .comment-help { margin: 0; font-size: .85rem; }
.comment-honeypot { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
[data-comment-turnstile] { width: 100%; min-width: 0; }