/* Community interaction surfaces — Design System V4 consumer.
   Theme identity is owned by tokens.css; this file contains no theme palette. */

.community-engagement{
  --community-panel-bg:var(--ds-surface-panel);
  --community-soft-bg:var(--ds-surface-subtle);
  --community-control-bg:var(--ds-surface-interactive);
  --community-control-hover:var(--ds-surface-interactive-hover);
  --community-control-border:var(--ds-border-default);
  --community-input-bg:var(--ds-field-bg);
  --community-input-border:var(--ds-field-border);
  --community-star-idle:var(--ds-text-muted);
  --community-action-shadow:var(--ds-shadow-control);
  position:relative;
  margin-top:48px;
  padding:clamp(24px,3vw,38px);
  border:1px solid var(--community-control-border);
  border-radius:calc(var(--ds-radius-panel) + 2px);
  background:var(--community-panel-bg);
  color:var(--ds-text-strong);
  box-shadow:var(--ds-shadow-panel);
}
.community-engagement::before{
  content:"";
  position:absolute;
  inset-block-start:0;
  inset-inline:clamp(24px,4vw,56px);
  height:2px;
  border-radius:999px;
  background:linear-gradient(90deg,transparent,color-mix(in srgb,var(--accent) 70%,transparent),transparent);
  pointer-events:none;
}
.community-engagement__head{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:center;
  gap:28px;
  padding-bottom:24px;
  border-bottom:1px solid var(--ds-divider);
}
.community-engagement__head-copy{min-width:0}
.community-engagement__eyebrow{
  display:flex;
  align-items:center;
  gap:9px;
  margin-bottom:7px;
  color:var(--ds-text-link);
  font-size:var(--fs-label);
  font-weight:var(--fw-extrabold);
}
.community-engagement__eyebrow a{
  color:var(--ds-text-muted);
  font-weight:var(--fw-bold);
  text-decoration:none;
}
.community-engagement__eyebrow a::before{content:"·";margin-inline-end:9px;color:var(--ds-text-muted)}
.community-engagement__eyebrow a:hover{color:var(--ds-text-link);text-decoration:underline;text-underline-offset:3px}
.community-engagement__head-copy h2{
  margin:0;
  color:var(--ds-text-strong);
  font-size:clamp(1.55rem,2.5vw,2.05rem);
  line-height:1.45;
}
.community-engagement__head-copy p{
  max-width:760px;
  margin:8px 0 0;
  color:var(--ds-text-default);
  font-size:var(--fs-body-sm);
  line-height:1.85;
}
.community-engagement__auth-actions{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:9px;
  flex-wrap:wrap;
}
.community-engagement__auth-actions[hidden]{display:none!important}
.community-engagement__auth{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  min-height:var(--ds-control-height-md);
  padding:9px 15px;
  border:1px solid transparent;
  border-radius:var(--ds-radius-control);
  text-decoration:none;
  font-size:var(--fs-body-sm);
  font-weight:var(--fw-extrabold);
  transition:transform var(--ds-transition-fast),background-color var(--ds-transition-fast),border-color var(--ds-transition-fast),box-shadow var(--ds-transition-fast);
}
.community-engagement__auth:hover{transform:translateY(-1px)}
.community-engagement__auth:focus-visible{
  outline:2px solid var(--ds-border-active);
  outline-offset:3px;
  box-shadow:var(--ds-shadow-focus);
}
.community-engagement__auth--primary{
  border-color:var(--ds-action-primary-border);
  background:var(--ds-action-primary-bg);
  color:var(--ds-action-primary-text);
  box-shadow:var(--ds-shadow-control);
}
.community-engagement__auth--primary:hover{background:var(--ds-action-primary-hover)}
.community-engagement__auth--secondary{
  border-color:var(--ds-action-secondary-border);
  background:var(--ds-action-secondary-bg);
  color:var(--ds-action-secondary-text);
}
.community-engagement__auth--secondary:hover{border-color:var(--ds-border-active);background:var(--ds-action-secondary-hover)}

