.comment-actions { display:flex; flex-wrap:wrap; align-items:center; gap:10px 16px; }
.comment-mobile-identity, .comment-post-mobile, .comment-change-mobile { display:none; }
.comment-actions #comment-button { display:inline-block; flex:0 1 auto; margin:0; border:0; cursor:pointer; max-width:100%; white-space:normal; overflow-wrap:anywhere; }
.comment-name { position:relative; display:flex; flex:0 1 auto; flex-wrap:wrap; gap:8px 12px; align-items:center; min-width:0; margin:0; max-width:100%; }
.comment-name-fields { display:flex; flex-wrap:wrap; align-items:center; gap:8px; max-width:100%; }
.comment-name-fields[hidden] { display:none; }
.comment-name-fields label { display:flex; align-items:center; margin:0; border:1px solid #555; border-radius:4px; padding-left:10px; color:#aaa; max-width:100%; }
.comment-name-fields input { width:180px; max-width:100%; min-width:0; background:#000; color:#ddd; border:0; margin:0; padding:8px; font:inherit; }
.comment-name-link { border:0; background:transparent; color:#c28ac8; text-decoration:underline; padding:4px 0; font:inherit; cursor:pointer; }
.comment-name-save { border:1px solid #555; border-radius:4px; background:#333; color:#ddd; padding:8px 14px; font:inherit; cursor:pointer; }
.comment-name button:focus-visible, .comment-name input:focus-visible { outline:2px solid #c28ac8; outline-offset:2px; }
.comment-name-message { flex-basis:100%; font-size:13px; color:#bbb; }
.comment-name-fields[hidden] ~ .comment-name-message { position:absolute; top:100%; left:0; margin-top:4px; white-space:nowrap; }
.comment-name-message:empty { display:none; }
.comment-name-message[data-error="true"] { color:#ff8f86; }
.comment-name input[aria-invalid="true"] { outline:1px solid #ff8f86; }
.comment-name button:disabled { opacity:.6; cursor:wait; }
#comment-button:disabled, #comment-button.disable-pointers { opacity:.6; cursor:wait; }
#comment-button:focus-visible { outline:2px solid #c28ac8; outline-offset:2px; }
@media(max-width:480px) {
    .comment-actions { display:grid; grid-template-columns:minmax(0,max-content) auto; gap:14px 12px; }
    .comment-mobile-identity { display:block; order:1; grid-column:1; color:#999; min-width:0; overflow-wrap:anywhere; font-size:14px; }
    .comment-mobile-identity strong { color:#ddd; }
    .comment-name { order:2; grid-column:2; justify-self:start; }
    .comment-name[data-editing="true"] { grid-column:1 / -1; justify-self:stretch; }
    .comment-name:not([data-editing="true"]) { flex-wrap:nowrap; gap:8px; }
    .comment-name-fields[hidden] ~ .comment-name-message { position:static; top:auto; left:auto; margin-top:0; flex:0 0 auto; white-space:nowrap; }
    .comment-name-link { white-space:nowrap; font-size:14px; }
    .comment-name-fields input { width:155px; }
    .comment-actions #comment-button { order:3; grid-column:1 / -1; width:100%; box-sizing:border-box; background:#383838; color:#bcbcbc; border:1px solid #444; border-radius:4px; padding:12px 16px; font-size:15px; font-weight:600; }
    .comment-actions #comment-button:hover { background:#444; color:#ddd; }
    .comment-post-desktop, .comment-change-desktop { display:none; }
    .comment-post-mobile, .comment-change-mobile { display:inline; }
}
