.reader-reaction{display:flex;align-items:center;justify-content:space-between;gap:20px;background:linear-gradient(135deg,#fff7f7,#fff);border:1px solid #f1d2d4;border-radius:14px;padding:20px;margin:28px 0}.reader-reaction>div:first-child span,.reader-reaction>div:first-child small{display:block}.reader-reaction>div:first-child span{font-size:19px;font-weight:900}.reader-reaction>div:first-child small{color:#667085;margin-top:3px}.reaction-actions{display:flex;gap:10px}.reaction-actions form{margin:0}.reaction-actions button{border:1px solid #e2e5ea;background:#fff;border-radius:99px;padding:10px 15px;font-weight:800;cursor:pointer}.reaction-actions button:hover{border-color:#e21b23;color:#e21b23}.reaction-actions b{background:#f1f3f5;border-radius:99px;padding:3px 7px;margin-left:4px}
.comments-section{margin:38px 0;border-top:4px solid #16181c;padding-top:20px}.comments-head{display:flex;justify-content:space-between;align-items:end;margin-bottom:17px}.comments-head h2{margin:5px 0 0}.comments-head>strong{color:#667085}.comment-form{display:grid;grid-template-columns:1fr 1fr;gap:15px;background:#f7f8fa;border:1px solid #e5e7eb;border-radius:13px;padding:20px}.comment-form .full{grid-column:1/-1}.comment-form label{display:block;font-weight:900;font-size:13px;margin-bottom:6px}.comment-form label span{color:#e21b23}.comment-form label small{color:#667085;font-weight:500}.comment-form input,.comment-form textarea{box-sizing:border-box;width:100%;border:1px solid #cfd4dc;border-radius:8px;padding:11px;font:inherit;background:#fff}.comment-submit{display:flex;align-items:center;justify-content:space-between;gap:15px}.comment-submit small{color:#667085}.comment-submit button{border:0;background:#e21b23;color:#fff;border-radius:8px;padding:12px 18px;font-weight:900;cursor:pointer}.comment-list{display:grid;gap:14px;margin-top:20px}.comment-list article{display:grid;grid-template-columns:46px 1fr;gap:13px;border-bottom:1px solid #e5e7eb;padding:0 0 16px}.comment-avatar{width:46px;height:46px;display:grid;place-items:center;border-radius:50%;background:#16181c;color:#fff;font-weight:900}.comment-list header{display:flex;justify-content:space-between;gap:15px}.comment-list time{font-size:12px;color:#667085}.comment-list p{margin:7px 0 0;white-space:pre-line}.comment-empty{text-align:center;background:#f7f8fa;color:#667085;border-radius:10px;padding:22px}
@media(max-width:650px){.reader-reaction{align-items:flex-start;flex-direction:column}.reaction-actions{width:100%}.reaction-actions form,.reaction-actions button{flex:1;width:100%}.comment-form{grid-template-columns:1fr}.comment-form .full{grid-column:auto}.comment-submit{align-items:stretch;flex-direction:column}.comment-list header{flex-direction:column;gap:2px}}