.community-engagement__interaction-panel{
  margin-top:22px;
  padding:18px;
  border:1px solid var(--ds-border-subtle);
  border-radius:var(--ds-radius-card);
  background:var(--community-soft-bg);
}
.community-engagement__interaction-head{
  display:flex;
  align-items:baseline;
  justify-content:space-between;
  gap:16px;
  margin-bottom:12px;
}
.community-engagement__interaction-head strong{font-size:.92rem}
.community-engagement__interaction-head span{color:var(--ds-text-muted);font-size:.78rem}
.community-engagement__action-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:10px;
}
.community-action-card{
  display:flex;
  align-items:center;
  gap:11px;
  min-height:68px;
  padding:11px 13px;
  border:1px solid var(--community-control-border);
  border-radius:var(--ds-radius-card);
  background:var(--community-control-bg);
  color:var(--ds-text-strong);
  box-shadow:var(--community-action-shadow);
  text-align:start;
  font:inherit;
  cursor:pointer;
  transition:transform var(--ds-transition-fast),background-color var(--ds-transition-fast),border-color var(--ds-transition-fast),box-shadow var(--ds-transition-fast);
}
.community-action-card:hover,.community-action-card.is-active{border-color:var(--ds-border-active);background:var(--community-control-hover)}
.community-action-card:hover{transform:translateY(-1px)}
.community-action-card:active{transform:translateY(0)}
.community-action-card:focus-visible,
.community-rating button:focus-visible,
.community-comment-form button:focus-visible,
.community-comment__actions button:focus-visible,
.community-picker__close:focus-visible,
.community-picker__item:focus-visible{
  outline:2px solid var(--ds-border-active);
  outline-offset:2px;
  box-shadow:var(--ds-shadow-focus);
}
.community-action-card__icon{
  display:grid;
  place-items:center;
  flex:0 0 38px;
  width:38px;
  height:38px;
  border-radius:11px;
  background:color-mix(in srgb,var(--accent) 9%,var(--community-control-bg));
  color:var(--ds-text-link);
}
.community-action-icon{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.community-action-card[data-community-action="like"].is-active .community-action-icon{fill:currentColor}
.community-action-card[data-community-action="bookmark"].is-active .community-action-icon{fill:currentColor}
.community-action-card__copy{display:grid;gap:2px;min-width:0}
.community-action-card__copy strong{font-size:.91rem;line-height:1.4}
.community-action-card__copy small{color:var(--ds-text-muted);font-size:.75rem;font-variant-numeric:tabular-nums}

.community-engagement__rating{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  margin-top:12px;
  padding:14px 16px;
  border:1px solid var(--community-control-border);
  border-radius:var(--ds-radius-card);
  background:var(--community-control-bg);
}
.community-engagement__rating-copy{display:grid;gap:4px;min-width:0}
.community-engagement__rating-copy>strong{font-size:.91rem}
.community-engagement__rating-copy>small{color:var(--ds-text-muted);font-size:.78rem;line-height:1.55}
.community-rating{display:flex;direction:ltr;gap:3px;flex:0 0 auto}
.community-rating button{
  display:grid;
  place-items:center;
  width:34px;
  height:34px;
  border:0;
  border-radius:8px;
  padding:0;
  background:transparent;
  color:var(--community-star-idle);
  font-size:1.45rem;
  line-height:1;
  cursor:pointer;
}
.community-rating button:hover,.community-rating button.is-active{color:var(--signal);background:color-mix(in srgb,var(--signal) 9%,transparent)}
.community-engagement__status{
  min-height:22px;
  margin:12px 0 0;
  color:var(--ds-text-link);
  font-size:.88rem;
}
.community-engagement__status:empty{display:none}

.community-discussion{
  padding-top:24px;
  border-top:1px solid var(--ds-divider);
}
.community-discussion>header{
  display:flex;
  justify-content:space-between;
  align-items:center;
  margin-bottom:16px;
}
.community-discussion h3{
  margin:0;
  color:var(--ds-text-strong);
  font-size:1.28rem;
  line-height:1.5;
}
.community-discussion>header>[data-stat="comments"]{
  min-width:30px;
  padding:4px 8px;
  border-radius:var(--ds-radius-pill);
  background:var(--ds-info-bg);
  color:var(--ds-info);
  text-align:center;
  font-size:.8rem;
}
.community-comments{
  display:grid;
  gap:10px;
}
.community-comments .comments-empty{
  margin:0;
  padding:14px 0 18px;
  color:var(--ds-text-default);
  line-height:1.8;
}
.community-comment{
  padding:16px;
  border:1px solid var(--community-control-border);
  border-radius:var(--ds-radius-card);
  background:var(--community-soft-bg);
  color:var(--ds-text-strong);
}
.community-comment header{
  display:flex;
  justify-content:space-between;
  gap:16px;
  margin-bottom:8px;
}
.community-comment header a{
  color:var(--ds-text-strong);
  font-weight:var(--fw-extrabold);
  text-decoration:none;
}
.community-comment time{
  color:var(--ds-text-muted);
  font-size:.78rem;
}
.community-comment p{
  margin:0;
  line-height:1.8;
  white-space:pre-wrap;
}
.community-comment--accepted{
  border-color:var(--ds-success-border);
  background:var(--ds-success-bg);
}
.community-comment__actions{
  display:flex;
  align-items:center;
  gap:8px;
  flex-wrap:wrap;
  margin-top:12px;
}
.community-comment__actions button{
  min-height:34px;
  padding:5px 9px;
  border:1px solid var(--ds-action-secondary-border);
  border-radius:var(--ds-radius-control);
  background:var(--ds-action-secondary-bg);
  color:var(--ds-action-secondary-text);
  font:inherit;
  font-size:.8rem;
  font-weight:var(--fw-extrabold);
  cursor:pointer;
}
.community-comment__actions button:hover{
  border-color:var(--ds-border-active);
  background:var(--ds-action-secondary-hover);
}
.community-answer-badge{
  display:inline-flex;
  align-items:center;
  min-height:32px;
  padding:5px 9px;
  border-radius:var(--ds-radius-pill);
  background:var(--ds-success-bg);
  color:var(--ds-success);
  font-size:.8rem;
}

.community-comment-form{
  display:grid;
  gap:11px;
  margin-top:18px;
}
.community-comment-form label{
  display:grid;
  gap:7px;
}
.community-comment-form label span{
  color:var(--ds-text-default);
  font-size:.9rem;
  font-weight:var(--fw-extrabold);
}
.community-comment-form textarea,
.community-report-form select,
.community-report-form textarea{
  width:100%;
  border:1px solid var(--ds-field-border);
  border-radius:var(--ds-radius-input);
  background:var(--ds-field-bg);
  color:var(--ds-field-text);
  caret-color:var(--accent);
  font:inherit;
}
.community-comment-form textarea{
  min-height:132px;
  padding:11px 12px;
  resize:vertical;
  line-height:1.7;
}
.community-comment-form textarea::placeholder,
.community-report-form textarea::placeholder{color:var(--ds-field-placeholder)}
.community-comment-form textarea:hover,
.community-report-form select:hover,
.community-report-form textarea:hover{
  border-color:var(--ds-field-border-hover);
  background:var(--ds-field-bg-hover);
}
.community-comment-form textarea:focus,
.community-report-form select:focus,
.community-report-form textarea:focus{
  outline:none;
  border-color:var(--ds-field-border-focus);
  box-shadow:var(--ds-shadow-focus);
}
.community-comment-form button,
.community-report-form button{
  min-height:var(--ds-control-height-md);
  padding:9px 18px;
  border:1px solid var(--ds-action-primary-border);
  border-radius:var(--ds-radius-control);
  background:var(--ds-action-primary-bg);
  color:var(--ds-action-primary-text);
  font:inherit;
  font-weight:var(--fw-extrabold);
  cursor:pointer;
}
.community-comment-form button{
  justify-self:start;
}
.community-comment-form button:hover,
.community-report-form button:hover{background:var(--ds-action-primary-hover)}
.community-comment-form button:active,
.community-report-form button:active{background:var(--ds-action-primary-active)}

.community-picker{
  position:fixed;
  inset:0;
  z-index:10050;
  display:grid;
  place-items:center;
  padding:18px;
  background:var(--ds-surface-overlay);
  backdrop-filter:blur(4px);
}
.community-picker__panel{
  width:min(520px,100%);
  max-height:min(680px,85vh);
  overflow:auto;
  padding:22px;
  border:1px solid var(--ds-border-default);
  border-radius:var(--ds-radius-panel);
  background:var(--ds-surface-panel);
  color:var(--ds-text-strong);
  box-shadow:var(--ds-shadow-float);
}
.community-picker__panel>header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  margin-bottom:16px;
}
.community-picker__panel h2{
  margin:0;
  font-size:1.3rem;
  line-height:1.5;
}
.community-picker__close{
  display:grid;
  place-items:center;
  width:38px;
  height:38px;
  border:1px solid var(--ds-action-secondary-border);
  border-radius:var(--ds-radius-control);
  background:var(--ds-action-secondary-bg);
  color:var(--ds-action-secondary-text);
  font-size:1.4rem;
  cursor:pointer;
}
.community-picker__list{
  display:grid;
  gap:8px;
}
.community-picker__item{
  display:flex;
  justify-content:space-between;
  gap:16px;
  width:100%;
  padding:12px 14px;
  border:1px solid var(--ds-action-secondary-border);
  border-radius:var(--ds-radius-control);
  background:var(--ds-action-secondary-bg);
  color:var(--ds-action-secondary-text);
  text-align:start;
  font:inherit;
  cursor:pointer;
}
.community-picker__item:hover{
  border-color:var(--ds-border-active);
  background:var(--ds-action-secondary-hover);
}
.community-picker__item small,
.community-picker__status,
.community-picker__empty{
  color:var(--ds-text-muted);
}
.community-picker__profile{
  display:inline-flex;
  margin-top:10px;
  color:var(--ds-text-link);
  font-weight:var(--fw-extrabold);
}
.community-picker__status{
  min-height:22px;
  margin:12px 0 0;
  font-size:.88rem;
}

