.comments { max-width:720px; margin:90px auto 0; padding-top:48px; border-top:2px solid var(--ink); }
.commentsHead { display:flex; align-items:end; justify-content:space-between; gap:20px; margin-bottom:26px; }
.commentsHead span { font:9px var(--mono); letter-spacing:.18em; color:var(--accent); }
.commentsHead h2 { margin:8px 0 0; font-size:32px; line-height:1.25; }
.commentsHead small { color:var(--muted); font:9px var(--mono); white-space:nowrap; }
.commentForm { padding:26px; border:1px solid var(--line); background:var(--paper); box-shadow:6px 6px 0 var(--gold); }
.commentForm label { display:block; margin-bottom:18px; color:var(--muted); font:9px var(--mono); letter-spacing:.12em; }
.commentForm input,.commentForm textarea { display:block; width:100%; margin-top:8px; padding:12px 14px; border:1px solid var(--line); border-radius:0; background:var(--bg); color:var(--ink); font:15px/1.7 var(--serif); }
.commentForm textarea { min-height:130px; resize:vertical; }
.commentForm input:focus,.commentForm textarea:focus { outline:2px solid rgba(198,79,32,.24); border-color:var(--accent); }
.commentFormFoot { display:flex; align-items:center; justify-content:space-between; gap:16px; }
.commentForm button { border:0; padding:12px 20px; background:var(--accent); color:var(--paper); font-weight:700; cursor:pointer; }
.commentForm button:disabled { opacity:.55; cursor:wait; }
.replyContext { display:flex; align-items:center; justify-content:space-between; gap:18px; margin-bottom:20px; padding:14px 16px; border-left:3px solid var(--accent); background:rgba(198,79,32,.07); }
.replyContext[hidden] { display:none; }
.replyContext p { margin:0; color:var(--ink); font-size:13px; line-height:1.6; }
.commentForm .replyContext button { flex:none; padding:7px 10px; border:1px solid var(--line); background:transparent; color:var(--muted); font:9px var(--mono); }
.commentStatus { margin:0; color:var(--muted); font-size:13px; }
.commentStatus.error { color:#a22f1b; }
.commentTrap { position:absolute!important; left:-9999px!important; width:1px!important; height:1px!important; overflow:hidden!important; }
.commentList { margin-top:34px; }
.commentItem { padding:22px 0; border-bottom:1px solid var(--line); }
.commentHead { display:flex; justify-content:space-between; gap:20px; }
.commentHead>span { display:flex; align-items:center; gap:12px; }
.commentList strong { color:var(--accent); }
.commentList time { color:var(--muted); font:9px var(--mono); }
.commentReplyButton { padding:0; border:0; background:transparent; color:var(--accent); cursor:pointer; font:9px var(--mono); }
.commentDeleteButton { padding:0; border:0; background:transparent; color:var(--muted); cursor:pointer; font:9px var(--mono); }
.commentDeleteButton:hover { color:#a22f1b; }
.commentDeleteButton:disabled { opacity:.45; cursor:wait; }
.commentDeleted>.commentContent { color:var(--muted); font-style:italic; }
.commentContent { margin:10px 0 0; white-space:pre-wrap; overflow-wrap:anywhere; }
.commentReplyTo { display:block; margin-top:9px; color:var(--muted); font:9px var(--mono); letter-spacing:.06em; }
.inlineReplySlot .commentForm { margin:18px 0 8px; box-shadow:4px 4px 0 rgba(150,114,26,.22); }
.commentReplies { margin:18px 0 0 24px; padding-left:22px; border-left:2px solid rgba(150,114,26,.25); }
.commentReplies .commentItem { padding:18px 0; border-bottom:1px solid rgba(52,43,32,.08); }
.commentReplies .commentItem:last-child { border-bottom:0; padding-bottom:0; }
.commentEmpty { color:var(--muted); text-align:center; padding:30px 0; }
@media(max-width:760px){.comments{margin-top:65px}.commentsHead{align-items:start;flex-direction:column}.commentForm{padding:22px}.commentFormFoot{align-items:stretch;flex-direction:column}.commentForm button{width:100%}.commentReplies{margin-left:8px;padding-left:14px}.commentHead{align-items:start}.commentHead>span{align-items:end;flex-direction:column;gap:5px}}