/* Article responses extend the existing paper, ink, and teal reading palette. */
.article-interactions{margin-top:40px;padding-top:28px;border-top:1px solid var(--rule);font-size:15px;line-height:1.7}
.article-interactions [hidden]{display:none!important}
.interactions-nojs,.comment-moderation,.comment-hints,.comments-empty{color:var(--muted)}
.interactions-nojs{margin:0}
.like-row{display:flex;align-items:center;flex-wrap:wrap;gap:10px 18px;margin-bottom:36px}
.article-interactions button{font:inherit;line-height:1.5;min-height:44px;cursor:pointer}
.article-like{display:inline-flex;align-items:center;justify-content:center;gap:9px;padding:9px 16px;background:var(--paper);color:var(--accent);border:1px solid #81969a;border-radius:4px;transition:background-color 160ms ease,border-color 160ms ease}
.article-like:hover,.article-like[aria-pressed="true"]{background:var(--soft);border-color:var(--accent)}
.like-icon{width:19px;height:19px;flex:none}
.article-like[aria-pressed="true"] .like-icon{fill:var(--accent)}
.article-like.like-confirmed .like-icon{animation:like-thanks 260ms cubic-bezier(.2,.7,.25,1)}
.like-count{font-variant-numeric:tabular-nums;font-size:14px}
.like-count:empty{display:none}
.article-interactions button:disabled{opacity:.6;cursor:default}
.article-interactions button:focus-visible,.article-interactions input:focus-visible,.article-interactions textarea:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
.comment-area h2{font:600 24px/1.5 var(--display);margin:0 0 8px;text-wrap:balance}
.comment-moderation{margin:0 0 22px;max-width:65ch;font-size:14px}
.comment-form{margin:0}
.comment-field{margin-bottom:18px}
.comment-field label{display:block;margin-bottom:7px;font-weight:500;color:var(--ink)}
.comment-field input,.comment-field textarea{display:block;width:100%;min-width:0;padding:10px 12px;border:1px solid #81969a;border-radius:3px;background:var(--paper);color:var(--ink);font:inherit;font-size:16px;line-height:1.7;caret-color:var(--accent)}
.comment-field input{max-width:360px;min-height:44px}
.comment-field textarea{min-height:142px;resize:vertical}
.comment-field [aria-invalid="true"]{border-color:#9b4239}
.comment-hints{display:flex;justify-content:space-between;gap:8px 16px;margin-top:6px;font-size:12px;line-height:1.6}
.comment-length{white-space:nowrap;font-variant-numeric:tabular-nums}
.comment-trap{display:none}
.comment-submit-row{display:flex;align-items:flex-start;gap:12px 18px;flex-wrap:wrap}
.comment-submit{flex:none;padding:10px 18px;border:1px solid var(--accent);border-radius:3px;background:var(--accent);color:var(--paper);transition:background-color 160ms ease}
.comment-submit:hover:not(:disabled){background:#214f58}
.like-status,.comment-submit-status,.interactions-load-status{margin:0;color:var(--muted);font-size:14px;line-height:1.7;overflow-wrap:anywhere}
.comment-submit-status{flex:1 1 240px;padding-top:8px}
.like-status:empty,.comment-submit-status:empty,.interactions-load-status:empty{display:none}
.article-interactions [data-error="true"]{color:#9b4239}
.comments-public{margin-top:32px}
.comments-empty{margin:0;font-size:14px}
.comments-list{list-style:none;padding:0;margin:0}
.public-comment{padding:20px 0;border-top:1px solid var(--rule)}
.public-comment:first-child{padding-top:0;border-top:0}
.public-comment-meta{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 14px;font-size:13px;line-height:1.7}
.public-comment-name{font-weight:600;color:var(--ink);overflow-wrap:anywhere}
.public-comment time{color:var(--muted);font-variant-numeric:tabular-nums}
.public-comment-body{margin:8px 0 0;white-space:pre-wrap;overflow-wrap:anywhere;font-size:15px;line-height:1.85}
.comments-more,.interactions-retry{padding:8px 0;border:0;background:transparent;color:var(--accent);text-decoration:underline;text-underline-offset:4px}
.comments-more{margin-top:4px}
.interactions-retry{margin-top:4px}
@keyframes like-thanks{0%,100%{transform:scale(1)}45%{transform:scale(1.12)}}
@media(max-width:520px){.article-interactions{margin-top:32px;padding-top:24px}.like-row{margin-bottom:28px}.comment-area h2{font-size:22px}.comment-submit-status{flex-basis:100%;padding-top:0}.comment-field input{max-width:none}}
@media(prefers-reduced-motion:reduce){.article-like,.comment-submit{transition:none}.article-like.like-confirmed .like-icon{animation:none}}
@media print{.article-interactions{display:none}}