.community-report-form{
  display:grid;
  gap:14px;
}
.community-report-form label{
  display:grid;
  gap:7px;
}
.community-report-form label>span{
  color:var(--ds-text-default);
  font-size:.88rem;
  font-weight:var(--fw-extrabold);
}
.community-report-form select,
.community-report-form textarea{
  padding:10px 12px;
}
.community-report-form textarea{
  resize:vertical;
  line-height:1.7;
}


.community-discussion__eyebrow{display:block;margin-bottom:3px;color:var(--ds-text-muted);font-size:.74rem;font-weight:var(--fw-bold)}
.community-comment-form__footer{display:flex;align-items:center;justify-content:space-between;gap:14px}
.community-comment-form__footer>small{color:var(--ds-text-muted);font-size:.78rem;line-height:1.5}
.community-comment-form.is-guest textarea{background:var(--ds-surface-subtle);color:var(--ds-text-muted);cursor:pointer}
.community-comment-form.is-guest textarea::placeholder{color:var(--ds-text-muted)}

@media(max-width:900px){
  .community-engagement__head{grid-template-columns:1fr;align-items:start;gap:18px}
  .community-engagement__auth-actions{justify-content:flex-start}
  .community-engagement__action-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:560px){
  .community-engagement{padding:18px;margin-inline:-4px;border-radius:var(--ds-radius-card)}
  .community-engagement__head{padding-bottom:18px}
  .community-engagement__head-copy h2{font-size:1.45rem}
  .community-engagement__auth-actions{display:grid;grid-template-columns:1fr 1fr;width:100%}
  .community-engagement__auth{width:100%;padding-inline:10px}
  .community-engagement__interaction-panel{margin-top:16px;padding:13px}
  .community-engagement__interaction-head{display:grid;gap:3px}
  .community-engagement__action-grid{grid-template-columns:1fr 1fr;gap:8px}
  .community-action-card{min-height:62px;padding:9px}
  .community-action-card__icon{width:34px;height:34px;flex-basis:34px}
  .community-engagement__rating{display:grid;gap:10px;padding:12px}
  .community-rating{width:100%;justify-content:space-between}
  .community-rating button{width:42px;height:38px}
  .community-comment-form textarea{min-height:112px}
  .community-comment-form__footer{display:grid!important;grid-template-columns:1fr}
  .community-comment-form__footer button{width:100%;justify-self:stretch!important}
  .community-comment header{display:grid;gap:4px}
  .community-picker{align-items:end;padding:10px}
  .community-picker__panel{width:100%;max-height:88vh;border-radius:18px}
}


