@layer compatibility {
[data-board-comments]{background:#fff;border:1px solid #dbe4eb;border-radius:12px;padding:24px;scroll-margin-top:110px;color:#17324d}
[data-board-comments] h2{margin:0 0 20px;font-size:1.4rem}
[data-board-comments] article{padding:18px 0;border-bottom:1px solid #e3eaf0}
[data-board-comments] [data-comment-row]{padding:10px 0}
[data-board-comments] img{border-radius:50%;object-fit:cover;vertical-align:middle;margin-right:8px}
[data-board-comments] small{color:#617080;margin-left:8px}
[data-board-comments] pre{white-space:pre-wrap;overflow-wrap:anywhere;font:inherit;line-height:1.7;margin:12px 0}
[data-board-comments] .match-reply{margin-left:32px;border-left:3px solid #e3eaf0;padding-left:16px}
[data-board-comments] form{margin-top:16px}
[data-board-comments] label{display:block;font-weight:600}
[data-board-comments] input,[data-board-comments] textarea{box-sizing:border-box;border:1px solid #bdcad5;border-radius:6px;padding:10px;font:inherit;max-width:100%}
[data-board-comments] input{margin-left:10px;width:min(75%,540px)}
[data-board-comments] textarea{min-height:110px;margin-top:8px}
[data-board-comments] button{border:1px solid #b6c9da;border-radius:6px;background:#f5f9fc;color:#174d7b;padding:7px 12px;font:inherit;cursor:pointer;margin:5px 6px 0 0}
[data-board-comments] button[type=submit]{background:#1477bd;color:white;border-color:#1477bd}
[data-board-comments] dialog{border:1px solid #b6c9da;border-radius:12px;width:min(600px,90vw);padding:24px}
[data-board-comments] [role=status]:empty{display:none}
[data-board-comments] [role=status]{color:#a22020}
}