.comment-form {
  max-width: 900px;
  max-width: var(--max-article-width, 900px);
  margin: 0 auto 2rem;
}
.comment {
  max-width: 900px;
  max-width: var(--max-article-width, 900px);
  position: relative;
  display: block;
  padding: 0;
  margin: 0 auto 1.5em;
}
.comments .indented {
  position: relative;
  padding-left: 1.25em;/* LTR */
  margin-top: -1.5em;
}
[dir="rtl"] .comments .indented {
  padding-left: 0;
  padding-right: 1.25em;
}
.comments .indented:before,
.comments .indented:after {
  content: '';
  position: absolute;
  display: block;
  border: 2px solid transparent;
}
.comments .indented:before {
  top: -1em;
  left: 0;
  width: 0.5em;
  height: 2em;
  border: 2px solid transparent;
  border-color: transparent transparent #bbb #bbb;
}
[dir="rtl"] .comments .indented:before {
  left: auto;
  right: 0;
  border-color: transparent #bbb #bbb transparent;
}
.comments .indented:after {
  content: '';
  background: #bbb;
  width: 5px;
  height: 10px;
  position: absolute;
  top: 14px;
  left: 10px;
  clip-path: polygon(0 0, 0 100%, 100% 50%);
}
[dir="rtl"] .comments .indented:after {
  left: auto;
  right: 10px;
  clip-path: polygon(0 50%, 100% 100%, 100% 0);
}
.comment .attribution {
  display: inline-flex;
  background: #f8f8f8;
  padding: .5em;
  border: 1px solid;
  border-color: #bbb #bbb #f8f8f8 #bbb;
  margin-bottom: -1px;
}
.comment .user-picture {
  width: 36px;
  padding: 0;
  margin: 0 5px;
}
.commenter-name {
  margin: 0;
}
.comment-title {
  padding: 1em 1.25em 0.25em;
}
.comment-title h3 {
  margin: 0;
  padding: 0;
  font-size: 1.125em;
}
.comment.comment-title-hidden .comment-title .permalink {
  display: block;
  width: 1em;
  height: 1em;
  float: left; /* LTR */
  margin: 6px 8px 0 0; /* LTR */
  text-indent: -333px;
  overflow: hidden;
  background-color: currentColor;
  -webkit-mask-image: url("../img/permalink.svg");
  mask-image: url("../img/permalink.svg");
  -webkit-mask-size: cover;
  mask-size: cover;
}
[dir="rtl"] .comment.comment-title-hidden .comment-title .permalink {
  float: right;
  margin: 6px 0 0 8px;
}
.comment-time {
  padding: 6px 0;
  display: block;
  font-size: 0.875em;
}
.comment .submitted {
  font-style: normal;
  font-size: 1rem;
  padding: 0;
}
.comment .content {
  padding: 0 1.375em;
}
.comment-text {
  margin: 0 0 1rem;
}
.comments .indented:before {
}
.js .dropbutton-wrapper {
  min-height: 1.9rem;
}
.comment .comment-text {
  padding-bottom: .5rem;
  border: 1px solid #bbbbbb;
  background-color: #f8f8f8;
}
.comment .dropbutton-widget {
  position: relative;
  font-size: 1rem;
}
.comment-linkwrapper {
  position: absolute;
  bottom: 1rem;
  right: 0;
}
[dir="rtl"] .comment-linkwrapper {
  right: auto;
  left: 0;
}
.comment .dropbutton-arrow {
  border-color: transparent transparent currentColor transparent;
  border-width: 5px;
  margin-top: -0.5em;
}
.comment .dropbutton-wrapper.open .dropbutton-arrow {
  border-color: currentColor transparent transparent transparent;
  margin-top: 0;
}
.comment-unpublished .comment-text {
  background-image: url("../img/warn-bg.png");
}