/* Author profile interaction density — lighter than article discussion surfaces. */
body[data-analytics-subject-type="person"] .people-shell>.community-engagement{
  margin-top:1.35rem;
  padding:1.15rem 1.25rem;
  border-radius:var(--ds-radius-panel);
  box-shadow:var(--shadow-1);
}
body[data-analytics-subject-type="person"] .people-shell>.community-engagement::before{
  inset-inline:1.25rem;
}
body[data-analytics-subject-type="person"] .community-engagement__head{
  gap:18px;
  padding-bottom:14px;
}
body[data-analytics-subject-type="person"] .community-engagement__head-copy h2{
  font-size:clamp(1.3rem,2vw,1.65rem);
}
body[data-analytics-subject-type="person"] .community-engagement__head-copy p{
  margin-top:4px;
  font-size:.82rem;
  line-height:1.65;
}
body[data-analytics-subject-type="person"] .community-engagement__auth{
  min-height:2.35rem;
  padding:7px 11px;
  font-size:.78rem;
}
body[data-analytics-subject-type="person"] .community-engagement__interaction-panel{
  margin-top:13px;
  padding:12px;
}
body[data-analytics-subject-type="person"] .community-engagement__interaction-head{
  margin-bottom:8px;
}
body[data-analytics-subject-type="person"] .community-action-card{
  min-height:54px;
  padding:8px 10px;
  gap:8px;
}
body[data-analytics-subject-type="person"] .community-action-card__icon{
  width:32px;
  height:32px;
  flex-basis:32px;
}
body[data-analytics-subject-type="person"] .community-action-icon{
  width:17px;
  height:17px;
}
body[data-analytics-subject-type="person"] .community-action-card__copy strong{
  font-size:.82rem;
}
body[data-analytics-subject-type="person"] .community-engagement__rating{
  margin-top:8px;
  padding:9px 11px;
}
body[data-analytics-subject-type="person"] .community-rating button{
  width:30px;
  height:30px;
  font-size:1.22rem;
}
body[data-analytics-subject-type="person"] .community-engagement__status{
  margin-top:8px;
}
body[data-analytics-subject-type="person"] .community-discussion{
  padding-top:16px;
}
body[data-analytics-subject-type="person"] .community-discussion>header{
  margin-bottom:8px;
}
body[data-analytics-subject-type="person"] .community-discussion h3{
  font-size:1.08rem;
}
body[data-analytics-subject-type="person"] .community-comments .comments-empty{
  padding:7px 0 10px;
  font-size:.82rem;
}
body[data-analytics-subject-type="person"] .community-comment-form{
  margin-top:10px;
  gap:8px;
}
body[data-analytics-subject-type="person"] .community-comment-form textarea{
  min-height:88px;
}
body[data-analytics-subject-type="person"] .community-comment-form button{
  min-height:2.35rem;
  padding:7px 13px;
  font-size:.8rem;
}
@media(max-width:560px){
  body[data-analytics-subject-type="person"] .people-shell>.community-engagement{
    margin-top:1rem;
    padding:1rem;
  }
  body[data-analytics-subject-type="person"] .community-engagement__action-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  body[data-analytics-subject-type="person"] .community-comment-form textarea{
    min-height:84px;
  }
}

/* Admin-verified account badge on comments and replies. */
.community-comment>header .community-verified-badge{display:inline-flex;align-items:center;min-height:21px;padding:2px 7px;border:1px solid color-mix(in srgb,var(--accent-secondary) 42%,var(--ds-border-subtle));border-radius:999px;background:color-mix(in srgb,var(--accent-secondary) 9%,var(--ds-surface-base));color:var(--accent-secondary);font-size:.62rem;font-weight:900;line-height:1.2}
