/* Comments + replies (inc/comments.php), phone pages and blog articles. Uses generator.css tokens. */
.cm-box h2 small { color: var(--sg-faint); font-weight: 700; font-size: 13px; }
.cm-form { display: grid; gap: 8px; margin-bottom: 14px; }
.cm-form textarea { width: 100%; border: 1px solid var(--sg-line); border-radius: 12px; padding: 10px 12px; font: inherit; font-size: 14px; background: var(--sg-card-2); color: var(--sg-text); resize: vertical; box-sizing: border-box; }
.cm-form textarea:focus { outline: none; border-color: var(--sg-accent); box-shadow: 0 0 0 3px var(--sg-accent-soft); }
.cm-form > .sg-btn { justify-self: end; }
.cm-formrow { display: flex; gap: 8px; justify-content: flex-end; }
.cm-login { display: flex; align-items: center; gap: 10px; color: var(--sg-muted); flex-wrap: wrap; margin: 0 0 12px; }
.cm-list, .cm-replies { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.cm-list > .cm-item { border-top: 1px solid var(--sg-line); padding-top: 12px; }
.cm-replies { margin: 8px 0 0; padding-inline-start: 14px; border-inline-start: 2px solid var(--sg-line); gap: 8px; }
.cm-replies:empty { display: none; }
.cm-replyform { margin: 8px 0 0; padding-inline-start: 16px; }
.cm-head { display: flex; gap: 8px; align-items: baseline; flex-wrap: wrap; font-size: 13px; }
.cm-head b { overflow-wrap: anywhere; }
.cm-to { color: var(--sg-muted); font-size: 12px; }
.cm-head time { color: var(--sg-faint); font-size: 12px; }
.cm-acts { margin-inline-start: auto; display: flex; gap: 2px; }
.cm-btn { border: 0; background: none; color: var(--sg-accent); cursor: pointer; font-size: 12px; font-weight: 700; padding: 4px 6px; border-radius: 6px; }
.cm-btn:hover { background: var(--sg-accent-soft); }
.cm-btn.cm-del { color: var(--sg-bad, #dc2626); font-weight: 600; }
.cm-item p { margin: 4px 0 0; font-size: 14px; line-height: 1.6; overflow-wrap: anywhere; }
.cm-reply p { font-size: 13.5px; }
.cm-new-flash { animation: cmFlash 2.4s ease-out; border-radius: 8px; }
@keyframes cmFlash { 0%, 30% { background: var(--sg-accent-soft); } 100% { background: transparent; } }
