/* Native platform presets intentionally ignore palette, layout and room colors. */
:root[data-ui-style="facebook"]{--social-accent:#0866ff!important;--site-accent:#0866ff!important;--social-bg:#f0f2f5!important;--social-card:#fff!important;--social-text:#1c1e21!important;--social-muted:#65676b!important;--social-line:#e4e6eb!important}
:root[data-ui-style="youtube"]{--social-accent:#c00!important;--site-accent:#c00!important;--social-bg:#fff!important;--social-card:#fff!important;--social-text:#0f0f0f!important;--social-muted:#606060!important;--social-line:#f2f2f2!important}
:root[data-ui-style="facebook"][data-theme="dark"]{--social-bg:#18191a!important;--social-card:#242526!important;--social-text:#e4e6eb!important;--social-muted:#b0b3b8!important;--social-line:#3a3b3c!important}
:root[data-ui-style="youtube"][data-theme="dark"]{--social-bg:#0f0f0f!important;--social-card:#0f0f0f!important;--social-text:#f1f1f1!important;--social-muted:#aaa!important;--social-line:#272727!important}
:root:is([data-ui-style="facebook"],[data-ui-style="youtube"]){--site-rail:var(--social-bg)!important;--site-pane:var(--social-card)!important;--site-chat:var(--social-bg)!important;--site-head:var(--social-card)!important;--site-bubble:var(--social-card)!important;--site-selected:var(--social-line)!important;--site-text:var(--social-text)!important;--ui-line:var(--social-line)!important;--admin-body:var(--social-bg)!important;--admin-head:var(--social-card)!important;--admin-text:var(--social-text)!important;--admin-muted:var(--social-muted)!important;--admin-line:var(--social-line)!important;--admin-accent:var(--social-accent)!important}
:root:is([data-ui-style="facebook"],[data-ui-style="youtube"]) #chat{--room-background:var(--social-bg)!important;--room-bubble:var(--social-card)!important;--room-own-bubble:var(--social-card)!important;--room-text:var(--social-text)!important;background:var(--social-bg);color:var(--social-text)}
:root:is([data-ui-style="facebook"],[data-ui-style="youtube"]) #socialTopbar .social-brand{display:flex;align-items:center;gap:6px}
:root[data-ui-style="youtube"] #socialTopbar .social-brand:before{content:none}
.social-site-logo{font-size:21px;flex:none}
:root:is([data-ui-style="facebook"],[data-ui-style="youtube"]) .modal-box .modal-actions{gap:8px}
:root:is([data-ui-style="facebook"],[data-ui-style="youtube"]) :is(.community-line,.wallet-summary,.storage-list){border-color:var(--social-line);color:var(--social-text)}
:root:is([data-ui-style="facebook"],[data-ui-style="youtube"]) .modal-box :is(p,label,small){color:var(--social-muted)}
:root:is([data-ui-style="facebook"],[data-ui-style="youtube"]) .modal-box :is(h2,h3){color:var(--social-text)}
:root:is([data-ui-style="facebook"],[data-ui-style="youtube"]) #rail .service-balance{background:var(--social-card);border-color:var(--social-line);color:var(--social-text)}
.platform-option-disabled{opacity:.5}
#platformPresentationNote{font-size:13px;line-height:1.5}
/* Posts/comments replace the chat transcript only for public social spaces. */
html[data-native-content="true"] #messageScroll{display:none!important}
html[data-native-content="true"] #chat{overflow-y:auto;min-height:0}
html[data-native-content="true"] #platformContent{flex:1 0 auto;width:100%;max-width:760px;margin:0 auto;padding:16px;box-sizing:border-box}
html[data-native-content="true"] #platformContent[hidden]{display:none!important}
html[data-native-content="true"] .platform-post{background:var(--social-card);border:1px solid var(--social-line);border-radius:10px;margin:0 0 16px;overflow:hidden;color:var(--social-text);box-shadow:0 1px 2px #0001}
html[data-native-content="true"] .platform-post>header{display:flex;align-items:center;gap:10px;padding:12px}
html[data-native-content="true"] .platform-post>header>span{flex:1;min-width:0}
html[data-native-content="true"] .platform-post small{display:block;color:var(--social-muted);font-size:12px}
html[data-native-content="true"] .platform-post>p{padding:0 14px;white-space:pre-wrap;overflow-wrap:anywhere}
html[data-native-content="true"] .platform-post button{background:transparent;border:0;color:inherit;border-radius:6px;padding:8px;cursor:pointer;font-size:14px}
html[data-native-content="true"] .platform-post button:hover{background:var(--social-input)}
html[data-native-content="true"] .platform-post-media{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:2px}
html[data-native-content="true"] .platform-post-media:empty{display:none}
html[data-native-content="true"] .platform-post-media .media-tile{width:100%;max-width:none;min-width:0;margin:0;aspect-ratio:4/3}
html[data-native-content="true"] .platform-post-media img{width:100%;height:100%;object-fit:cover}
html[data-native-content="true"] .platform-post>footer{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-around;border-top:1px solid var(--social-line);margin:10px 12px 0;padding:4px}
html[data-native-content="true"] .platform-thread{padding:12px;border-top:1px solid var(--social-line)}
html[data-native-content="true"] .platform-thread[hidden]{display:none}
html[data-native-content="true"] .platform-comment{box-shadow:none;border:0;background:var(--social-input);margin:0 0 10px}
html[data-native-content="true"] .platform-comment .platform-thread{padding:8px;border-left:2px solid var(--social-line)}
html[data-native-content="true"] .platform-comment-form{display:flex;align-items:flex-end;gap:8px}
html[data-native-content="true"] .platform-comment-form textarea{flex:1;min-width:0;resize:vertical;min-height:40px;max-height:160px;border:1px solid var(--social-line);border-radius:20px;padding:10px 14px;background:var(--social-input);color:var(--social-text);box-sizing:border-box}
html[data-native-content="true"] .platform-sticker{max-width:140px;margin:8px}
html[data-native-content="true"] .composer-wrap{position:static;flex-shrink:0}
html[data-native-content="true"][data-ui-style="facebook"] .composer-wrap{margin:12px auto;width:calc(100% - 24px);max-width:736px;border-radius:10px;border:1px solid var(--social-line)}
html[data-native-content="true"][data-ui-style="youtube"] .platform-post{box-shadow:none;border-radius:0}
html[data-native-content="true"][data-ui-style="youtube"] .platform-comment{background:var(--social-card)}
html[data-native-content="true"][data-ui-style="youtube"] #platformContent{max-width:1000px}
@media(max-width:600px){html[data-native-content="true"] #platformContent{padding:8px 0}html[data-native-content="true"] .platform-post{border-radius:0;border-left:0;border-right:0}html[data-native-content="true"] .platform-post-media{grid-template-columns:repeat(auto-fit,minmax(140px,1fr))}html[data-native-content="true"] .platform-post>footer button{font-size:13px;padding:8px 4px}html[data-native-content="true"] .platform-thread{padding:8px}}

html[data-native-content="true"] #chat>.chat-head,html[data-native-content="true"] #spacePresentationTabs{flex-shrink:0}
html[data-native-content="true"][data-ui-style="youtube"][data-space-presentation="discussion"] #chat{overflow-y:auto}
html[data-native-content="true"] .platform-post-media>.media-image,html[data-native-content="true"] .platform-post-media>.media-video{width:100%;max-width:none;aspect-ratio:4/3;padding:0;border-radius:0;overflow:hidden}

html[data-native-content="true"] .platform-post-media>[data-item-id]>.media-image,html[data-native-content="true"] .platform-post-media>[data-item-id]>.media-video{width:100%;max-width:none;height:100%;aspect-ratio:4/3;padding:0;border-radius:0;overflow:hidden}
html[data-native-content="true"] .platform-post-media>[data-item-id]{min-width:0}
html[data-merged-header="true"] #app{grid-template-rows:auto minmax(0,1fr)}
html[data-merged-header="true"] #socialTopbar.merged-space-header{height:56px;min-height:56px;padding:6px 12px;gap:10px;flex-wrap:nowrap}
html[data-merged-header="true"] #socialTopbar .head-title{flex:1;min-width:0;overflow:hidden;color:var(--social-text)}
html[data-merged-header="true"] #socialTopbar .head-title strong{display:block;font-size:15px;line-height:1.3;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
html[data-merged-header="true"] #socialTopbar .head-title small{display:block;font-size:11px;line-height:1.3;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--social-muted)}
html[data-merged-header="true"] #socialTopbar #avatarHeader{flex:0 0 36px;width:36px;min-width:36px;height:36px;padding:0;border:0;border-radius:50%;background:none}
html[data-merged-header="true"] #socialTopbar #avatarHeader .avatar{width:36px;height:36px;min-width:36px}
html[data-merged-header="true"] #socialTopbar #socialSearchToggle{display:grid;place-items:center;background:none;border:0;color:var(--social-text);flex:0 0 36px;width:36px;min-width:36px;height:40px;padding:0}
html[data-merged-header="true"] #socialTopbar #socialSearchForm{display:none}
html[data-merged-header="true"] #socialTopbar.search-open{height:auto;flex-wrap:wrap}
html[data-merged-header="true"] #socialTopbar.search-open #socialSearchForm{display:flex;order:10;flex:1 0 100%;max-width:none;margin:4px 0 0}
#socialHeaderMore{position:relative;flex:0 0 36px;color:var(--social-text)}
#socialHeaderMore>summary{display:grid;place-items:center;list-style:none;cursor:pointer;width:36px;height:40px;font-size:24px;border-radius:50%}
#socialHeaderMore>summary::-webkit-details-marker{display:none}
#socialHeaderMore>summary:hover{background:var(--social-line)}
#socialTopbar #socialHeaderMore .social-header-actions{position:absolute;right:0;top:44px;width:240px;max-width:calc(100vw - 24px);max-height:calc(100dvh - 90px);overflow-y:auto;overscroll-behavior:contain;padding:6px;border-radius:10px;border:1px solid var(--social-line);background:var(--social-card);box-shadow:0 4px 20px #0003;display:flex;flex-direction:column;gap:2px;z-index:20}
#socialTopbar #socialHeaderMore .social-header-actions>button{display:flex;align-items:center;gap:8px;flex:none;max-width:none;width:100%;min-height:40px;height:auto;padding:10px 12px;border:0;border-radius:6px;background:none;color:var(--social-text);font-size:14px;text-align:left;white-space:normal;letter-spacing:normal}
#socialTopbar #socialHeaderMore .social-header-actions>button:hover{background:var(--social-line)}
html[data-native-content="true"] #platformContentRefresh,html[data-native-content="true"] #platformContentMore{display:block;margin:0 12px 12px auto;padding:8px 12px;border:1px solid var(--social-line);border-radius:18px;background:var(--social-card);color:var(--social-muted);font-size:13px;cursor:pointer}
@media(max-width:600px){html[data-merged-header="true"] #socialTopbar.merged-space-header{padding:6px 8px;gap:6px;height:52px;min-height:52px}html[data-merged-header="true"] #socialTopbar.search-open{height:auto}html[data-merged-header="true"] #socialTopbar .head-title strong{font-size:14px}}

/* Keep the complete platform UI on one palette, including shared legacy tools. */
:root[data-ui-style="facebook"]{--social-input:#f0f2f5;--social-danger:#b42318}
:root[data-ui-style="youtube"]{--social-input:#f2f2f2;--social-danger:#b42318}
:root[data-ui-style="facebook"][data-theme="dark"]{--social-input:#3a3b3c;--social-danger:#ff8a80}
:root[data-ui-style="youtube"][data-theme="dark"]{--social-input:#272727;--social-danger:#ff8a80}
:root:is([data-ui-style="facebook"],[data-ui-style="youtube"]) #chat:before{content:none!important;background-image:none!important}
:root:is([data-ui-style="facebook"],[data-ui-style="youtube"]) #chat .message-scroll{background-image:none!important}
:root:is([data-ui-style="facebook"],[data-ui-style="youtube"]) body{background:var(--social-bg);color:var(--social-text)}
:root:is([data-ui-style="facebook"],[data-ui-style="youtube"]) :is(.composer,.join-bar,.identity,.search,.reply-chip,.attachment-chip){background:var(--social-input);color:var(--social-text);border-color:var(--social-line);box-shadow:none}
:root:is([data-ui-style="facebook"],[data-ui-style="youtube"]) :is(.composer textarea,.search input){color:var(--social-text)}
:root:is([data-ui-style="facebook"],[data-ui-style="youtube"]) :is(.composer textarea,.search input,.platform-comment-form textarea)::placeholder{color:var(--social-muted);opacity:1}
:root:is([data-ui-style="facebook"],[data-ui-style="youtube"]) :is(.composer label,.composer button,.secondary,.join-bar button,.signin-rail){background:var(--social-input);color:var(--social-text);border-color:var(--social-line)}
:root[data-ui-style="facebook"] :is(.primary,.join-bar button,.signin-rail){background:var(--social-accent);color:#fff;border-color:var(--social-accent)}
:root[data-ui-style="facebook"] .composer button[aria-label="Gửi"]{background:var(--social-accent);color:#fff;font-size:14px;width:auto;min-width:52px}
:root[data-ui-style="youtube"] :is(.primary,.join-bar button,.signin-rail){background:var(--social-text);color:var(--social-bg);border-color:var(--social-text);border-radius:22px}
:root[data-ui-style="youtube"] .composer button[aria-label="Gửi"]{background:var(--social-text);color:var(--social-bg);font-size:14px;width:auto;min-width:52px;border-radius:22px}
:root:is([data-ui-style="facebook"],[data-ui-style="youtube"]) :is(.icon,.identity small,.row-meta,.list-foot,.list-foot button,.row-preview){color:var(--social-muted)}
:root:is([data-ui-style="facebook"],[data-ui-style="youtube"]) :is(.icon:hover,.row:hover,.row.selected){background:var(--social-line)}
:root:is([data-ui-style="facebook"],[data-ui-style="youtube"]) :is(#messageMenu,#mediaContextMenu,#spaceContextMenu,.toast){background:var(--social-card);color:var(--social-text);border:1px solid var(--social-line);box-shadow:0 4px 20px #0003}
:root:is([data-ui-style="facebook"],[data-ui-style="youtube"]) :is(#messageMenu,#mediaContextMenu,#spaceContextMenu) button{color:var(--social-text);background:transparent}
:root:is([data-ui-style="facebook"],[data-ui-style="youtube"]) :is(#messageMenu,#mediaContextMenu,#spaceContextMenu) button:hover{background:var(--social-line)}
:root:is([data-ui-style="facebook"],[data-ui-style="youtube"]) .toast.error{color:var(--social-danger)}
html[data-native-content="true"] .platform-post>header .social-profile-avatar{padding:0;align-self:flex-start;line-height:0}
html[data-native-content="true"] .platform-post>header .avatar{width:36px;height:36px;min-width:36px;font-size:14px}
html[data-native-content="true"] .platform-post>header .user-role-badge{width:16px;height:16px;font-size:10px}
html[data-native-content="true"] .platform-post>header strong{font-size:14px;line-height:1.4}
html[data-native-content="true"] .platform-post>p{font-size:15px;line-height:1.5;margin:8px 0 12px}
html[data-native-content="true"] .platform-post>footer{color:var(--social-muted);font-weight:600}
html[data-native-content="true"] .platform-post a{color:var(--social-accent)}
html[data-native-content="true"][data-ui-style="youtube"] .platform-post{border:0;border-bottom:1px solid var(--social-line)}
html[data-native-content="true"][data-ui-style="youtube"] .platform-comment{border:0}
html[data-native-content="true"][data-ui-style="youtube"] .platform-post a{color:#065fd4}
html[data-native-content="true"][data-ui-style="youtube"][data-theme="dark"] .platform-post a{color:#3ea6ff}
html[data-native-content="true"][data-ui-style="youtube"] .platform-comment-form textarea{border-radius:0;border:0;border-bottom:1px solid var(--social-muted);background:transparent;min-height:36px;padding:8px 0;resize:vertical}
html[data-native-content="true"] .platform-comment-form button[type="submit"]{background:var(--social-accent);color:#fff;border-radius:20px;font-weight:600;padding:8px 16px}
html[data-native-content="true"][data-ui-style="youtube"] .platform-comment-form button[type="submit"]{background:var(--social-text);color:var(--social-bg)}

/* Home is the feed, never the old community selector underneath it. */
html[data-ui-style="facebook"] #app.platform-feed-home,html[data-ui-style="youtube"] #app.platform-feed-home{grid-template-columns:220px minmax(0,1fr);grid-template-rows:auto minmax(0,1fr)}
html[data-ui-style="facebook"] #app.platform-feed-home #listPane,html[data-ui-style="youtube"] #app.platform-feed-home #listPane{display:none!important}
html[data-ui-style="facebook"] #app.platform-feed-home #chat,html[data-ui-style="youtube"] #app.platform-feed-home #chat{display:flex!important;grid-column:2;grid-row:2;height:100%;min-height:0;overflow-y:auto}
html[data-ui-style="facebook"] #app.platform-feed-home .social-home,html[data-ui-style="youtube"] #app.platform-feed-home .social-home{width:100%;min-width:0;flex:1 0 auto}
@media(max-width:1100px){html[data-ui-style="facebook"] #app.platform-feed-home,html[data-ui-style="youtube"] #app.platform-feed-home{grid-template-columns:72px minmax(0,1fr)}}
@media(max-width:720px){html[data-ui-style="facebook"] #app.platform-feed-home,html[data-ui-style="youtube"] #app.platform-feed-home{grid-template-columns:minmax(0,1fr)}html[data-ui-style="facebook"] #app.platform-feed-home #chat,html[data-ui-style="youtube"] #app.platform-feed-home #chat{grid-column:1}}