.social-section { padding-bottom: 20px; }
.social-brand { display: flex; align-items: center; gap: 9px; }
.social-brand-mark { width: 28px; height: 28px; display: grid; place-items: center; color: var(--canvas); background: var(--amber); border-radius: 8px; font-weight: 900; font-size: 12px; }
.social-brand-copy { display: grid; gap: 2px; }
.social-brand-copy strong { color: var(--white); font-size: 15px; letter-spacing: -.02em; }
.social-brand-copy span { color: var(--dim); font-size: 9px; letter-spacing: .12em; text-transform: uppercase; }
.social-composer { margin-top: 12px; padding: 10px; border: 1px solid var(--line); border-radius: var(--radius-sm); background: var(--canvas); }
.social-composer textarea { width: 100%; min-height: 58px; resize: vertical; border: 0; outline: 0; color: var(--ink); background: transparent; font-size: 12px; line-height: 1.45; }
.social-composer textarea::placeholder { color: var(--dim); }
.social-compose-tools { display: flex; gap: 7px; align-items: center; margin-top: 7px; }
.social-compose-tools select { min-width: 0; flex: 1; min-height: 34px; }
.social-compose-tools .button { min-height: 34px; padding: 0 10px; font-size: 11px; }
.social-feed { display: grid; gap: 7px; max-height: 310px; overflow-y: auto; margin-top: 12px; padding-right: 2px; }
.social-post { display: flex; gap: 9px; padding: 10px 0; border-top: 1px solid var(--line); }
.social-avatar { flex: 0 0 28px; width: 28px; height: 28px; display: grid; place-items: center; color: var(--canvas); background: var(--steel); border-radius: 50%; font-size: 11px; font-weight: 900; }
.social-post-content { min-width: 0; flex: 1; }
.social-post-head { display: flex; flex-wrap: wrap; align-items: baseline; gap: 5px; }
.social-post-head strong { color: var(--white); font-size: 11px; }
.social-post-head span, .social-post-meta { color: var(--dim); font-size: 10px; }
.social-post p { margin: 5px 0 7px; color: var(--muted); font-size: 11px; line-height: 1.45; }
.social-post-meta { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.social-like { border: 0; padding: 2px 0; color: var(--dim); background: transparent; font-size: 10px; }
.social-like:hover, .social-like.is-liked { color: var(--amber); }
.social-empty { color: var(--dim); font-size: 11px; }
@media (max-width: 540px) { .social-feed { max-height: 260px; } .social-compose-tools .select-field { max-width: 48%; } }