html:root.native-mobile body #overlay[data-panel="news"] #panel-body { padding:0 0 92px; background:var(--chat-bar); }
html:root.native-mobile body #overlay[data-panel="news"] .panel > header { display:none !important; }
html:root.native-mobile body .s4-social-hub { color:var(--chat-ink); background:var(--chat-bar); font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; }
html:root.native-mobile body :is(.s4-social-hub,.s4-social-dialog) { --chat-border:var(--page-line,#e5e7e6); }
html:root.native-mobile body :is(.s4-social-hub,.s4-social-dialog) * { box-sizing:border-box; }
html:root.native-mobile body :is(.s4-social-hub,.s4-social-dialog) button { touch-action:manipulation; -webkit-tap-highlight-color:transparent; color:inherit; font:inherit; cursor:pointer; }
html:root.native-mobile body :is(.s4-social-hub,.s4-social-dialog) button:disabled { opacity:.5; cursor:default; }
html:root.native-mobile body :is(.s4-social-hub,.s4-social-dialog) button:active { filter:brightness(.94); }
html:root.native-mobile body :is(.s4-social-hub,.s4-social-dialog) :focus-visible { outline:2px solid #1675e8; outline-offset:2px; }
html:root.native-mobile body .social-heading { display:flex; align-items:center; justify-content:space-between; padding:18px 16px 10px; background:var(--chat-incoming); }
html:root.native-mobile body .social-heading small { font-size:10px; letter-spacing:.12em; color:var(--chat-secondary); }
html:root.native-mobile body .social-heading h2 { font-size:28px; line-height:1.2; margin:3px 0; font-weight:700; color:var(--chat-ink); }
html:root.native-mobile body .social-heading button { display:grid; place-items:center; width:44px; height:44px; border:0; border-radius:50%; background:var(--chat-bar); }
html:root.native-mobile body :is(.s4-social-hub,.s4-social-dialog) svg { width:22px; height:22px; flex-shrink:0; }
html:root.native-mobile body .social-feed-tools { display:flex; gap:8px; padding:8px 16px; background:var(--chat-incoming); }
html:root.native-mobile body .social-feed-tools label { display:flex; align-items:center; flex:1; min-width:0; gap:10px; padding:0 12px; border-radius:24px; background:var(--chat-bar); }
html:root.native-mobile body .social-feed-tools input { min-width:0; width:100%; border:0; background:transparent; color:var(--chat-ink); height:44px; font-size:16px !important; outline:0; padding:0; }
html:root.native-mobile body .social-feed-tools button { width:44px; border:0; background:transparent; }
html:root.native-mobile body .social-feed-tabs { display:flex; overflow:auto; gap:4px; padding:8px 12px; scrollbar-width:none; background:var(--chat-incoming); }
html:root.native-mobile body .social-feed-tabs button { border:0; border-radius:20px; padding:10px 12px; white-space:nowrap; min-height:44px; background:transparent; font-size:14px; }
html:root.native-mobile body .social-feed-tabs button[aria-pressed="true"] { color:#0866c6; background:#e7f0ff; font-weight:650; }
html:root.native-mobile body .social-composer-launch { display:flex; align-items:center; gap:12px; width:100%; border:0; border-top:1px solid var(--chat-border); background:var(--chat-incoming); padding:16px; margin-bottom:8px; text-align:left; }
html:root.native-mobile body #social-create > span:nth-child(2) { flex:1; padding:12px 16px !important; min-width:0; border:1px solid var(--chat-border) !important; border-radius:24px; background:var(--chat-bar); font-size:16px; }
html:root.native-mobile body #social-create[hidden] { display:none !important; }
html:root.native-mobile body .social-composer-launch > svg { color:#168649; }
html:root.native-mobile body .social-avatar { display:grid; place-items:center; width:44px; height:44px; border-radius:50%; background:#7561b6; color:white; font-size:17px; flex-shrink:0; }
html:root.native-mobile body #social-status { font-size:14px; text-align:center; color:var(--chat-secondary); }
html:root.native-mobile body #social-status:not(:empty) { padding:16px; }
html:root.native-mobile body #social-status button,html:root.native-mobile body #social-more { border:1px solid var(--chat-border); border-radius:12px; background:var(--chat-incoming); padding:12px 18px; min-height:44px; }
html:root.native-mobile body #social-more { width:calc(100% - 32px); margin:8px 16px; }
html:root.native-mobile body .social-post { background:var(--chat-incoming); margin:0 0 8px; padding:0; overflow:hidden; }
html:root.native-mobile body .social-post header { display:flex; align-items:center; gap:10px; padding:14px 16px 8px; }
html:root.native-mobile body .social-post header > div { flex:1; min-width:0; }
html:root.native-mobile body .social-post header strong { display:block; color:var(--chat-ink); font-size:16px; font-weight:650; overflow-wrap:anywhere; }
html:root.native-mobile body .social-post header small { display:block; margin-top:3px; color:var(--chat-secondary); font-size:12px; }
html:root.native-mobile body .social-post header button { width:44px; height:44px; border:0; background:transparent; }
html:root.native-mobile body .social-post-text { font-size:17px; line-height:1.45; padding:8px 16px 16px; margin:0; white-space:pre-wrap; overflow-wrap:anywhere; color:var(--chat-ink); }
html:root.native-mobile body .social-see-more { display:block; color:var(--chat-ink); background:transparent; border:0; min-height:44px; padding:0 16px 12px; font-weight:600; }
html:root.native-mobile body .social-photo { display:block; width:100%; aspect-ratio:4/3; max-height:520px; border:0; border-radius:0; padding:0; background:var(--chat-bar); overflow:hidden; }
html:root.native-mobile body .social-photo img { display:block; width:100%; height:100%; object-fit:contain; }
html:root.native-mobile body .social-post-counts { display:flex; align-items:center; gap:8px; min-height:44px; padding:0 16px; color:var(--chat-secondary); font-size:13px; }
html:root.native-mobile body .social-post-counts > span { flex:1; }
html:root.native-mobile body .social-post-counts button { background:none; border:0; color:var(--chat-secondary); min-height:44px; font-size:13px; }
html:root.native-mobile body .social-post footer { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); margin:0 12px; border-top:1px solid var(--chat-border); }
html:root.native-mobile body .social-post footer button { display:flex; justify-content:center; align-items:center; gap:6px; min-height:48px; font-size:14px; border:0; background:none; color:var(--chat-secondary); }
html:root.native-mobile body .social-post footer button[aria-pressed="true"] { color:#0866c6; font-weight:650; }
html:root.native-mobile body .social-empty { text-align:center; padding:48px 24px; color:var(--chat-secondary); }
html:root.native-mobile body .social-empty h3 { color:var(--chat-ink); font-size:20px; }
html:root.native-mobile body .social-story-link { display:block; color:#0866c6; padding:12px 16px; min-height:44px; }
html:root.native-mobile body .s4-social-dialog { position:fixed; inset:0; z-index:160; padding-top:env(safe-area-inset-top); background:var(--chat-incoming); color:var(--chat-ink); overflow:auto; overscroll-behavior:contain; }
html:root.native-mobile body .s4-social-dialog > section { min-height:100%; }
html:root.native-mobile body .s4-social-dialog header { display:flex; gap:12px; align-items:center; position:sticky; top:0; z-index:1; background:var(--chat-incoming); padding:10px 16px; border-bottom:1px solid var(--chat-border); }
html:root.native-mobile body .s4-social-dialog header h2 { font-size:20px; margin:0; font-weight:650; }
html:root.native-mobile body .s4-social-dialog header button { border:0; background:transparent; display:grid; place-items:center; width:44px; height:44px; }
html:root.native-mobile body .social-dialog-content { padding:20px 16px max(24px,env(safe-area-inset-bottom)); }
html:root.native-mobile body .social-compose-author { display:flex; align-items:center; gap:12px; }
html:root.native-mobile body .social-compose-author strong { color:var(--chat-ink); font-size:17px; }
html:root.native-mobile body .social-compose-author div > span { display:flex; gap:4px; align-items:center; font-size:12px; margin-top:5px; color:var(--chat-secondary); }
html:root.native-mobile body .social-compose-author svg { width:14px; height:14px; }
html:root.native-mobile body .social-audience-note { color:var(--chat-secondary); font-size:13px; line-height:1.45; margin:14px 0; }
html:root.native-mobile body .social-compose-form textarea { width:100%; resize:vertical; min-height:180px; padding:12px 0; border:0; background:var(--chat-incoming); color:var(--chat-ink); font-size:22px !important; line-height:1.4; outline:0; }
html:root.native-mobile body [data-counter] { display:block; text-align:right; color:var(--chat-secondary); font-size:12px; }
html:root.native-mobile body .social-compose-preview { position:relative; margin:16px 0; }
html:root.native-mobile body .social-compose-preview img { width:100%; max-height:280px; object-fit:contain; border-radius:12px; background:var(--chat-bar); }
html:root.native-mobile body .social-compose-preview button { position:absolute; right:8px; top:8px; width:44px; height:44px; border:0; border-radius:50%; color:#182226; background:#fff; }
html:root.native-mobile body .social-add-photo { display:flex; gap:12px; align-items:center; width:100%; border:1px solid var(--chat-border); border-radius:12px; padding:14px; background:none; min-height:52px; }
html:root.native-mobile body .social-add-photo svg { color:#168649; }
html:root.native-mobile body .s4-social-dialog .social-publish { display:block; width:100%; min-height:48px; background:#0866c6 !important; color:#fff !important; border:0; border-radius:10px; margin-top:20px; font-weight:650; }
html:root.native-mobile body .social-error { color:#b32632; font-size:14px; overflow-wrap:anywhere; line-height:1.4; }
html:root.native-mobile body .social-menu button { width:100%; min-height:56px; padding:12px; display:flex; align-items:center; gap:16px; text-align:left; background:none; border:0; border-bottom:1px solid var(--chat-border); font-size:17px; }
html:root.native-mobile body .social-danger { color:#b32632 !important; }
html:root.native-mobile body .social-photo-view { display:block; max-width:100%; max-height:80dvh; margin:auto; }
html:root.native-mobile body .social-comment-list article { display:flex; gap:10px; margin-bottom:16px; }
html:root.native-mobile body .social-comment-list article > div { flex:1; min-width:0; padding:12px; border-radius:16px; background:var(--chat-bar); }
html:root.native-mobile body .social-comment-list strong { color:var(--chat-ink); font-size:14px; }
html:root.native-mobile body .social-comment-list p { white-space:pre-wrap; overflow-wrap:anywhere; margin:6px 0; color:var(--chat-ink); font-size:16px; }
html:root.native-mobile body .social-comment-list small { color:var(--chat-secondary); font-size:12px; }
html:root.native-mobile body .social-comment-list button { display:block; border:0; padding:6px 0; background:none; min-height:44px; color:#b32632; font-size:13px; }
html:root.native-mobile body .social-comment-form { position:sticky; bottom:0; display:flex; align-items:center; gap:8px; padding:12px 0; background:var(--chat-incoming); }
html:root.native-mobile body .social-comment-form input { border:0; border-radius:24px; background:var(--chat-bar); color:var(--chat-ink); min-width:0; flex:1; height:48px; padding:12px 16px; font-size:16px !important; }
html:root.native-mobile body .social-comment-form button { display:grid; place-items:center; border:0; border-radius:50%; background:#0866c6; color:white; width:48px; height:48px; }
html:root.native-mobile body .social-profile-form label { display:block; margin:20px 0; color:var(--chat-ink); font-size:15px; }
html:root.native-mobile body .social-profile-form input,html:root.native-mobile body .social-profile-form textarea { display:block; width:100%; min-height:48px; margin-top:8px; padding:12px; border:1px solid var(--chat-border); border-radius:12px; background:var(--chat-bar); color:var(--chat-ink); font-size:16px !important; }
html:root.native-mobile body .social-profile-form small { color:var(--chat-secondary); font-size:12px; }
html:root.native-mobile body:has(.s4-social-dialog) #app #native-mobile-nav { display:none !important; }
html:root.native-mobile[data-theme="dark"] body .social-error,html:root.native-mobile[data-theme="dark"] body .social-danger,html:root.native-mobile[data-theme="dark"] body .social-comment-list button { color:#ffaab4 !important; }
html:root.native-mobile[data-theme="dark"] body .social-post footer button[aria-pressed="true"],html:root.native-mobile[data-theme="dark"] body .social-story-link { color:#79baff; }
html:root.native-mobile body #social-post-text { font-size:22px !important; }
html:root.native-mobile body #social-profile-status:not(:empty) { padding:16px; text-align:center; font-size:14px; }
/* Keep news, radio and television available without hiding the social feed. */
html:root.native-mobile body .social-live-shortcuts { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; padding:0 12px 12px; }
html:root.native-mobile body .social-live-shortcuts button { display:flex; align-items:center; justify-content:center; gap:6px; min-height:48px; padding:8px; font-size:14px; border-radius:16px; background:var(--chat-incoming); color:var(--chat-ink); border:1px solid var(--chat-border); }
html:root.native-mobile body .social-live-shortcuts button svg { width:20px; height:20px; flex:none; }
html:root.native-mobile body .social-live-shortcuts button[aria-pressed="true"] { color:#0866c6; background:#e7f0ff; }
html:root.native-mobile body #floating-live-player { inset:env(safe-area-inset-top) 0 env(safe-area-inset-bottom); z-index:175; width:100% !important; height:auto !important; min-width:0; max-width:none; max-height:none; border:0; border-radius:0; grid-template-rows:56px minmax(0,1fr); }
html:root.native-mobile body #floating-live-player > header { cursor:default; touch-action:manipulation; }
html:root.native-mobile body #floating-live-player > header button { width:44px; height:44px; }
html:root.native-mobile body #floating-live-player .live-player-resize-handle { display:none; }
html:root.native-mobile body #floating-live-player.minimized { inset:auto 12px calc(88px + env(safe-area-inset-bottom)); height:56px !important; width:calc(100% - 24px) !important; border-radius:18px; grid-template-rows:56px; }
html:root.native-mobile body #floating-live-player :is(.s4-radio-app,.s4-tv-hub) { grid-template-columns:1fr; grid-template-rows:auto minmax(0,1fr); }
html:root.native-mobile body #floating-live-player :is(.s4-radio-app,.s4-tv-hub) > aside { flex-direction:row; padding:8px; overflow-x:auto; border-right:0; }
html:root.native-mobile body #floating-live-player aside > :is(strong,small) { display:none; }
html:root.native-mobile body #floating-live-player aside > button { width:auto; flex:none; min-height:44px; font-size:14px; }
html:root.native-mobile body #floating-live-player :is(input,select) { font-size:16px; min-height:44px; }
html:root.native-mobile body #floating-live-player .radio-station-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
html:root.native-mobile body #floating-live-player :is(.radio-card-play,.tv-channel-rail button) { min-height:64px; }
html:root.native-mobile body #floating-live-player :is(.radio-card-play strong,.tv-channel-rail strong) { font-size:14px; }
html:root.native-mobile body #floating-live-player :is(.radio-card-play small,#tv-live-view > p,.radio-playback-status) { font-size:13px; line-height:1.5; }
html:root.native-mobile body #floating-live-player .radio-playback-status { padding:8px 0; color:#e9edef; }
html:root.native-mobile body #floating-live-player audio { width:100%; }
html:root.native-mobile body #floating-live-player .radio-favorite { opacity:1; width:44px; height:44px; }
html:root.native-mobile body #floating-live-player .radio-favorite svg { width:20px; height:20px; }

/* Keep live shortcuts within the same Social Hub header surface. */
html:root.native-mobile body .s4-social-hub .social-heading { padding:16px 16px 8px; margin:0; gap:12px; }
html:root.native-mobile body .s4-social-hub .social-live-shortcuts { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); align-items:center; gap:10px; margin:0; padding:4px 16px 14px; width:100%; background:var(--chat-incoming); border-bottom:1px solid var(--chat-border); box-sizing:border-box; }
html:root.native-mobile body .s4-social-hub .social-live-shortcuts button { width:100%; min-width:0; height:44px; min-height:44px; padding:8px 12px; margin:0; border-radius:12px; line-height:20px; font-size:14px; background:var(--chat-bar); box-shadow:none; }
html:root.native-mobile body .s4-social-hub .social-live-shortcuts button svg { width:20px; height:20px; display:block; }
