.commerce-social { margin: 32px 0; }
.social-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.social-card { min-width: 0; padding: 22px; border: 1px solid var(--gb-line, var(--theme-color-339dff3b,rgba(51, 157, 255, .23))); border-radius: 16px; background: var(--gb-panel, var(--theme-color-101c2dff,#101c2d)); }
.social-card-top, .social-share-actions { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.social-platform { display: flex; gap: 10px; align-items: center; color: var(--gb-text, var(--theme-color-eef5ffff,#eef5ff)); font-size: 17px; font-weight: 700; }
.social-platform i { color: var(--gb-cyan, var(--theme-color-4fc3ffff,#4fc3ff)); font-size: 22px; }
.social-reward { color: var(--gb-cyan, var(--theme-color-4fc3ffff,#4fc3ff)); font-weight: 700; }
.social-card h3 { color: var(--gb-text, var(--theme-color-eef5ffff,#eef5ff)); font-size: 15px; margin: 18px 0 12px; }
.social-card > label { color: var(--gb-muted, var(--theme-color-9baec7ff,#9baec7)); font-size: 12px; }
.social-card .social-caption { width: 100%; box-sizing: border-box; resize: vertical; min-height: 112px; margin: 6px 0 12px; padding: 12px; border: 1px solid var(--gb-line, var(--theme-color-339dff3b,rgba(51, 157, 255, .23))); border-radius: 9px; background: var(--gb-bg, var(--theme-color-080f1cff,#080f1c)); color: var(--gb-text, var(--theme-color-eef5ffff,#eef5ff)); font: inherit; font-size: 13px; line-height: 1.6; }
.social-copy, .social-open, .social-claim { display: inline-flex; align-items: center; justify-content: center; gap: 8px; border: 1px solid var(--gb-line, var(--theme-color-339dff3b,rgba(51, 157, 255, .23))); border-radius: 9px; padding: 10px 13px; background: transparent; color: var(--gb-text, var(--theme-color-eef5ffff,#eef5ff)); font: inherit; font-size: 13px; text-decoration: none; cursor: pointer; }
.social-open:hover, .social-copy:hover { color: var(--gb-cyan, var(--theme-color-4fc3ffff,#4fc3ff)); border-color: var(--gb-cyan, var(--theme-color-4fc3ffff,#4fc3ff)); text-decoration: none; }
.social-card .social-claim { width: 100%; box-sizing: border-box; background: var(--gb-cyan, var(--theme-color-4fc3ffff,#4fc3ff)); color: var(--theme-button-text, var(--theme-color-10151bff,#10151b)); font-weight: 700; margin-top: 8px; }
.social-claim:disabled, .social-claim[aria-disabled="true"] { opacity: .5; cursor: default; }
.social-hint, .social-feedback, .social-cooldown, .social-confirm { font-size: 12px; color: var(--gb-muted, var(--theme-color-9baec7ff,#9baec7)); line-height: 1.6; }
.social-hint { margin: 12px 0 0; }
.social-feedback { min-height: 19px; margin: 8px 0; color: var(--gb-cyan, var(--theme-color-4fc3ffff,#4fc3ff)); }
.social-confirm { display: flex; align-items: flex-start; gap: 8px; margin: 8px 0; }
.social-confirm input { flex: 0 0 auto; margin: 4px 0 0; }
.social-media { display: inline-block; margin-top: 8px; color: var(--gb-cyan, var(--theme-color-4fc3ffff,#4fc3ff)); }
.social-cooldown { margin: 8px 0; }
.social-cooldown i { margin-right: 8px; }
.social-notice { padding: 12px 16px; border: 1px solid #398b65; border-radius: 10px; color: #91dfb5; background: #102a21; }
.social-history { margin-top: 24px; }
.social-history h3 { color: var(--gb-text, var(--theme-color-eef5ffff,#eef5ff)); font-size: 18px; }
.social-table-wrap { overflow-x: auto; }
.social-history table { width: 100%; border-collapse: collapse; }
.social-history th, .social-history td { text-align: left; padding: 11px; border-bottom: 1px solid var(--gb-line, var(--theme-color-339dff3b,rgba(51, 157, 255, .23))); font-size: 13px; color: var(--gb-muted, var(--theme-color-9baec7ff,#9baec7)); }
.social-history td { color: var(--gb-text, var(--theme-color-eef5ffff,#eef5ff)); }
.social-card :focus-visible { outline: 2px solid var(--gb-cyan, var(--theme-color-4fc3ffff,#4fc3ff)); outline-offset: 3px; }
@media (max-width: 700px) { .social-grid { grid-template-columns: minmax(0, 1fr); } .social-card { padding: 17px; } }