.social-boundary { color: var(--muted); margin: -4px 0 24px; line-height: 1.6; }
.social-brand { width: min(100%, 400px); padding: 8px 12px; margin-bottom: 20px; background: var(--am-navy); border-radius: var(--am-radius-panel); }
.social-brand img { display: block; width: 100%; height: auto; }
.social-workspace { display: grid; grid-template-columns: minmax(290px, 420px) minmax(0, 1fr); gap: 24px; align-items: start; }
.social-controls, .social-output { min-width: 0; display: grid; gap: 22px; }
.social-panel { min-width: 0; padding: 24px; }
.social-panel h2 { font-size: 19px; margin: 8px 0 20px; }
.social-panel label:not(.social-check) { display: grid; gap: 8px; margin: 16px 0; font-size: 13px; font-weight: 600; }
.social-panel .field-input { width: 100%; min-width: 0; box-sizing: border-box; }
.social-panel button { white-space: normal; }
.social-help { color: var(--muted); font-size: 13px; line-height: 1.65; }
.social-check { display: flex; align-items: flex-start; gap: 10px; font-size: 13px; line-height: 1.7; margin: 20px 0; }
.social-check input { flex-shrink: 0; margin-top: 5px; accent-color: var(--accent); }
.social-preview-head, .social-pager { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; }
.social-preview-head > span, .social-pager span { color: var(--muted); font-size: 12px; }
.social-preview canvas { width: 100%; height: auto; max-width: 540px; display: block; margin: 0 auto; border-radius: var(--am-radius-control); }
#view-social [hidden] { display: none; }
.social-empty { min-height: 360px; display: grid; align-content: center; justify-items: center; text-align: center; padding: 24px; background: var(--soft); color: var(--muted); }
.social-empty svg { width: 40px; height: 40px; color: var(--accent); }
.social-empty h3 { color: var(--ink); font-size: 21px; }
.social-pager { margin-top: 18px; }
.social-card-editor { border-top: var(--am-border); padding: 20px 0 8px; min-width: 0; }
.social-card-editor legend { font-size: 14px; font-weight: 700; padding-right: 8px; }
.social-card-editor fieldset { border: 0; padding: 0; margin: 0; min-width: 0; }
.social-card-editor .social-crop { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.social-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 15px; }
.social-warnings { padding-left: 20px; color: var(--am-warning); font-size: 13px; line-height: 1.6; }
.social-warnings:empty { display: none; }
#socialMessage { white-space: pre-line; overflow-wrap: anywhere; font-size: 13px; line-height: 1.6; }
#socialMessage[data-tone="error"] { color: var(--am-error); }
.social-draft { display: flex; gap: 12px; justify-content: space-between; align-items: center; border-top: var(--am-border); padding: 15px 0; }
.social-draft strong { display: block; font-size: 14px; overflow-wrap: anywhere; }
.social-draft small { color: var(--muted); display: block; margin-top: 6px; }
.social-draft .social-actions { flex-shrink: 0; margin: 0; }
@media (max-width: 1100px) { .social-workspace { grid-template-columns: 1fr; } .social-output { grid-row: 1; } .social-empty { min-height: 180px; } }
@media (max-width: 600px) { .social-panel { padding: 18px; } .social-draft { align-items: flex-start; flex-direction: column; } .social-panel button { min-height: 44px; } }