.comment-page{max-width:880px}
.comment-page h1{font-size:clamp(32px,5vw,46px)}
.comment-page .lede{max-width:680px}
.comment-page section{max-width:none;margin:0;padding:22px 0}
.comment-page h2{border:0;padding:0;margin:12px 0 16px;font-size:26px}
.note p,.privacy p{margin:6px 0 0}
.preview-banner{margin-top:18px;padding:14px 16px;border:1px dashed var(--line);background:#fff;font-size:15px}
.preview-banner strong{display:block;margin-bottom:4px}
.intro p{max-width:650px}
.comment-page button{border:0;cursor:pointer;min-height:48px;font-family:inherit}
.comment-page button.secondary{border:1px solid var(--blue);background:transparent;color:var(--blue)}
.comment-page label{display:block;font-weight:700;margin:18px 0 7px}
.comment-page label span{font-weight:400;color:var(--muted)}
.comment-page input,.comment-page textarea{width:100%;padding:12px;border:1px solid #85939d;background:#fff;border-radius:3px;color:var(--ink);font:16px/1.5 Inter,ui-sans-serif,system-ui,sans-serif}
.comment-page textarea{resize:vertical;min-height:170px}
.comment-page input:focus,.comment-page textarea:focus,.comment-page button:focus-visible,.comment-page a:focus-visible{outline:3px solid #a36a13;outline-offset:3px}
.comment-page .hint{font-size:14px;color:var(--muted);margin:7px 0 12px}
.field-grid{display:grid;grid-template-columns:1fr 1fr;gap:22px}
.privacy{padding:16px;background:var(--paper);margin-top:22px;font-size:14px}
.honeypot{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}
#save-status{color:var(--red);font-weight:650;min-height:1.4em}
.comment-page button:disabled{opacity:.7;cursor:wait}
.visibility{border:1px solid var(--line);padding:18px;margin:22px 0}
.visibility legend{font-weight:700;padding:0 6px}
.visibility-options{display:flex;flex-wrap:wrap;gap:12px}
.visibility-choice{display:flex;align-items:center;gap:10px;margin:0;min-height:48px;padding:10px 18px;border:1px solid var(--blue);border-radius:3px;cursor:pointer;flex:1 1 180px}
.visibility-choice:has(input:checked){background:#163f5c;color:#fff}
.visibility-choice input{width:20px;height:20px;margin:0;accent-color:#9f2d24}
.visibility p{margin-bottom:0}
#public-list{border-top:1px solid var(--line);margin-top:8px}
.public-comment{border:1px solid var(--line);border-left:3px solid var(--blue);padding:20px;margin:18px 0;background:var(--paper)}
.public-comment p{margin:12px 0 0;white-space:pre-wrap;overflow-wrap:anywhere}
.comment-byline{display:flex;flex-wrap:wrap;gap:6px 18px;justify-content:space-between}
.comment-byline span,.comment-byline time{font-size:13px;color:var(--muted)}
#preview-result{padding:18px 18px 8px;background:#fff;border:1px solid var(--line);border-left:4px solid var(--red)}
@media(max-width:600px){
.field-grid{grid-template-columns:1fr;gap:0}
.comment-page .lede{font-size:17px}
.comment-page{padding:26px 18px}
.comment-page .actions{gap:14px}
.comment-page label{margin-top:16px}
.preview-banner{font-size:14px}
}