/* Facebook-style navigation, feed, account panels and discussion. */
:root[data-ui-style="facebook"]{--social-accent:#0866ff;--site-accent:#0866ff;--site-head:var(--social-card);--site-chat:var(--social-bg);--site-text:var(--social-text);--site-selected:var(--social-line)}
:root[data-ui-style="facebook"] #socialTopbar{height:60px;padding:6px 16px;box-shadow:0 1px 5px #0002;border:0;gap:10px}
:root[data-ui-style="facebook"] #socialTopbar .social-brand{letter-spacing:-1px;font-size:26px}
:root[data-ui-style="facebook"] #socialTopbar form{flex:0 1 300px;margin:0}
:root[data-ui-style="facebook"] #socialTopbar input{border:0;border-radius:24px;font-size:14px}
:root[data-ui-style="facebook"] #socialTopbar form button{border:0;border-radius:50%;margin-left:4px;width:40px;min-width:40px}
.social-top-nav{display:flex;align-self:stretch;align-items:center;justify-content:center;gap:8px;flex:1}
.social-top-nav button{border:0;background:none;color:var(--social-muted);font-size:28px;min-width:72px;height:100%;border-radius:8px}
:root[data-ui-style="facebook"] .social-top-nav button:hover{background:var(--social-bg);color:var(--social-accent)}
:root[data-ui-style="facebook"] :is(.social-top-create,.social-top-notifications,#socialAccount){background:var(--social-line);color:var(--social-text);border:0;min-width:40px;min-height:40px;border-radius:22px;padding:8px 14px;font-weight:600}
:root[data-ui-style="facebook"] #rail{padding:16px 8px;font-size:15px}
:root[data-ui-style="facebook"] #rail>nav{margin-top:0;gap:4px}
:root[data-ui-style="facebook"] #rail .nav{min-height:48px;font-size:15px;font-weight:600;display:flex;align-items:center;gap:10px;text-align:left}
:root[data-ui-style="facebook"] #rail .nav span{font-size:24px;color:var(--social-accent)}
:root[data-ui-style="facebook"] #rail .service-menu-group{border:0;border-bottom:1px solid var(--social-line);background:none;border-radius:0;margin:6px 0}
:root[data-ui-style="facebook"] #rail :is(.service-menu-group summary,.service-link){color:var(--social-text);font-size:14px;background:none;border:0;box-shadow:none}
:root[data-ui-style="facebook"] #rail .service-link{border-radius:8px;min-height:44px}
:root[data-ui-style="facebook"] #rail .service-link:hover{background:var(--social-line)}
:root[data-ui-style="facebook"] #listPane .list-top{padding:20px 12px 12px;background:none}
:root[data-ui-style="facebook"] #listPane .titlebar h1{font-size:18px;color:var(--social-muted)}
:root[data-ui-style="facebook"] #listPane .row{background:none;border:0;box-shadow:none;border-radius:8px;margin:3px 6px;padding:10px}
:root[data-ui-style="facebook"] #listPane .row:hover{background:var(--social-line)}
:root[data-ui-style="facebook"] .social-feed-heading{display:none}
:root[data-ui-style="facebook"] .social-feed-scopes{display:flex;gap:8px;max-width:680px;margin:0 auto 14px;padding:12px;background:var(--social-card);border-radius:10px;box-shadow:0 1px 2px #0002}
.social-feed-scopes button{border:0;border-radius:20px;padding:10px 18px;background:var(--social-line);color:var(--social-text);font-weight:600;min-height:40px}
.social-feed-scopes button.selected{background:var(--social-accent);color:#fff}
.facebook-compose{display:flex;align-items:center;gap:12px;max-width:680px;margin:0 auto 20px;padding:16px;background:var(--social-card);border-radius:10px;box-shadow:0 1px 2px #0002}
.facebook-compose>button{flex:1;min-width:0;min-height:44px;border:0;border-radius:25px;padding:12px 18px;color:var(--social-muted);background:var(--social-bg);text-align:left}
.social-profile-avatar{padding:0;background:none;border:0;flex:none;cursor:pointer}
:root[data-ui-style="facebook"] .social-post>header{padding-top:0;min-height:40px}
:root[data-ui-style="facebook"] .social-post>header .avatar{width:40px;height:40px;border-radius:50%}
:root[data-ui-style="facebook"] .social-post .social-channel-link{font-size:15px}
:root[data-ui-style="facebook"] .social-post>p{font-size:15px;line-height:1.5}
:root[data-ui-style="facebook"] .social-post footer button:hover{background:var(--social-bg);border-radius:6px}
:root[data-ui-style="facebook"] .chat-head{background:var(--social-card);border-bottom:1px solid var(--social-line);color:var(--social-text)}
:root[data-ui-style="facebook"] .bubble{background:var(--social-card);border:0;border-radius:18px;color:var(--social-text);box-shadow:none}
:root[data-ui-style="facebook"] .own .bubble{background:#0866ff;color:#fff}
:root[data-ui-style="facebook"] .composer-wrap{background:var(--social-card);border-color:var(--social-line)}
:root[data-ui-style="facebook"] :is(.modal-box,.panel){background:var(--social-card);color:var(--social-text);border:1px solid var(--social-line);border-radius:10px;box-shadow:0 8px 28px #0002}
:root[data-ui-style="facebook"] .modal-box :is(p,label,h2,h3){color:var(--social-text)}
:root[data-ui-style="facebook"] .modal-box :is(input,select,textarea){background:var(--social-bg);color:var(--social-text);border:1px solid var(--social-line);border-radius:6px}
@media(max-width:1100px){:root[data-ui-style="facebook"] #socialTopbar .social-top-nav{display:none}}
@media(max-width:720px){
 :root[data-ui-style="facebook"] #socialTopbar{height:auto;min-height:56px;flex-wrap:wrap;padding:8px}
 :root[data-ui-style="facebook"] #socialTopbar form{order:4;flex:1 1 100%;display:flex}
 :root[data-ui-style="facebook"] #socialTopbar .social-brand{font-size:23px}
 :root[data-ui-style="facebook"] #socialTopbar #socialAccount{font-size:12px;padding:8px}
 :root[data-ui-style="facebook"] .social-home{padding:10px 0}
 :root[data-ui-style="facebook"] :is(.facebook-compose,.social-feed-scopes,.social-post){border-radius:0;border-inline:0}
 :root[data-ui-style="facebook"] #blogPosts{gap:10px}
 :root[data-ui-style="facebook"] .social-post footer{padding:4px 8px;gap:2px}
 :root[data-ui-style="facebook"] .social-post footer button{font-size:12px;padding:6px}
}
/* Space content uses post cards across the whole page. */
:root[data-ui-style="facebook"][data-space-presentation="posts"] #messageScroll{background:var(--social-bg)}
:root[data-ui-style="facebook"][data-space-presentation="posts"] .messages{max-width:720px;padding:20px 16px;gap:18px}
:root[data-ui-style="facebook"][data-space-presentation="posts"] .bubble-wrap{display:flex;flex-direction:column;align-self:stretch;max-width:100%;width:100%;background:var(--social-card);border:1px solid var(--social-line);border-radius:10px;padding:14px 16px;box-shadow:0 1px 2px #0001}
:root[data-ui-style="facebook"][data-space-presentation="posts"] .bubble,:root[data-ui-style="facebook"][data-space-presentation="posts"] .own .bubble{width:100%;max-width:100%;min-width:0;color:var(--social-text);background:none;border:0;box-shadow:none;padding:10px 0;border-radius:0}
:root[data-ui-style="facebook"][data-space-presentation="posts"] .album-bubble{min-width:0}
:root[data-ui-style="facebook"][data-space-presentation="posts"] .sender-profile{align-self:flex-start}
:root[data-ui-style="facebook"][data-space-presentation="posts"] .message-footer{justify-content:flex-start;border-top:1px solid var(--social-line);padding-top:10px;width:100%}
:root[data-ui-style="facebook"][data-space-presentation="posts"] .system-notice{display:none}
:root[data-ui-style="facebook"] #spacePresentationTabs{display:flex;gap:18px;padding:0 20px;background:var(--social-card);border-bottom:1px solid var(--social-line);flex:none;overflow-x:auto;white-space:nowrap}
:root[data-ui-style="facebook"] #spacePresentationTabs button.selected{border-color:var(--social-accent);color:var(--social-accent)}
:root[data-ui-style="facebook"] :is(.user-profile-card,.wallet-summary,.storage-list,.service-card-grid,.community-grid,.community-line){color:var(--social-text)}
:root[data-ui-style="facebook"] .service-card-grid .service-link{background:var(--social-bg);color:var(--social-text);border:1px solid var(--social-line);border-radius:8px;padding:12px}
:root[data-ui-style="facebook"] .modal-box .secondary{background:var(--social-bg);color:var(--social-text);border:1px solid var(--social-line);font-size:14px;min-height:40px;padding:10px 12px}
:root[data-ui-style="facebook"] .modal-box .primary{background:var(--social-accent);color:#fff;border:0;border-radius:6px;min-height:40px}
:root[data-ui-style="facebook"] .detail-tabs button{background:none;color:var(--social-muted);border:0;border-radius:0;border-bottom:3px solid transparent}
:root[data-ui-style="facebook"] .detail-tabs button.active{color:var(--social-accent);border-bottom-color:var(--social-accent)}
@media(max-width:720px){:root[data-ui-style="facebook"][data-space-presentation="posts"] .messages{padding:10px 0;gap:10px}:root[data-ui-style="facebook"][data-space-presentation="posts"] .bubble-wrap{border-radius:0;border-inline:0}}
:root[data-ui-style="facebook"][data-space-presentation="discussion"] #chat .messages{max-width:720px;padding:12px;gap:14px}
:root[data-ui-style="facebook"][data-space-presentation="discussion"] #chat .bubble-wrap{max-width:100%;width:100%;align-self:stretch;background:var(--social-card);border:1px solid var(--social-line);border-radius:10px;padding:12px}
:root[data-ui-style="facebook"][data-space-presentation="discussion"] #chat .bubble,:root[data-ui-style="facebook"][data-space-presentation="discussion"] #chat .own .bubble{background:transparent;color:var(--social-text);border:0;box-shadow:none;width:100%;max-width:100%;min-width:0;padding:8px 0;border-radius:0}
:root[data-ui-style="facebook"] #chat .media-caption{background:#000a;color:#fff}
:root[data-ui-style="facebook"] #chat .message-footer{font-size:12px;color:var(--social-muted)}