.social-buttons { display: grid; gap: 12px; margin: 24px 0; }
.social-provider { display: flex; align-items: center; justify-content: center; gap: 12px; min-height: 48px; border: 1px solid #bcbab5; border-radius: 10px; background: #fff; color: #1f1f1f; text-decoration: none; font: 500 15px system-ui, sans-serif; padding: 12px 20px; }
.social-provider:hover { background: #f8f8f8; border-color: #888; }
.social-provider:focus-visible, .social-primary:focus-visible { outline: 3px solid #7b2ff7; outline-offset: 3px; }
.social-provider img { width: 20px; height: 20px; }
.social-divider { display: flex; align-items: center; gap: 14px; color: #68645e; font: 13px system-ui, sans-serif; margin: 20px 0; }
.social-divider::before, .social-divider::after { content: ''; height: 1px; flex: 1; background: #d8d2c8; }
.social-page { box-sizing: border-box; min-height: 100vh; margin: 0; padding: 40px 20px; display: grid; place-items: center; background: #f0ece3; color: #17130f; font: 15px/1.6 system-ui, sans-serif; }
.social-page * { box-sizing: border-box; }
.social-card { width: 100%; max-width: 440px; padding: 32px; background: #fffdf8; border: 1px solid #e0d9cc; border-radius: 20px; box-shadow: 0 16px 60px #17130f0a; }
.social-logo { display: block; margin: 0 auto 20px; }
.social-eyebrow { font-size: 11px; letter-spacing: .16em; color: #6e665b; }
.social-card h1 { font-size: 28px; line-height: 1.2; margin: 8px 0 12px; }
.social-card h2 { font-size: 19px; margin: 24px 0 8px; }
.social-muted { color: #686056; }
.social-email { overflow-wrap: anywhere; }
.social-card a { color: #6727bf; text-underline-offset: 3px; }
.social-card form { display: grid; gap: 10px; }
.social-card label { font-size: 13px; }
.social-card input:not([type=checkbox]) { padding: 13px; width: 100%; font: inherit; border: 1px solid #bcb5a8; border-radius: 8px; background: #fff; }
.social-consent { display: flex; align-items: flex-start; gap: 10px; margin: 12px 0; }
.social-consent input { flex: 0 0 auto; width: 18px; height: 18px; margin-top: 2px; }
.social-primary { padding: 14px 20px; border: 0; border-radius: 9px; background: #17130f; color: #fff; font: 600 15px system-ui,sans-serif; cursor: pointer; min-height: 48px; }
.social-primary:hover { background: #3c3447; }
.social-message { background: #fff3dd; padding: 14px; border-radius: 8px; }
.social-link-account { border-top: 1px solid #e0d9cc; margin-top: 26px; padding-top: 20px; }
.social-link-account summary { cursor: pointer; font-weight: 600; }
.social-back { display: block; margin-top: 24px; font-size: 13px; }
@media (max-width: 420px) { .social-card { padding: 24px; } }