/* ================================================================
   SOCIAL — social.css
   ================================================================ */

.social-wrap { margin-top: -120px; }

.social-header {
  margin-bottom: 1.25rem;
}
.social-title {
  font-family: var(--font-display); font-size: 1.4rem; font-weight: 700;
  letter-spacing: .18em; color: var(--cream); margin: .4rem 0 .2rem;
}
.social-sub {
  font-family: var(--font-ink); font-style: italic; font-size: .9rem;
  color: var(--ivory-dark); opacity: .6;
}

.social-tabs { margin-bottom: 0; }

/* Warden row */
.social-list { display: flex; flex-direction: column; gap: .5rem; padding-top: 1rem; }

.social-warden-row {
  display: grid;
  grid-template-columns: 52px 1fr auto;
  align-items: center;
  gap: 1rem;
  padding: .85rem 1rem;
  border: 1px solid rgba(181,139,74,.18);
  background: linear-gradient(148deg, var(--greenhouse-2), var(--greenhouse-3));
  transition: border-color .15s;
}
.social-warden-row:hover { border-color: rgba(181,139,74,.4); }

.social-avatar {
  width: 48px; height: 48px; flex-shrink: 0;
  background: linear-gradient(135deg, var(--greenhouse-2), var(--greenhouse-3));
  border: 1px solid rgba(181,139,74,.25);
  display: flex; align-items: center; justify-content: center;
  font-size: 1.4rem;
}

.social-warden-name {
  font-family: var(--font-display); font-size: .72rem; font-weight: 700;
  letter-spacing: .1em; color: var(--cream); margin-bottom: .15rem;
}
.social-warden-meta {
  font-family: var(--font-display); font-size: .46rem; letter-spacing: .14em;
  color: var(--ivory-dark); opacity: .55;
}
.social-warden-rank {
  font-family: var(--font-display); font-size: .46rem; letter-spacing: .14em;
  color: var(--brass-light); opacity: .8; margin-top: .1rem;
}

.social-actions { display: flex; gap: .4rem; }

.social-btn {
  font-family: var(--font-display); font-size: .46rem; letter-spacing: .14em;
  border: 1px solid rgba(181,139,74,.25); background: none;
  color: var(--ivory-dark); padding: .35rem .65rem; cursor: pointer;
  transition: border-color .15s, color .15s;
  white-space: nowrap;
}
.social-btn:hover { border-color: var(--brass); color: var(--brass-light); }
.social-btn-danger:hover { border-color: #a04040; color: #c06060; }
.social-btn-accept { border-color: var(--moss); color: #8fb279; }
.social-btn-accept:hover { background: rgba(95,118,84,.1); }

/* Empty state */
.social-empty {
  text-align: center; padding: 3rem 1rem;
  font-family: var(--font-ink); font-style: italic;
  font-size: 1rem; color: var(--ivory-dark); opacity: .4;
}

/* Blocked note */
.social-blocked-note {
  background: rgba(160,64,64,.08); border: 1px solid rgba(160,64,64,.2);
  padding: .75rem 1rem; margin-bottom: .75rem;
  font-family: var(--font-ink); font-style: italic; font-size: .88rem;
  color: var(--ivory-dark); opacity: .7;
}

/* Mobile */
@media (max-width: 600px) {
  .social-warden-row { grid-template-columns: 44px 1fr; }
  .social-actions { grid-column: 1 / -1; }
  .social-btn { font-size: .42rem; padding: .3rem .5rem; }
}