/* =====================================================
   AUTO DARK MODE – ORGANIZATION (GLOBAL)
   Background base: #171d24
   ===================================================== */

html.dark-auto,
html.dark-auto *,
:is(html.dark-auto, body.dark-auto),
:is(html.dark-auto, body.dark-auto) *{
  transition: background-color .25s ease, color .25s ease, border-color .25s ease;
}

/* Base */
html.dark-auto,
:is(html.dark-auto, body.dark-auto){
  background:var(--msb-palette-bg, #171d24) !important;
  color:var(--msb-palette-text, #b1bcce);
  color-scheme: dark;

  /* video */
  --msb-dark-auto-chrome:#b1bcce;
  --studio-line:#394451;
  --studio-text:var(--msb-palette-text, #b1bcce);
  --studio-muted:var(--msb-palette-text-muted, #b1bcce);
  --studio-bg:var(--msb-palette-bg, #171d24);
  --studio-card:var(--msb-palette-surface-2, #2b3137);
  --studio-border:var(--msb-palette-border, rgba(255,255,255,.12));
  --studio-input:var(--msb-palette-input-bg, #1e1f1f);
  background:var(--msb-palette-bg, #171d24);
  color:var(--studio-text);
}

html.dark-auto body{
  background:var(--msb-palette-bg, #171d24) !important;
  color:var(--studio-text) !important;
}

html[data-theme="dark"]:not([data-msb-appearance]) body{
  background-color:var(--msb-palette-bg, #171d24) !important;
  background-image:none !important;
  color:var(--studio-text, #b1bcce) !important;
}

html:not(.dark-auto),
html[data-theme="light"]{
  color-scheme: light;
}

:is(html.dark-auto, body.dark-auto) a:not(.btn):not(.btn-primary):not(.btn-success):not(.ch-btn-primary):not(.gear-detail-open-btn):not(.feed-ig-logo){
  color:var(--msb-palette-link, var(--msb-palette-text, #b1bcce));
}

:is(html.dark-auto, body.dark-auto) a:not(.btn):not(.btn-primary):not(.btn-success):not(.ch-btn-primary):not(.gear-detail-open-btn):not(.feed-ig-logo):hover,
:is(html.dark-auto, body.dark-auto) a:not(.btn):not(.btn-primary):not(.btn-success):not(.ch-btn-primary):not(.gear-detail-open-btn):not(.feed-ig-logo):focus{
  color:var(--msb-palette-link-hover, var(--msb-palette-link, var(--msb-palette-text, #e8edf5)));
}

html.dark-auto:not([data-msb-appearance]) a.gear-detail-open-btn,
html.dark-auto:not([data-msb-appearance]) body.profile-page a.gear-detail-open-btn,
html[data-theme="dark"]:not([data-msb-appearance]) a.gear-detail-open-btn,
html[data-theme="dark"]:not([data-msb-appearance]) body.profile-page a.gear-detail-open-btn,
html.dark-auto:not([data-msb-appearance]) a.btn,
html.dark-auto:not([data-msb-appearance]) a.btn-primary,
html.dark-auto:not([data-msb-appearance]) a.btn-success,
html.dark-auto:not([data-msb-appearance]) a.ch-btn-primary,
html.dark-auto:not([data-msb-appearance]) body.org-app a.btn,
html.dark-auto:not([data-msb-appearance]) body.org-app a.btn-primary,
html.dark-auto:not([data-msb-appearance]) body.org-app a.ch-btn-primary,
html[data-theme="dark"]:not([data-msb-appearance]) a.btn,
html[data-theme="dark"]:not([data-msb-appearance]) a.btn-primary,
html[data-theme="dark"]:not([data-msb-appearance]) body.org-app a.btn-primary{
  background-color:var(--msb-palette-btn-bg, #1d4ed8) !important;
  background-image:none !important;
  border-color:var(--msb-palette-btn-bg, #1d4ed8) !important;
  color:var(--msb-palette-btn-text, #ffffff) !important;
}

html.dark-auto:not([data-msb-appearance]) a.gear-detail-open-btn i,
html.dark-auto:not([data-msb-appearance]) a.gear-detail-open-btn .icon,
html.dark-auto:not([data-msb-appearance]) a.btn-primary i,
html.dark-auto:not([data-msb-appearance]) body.org-app a.btn-primary i,
html[data-theme="dark"]:not([data-msb-appearance]) a.gear-detail-open-btn i,
html[data-theme="dark"]:not([data-msb-appearance]) a.btn-primary i{
  color:var(--msb-palette-btn-text, #ffffff) !important;
}

:is(html.dark-auto, body.dark-auto) small,
:is(html.dark-auto, body.dark-auto) .small,
:is(html.dark-auto, body.dark-auto) .text-muted,
:is(html.dark-auto, body.dark-auto) .tx-gray-500,
:is(html.dark-auto, body.dark-auto) .tx-gray-600,
:is(html.dark-auto, body.dark-auto) .text-secondary{
  color:#b1bcce !important;
}

/* Panels & Layout */
:is(html.dark-auto, body.dark-auto) .sh-pagetitle,
:is(html.dark-auto, body.dark-auto) .ig-card,
:is(html.dark-auto, body.dark-auto) .pv-right,
:is(html.dark-auto, body.dark-auto) .pv-head,
:is(html.dark-auto, body.dark-auto) .pv-body,
:is(html.dark-auto, body.dark-auto) .bestprofile-nav,
:is(html.dark-auto, body.dark-auto) .dropdown-menu,
/* :is(html.dark-auto, body.dark-auto) .sh-logopanel,
:is(html.dark-auto, body.dark-auto) .sh-headpanel, */
:is(html.dark-auto, body.dark-auto) .tt-comments-head,
:is(html.dark-auto, body.dark-auto) .tt-comments-list,
:is(html.dark-auto, body.dark-auto) .post,
:is(html.dark-auto, body.dark-auto) .pv-actions,
:is(html.dark-auto, body.dark-auto) .pv-input,
:is(html.dark-auto, body.dark-auto) .tt-rm-head,
:is(html.dark-auto, body.dark-auto) .ig-details,
:is(html.dark-auto, body.dark-auto) .sh-sideleft-menu,
:is(html.dark-auto, body.dark-auto) .tt-comments-wrap,
:is(html.dark-auto, body.dark-auto) .tt-rm-body,
:is(html.dark-auto, body.dark-auto) .tl-card,
:is(html.dark-auto, body.dark-auto) .c-footer,
:is(html.dark-auto, body.dark-auto) .c-overlay,
:is(html.dark-auto, body.dark-auto) .c-modal,
:is(html.dark-auto, body.dark-auto) .mt-2,
:is(html.dark-auto, body.dark-auto) .chat-card-body,
:is(html.dark-auto, body.dark-auto) .chat-list,
:is(html.dark-auto, body.dark-auto) .chat-topbar,
:is(html.dark-auto, body.dark-auto) .chat-right-col,
:is(html.dark-auto, body.dark-auto) .chat-card,
:is(html.dark-auto, body.dark-auto) .table-pro,
:is(html.dark-auto, body.dark-auto) .pv-pill,
:is(html.dark-auto, body.dark-auto) .chatBox,
:is(html.dark-auto, body.dark-auto) .sidebar-pill,
:is(html.dark-auto, body.dark-auto) .ig-topbar,
:is(html.dark-auto, body.dark-auto) .members-list-wrap,
:is(html.dark-auto, body.dark-auto) .composer-fixed,
:is(html.dark-auto, body.dark-auto) .conv-history,
:is(html.dark-auto, body.dark-auto) .conv-topbar,
:is(html.dark-auto, body.dark-auto) .msg-scroll,
:is(html.dark-auto, body.dark-auto) .right-sidebar-subject,
:is(html.dark-auto, body.dark-auto) .feed-card,
:is(html.dark-auto, body.dark-auto) .sh-pagetitle-left,
:is(html.dark-auto, body.dark-auto) .sh-pagebody,
:is(html.dark-auto, body.dark-auto) .row,
:is(html.dark-auto, body.dark-auto) .row-sm,
:is(html.dark-auto, body.dark-auto) .app-footer,
:is(html.dark-auto, body.dark-auto) .col-lg-4,
:is(html.dark-auto, body.dark-auto) .col-lg-8,
:is(html.dark-auto, body.dark-auto) .col-md-4,
:is(html.dark-auto, body.dark-auto) .hd,
:is(html.dark-auto, body.dark-auto) .bd,
:is(html.dark-auto, body.dark-auto) .app-main,
:is(html.dark-auto, body.dark-auto) .signbox,
:is(html.dark-auto, body.dark-auto) .col-md-8,
:is(html.dark-auto, body.dark-auto) .gear-wrap,
:is(html.dark-auto, body.dark-auto) .gear-shell,
:is(html.dark-auto, body.dark-auto) .gear-sidebar,
:is(html.dark-auto, body.dark-auto) .gear-sidebar-head,
:is(html.dark-auto, body.dark-auto) .gear-main,
:is(html.dark-auto, body.dark-auto) .gear-nav,
:is(html.dark-auto, body.dark-auto) .gear-detail-panel,
:is(html.dark-auto, body.dark-auto) .gear-detail-head,
:is(html.dark-auto, body.dark-auto) .gear-detail-body,
:is(html.dark-auto, body.dark-auto) .gear-detail-empty,
:is(html.dark-auto, body.dark-auto) .gear-search,
:is(html.dark-auto, body.dark-auto) .gear-control,
:is(html.dark-auto, body.dark-auto) .gear-note{
  background:var(--msb-palette-bg, #171d24) !important;
  color:#e6edf3;
}

/* Org product/settings forms — no dark row bands; appearance palette paints the card */
html[data-msb-appearance] body.org-app .card-body .row,
html[data-msb-appearance] body.org-app form .row,
:is(html.dark-auto, body.dark-auto) body.org-app .card-body .row,
:is(html.dark-auto, body.dark-auto) body.org-app form .row {
  background: transparent !important;
  background-color: transparent !important;
  color: inherit !important;
  border-color: transparent !important;
  box-shadow: none !important;
}

:is(html.dark-auto, body.dark-auto) body.org-app .card-body .form-group label,
:is(html.dark-auto, body.dark-auto) body.org-app form .form-group label,
html[data-msb-appearance] body.org-app form .form-group label,
html[data-msb-appearance] body.org-app form label {
  color: var(--msb-palette-text, var(--org-text, #e8edf5)) !important;
}

html[data-msb-appearance] body.org-app .org-surface-page .card-body .row,
html[data-msb-appearance] body.org-app .org-surface-page form .row,
:is(html.dark-auto, body.dark-auto) body.org-app .org-surface-page .card-body .row,
:is(html.dark-auto, body.dark-auto) body.org-app .org-surface-page form .row {
  background: transparent !important;
  background-color: transparent !important;
  color: inherit !important;
  border-color: transparent !important;
  box-shadow: none !important;
}

html[data-msb-appearance] body.org-app .org-surface-page .form-group label,
html[data-msb-appearance] body.org-app .org-surface-page form .form-group label {
  color: var(--msb-palette-text) !important;
}

:is(html.dark-auto, body.dark-auto) .right-sidebar,
:is(html.dark-auto, body.dark-auto) .tt-close,
:is(html.dark-auto, body.dark-auto) .msgPlusBtn,
:is(html.dark-auto, body.dark-auto) .emojiBtn,
:is(html.dark-auto, body.dark-auto) .tt-iconbtn,
:is(html.dark-auto, body.dark-auto) .feed-sidebar,
:is(html.dark-auto, body.dark-auto) .right-sidebar-subject,
:is(html.dark-auto, body.dark-auto) .btn-search,
:is(html.dark-auto, body.dark-auto) .rows-scroll,
:is(html.dark-auto, body.dark-auto) .msg-them-peer{
    background:#171d24 !important;
  color:#e6edf3;
}

/* :is(html.dark-auto, body.dark-auto) .chat-card,
:is(html.dark-auto, body.dark-auto) .chat-card-right{
  background: linear-gradient(180deg, rgb(154 161 175 / 98%), rgba(23, 24, 28, .98)) !important;
  color: white;
} */


:is(html.dark-auto, body.dark-auto) .right-active,
:is(html.dark-auto, body.dark-auto) .active:not(.ig-tab):not(.chat-item):not(.messages-shell-tab):not(.profile-panel){
    background:#171d24 !important;
  color:#e6edf3;
}

/* Profile posts/gallery panels use .active for visibility — keep Appearance Dark canvas */
:is(html.dark-auto, body.dark-auto) .profile-panel.active,
:is(html.dark-auto, body.dark-auto) body.profile-page .profile-panel.active,
:is(html.dark-auto, body.dark-auto) body.profile-page #profilePostsFeed,
:is(html.dark-auto, body.dark-auto) body.profile-page #profilePostsFeed.mf-feed {
  background: var(--msb-palette-bg, #171d24) !important;
  background-color: var(--msb-palette-bg, #171d24) !important;
  color: var(--msb-palette-text, #e6edf3);
}

/* Cards */
:is(html.dark-auto, body.dark-auto) .card,
:is(html.dark-auto, body.dark-auto) .card-body,
:is(html.dark-auto, body.dark-auto) .card-header,
:is(html.dark-auto, body.dark-auto) .card-footer,
:is(html.dark-auto, body.dark-auto) .app-footer,
:is(html.dark-auto, body.dark-auto) .card.bd-0,
:is(html.dark-auto, body.dark-auto) .post,
:is(html.dark-auto, body.dark-auto) .feed-ig-rail{
  background:var(--msb-palette-bg, #171d24) !important;
  color:var(--msb-palette-text, #e6edf3);
  border-color:var(--studio-border) !important;
}

/* Lists */
:is(html.dark-auto, body.dark-auto) .tt-text,
:is(html.dark-auto, body.dark-auto) .h3-txt,
:is(html.dark-auto, body.dark-auto) .pv-likebar,
:is(html.dark-auto, body.dark-auto) .caption-line,
:is(html.dark-auto, body.dark-auto) .name,
:is(html.dark-auto, body.dark-auto) .mf-body,
:is(html.dark-auto, body.dark-auto) .sh-sideleft-menu,
:is(html.dark-auto, body.dark-auto) .nav-link
:is(html.dark-auto, body.dark-auto) .list-group,
:is(html.dark-auto, body.dark-auto) .tt-rm-title,
:is(html.dark-auto, body.dark-auto) .i,
:is(html.dark-auto, body.dark-auto) .ig-title,
:is(html.dark-auto, body.dark-auto) .vrail-ico,
:is(html.dark-auto, body.dark-auto) .list-group-flush,
:is(html.dark-auto, body.dark-auto) .list-group-item{
  background:#171d24 !important;
  color:#e6edf3;
  border-color:var(--studio-border) !important;
}
:is(html.dark-auto, body.dark-auto) .pv-com{
  background:transparent !important;
  color:var(--msb-palette-text, #e6edf3);
  border-color:transparent !important;
}
:is(html.dark-auto, body.dark-auto) .pv-com .nm,
:is(html.dark-auto, body.dark-auto) .pv-com .tx,
:is(html.dark-auto, body.dark-auto) .pv-com .t{
  color:var(--msb-palette-text, #e6edf3) !important;
}
:is(html.dark-auto, body.dark-auto) .pv-com .m{
  color:var(--msb-palette-text-muted, #b1bcce) !important;
}
:is(html.dark-auto, body.dark-auto) .pv-com .bubble{
  background:transparent !important;
  border-color:transparent !important;
}
:is(html.dark-auto, body.dark-auto) .pv-iconbtn{
  background:var(--msb-palette-hover-bg, #1f2630) !important;
  color:var(--msb-palette-text, #e6edf3) !important;
}
:is(html.dark-auto, body.dark-auto) #pvMediaBtn{
  background:transparent !important;
  color:#22c55e !important;
}
:is(html.dark-auto, body.dark-auto) .pv-send{
  background:#7c1730 !important;
  color:#fff !important;
}

:is(html.dark-auto, body.dark-auto) .list-group-item.active{
  background:#2f363d !important;
  color:#ffffff;
}

/* Chat */
:is(html.dark-auto, body.dark-auto) .msg-box{
  background:#171d24 !important;
  border-color:rgba(255,255,255,.08);
}

:is(html.dark-auto, body.dark-auto) .msg-me,
:is(html.dark-auto, body.dark-auto) .cmt{
  background:#30363d !important;
  color:#e6edf3;
}

:is(html.dark-auto, body.dark-auto) .msg-them{
  background:#2b3137 !important;
  color:#e6edf3;
}

/* Inputs */
:is(html.dark-auto, body.dark-auto) input:not([type=checkbox]):not([type=radio]):not([type=file]):not([type=color]):not([type=range]):not([type=hidden]):not([type=submit]):not([type=button]):not([type=image]):not(.gear-color-control),
:is(html.dark-auto, body.dark-auto) .textarea,
:is(html.dark-auto, body.dark-auto) .rm-title,
:is(html.dark-auto, body.dark-auto) textarea,
:is(html.dark-auto, body.dark-auto) select,
:is(html.dark-auto, body.dark-auto) .form-control,
:is(html.dark-auto, body.dark-auto) .custom-select{
  background:var(--msb-palette-input-bg, var(--msb-palette-bg, var(--studio-input))) !important;
  color:var(--msb-palette-text, #f8fafc) !important;
  border-color:var(--msb-palette-border-strong, var(--studio-border)) !important;
}
:is(html.dark-auto, body.dark-auto) .pv-input,
:is(html.dark-auto, body.dark-auto) .pv-actions,
:is(html.dark-auto, body.dark-auto) .pv-right,
:is(html.dark-auto, body.dark-auto) .pv-head,
:is(html.dark-auto, body.dark-auto) .pv-body{
  background:var(--msb-palette-bg, var(--studio-bg, #171d24)) !important;
  background-color:var(--msb-palette-bg, var(--studio-bg, #171d24)) !important;
  color:var(--msb-palette-text, #f8fafc) !important;
  border-color:var(--msb-palette-border, var(--studio-border)) !important;
}
:is(html.dark-auto, body.dark-auto) .pv-modal,
:is(html.dark-auto, body.dark-auto) .pv-left,
:is(html.dark-auto, body.dark-auto) .pv-media{
  background:transparent !important;
  background-color:transparent !important;
  background-image:none !important;
}
:is(html.dark-auto, body.dark-auto) .pv-input input{
  background:var(--msb-palette-input-bg, var(--msb-palette-bg, var(--studio-input))) !important;
  color:var(--msb-palette-text, #f8fafc) !important;
  border-color:var(--msb-palette-border-strong, var(--studio-border)) !important;
}

:is(html.dark-auto, body.dark-auto) input::placeholder,
:is(html.dark-auto, body.dark-auto) textarea::placeholder,
:is(html.dark-auto, body.dark-auto) .form-control::placeholder{
  color:#94a3b8 !important;
}

:is(html.dark-auto, body.dark-auto) hr,
:is(html.dark-auto, body.dark-auto) .dropdown-divider,
:is(html.dark-auto, body.dark-auto) .border,
:is(html.dark-auto, body.dark-auto) [class*="border-"],
:is(html.dark-auto, body.dark-auto) table th,
:is(html.dark-auto, body.dark-auto) table td,
:is(html.dark-auto, body.dark-auto) .modal-content,
:is(html.dark-auto, body.dark-auto) .dropdown-menu,
:is(html.dark-auto, body.dark-auto) .nav-tabs,
:is(html.dark-auto, body.dark-auto) .nav-tabs .nav-link,
:is(html.dark-auto, body.dark-auto) .table,
:is(html.dark-auto, body.dark-auto) .table th,
:is(html.dark-auto, body.dark-auto) .table td{
  border-color:var(--studio-border) !important;
}

html.dark-auto:not([data-msb-appearance]) .btn-light,
html.dark-auto:not([data-msb-appearance]) .btn-white,
html.dark-auto:not([data-msb-appearance]) .btn-outline-secondary,
html[data-theme="dark"]:not([data-msb-appearance]) .btn-light,
html[data-theme="dark"]:not([data-msb-appearance]) .btn-white,
html[data-theme="dark"]:not([data-msb-appearance]) .btn-outline-secondary {
  background: var(--msb-palette-surface-2, #30363d) !important;
  color: var(--msb-palette-text, #f8fafc) !important;
  border-color: var(--msb-palette-border-strong, var(--studio-border, rgba(255,255,255,.12))) !important;
}

:is(html.dark-auto, body.dark-auto) .btn-link{
  color:#93c5fd !important;
}

:is(html.dark-auto, body.dark-auto) .badge-light{
  background:#30363d !important;
  color:#f8fafc !important;
}
:is(html.dark-auto, body.dark-auto) .rm-modal,
:is(html.dark-auto, body.dark-auto) .rm-content,
:is(html.dark-auto, body.dark-auto) .rm-body,
:is(html.dark-auto, body.dark-auto) .rm-section,
:is(html.dark-auto, body.dark-auto) .rm-footer,
:is(html.dark-auto, body.dark-auto) .input-group,
:is(html.dark-auto, body.dark-auto)  .txt,
:is(html.dark-auto, body.dark-auto) .input-group-btn{
  background:var(--msb-palette-bg, #131d25) !important;
  color:var(--msb-palette-text, #e6edf3) !important;
  border-color:var(--msb-palette-border, rgba(255,255,255,.12));
}

:is(html.dark-auto, body.dark-auto) input::placeholder,
:is(html.dark-auto, body.dark-auto) .pv-meta,
:is(html.dark-auto, body.dark-auto) .peerSub,
:is(html.dark-auto, body.dark-auto) .chat-left-title,
:is(html.dark-auto, body.dark-auto) .chat-left-head,
:is(html.dark-auto, body.dark-auto) .chat-filter-tab,
:is(html.dark-auto, body.dark-auto) .pv-cap-short,
:is(html.dark-auto, body.dark-auto) .m,
:is(html.dark-auto, body.dark-auto) .pv-cap-desc,
:is(html.dark-auto, body.dark-auto) .card-title,
:is(html.dark-auto, body.dark-auto) .chatLastMsg,
:is(html.dark-auto, body.dark-auto) textarea::placeholder{
  color:#9aa4ad;
}

/* Icons */
:is(html.dark-auto, body.dark-auto) .sh-pagetitle-icon,
:is(html.dark-auto, body.dark-auto) .pv-cap-title,
:is(html.dark-auto, body.dark-auto) .t,
:is(html.dark-auto, body.dark-auto) .icon,
:is(html.dark-auto, body.dark-auto) .ion-ios-chatbubble{
  color:#e6edf3 !important;
}

/* Buttons */
html.dark-auto:not([data-msb-appearance]) .btn,
html.dark-auto:not([data-msb-appearance]) button.btn,
html.dark-auto:not([data-msb-appearance]) .ig-btn,
html.dark-auto:not([data-msb-appearance]) .iconbtn,
html[data-theme="dark"]:not([data-msb-appearance]) .btn,
html[data-theme="dark"]:not([data-msb-appearance]) button.btn,
html[data-theme="dark"]:not([data-msb-appearance]) .ig-btn {
  background: var(--msb-palette-surface-2, var(--msb-palette-hover-bg, #30363d)) !important;
  color: var(--msb-palette-text, #e6edf3) !important;
  border-color: var(--msb-palette-border-strong, rgba(255,255,255,.12)) !important;
}

html.dark-auto:not([data-msb-appearance]) .btn-primary,
html.dark-auto:not([data-msb-appearance]) button.btn-primary,
html.dark-auto:not([data-msb-appearance]) a.btn-primary,
html.dark-auto:not([data-msb-appearance]) .btn-success,
html.dark-auto:not([data-msb-appearance]) .ch-btn-primary,
html[data-theme="dark"]:not([data-msb-appearance]) .btn-primary,
html[data-theme="dark"]:not([data-msb-appearance]) button.btn-primary,
html[data-theme="dark"]:not([data-msb-appearance]) a.btn-primary {
  background: var(--msb-palette-btn-bg, #1d4ed8) !important;
  border-color: var(--msb-palette-btn-bg, #1d4ed8) !important;
  color: var(--msb-palette-btn-text, #ffffff) !important;
}

:is(html.dark-auto, body.dark-auto) .c,
:is(html.dark-auto, body.dark-auto) .composer,
:is(html.dark-auto, body.dark-auto) .button {
  background:var(--msb-palette-surface-2, #30363d);
  color:var(--msb-palette-text, #e6edf3);
  border-color:var(--msb-palette-border-strong, rgba(255,255,255,.12));
}


/* video_live */
:is(html.dark-auto, body.dark-auto) .live-page,
:is(html.dark-auto, body.dark-auto) .studio-viewport,
:is(html.dark-auto, body.dark-auto) .studio-shell,
:is(html.dark-auto, body.dark-auto) .studio-column{
  background:#171d24 !important;
  color:var(--studio-text);
}
:is(html.dark-auto, body.dark-auto) .studio-box,
:is(html.dark-auto, body.dark-auto) .studio-info-card,
:is(html.dark-auto, body.dark-auto) .studio-source,
:is(html.dark-auto, body.dark-auto) .live-device-card,
:is(html.dark-auto, body.dark-auto) .studio-toggle-row,
:is(html.dark-auto, body.dark-auto) .live-history-summary,
:is(html.dark-auto, body.dark-auto) .history-modal-dialog,
:is(html.dark-auto, body.dark-auto) .history-row,
:is(html.dark-auto, body.dark-auto) .live-stat,
:is(html.dark-auto, body.dark-auto) .live-stream-key,
:is(html.dark-auto, body.dark-auto) .live-install code,
:is(html.dark-auto, body.dark-auto) .live-modal-side,
:is(html.dark-auto, body.dark-auto) .live-modal-head,
:is(html.dark-auto, body.dark-auto) .live-modal-comments,
:is(html.dark-auto, body.dark-auto) .live-modal-compose,
:is(html.dark-auto, body.dark-auto) .live-confirm-card{
  background:#2b3137 !important;
  color:#e6edf3 !important;
  border-color:#495463 !important;
}
:is(html.dark-auto, body.dark-auto) .history-modal-body,
/* :is(html.dark-auto, body.dark-auto) .live-modal-dialog{
  background:#171d24 !important;
  color:#e6edf3 !important;
} */
:is(html.dark-auto, body.dark-auto) .studio-info-card p,
:is(html.dark-auto, body.dark-auto) .studio-info-card .studio-panel-sub,
:is(html.dark-auto, body.dark-auto) .studio-subtitle,
:is(html.dark-auto, body.dark-auto) .studio-controls-copy,
:is(html.dark-auto, body.dark-auto) .studio-toggle-note,
:is(html.dark-auto, body.dark-auto) .live-list-meta,
:is(html.dark-auto, body.dark-auto) .history-modal-head p,
:is(html.dark-auto, body.dark-auto) .history-row-meta,
:is(html.dark-auto, body.dark-auto) .live-stat-label,
:is(html.dark-auto, body.dark-auto) .live-install,
:is(html.dark-auto, body.dark-auto) .live-modal-host p,
:is(html.dark-auto, body.dark-auto) .live-modal-stats,
:is(html.dark-auto, body.dark-auto) .live-modal-empty,
:is(html.dark-auto, body.dark-auto) .live-modal-compose-label{
  color:#9aa4ad !important;
}
:is(html.dark-auto, body.dark-auto) .studio-info-card strong,
:is(html.dark-auto, body.dark-auto) .live-list-title,
:is(html.dark-auto, body.dark-auto) .history-modal-head h3,
:is(html.dark-auto, body.dark-auto) .history-row-title,
:is(html.dark-auto, body.dark-auto) .live-stat-value,
:is(html.dark-auto, body.dark-auto) .live-modal-host strong,
:is(html.dark-auto, body.dark-auto) .live-modal-comment strong,
:is(html.dark-auto, body.dark-auto) .live-modal-comment p{
  color:#e6edf3 !important;
}
:is(html.dark-auto, body.dark-auto) .live-page h1,
:is(html.dark-auto, body.dark-auto) .live-page h2,
:is(html.dark-auto, body.dark-auto) .live-page h3,
:is(html.dark-auto, body.dark-auto) .studio-title,
:is(html.dark-auto, body.dark-auto) .live-placeholder-copy h2,
:is(html.dark-auto, body.dark-auto) .live-confirm-card h3{
  color:#f3f5f7 !important;
}
:is(html.dark-auto, body.dark-auto) .setup-card-title,
:is(html.dark-auto, body.dark-auto) .setup-step-name,
:is(html.dark-auto, body.dark-auto) .studio-source-head,
:is(html.dark-auto, body.dark-auto) .studio-video-label,
:is(html.dark-auto, body.dark-auto) .studio-controls-head,
:is(html.dark-auto, body.dark-auto) .studio-field label,
:is(html.dark-auto, body.dark-auto) .studio-off-text,
:is(html.dark-auto, body.dark-auto) .studio-camera-warning,
:is(html.dark-auto, body.dark-auto) .live-camera-status strong,
:is(html.dark-auto, body.dark-auto) .live-panel-camera-status strong{
  color:#f3f5f7 !important;
}
:is(html.dark-auto, body.dark-auto) .studio-inline-icons,
:is(html.dark-auto, body.dark-auto) .live-device-icon,
:is(html.dark-auto, body.dark-auto) .live-device-toggle,
:is(html.dark-auto, body.dark-auto) .history-modal-close{
  color:#e6edf3 !important;
}
:is(html.dark-auto, body.dark-auto) .studio-input,
:is(html.dark-auto, body.dark-auto) .studio-select,
:is(html.dark-auto, body.dark-auto) .studio-textarea,
:is(html.dark-auto, body.dark-auto) .live-modal-compose textarea{
  background:#1f2428 !important;
  color:#e6edf3 !important;
  border:1px solid #4f5b69 !important;
}
:is(html.dark-auto, body.dark-auto) .studio-input::placeholder,
:is(html.dark-auto, body.dark-auto) .studio-textarea::placeholder,
:is(html.dark-auto, body.dark-auto) .live-modal-compose textarea::placeholder{
  color:#9aa4ad !important;
}
:is(html.dark-auto, body.dark-auto) input[type="date"]::-webkit-calendar-picker-indicator,
:is(html.dark-auto, body.dark-auto) input[type="datetime-local"]::-webkit-calendar-picker-indicator,
:is(html.dark-auto, body.dark-auto) .studio-input[type="date"]::-webkit-calendar-picker-indicator,
:is(html.dark-auto, body.dark-auto) .studio-input[type="datetime-local"]::-webkit-calendar-picker-indicator{
  filter:invert(1) brightness(1.2);
  opacity:1;
}
:is(html.dark-auto, body.dark-auto) .studio-select{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%239aa4ad' d='M1 1l5 5 5-5'/%3E%3C/svg%3E") !important;
  background-position:calc(100% - 16px) 50% !important;
  background-size:12px 8px !important;
}
:is(html.dark-auto, body.dark-auto) .live-btn,
:is(html.dark-auto, body.dark-auto) .live-history-trigger,
:is(html.dark-auto, body.dark-auto) .history-row-delete,
:is(html.dark-auto, body.dark-auto) .history-modal-close,
:is(html.dark-auto, body.dark-auto) .live-confirm-btn{
  border-color:#4f5b69 !important;
  background:#30363d !important;
  color:#e6edf3 !important;
}
:is(html.dark-auto, body.dark-auto) .live-reaction-btn,
:is(html.dark-auto, body.dark-auto) .live-modal-reaction-btn{
  background:transparent !important;
  border-color:transparent !important;
  box-shadow:none !important;
  color:#e6edf3 !important;
}
:is(html.dark-auto, body.dark-auto) .live-btn.primary,
:is(html.dark-auto, body.dark-auto) .live-btn.secondary,
:is(html.dark-auto, body.dark-auto) .live-modal-send,
:is(html.dark-auto, body.dark-auto) .live-modal-finish,
:is(html.dark-auto, body.dark-auto) .live-confirm-btn.primary{
  color:#fff !important;
}
:is(html.dark-auto, body.dark-auto) .live-list-item{
  background:#2b3137 !important;
  border-color:#495463 !important;
  color:#e6edf3 !important;
}
:is(html.dark-auto, body.dark-auto) .live-list-item.active,
:is(html.dark-auto, body.dark-auto) .history-row:hover{
  background:#30363d !important;
  border-color:#4f6b8a !important;
}
:is(html.dark-auto, body.dark-auto) .history-chip,
:is(html.dark-auto, body.dark-auto) .live-modal-visibility{
  background:#30363d !important;
  color:#d0d7de !important;
  border-color:#495463 !important;
}
:is(html.dark-auto, body.dark-auto) .live-stream-key code{
  color:#8ab4ff !important;
}
:is(html.dark-auto, body.dark-auto) .studio-label .dot{
  box-shadow:0 0 0 6px rgba(123,211,137,.12);
}
:is(html.dark-auto, body.dark-auto) .studio-label span[style],
:is(html.dark-auto, body.dark-auto) .studio-source div[style]{
  color:#e6edf3 !important;
}
:is(html.dark-auto, body.dark-auto) .studio-camera-warning,
:is(html.dark-auto, body.dark-auto) .studio-submit-warning,
:is(html.dark-auto, body.dark-auto) .live-host-alert{
  background:#332b1f !important;
  border-color:#7c5b2b !important;
  color:#f3d9a2 !important;
}
:is(html.dark-auto, body.dark-auto) .live-modal-dialog{
  background:#171d24 !important;
  border-color:#4f5b69 !important;
}
:is(html.dark-auto, body.dark-auto) .live-page,
:is(html.dark-auto, body.dark-auto) .live-page *,
:is(html.dark-auto, body.dark-auto) .live-modal,
:is(html.dark-auto, body.dark-auto) .live-modal *{
  transition:none !important;
}
:is(html.dark-auto, body.dark-auto) .live-modal-stage,
:is(html.dark-auto, body.dark-auto) .live-modal-video,
:is(html.dark-auto, body.dark-auto) .live-modal-fallback{
  background:#101010 !important;
}
:is(html.dark-auto, body.dark-auto) .live-modal-badge{
  background:rgba(17,17,17,.58) !important;
  border-color:transparent !important;
  box-shadow:none !important;
}
:is(html.dark-auto, body.dark-auto) .live-modal-badge.live{
  background:#ff4d4f !important;
}
:is(html.dark-auto, body.dark-auto) .live-modal-reactions{
  background:transparent !important;
}
:is(html.dark-auto, body.dark-auto) .live-reaction-btn,
:is(html.dark-auto, body.dark-auto) .live-modal-reaction-btn,
:is(html.dark-auto, body.dark-auto) .live-reaction-icon,
:is(html.dark-auto, body.dark-auto) .live-modal-reaction-icon{
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
}
:is(html.dark-auto, body.dark-auto) .live-reaction-btn:hover,
:is(html.dark-auto, body.dark-auto) .live-modal-reaction-btn:hover,
:is(html.dark-auto, body.dark-auto) .live-reaction-btn:focus,
:is(html.dark-auto, body.dark-auto) .live-modal-reaction-btn:focus{
  background:transparent !important;
  box-shadow:none !important;
  outline:none;
}
:is(html.dark-auto, body.dark-auto) .live-reaction-btn [data-role="count"],
:is(html.dark-auto, body.dark-auto) .live-modal-reaction-btn [data-role="count"]{
  color:#e6edf3 !important;
}
:is(html.dark-auto, body.dark-auto) .live-reaction-btn.active [data-role="count"],
:is(html.dark-auto, body.dark-auto) .live-modal-reaction-btn.active [data-role="count"]{
  color:#ffffff !important;
}




/* Scrollbars */
:is(html.dark-auto, body.dark-auto) ::-webkit-scrollbar{
  width:8px;
}
:is(html.dark-auto, body.dark-auto) ::-webkit-scrollbar-thumb{
  background:#3b4046;
  border-radius:6px;
}
:is(html.dark-auto, body.dark-auto) ::-webkit-scrollbar-track{
  background:#171d24;
}
:is(html.dark-auto, body.dark-auto) .pv-body,
:is(html.dark-auto, body.dark-auto) #pvOverlay .pv-body,
:is(html.dark-auto, body.dark-auto) .tt-rm-body,
:is(html.dark-auto, body.dark-auto) .tt-comments-list{
  scrollbar-width:thin !important;
  scrollbar-color:rgba(255,255,255,.35) transparent !important;
}
:is(html.dark-auto, body.dark-auto) #pvOverlay .pv-body::-webkit-scrollbar,
:is(html.dark-auto, body.dark-auto) .pv-body::-webkit-scrollbar,
:is(html.dark-auto, body.dark-auto) .tt-rm-body::-webkit-scrollbar,
:is(html.dark-auto, body.dark-auto) .tt-comments-list::-webkit-scrollbar{
  width:2px !important;
  height:2px !important;
}
:is(html.dark-auto, body.dark-auto) #pvOverlay .pv-body::-webkit-scrollbar-thumb,
:is(html.dark-auto, body.dark-auto) .pv-body::-webkit-scrollbar-thumb,
:is(html.dark-auto, body.dark-auto) .tt-rm-body::-webkit-scrollbar-thumb,
:is(html.dark-auto, body.dark-auto) .tt-comments-list::-webkit-scrollbar-thumb{
  background:rgba(255,255,255,.35) !important;
  border-radius:999px;
  border:0 !important;
}
:is(html.dark-auto, body.dark-auto) #pvOverlay .pv-body::-webkit-scrollbar-track,
:is(html.dark-auto, body.dark-auto) .pv-body::-webkit-scrollbar-track,
:is(html.dark-auto, body.dark-auto) .tt-rm-body::-webkit-scrollbar-track,
:is(html.dark-auto, body.dark-auto) .tt-comments-list::-webkit-scrollbar-track{
  background:transparent !important;
}

:is(html.dark-auto, body.dark-auto) .stat-pill{ background:#0b1220; border-color:#334155; box-shadow:none; }
:is(html.dark-auto, body.dark-auto) .mf-card,
:is(html.dark-auto, body.dark-auto) .mf-feed,
:is(html.dark-auto, body.dark-auto) #profilePostsFeed,
:is(html.dark-auto, body.dark-auto) #profilePostsFeed.mf-feed{
  background: var(--msb-palette-bg, #171d24) !important;
  background-color: var(--msb-palette-bg, #171d24) !important;
  color: var(--msb-palette-text, #e6edf3);
}
/* Link preview must follow Appearance / Progress / Dark auto (not stay #fff) */
:is(html.dark-auto, body.dark-auto) .mf-link-preview,
:is(html.dark-auto, body.dark-auto) .msb-link-preview-card,
:is(html.dark-auto, body.dark-auto) .mf-link-preview-side,
:is(html.dark-auto, body.dark-auto) .msb-link-preview-side,
:is(html.dark-auto, body.dark-auto) .mf-link-preview-body,
:is(html.dark-auto, body.dark-auto) .msb-link-preview-body,
:is(html.dark-auto, body.dark-auto) #profilePostsFeed .mf-link-preview,
:is(html.dark-auto, body.dark-auto) #profilePostsFeed .mf-link-preview-side,
:is(html.dark-auto, body.dark-auto) #profilePostsFeed .mf-link-preview-body{
  background: var(--msb-palette-bg, #171d24) !important;
  background-color: var(--msb-palette-bg, #171d24) !important;
  color: var(--msb-palette-text, #e6edf3) !important;
  box-shadow: none !important;
}
:is(html.dark-auto, body.dark-auto) .mf-link-preview,
:is(html.dark-auto, body.dark-auto) .msb-link-preview-card,
:is(html.dark-auto, body.dark-auto) #profilePostsFeed .mf-link-preview{
  border-color: var(--msb-palette-border-strong, var(--msb-palette-border, rgba(255,255,255,.12))) !important;
}
:is(html.dark-auto, body.dark-auto) .mf-link-preview-media.is-logo,
:is(html.dark-auto, body.dark-auto) .mf-link-preview.has-logo .mf-link-preview-media,
:is(html.dark-auto, body.dark-auto) .msb-link-preview-media.is-logo,
:is(html.dark-auto, body.dark-auto) #profilePostsFeed .mf-link-preview-media.is-logo,
:is(html.dark-auto, body.dark-auto) #profilePostsFeed .mf-link-preview.has-logo .mf-link-preview-media{
  /* Keep logo tile light so brand marks stay readable (Profile Posts design) */
  background:#fff !important;
  background-image:none !important;
}
:is(html.dark-auto, body.dark-auto) .mf-link-preview-host,
:is(html.dark-auto, body.dark-auto) .mf-link-preview-info,
:is(html.dark-auto, body.dark-auto) .mf-link-preview-desc,
:is(html.dark-auto, body.dark-auto) .msb-link-preview-host,
:is(html.dark-auto, body.dark-auto) .msb-link-preview-info,
:is(html.dark-auto, body.dark-auto) .msb-link-preview-desc,
:is(html.dark-auto, body.dark-auto) #profilePostsFeed .mf-link-preview-host,
:is(html.dark-auto, body.dark-auto) #profilePostsFeed .mf-link-preview-info,
:is(html.dark-auto, body.dark-auto) #profilePostsFeed .mf-link-preview-desc{
  color: var(--msb-palette-text-muted, #b1bcce) !important;
}
:is(html.dark-auto, body.dark-auto) .mf-link-preview-title,
:is(html.dark-auto, body.dark-auto) .msb-link-preview-title,
:is(html.dark-auto, body.dark-auto) #profilePostsFeed .mf-link-preview-title{
  color: var(--msb-palette-text, #eef4ff) !important;
}
:is(html.dark-auto, body.dark-auto) .mf-link-preview-cta,
:is(html.dark-auto, body.dark-auto) .msb-link-preview-cta,
:is(html.dark-auto, body.dark-auto) #profilePostsFeed .mf-link-preview-cta{
  background: var(--msb-palette-hover-bg, var(--msb-palette-surface-2, #222a33)) !important;
  color: var(--msb-palette-text, #eef4ff) !important;
  border-top-color: var(--msb-palette-border-strong, rgba(255,255,255,.12)) !important;
}
:is(html.dark-auto, body.dark-auto) .stat-pill .num{ color:#f3f4f6; }
:is(html.dark-auto, body.dark-auto) .stat-pill .lbl{ color:#cbd5e1; }
:is(html.dark-auto, body.dark-auto) .stat-pill .sub{ color:#94a3b8; }
:is(html.dark-auto, body.dark-auto) .stat-pill .icon{ background:#111827; color:#60a5fa; }


/* html video */
/* video_live */
html.dark-auto .live-page,
html.dark-auto .studio-viewport,
html.dark-auto .studio-shell,
html.dark-auto .studio-column{
  background:#171d24 !important;
  color:var(--studio-text);
}
html.dark-auto .studio-box,
html.dark-auto .studio-info-card,
html.dark-auto .studio-source,
html.dark-auto .live-device-card,
html.dark-auto .studio-toggle-row,
html.dark-auto .live-history-summary,
html.dark-auto .history-modal-dialog,
html.dark-auto .history-row,
html.dark-auto .live-stat,
html.dark-auto .live-stream-key,
html.dark-auto .live-install code,
html.dark-auto .live-modal-side,
html.dark-auto .live-modal-head,
html.dark-auto .live-modal-comments,
html.dark-auto .live-modal-compose,
html.dark-auto .live-confirm-card{
  background:#2b3137 !important;
  color:#e6edf3 !important;
  border-color:#495463 !important;
}
html.dark-auto .history-modal-body,
/* html.dark-auto .live-modal-dialog{
  background:#171d24 !important;
  color:#e6edf3 !important;
} */
html.dark-auto .studio-info-card p,
html.dark-auto .studio-info-card .studio-panel-sub,
html.dark-auto .studio-subtitle,
html.dark-auto .studio-controls-copy,
html.dark-auto .studio-toggle-note,
html.dark-auto .live-list-meta,
html.dark-auto .history-modal-head p,
html.dark-auto .history-row-meta,
html.dark-auto .live-stat-label,
html.dark-auto .live-install,
html.dark-auto .live-modal-host p,
html.dark-auto .live-modal-stats,
html.dark-auto .live-modal-empty,
html.dark-auto .live-modal-compose-label{
  color:#9aa4ad !important;
}
html.dark-auto .studio-info-card strong,
html.dark-auto .live-list-title,
html.dark-auto .history-modal-head h3,
html.dark-auto .history-row-title,
html.dark-auto .live-stat-value,
html.dark-auto .live-modal-host strong,
html.dark-auto .live-modal-comment strong,
html.dark-auto .live-modal-comment p{
  color:#e6edf3 !important;
}
html.dark-auto .live-page h1,
html.dark-auto .live-page h2,
html.dark-auto .live-page h3,
html.dark-auto .studio-title,
html.dark-auto .live-placeholder-copy h2,
html.dark-auto .live-confirm-card h3{
  color:#f3f5f7 !important;
}
html.dark-auto .setup-card-title,
html.dark-auto .setup-step-name,
html.dark-auto .studio-source-head,
html.dark-auto .studio-video-label,
html.dark-auto .studio-controls-head,
html.dark-auto .studio-field label,
html.dark-auto .studio-off-text,
html.dark-auto .studio-camera-warning,
html.dark-auto .live-camera-status strong,
html.dark-auto .live-panel-camera-status strong{
  color:#f3f5f7 !important;
}
html.dark-auto .studio-inline-icons,
html.dark-auto .live-device-icon,
html.dark-auto .live-device-toggle,
html.dark-auto .history-modal-close{
  color:#e6edf3 !important;
}
html.dark-auto .studio-input,
html.dark-auto .studio-select,
html.dark-auto .studio-textarea,
html.dark-auto .live-modal-compose textarea{
  background:#1f2428 !important;
  color:#e6edf3 !important;
  border:1px solid #4f5b69 !important;
}
html.dark-auto .studio-input::placeholder,
html.dark-auto .studio-textarea::placeholder,
html.dark-auto .live-modal-compose textarea::placeholder{
  color:#9aa4ad !important;
}
html.dark-auto input[type="date"]::-webkit-calendar-picker-indicator,
html.dark-auto input[type="datetime-local"]::-webkit-calendar-picker-indicator,
html.dark-auto .studio-input[type="date"]::-webkit-calendar-picker-indicator,
html.dark-auto .studio-input[type="datetime-local"]::-webkit-calendar-picker-indicator{
  filter:invert(1) brightness(1.2);
  opacity:1;
}
html.dark-auto .studio-select{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%239aa4ad' d='M1 1l5 5 5-5'/%3E%3C/svg%3E") !important;
  background-position:calc(100% - 16px) 50% !important;
  background-size:12px 8px !important;
}
html.dark-auto .live-btn,
html.dark-auto .live-history-trigger,
html.dark-auto .history-row-delete,
html.dark-auto .history-modal-close,
html.dark-auto .live-confirm-btn{
  border-color:#4f5b69 !important;
  background:#30363d !important;
  color:#e6edf3 !important;
}
html.dark-auto .live-reaction-btn,
html.dark-auto .live-modal-reaction-btn{
  background:transparent !important;
  border-color:transparent !important;
  box-shadow:none !important;
  color:#e6edf3 !important;
}
html.dark-auto .live-btn.primary,
html.dark-auto .live-btn.secondary,
html.dark-auto .live-modal-send,
html.dark-auto .live-modal-finish,
html.dark-auto .live-confirm-btn.primary{
  color:#fff !important;
}
html.dark-auto .live-list-item{
  background:#2b3137 !important;
  border-color:#495463 !important;
  color:#e6edf3 !important;
}
html.dark-auto .live-list-item.active,
html.dark-auto .history-row:hover{
  background:#30363d !important;
  border-color:#4f6b8a !important;
}
html.dark-auto .history-chip,
html.dark-auto .live-modal-visibility{
  background:#30363d !important;
  color:#d0d7de !important;
  border-color:#495463 !important;
}
html.dark-auto .live-stream-key code{
  color:#8ab4ff !important;
}
html.dark-auto .studio-label .dot{
  box-shadow:0 0 0 6px rgba(123,211,137,.12);
}
html.dark-auto .studio-label span[style],
html.dark-auto .studio-source div[style]{
  color:#e6edf3 !important;
}
html.dark-auto .studio-camera-warning,
html.dark-auto .studio-submit-warning,
html.dark-auto .live-host-alert{
  background:#332b1f !important;
  border-color:#7c5b2b !important;
  color:#f3d9a2 !important;
}
html.dark-auto .live-modal-dialog{
  background:#171d24 !important;
  border-color:#4f5b69 !important;
}
html.dark-auto .live-page,
html.dark-auto .live-page *,
html.dark-auto .live-modal,
html.dark-auto .live-modal *{
  transition:none !important;
}
html.dark-auto .live-modal-stage,
html.dark-auto .live-modal-video,
html.dark-auto .live-modal-fallback{
  background:#101010 !important;
}
html.dark-auto .live-modal-badge{
  background:rgba(17,17,17,.58) !important;
  border-color:transparent !important;
  box-shadow:none !important;
}
html.dark-auto .live-modal-badge.live{
  background:#ff4d4f !important;
}
html.dark-auto .live-modal-reactions{
  background:transparent !important;
}
html.dark-auto .live-reaction-btn,
html.dark-auto .live-modal-reaction-btn,
html.dark-auto .live-reaction-icon,
html.dark-auto .live-modal-reaction-icon{
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
}
html.dark-auto .live-reaction-btn:hover,
html.dark-auto .live-modal-reaction-btn:hover,
html.dark-auto .live-reaction-btn:focus,
html.dark-auto .live-modal-reaction-btn:focus{
  background:transparent !important;
  box-shadow:none !important;
  outline:none;
}
html.dark-auto .live-reaction-btn [data-role="count"],
html.dark-auto .live-modal-reaction-btn [data-role="count"]{
  color:#e6edf3 !important;
}
html.dark-auto .live-reaction-btn.active [data-role="count"],
html.dark-auto .live-modal-reaction-btn.active [data-role="count"]{
  color:#ffffff !important;
}

/* Auto Dark Mode (Org) */
html.dark-auto:not([data-msb-appearance]),
html.dark-auto:not([data-msb-appearance]) body{
  background:var(--msb-palette-bg, #171d24) !important;
  color:#f3f5f7;
}
/* Main layout blocks */
html.dark-auto .sh-pagetitle,
/* html.dark-auto .sh-logopanel, */
/* html.dark-auto .sh-headpanel, */
html.dark-auto .ig-card,
html.dark-auto .ig-main,
html.dark-auto .feed-ig-rail,
html.dark-auto .ig-wrap,
html.dark-auto body.profile-page .ig-profile-shell,
html.dark-auto body.profile-page .ig-profile-head,
html.dark-auto body.profile-page .ig-profile-scroll,
html.dark-auto body.profile-page .ig-highlights,
html.dark-auto body.profile-page .ig-tabs,
html.dark-auto body.profile-page .ig-avatar,
html.dark-auto body.profile-page .ig-top,
html.dark-auto .tt-rm-body,
html.dark-auto .tt-rm-head,
html.dark-auto .signbox,
html.dark-auto .ig-details,
html.dark-auto .tt-comments-head,
html.dark-auto .tt-comments-list,
html.dark-auto .tt-comments-foot,
html.dark-auto .sh-sideleft-menu,
html.dark-auto .tt-comments-wrap,
html.dark-auto .c-overlay,
html.dark-auto .app-main,
html.dark-auto .c-modal,
html.dark-auto .c-bodywrap,
html.dark-auto .mt-2,
html.dark-auto .sh-mainpanel,
html.dark-auto .sidebar-pill,
html.dark-auto .table-responsive,
html.dark-auto .table,
html.dark-auto .table-pro,
html.dark-auto .ig-topbar,
html.dark-auto .members-list-wrap,
html.dark-auto .conv-history,
html.dark-auto .chat-card-body,
html.dark-auto .chat-list,
html.dark-auto .chat-topbar,
html.dark-auto .chat-right-col,
html.dark-auto .chat-card,
html.dark-auto .table-pro,
html.dark-auto .pv-pill,
html.dark-auto .chatBox,
html.dark-auto .msg-scroll,
html.dark-auto .feed-card,
html.dark-auto .conv-topbar,
html.dark-auto .composer-fixed,
html.dark-auto .sh-pagetitle-left,
html.dark-auto .sh-pagebody,
html.dark-auto .row,
html.dark-auto .post,
html.dark-auto .tl-card,
html.dark-auto .hd,
html.dark-auto .bd,
html.dark-auto .row-sm,
html.dark-auto .app-footer,
html.dark-auto .col-lg-4,
html.dark-auto .col-lg-8,
html.dark-auto .col-md-8,
html.dark-auto .col-md-4,
html.dark-auto .gear-wrap,
html.dark-auto .gear-shell,
html.dark-auto .gear-sidebar,
html.dark-auto .gear-sidebar-head,
html.dark-auto .gear-main,
html.dark-auto .gear-nav,
html.dark-auto .gear-detail-panel,
html.dark-auto .gear-detail-head,
html.dark-auto .gear-detail-body,
html.dark-auto .gear-detail-empty,
html.dark-auto .gear-search,
html.dark-auto .gear-control,
html.dark-auto .gear-note{background:var(--msb-palette-bg, #171d24) !important;color:#e6edf3;}

/* Leftbar overlay doors — match Appearance dark (#171d24 or custom palette) */
html.dark-auto #ttLeftbarOverlays .tt-comments-wrap,
html.dark-auto #ttLeftbarOverlays .tt-comments-head,
html.dark-auto #ttLeftbarOverlays .tt-comments-list,
html.dark-auto #ttLeftbarOverlays .tt-comments-foot,
html.dark-auto #ttLeftbarOverlays .tt-readmore-wrap,
html.dark-auto #ttLeftbarOverlays .tt-rm-head,
html.dark-auto #ttLeftbarOverlays .tt-rm-body,
html.dark-auto #ttLeftbarOverlays .tt-menu-wrap,
html.dark-auto #ttLeftbarOverlays .tt-menu-head,
html.dark-auto #ttLeftbarOverlays .tt-menu-body,
html.dark-auto #ttLeftbarOverlays .tt-live-wrap,
html.dark-auto #ttLeftbarOverlays .tt-live-door-shade,
html.dark-auto #ttLeftbarOverlays .tt-live-door-frame,
html.dark-auto .msb-live-door-host .tt-live-wrap,
html.dark-auto .msb-live-door-host .tt-live-door-shade,
html.dark-auto .msb-live-door-host .tt-live-door-frame,
html[data-theme="dark"] #ttLeftbarOverlays .tt-comments-wrap,
html[data-theme="dark"] #ttLeftbarOverlays .tt-comments-head,
html[data-theme="dark"] #ttLeftbarOverlays .tt-comments-list,
html[data-theme="dark"] #ttLeftbarOverlays .tt-comments-foot,
html[data-theme="dark"] #ttLeftbarOverlays .tt-readmore-wrap,
html[data-theme="dark"] #ttLeftbarOverlays .tt-rm-head,
html[data-theme="dark"] #ttLeftbarOverlays .tt-rm-body,
html[data-theme="dark"] #ttLeftbarOverlays .tt-menu-wrap,
html[data-theme="dark"] #ttLeftbarOverlays .tt-menu-head,
html[data-theme="dark"] #ttLeftbarOverlays .tt-menu-body,
html[data-theme="dark"] #ttLeftbarOverlays .tt-live-wrap,
html[data-theme="dark"] #ttLeftbarOverlays .tt-live-door-shade,
html[data-theme="dark"] #ttLeftbarOverlays .tt-live-door-frame,
html[data-theme="dark"] .msb-live-door-host .tt-live-wrap,
html[data-theme="dark"] .msb-live-door-host .tt-live-door-shade,
html[data-theme="dark"] .msb-live-door-host .tt-live-door-frame{
  background-color:var(--msb-palette-bg, #171d24) !important;
  background-image:none !important;
  color:var(--msb-palette-text, #e6edf3) !important;
}

/* text */
html.dark-auto .tt-text,
html.dark-auto .h3-txt,
html.dark-auto .caption-line,
html.dark-auto .ig-username,
html.dark-auto .name,

html.dark-auto .chat-filter-tab.active {
    background: var(--msb-palette-btn-bg, var(--msb-palette-action, #2563eb));
    color: var(--msb-palette-btn-text, #fff);
}

html.dark-auto .chat-filter-tab {
  border: 0;
  background: var(--msb-palette-hover-bg, var(--msb-palette-surface-2, transparent));
  color: var(--msb-palette-text, #d1d5db);
}
html.dark-auto .messages-shell.customer-msg-ui .chat-filter-tab {
  background: var(--msb-palette-hover-bg, var(--msb-palette-surface-2, rgba(255,255,255,.08))) !important;
  color: var(--msb-palette-text, #e6edf3) !important;
}
html.dark-auto .messages-shell.customer-msg-ui .chat-filter-tab.active {
  background: var(--msb-palette-btn-bg, var(--msb-palette-action, #2563eb)) !important;
  color: var(--msb-palette-btn-text, #fff) !important;
}

html.dark-auto .chat-name,
html.dark-auto .feed-ig-logo-label,
html.dark-auto .feed-ig-rail .feed-ig-logo-label,
html[data-theme="dark"] .feed-ig-rail .feed-ig-logo-label,
html.dark-auto .likes-line {
  color: var(--msb-palette-text-on-nav, var(--msb-palette-text, #f3f6fb)) !important;
}
html.dark-auto .feed-ig-logo,
html.dark-auto .feed-ig-rail .feed-ig-logo,
html[data-theme="dark"] .feed-ig-logo,
html[data-theme="dark"] .feed-ig-rail .feed-ig-logo {
  background: linear-gradient(
    135deg,
    var(--msb-palette-action, #60a5fa),
    var(--msb-palette-accent, var(--msb-palette-action-strong, #38bdf8))
  ) !important;
  background-color: transparent !important;
  color: #fff !important;
}
html.dark-auto .feed-ig-rail,
html[data-theme="dark"] .feed-ig-rail {
  color: var(--msb-palette-text-on-nav, var(--msb-palette-text, #f3f6fb)) !important;
}

html.dark-auto .chat-meta, 
html.dark-auto .chatLastMsg,
html.dark-auto .chat-item{
  color: rgba(255, 255, 255, .62) !important;
}

html.dark-auto .a,
html.dark-auto .vcall-sidebar-close {
  color: #6a6e72;

}

html.dark-auto .a:not([href]):not([tabindex]) {
  color: inherit;
  text-decoration: none;
}
/* btn */
html.dark-auto .btn,
html.dark-auto .msg-pill,
html.dark-auto .c,
html.dark-auto .ig-btn,
html.dark-auto .ig-hl,
html.dark-auto .composer,
html.dark-auto .button,
html.dark-auto .iconbtn{
  background:#171d24 !important;color:#e6edf3;
}
/* Cards */
html.dark-auto .mf-card,
html.dark-auto .card,
html.dark-auto .messages-shell,
html.dark-auto .messages-shell-head,
html.dark-auto .chat-left-head,
html.dark-auto .chat-info-panel,
html.dark-auto .sh-sideleft-menu,
html.dark-auto .rows-scroll,
html.dark-auto .card-body,
html.dark-auto .card-header,
html.dark-auto .feed-ig-rail,
html.dark-auto .card.bd-0{background:#171d24 !important;color:#e6edf3;border-color:rgba(255,255,255,.08) !important;}
/* Lists */
html.dark-auto .list-group,
html.dark-auto .list-group-flush,
html.dark-auto .list-group-item{background:#171d24 !important;color:#e6edf3;border-color:rgba(255,255,255,.08) !important;}
html.dark-auto .list-group-item.active{background:#2f363d !important;color:#fff;}
/* Chat box */
html.dark-auto .msg-box{background:#171d24 !important;border-color:rgba(255,255,255,.10) !important;}
/* Input groups + controls */
html.dark-auto .input-group,
html.dark-auto .input-group-btn{background:#171d24 !important;}
html.dark-auto .input:not([type=checkbox]):not([type=radio]):not([type=file]):not([type=color]),
html.dark-auto .textarea,
html.dark-auto .form-control{background:var(--msb-palette-input-bg, var(--msb-palette-bg, #131d25)) !important;color:var(--msb-palette-text, #e6edf3) !important;border-color:var(--msb-palette-border-strong, rgba(255,255,255,.12)) !important;}
html.dark-auto .mf-body,
html.dark-auto .mf-title,
html.dark-auto .mf-card .mf-foot,
html.dark-auto .mf-card .mf-actions,
body.dark-auto .mf-body,
body.dark-auto .mf-title,
body.dark-auto .mf-card .mf-foot,
body.dark-auto .mf-card .mf-actions{
  background-color:var(--msb-palette-bg, #171d24) !important;
  background-image:none !important;
  color:var(--msb-palette-text, #eef4ff) !important;
  -webkit-text-fill-color:var(--msb-palette-text, #eef4ff) !important;
  border-color:var(--msb-palette-border, rgba(255,255,255,.12)) !important;
}
html.dark-auto .mf-body .mf-body-formatted,
html.dark-auto .mf-body .post-card-paragraph,
html.dark-auto .mf-body p,
html.dark-auto .mf-video-body,
html.dark-auto .mf-video-body .post-card-paragraph,
html.dark-auto #profilePostsFeed .mf-body,
html.dark-auto #profilePostsFeed .mf-body .post-card-paragraph,
body.dark-auto .mf-body .mf-body-formatted,
body.dark-auto .mf-body .post-card-paragraph,
body.dark-auto .mf-body p,
body.dark-auto #profilePostsFeed .mf-body,
body.dark-auto #profilePostsFeed .mf-body .post-card-paragraph{
  color:var(--msb-palette-text, #eef4ff) !important;
  -webkit-text-fill-color:var(--msb-palette-text, #eef4ff) !important;
}
html.dark-auto input::placeholder,
html.dark-auto .textarea::placeholder{color:#9aa4ad !important;}
/* Icons */
html.dark-auto .sh-pagetitle-icon,
html.dark-auto .icon,
html.dark-auto .mf-time,
html.dark-auto .mf-comment,
html.dark-auto .mf-cmt,
html.dark-auto .chat-round-btn,
html.dark-auto .ion-ios-chatbubble{color:#e6edf3 !important;}

html.dark-auto .msg-me
{ background:#3a3c3d !important;
  color:#e6edf3;}

html.dark-auto .right-active{
    background:#4a545f !important;
  color:#e6edf3;
}

/* html.dark-auto .chat-card,
html.dark-auto .chat-card-right{
  background: linear-gradient(180deg, rgb(154 161 175 / 98%), rgba(23, 24, 28, .98)) !important;
  color: white;
} */

.vcall-sidebar {
  background:#4a545f !important;
  color:#e6edf3;
  border-left: 1px solid rgba(8, 16, 30, .06);
}
html.dark-auto .right-sidebar,
html.dark-auto .right-sidebar-subject,
html.dark-auto .msg-them-peer,
html.dark-auto .btn-search{
  background:#171d24 !important;
  color:#e6edf3;
}

html.dark-auto .vcall-compose {
  border-top: 1px solid rgba(15, 23, 42, .08);
  background:#4a545f !important;
}


/* =====================================================
   FEED THEME (uses :root light + html.dark-auto dark)
   This keeps feed.php clean — only layout CSS stays there.
   ===================================================== */

:root{
  --bg-main: #f5f7fb;
  --bg-card: #ffffff;
  --bg-sidebar: #f0f2f7;

  --text-primary: #25282f;
  --text-secondary: #475569;
  --text-muted: #64748b;

  --border-color: rgba(15,23,42,0.08);
  --shadow: 0 10px 18px rgba(0,0,0,.04);
  --shadow-strong: 0 14px 24px rgba(0,0,0,.10);
}

/* Dark (enabled by ../js/dark-auto.js adding html.dark-auto) */
html.dark-auto:not([data-msb-appearance]){
  --bg-main: var(--msb-palette-bg, #171d24);
  --bg-card: var(--msb-palette-bg, #171d24);
  --bg-sidebar: var(--msb-palette-bg, #171d24);

  --text-primary: #f8fafc;
  --text-secondary: #cbd5e1;
  --text-muted: #94a3b8;

  --border-color: rgba(255,255,255,0.08);
  --shadow: 0 10px 18px rgba(0,0,0,.35);
  --shadow-strong: 0 14px 24px rgba(0,0,0,.45);
}

html[data-msb-appearance]{
  --bg-main: var(--msb-palette-bg);
  --bg-card: var(--msb-palette-bg);
  --bg-sidebar: var(--msb-palette-bg);
  --text-primary: var(--msb-palette-text);
  --text-secondary: var(--msb-palette-text-muted, var(--msb-palette-text));
  --text-muted: var(--msb-palette-text-muted, var(--msb-palette-text));
  --border-color: var(--msb-palette-border);
}

html[data-msb-appearance] body.org-app,
html[data-msb-appearance] body.org-app .sh-mainpanel,
html[data-msb-appearance] body.org-app .sh-pagebody,
html[data-msb-appearance] body.org-app.org-page-feed .feed-layout,
html[data-msb-appearance] body.org-app.org-page-feed .feed-main,
html[data-msb-appearance] body.org-app.org-page-feed .feed-post-detail{
  background: var(--msb-palette-bg) !important;
  color: var(--msb-palette-text) !important;
}

/* Apply variables */
body{
  background: var(--bg-main) !important;
  color: var(--text-primary) !important;
  transition: background-color .25s ease, color .25s ease, border-color .25s ease;
}

.sh-mainpanel, .sh-pagebody{
  background: var(--bg-main) !important;
}

.feed-card{
  background: var(--bg-card) !important;
  border: 1px solid var(--border-color) !important;
}

.feed-title{ color: var(--text-primary) !important; }
.feed-desc{ color: var(--text-secondary) !important; }
.feed-date, .feed-meta{ color: var(--text-muted) !important; }

.feed-main{ box-shadow: var(--shadow) !important; }
html.dark-auto .feed-main{ box-shadow: var(--shadow) !important; }

html.dark-auto .stat-pill{ background:#0b1220; border-color:#334155; box-shadow:none; }
html.dark-auto .stat-pill .num{ color:#f3f4f6; }
html.dark-auto .stat-pill .lbl{ color:#cbd5e1; }
html.dark-auto .stat-pill .sub{ color:#94a3b8; }
html.dark-auto .stat-pill .icon{ background:#111827; color:#60a5fa; }
/* =====================================================
   PRO THEME TOKENS (GLOBAL)
   - Light tokens in :root
   - Dark tokens in html.dark-auto (set by ../js/dark-auto.js)
   - Org accent can be overridden by header.php via --org-accent, --org-bg, etc.
   ===================================================== */

:root{
  /* Core surfaces */
  --bg: var(--org-bg, #f5f7fb);
  --surface: #ffffff;
  --surface-2: #f8fafc;

  /* Text */
  --text: #0f172a;
  --muted: #64748b;

  /* UI */
  --border: rgba(15,23,42,0.08);
  --shadow: 0 10px 18px rgba(0,0,0,.04);
  --shadow-strong: 0 14px 24px rgba(0,0,0,.10);
  --radius: 14px;

  /* Accent */
  --accent: var(--org-accent, #0861bc);
}

/* Dark mode tokens */
html.dark-auto{
  --bg: #171d24;
  --surface: #171d24;
  --surface-2: #0f1a2e;

  --text: #f8fafc;
  --muted: #cbd5e1;

  --border: rgba(255,255,255,0.08);
  --shadow: 0 10px 18px rgba(0,0,0,.35);
  --shadow-strong: 0 14px 24px rgba(0,0,0,.45);
}

/* Compatibility tokens used by existing pages (feed.php etc.) */
:root{
  --bg-main: var(--bg);
  --bg-card: var(--surface);
  --bg-sidebar: #f0f2f7;

  --text-primary: var(--text);
  --text-secondary: #475569;
  --text-muted: var(--muted);

  --border-color: var(--border);
}

html.dark-auto{
  --bg-sidebar: #171d24;
  --text-secondary: #cbd5e1;
}

/* Apply base */
body{
  background: var(--bg-main) !important;
  color: var(--text-primary) !important;
  transition: background-color .25s ease, color .25s ease, border-color .25s ease;
}

.sh-mainpanel, .sh-pagebody{
  background: var(--bg-main) !important;
}

/* Component defaults (token-based; no hard-coded dark duplication) */
.feed-card{
  background: var(--bg-card) !important;
  border: 1px solid var(--border-color) !important;
  border-radius: var(--radius);
}

.feed-title{ color: var(--text-primary) !important; }
.feed-desc{ color: var(--text-secondary) !important; }
.feed-date, .feed-meta, .mini-muted{ color: var(--text-muted) !important; }

.feed-main{ box-shadow: var(--shadow) !important; }

/* Sidebar tokens */
.feed-sidebar,
.right-sidebar,
.chat-main-pane,
.right-sidebar-subject{
  background: var(--bg-sidebar) !important;
  border-color: var(--border-color) !important;
  color: var(--text-primary) !important;
}

/* Modal / replies */
.modal-clean .modal-content,
.reply-box,
.comment-item{
  background: var(--bg-card) !important;
  border-color: var(--border-color) !important;
  color: var(--text-primary) !important;
}

/* Attachment tiles */
.media-tile{
  background: var(--bg-card) !important;
  border-color: var(--border-color) !important;
}
.media-tile .tile-icon{ color: var(--text-primary) !important; }


/* dark-auto for messages.php */
body.dark-auto{
    background:#171d24 !important;
    color:#e6edf3 !important;
  }
  body.dark-auto .sh-pagebody,
  body.dark-auto .messages-shell,
  body.dark-auto .messages-shell-head,
  body.dark-auto .chat-card,
  body.dark-auto .chat-card-right,
  body.dark-auto .chat-left-head,
  body.dark-auto .chat-topbar,
  body.dark-auto .chat-info-panel{
    background:#171d24 !important;
    color:#e6edf3 !important;
    border-color:rgba(255,255,255,.08) !important;
  }
  body.dark-auto .messages-shell-search,
  body.dark-auto .chat-search-wrap,
  body.dark-auto .composer,
  body.dark-auto .composer-bar,
  body.dark-auto #msgPreviewInline,
  body.dark-auto .floatMenu,
  body.dark-auto .msg-menu,
  body.dark-auto .msg-react-picker{
    background:#2b3137 !important;
    color:#e6edf3 !important;
    border-color:rgba(255,255,255,.10) !important;
  }
  body.dark-auto .messages-shell-title,
  body.dark-auto .chat-name,
  body.dark-auto .peerTitle,
  body.dark-auto .peerTitle span,
  body.dark-auto .chat-info-name,
  body.dark-auto .chat-file-name,
  body.dark-auto .chat-member-name,
  body.dark-auto .reply-preview,
  body.dark-auto .reply-preview-close{
    color:#f3f5f7 !important;
  }
  body.dark-auto .messages-shell:not(.customer-msg-ui) .messages-shell-icon,
  body.dark-auto .messages-shell-avatar,
  body.dark-auto .avatar,
  body.dark-auto .peerAvatar,
  body.dark-auto .msg-avatar-mini,
  body.dark-auto .chat-info-avatar,
  body.dark-auto .chat-member-avatar{
    background: var(--msb-palette-hover-bg, var(--msb-palette-surface-2, #30363d)) !important;
  }
  body.dark-auto .messages-shell.customer-msg-ui .messages-shell-icon,
  body.dark-auto .messages-shell.customer-msg-ui .chat-compose-btn,
  body.dark-auto .messages-shell.customer-msg-ui .messages-shell-search-btn,
  body.dark-auto .messages-shell.customer-msg-ui .chat-filter-tab{
    background: var(--msb-palette-hover-bg, var(--msb-palette-surface-2, var(--msg-bg, #30363d))) !important;
    background-color: var(--msb-palette-hover-bg, var(--msb-palette-surface-2, var(--msg-bg, #30363d))) !important;
    color: var(--msb-palette-text, #e6edf3) !important;
  }
  body.dark-auto .messages-shell.customer-msg-ui .chat-filter-tab.active{
    background: var(--msb-palette-btn-bg, var(--msb-palette-action, #2563eb)) !important;
    color: var(--msb-palette-btn-text, #fff) !important;
  }
  body.dark-auto .chat-item{
    background:transparent !important;
    color:#e6edf3 !important;
    border-color:rgba(255,255,255,.06) !important;
    transition: none !important;
  }
  body.dark-auto .chat-item:hover,
  body.dark-auto .chat-item:focus,
  body.dark-auto .chat-item:focus-visible,
  body.dark-auto .chat-item:active,
  body.dark-auto .chat-item.active{
    background:rgba(148,163,184,.12) !important;
    color:#e6edf3 !important;
    border-color:rgba(255,255,255,.06) !important;
  }
  body.dark-auto .chat-item.active::after{
    background:#7c8cff;
  }
  body.dark-auto .chat-meta,
  body.dark-auto .chatLastMsg,
  body.dark-auto .chat-file-meta,
  body.dark-auto .chat-member-meta,
  body.dark-auto .reply-preview-text,
  body.dark-auto .peerSub,
  body.dark-auto .messages-shell-search input::placeholder,
  body.dark-auto #chatSearch::placeholder,
  body.dark-auto #messageInput::placeholder{
    color:#9aa4ad !important;
  }
  body.dark-auto .messages-shell-search input,
  body.dark-auto #chatSearch,
  body.dark-auto #messageInput,
  body.dark-auto #plusMenuBody button,
  body.dark-auto #emojiGrid button,
  body.dark-auto .msg-menu button,
  body.dark-auto .reply-preview-close,
  body.dark-auto #msgPlusBtn,
  body.dark-auto #emojiBtn,
  body.dark-auto #composerLocationBtn,
  body.dark-auto #composerMicBtn{
    color:#e6edf3 !important;
  }
  body.dark-auto #chatBox{
    background:#1f2428 !important;
  }
  body.dark-auto .day-divider{
    color:#9aa4ad !important;
  }
  body.dark-auto .day-divider::before,
  body.dark-auto .day-divider::after{
    background:rgba(255,255,255,.08) !important;
  }
  body.dark-auto .bubble{
    background:#2b3137 !important;
    color:#e6edf3 !important;
  }
  body.dark-auto .bubble.me{
    background:linear-gradient(135deg, #4f46e5 0%, #4338ca 100%) !important;
    color:#fff !important;
  }
  body.dark-auto .msg-side-btn:hover,
  body.dark-auto .msg-menu button:hover,
  body.dark-auto .msg-react-picker button:hover,
  body.dark-auto .reply-preview-close:hover{
    background:#394451 !important;
    color:#fff !important;
  }
  body.dark-auto .msg-reaction-pill{
    background:#30363d !important;
    color:#e6edf3 !important;
    border-color:rgba(255,255,255,.10) !important;
  }
  body.dark-auto .msg-edited,
  body.dark-auto .msg-dot-btn,
  body.dark-auto .msg-side-actions,
  body.dark-auto .msg-peer-actions{
    color:#9aa4ad !important;
  }
  body.dark-auto .msg-reply-line{
    background:rgba(255,255,255,.06) !important;
    border-left-color:rgba(255,255,255,.25) !important;
  }
  body.dark-auto .msg-row:not(.me) .msg-reply-line-title,
  body.dark-auto .msg-row:not(.me) .msg-reply-line-text{
    color:#d0d7de !important;
  }
  body.dark-auto .presenceDot{
    box-shadow:0 0 0 3px #171d24 !important;
  }


  /* html dark-auto for messages.php */
  html.dark-auto .chat-meta,
  html.dark-auto .chatLastMsg,
  html.dark-auto .chat-file-meta,
  html.dark-auto .chat-member-meta,
  html.dark-auto .reply-preview-text,
  html.dark-auto .peerSub,
  html.dark-auto .messages-shell-search input::placeholder,
  html.dark-auto #chatSearch::placeholder,
  html.dark-auto #messageInput::placeholder{
    color:#9aa4ad !important;
  }
  html.dark-auto .messages-shell-search input,
  html.dark-auto #chatSearch,
  html.dark-auto #messageInput,
  html.dark-auto #plusMenuBody button,
  html.dark-auto #emojiGrid button,
  html.dark-auto .msg-menu button,
  html.dark-auto .reply-preview-close,
  html.dark-auto #msgPlusBtn,
  html.dark-auto #emojiBtn,
  html.dark-auto #composerLocationBtn,
  html.dark-auto #composerMicBtn{
    color:#e6edf3 !important;
  }

/* Feed media overlay — keep shell/stage transparent (beat card wheat/dark-auto) */
html.dark-auto .mf-feed .mf-card:has(.mf-head--on-media) .mf-media-shell,
html.dark-auto .mf-feed .mf-card:has(.mf-head--on-media) .mf-media-shell .media-stage,
html.dark-auto .mf-feed .mf-card:has(.mf-head--on-media) .mf-media-shell .mf-media,
body.dark-auto .mf-feed .mf-card:has(.mf-head--on-media) .mf-media-shell,
body.dark-auto .mf-feed .mf-card:has(.mf-head--on-media) .mf-media-shell .media-stage,
body.dark-auto .mf-feed .mf-card:has(.mf-head--on-media) .mf-media-shell .mf-media {
  background: transparent !important;
  background-color: transparent !important;
}
html.dark-auto .mf-feed .mf-card:has(.mf-head--on-media) .mf-head--on-media,
body.dark-auto .mf-feed .mf-card:has(.mf-head--on-media) .mf-head--on-media {
  background: transparent !important;
  background-color: transparent !important;
}

html.dark-auto .news-page .post.public-post-card:has(.standard-media-topbar) .media-stage,
html.dark-auto .news-page .post.public-post-card:has(.standard-media-topbar) .media-stage > img,
html.dark-auto .news-page .post.public-post-card:has(.standard-media-topbar) .media-stage > video,
html.dark-auto .news-page .post.public-post-card:has(.standard-media-topbar) .media-stage > .media-carousel,
body.dark-auto .news-page .post.public-post-card:has(.standard-media-topbar) .media-stage,
body.dark-auto .news-page .post.public-post-card:has(.standard-media-topbar) .media-stage > img,
body.dark-auto .news-page .post.public-post-card:has(.standard-media-topbar) .media-stage > video,
body.dark-auto .news-page .post.public-post-card:has(.standard-media-topbar) .media-stage > .media-carousel,
html.dark-auto .news-page .post.public-post-card:has(.standard-media-topbar) .standard-media-topbar,
body.dark-auto .news-page .post.public-post-card:has(.standard-media-topbar) .standard-media-topbar {
  background: transparent !important;
  background-color: transparent !important;
}

html.dark-auto #profilePostsFeed .mf-card:has(.mf-head--on-media) .mf-media-shell,
html.dark-auto #profilePostsFeed .mf-card:has(.mf-head--on-media) .mf-media-shell .media-stage,
html.dark-auto #profilePostsFeed .mf-card:has(.mf-head--on-media) .mf-media-shell .mf-media,
body.dark-auto #profilePostsFeed .mf-card:has(.mf-head--on-media) .mf-media-shell,
body.dark-auto #profilePostsFeed .mf-card:has(.mf-head--on-media) .mf-media-shell .media-stage,
body.dark-auto #profilePostsFeed .mf-card:has(.mf-head--on-media) .mf-media-shell .mf-media,
html.dark-auto #profilePostsFeed .mf-card:has(.mf-head--on-media) .mf-head--on-media,
body.dark-auto #profilePostsFeed .mf-card:has(.mf-head--on-media) .mf-head--on-media {
  background: transparent !important;
  background-color: transparent !important;
}

/* =====================================================
   DARK AUTO CHROME — Gear Dark auto / Dark (#b1bcce)
   public_user + organization when html.dark-auto is active
   ===================================================== */
html.dark-auto:not([data-msb-appearance]),
html.dark-auto:not([data-msb-appearance]) body,
body.dark-auto:not([data-msb-appearance]) {
  --msb-dark-auto-chrome: #b1bcce;
  --msb-palette-bg: #171d24;
  --msb-palette-surface-2: #2b3137;
  --msb-palette-input-bg: #1e1f1f;
  --msb-palette-border: rgba(255, 255, 255, 0.12);
  --msb-palette-border-strong: rgba(177, 188, 206, 0.48);
  --msb-palette-text: #b1bcce;
  --msb-fries: #ffffff;
  --msb-palette-text-muted: #b1bcce;
  --msb-palette-text-on-nav: #b1bcce;
  --msb-palette-text-on-nav-hover: #e8edf5;
  --msb-palette-text-on-hover: #e8edf5;
  --msb-palette-icon: #b1bcce;
  --msb-palette-icon-on-nav-hover: #e8edf5;
  --msb-palette-icon-on-hover: #e8edf5;
  --msb-palette-nav-hover: #2f3a4a;
  --msb-palette-hover-bg: #2f3a4a;
  --msb-palette-nav-active-bg: rgba(255, 255, 255, 0.12);
  --msb-palette-nav-active-text: #ffffff;
  --msb-palette-nav-active-icon: #ffffff;
  --msb-palette-link: #b1bcce;
  --msb-palette-link-hover: #e8edf5;
  --studio-text: #b1bcce;
  --studio-muted: #b1bcce;
  --text-primary: #b1bcce;
  --text-secondary: #b1bcce;
  --text-muted: #b1bcce;
  --feed-text: #b1bcce;
  --feed-muted: #b1bcce;
  --public-text: #b1bcce;
  --public-muted: #b1bcce;
  color: #b1bcce !important;
}

html.dark-auto:not([data-msb-appearance]) body.org-app {
  --org-chrome-text: #b1bcce;
  --org-accent: #60a5fa;
  --org-accent-strong: #3b82f6;
  --org-link: #93c5fd;
  --org-icon: #b1bcce;
}

/* Profile gear tab — Dark auto / Light / Dark built-in contrast */
html.dark-auto:not([data-msb-appearance]) body.profile-page .gear-sidebar-title,
html.dark-auto:not([data-msb-appearance]) body.profile-page .gear-detail-title,
html.dark-auto:not([data-msb-appearance]) body.profile-page .gear-nav-section-toggle,
html.dark-auto:not([data-msb-appearance]) body.profile-page .gear-nav-item,
html.dark-auto:not([data-msb-appearance]) body.profile-page .gear-control,
html.dark-auto:not([data-msb-appearance]) body.profile-page .gear-detail-open-btn,
html.dark-auto:not([data-msb-appearance]) body.profile-page .gear-upload-btn,
html[data-theme="dark"]:not([data-msb-appearance]) body.profile-page .gear-sidebar-title,
html[data-theme="dark"]:not([data-msb-appearance]) body.profile-page .gear-detail-title,
html[data-theme="dark"]:not([data-msb-appearance]) body.profile-page .gear-nav-section-toggle,
html[data-theme="dark"]:not([data-msb-appearance]) body.profile-page .gear-nav-item,
html[data-theme="dark"]:not([data-msb-appearance]) body.profile-page .gear-control {
  color: var(--msb-palette-text, #b1bcce) !important;
}

html.dark-auto:not([data-msb-appearance]) body.profile-page .gear-detail-desc,
html.dark-auto:not([data-msb-appearance]) body.profile-page .gear-nav-item-meta,
html.dark-auto:not([data-msb-appearance]) body.profile-page .gear-upload-hint,
html.dark-auto:not([data-msb-appearance]) body.profile-page .gear-detail-empty,
html.dark-auto:not([data-msb-appearance]) body.profile-page .gear-save-state,
html[data-theme="dark"]:not([data-msb-appearance]) body.profile-page .gear-detail-desc,
html[data-theme="dark"]:not([data-msb-appearance]) body.profile-page .gear-nav-item-meta,
html[data-theme="dark"]:not([data-msb-appearance]) body.profile-page .gear-upload-hint,
html[data-theme="dark"]:not([data-msb-appearance]) body.profile-page .gear-detail-empty,
html[data-theme="dark"]:not([data-msb-appearance]) body.profile-page .gear-save-state {
  color: var(--msb-palette-text-muted, #b1bcce) !important;
}

html.dark-auto:not([data-msb-appearance]) body.profile-page .gear-detail-icon i,
html.dark-auto:not([data-msb-appearance]) body.profile-page .gear-nav-section-icon i,
html.dark-auto:not([data-msb-appearance]) body.profile-page .gear-nav-section-chevron,
html[data-theme="dark"]:not([data-msb-appearance]) body.profile-page .gear-detail-icon i,
html[data-theme="dark"]:not([data-msb-appearance]) body.profile-page .gear-nav-section-icon i,
html[data-theme="dark"]:not([data-msb-appearance]) body.profile-page .gear-nav-section-chevron {
  color: var(--msb-palette-icon, #b1bcce) !important;
}

html[data-msb-appearance] body.profile-page .gear-wrap,
html[data-msb-appearance] body.profile-page .gear-shell,
html[data-msb-appearance] body.profile-page .gear-sidebar,
html[data-msb-appearance] body.profile-page .gear-sidebar-head,
html[data-msb-appearance] body.profile-page .gear-main,
html[data-msb-appearance] body.profile-page .gear-nav,
html[data-msb-appearance] body.profile-page .gear-detail-panel,
html[data-msb-appearance] body.profile-page .gear-detail-head,
html[data-msb-appearance] body.profile-page .gear-detail-body,
html[data-msb-appearance] body.profile-page .gear-detail-empty,
html[data-msb-appearance] body.profile-page .gear-search,
html[data-msb-appearance] body.profile-page .gear-control,
html[data-msb-appearance] body.profile-page .gear-note {
  background-color: var(--msb-palette-bg) !important;
  background-image: none !important;
  color: var(--msb-palette-text) !important;
  border-color: var(--msb-palette-border) !important;
}

html[data-msb-appearance] body.profile-page .gear-sidebar-title,
html[data-msb-appearance] body.profile-page .gear-detail-title,
html[data-msb-appearance] body.profile-page .gear-nav-section-toggle,
html[data-msb-appearance] body.profile-page .gear-nav-item,
html[data-msb-appearance] body.profile-page .gear-detail-control-label,
html[data-msb-appearance] body.profile-page .gear-control {
  color: var(--msb-palette-text) !important;
}

html[data-msb-appearance] body.profile-page .gear-detail-desc,
html[data-msb-appearance] body.profile-page .gear-nav-item-meta,
html[data-msb-appearance] body.profile-page .gear-upload-hint,
html[data-msb-appearance] body.profile-page .gear-detail-empty,
html[data-msb-appearance] body.profile-page .gear-save-state {
  color: var(--msb-palette-text-muted) !important;
}

html[data-msb-appearance] body.profile-page .gear-detail-icon i,
html[data-msb-appearance] body.profile-page .gear-nav-section-icon i,
html[data-msb-appearance] body.profile-page .gear-nav-section-chevron {
  color: var(--msb-palette-icon) !important;
}

html[data-msb-appearance] body.profile-page .gear-detail-open-btn,
html[data-msb-appearance] body.profile-page .gear-upload-btn {
  background-color: var(--msb-palette-btn-bg, var(--msb-palette-action)) !important;
  border-color: var(--msb-palette-btn-bg, var(--msb-palette-action)) !important;
  color: var(--msb-palette-btn-text, #ffffff) !important;
}

html.dark-auto:not([data-msb-appearance]) .feed-left-nav-item:hover,
html.dark-auto:not([data-msb-appearance]) .feed-left-nav-item:focus,
html.dark-auto:not([data-msb-appearance]) .feed-right-nav-item:hover,
html.dark-auto:not([data-msb-appearance]) .feed-right-nav-item:focus,
html.dark-auto:not([data-msb-appearance]) .tt-menu-body .feed-left-nav-item:hover,
html.dark-auto:not([data-msb-appearance]) .tt-menu-body .feed-left-nav-item:focus,
html[data-theme="dark"]:not([data-msb-appearance]) .feed-left-nav-item:hover,
html[data-theme="dark"]:not([data-msb-appearance]) .feed-left-nav-item:focus,
html[data-theme="dark"]:not([data-msb-appearance]) .feed-right-nav-item:hover,
html[data-theme="dark"]:not([data-msb-appearance]) .feed-right-nav-item:focus,
html[data-theme="dark"]:not([data-msb-appearance]) .tt-menu-body .feed-left-nav-item:hover,
html[data-theme="dark"]:not([data-msb-appearance]) .tt-menu-body .feed-left-nav-item:focus {
  background-color: #2f3a4a !important;
  color: #e8edf5 !important;
  box-shadow: inset 0 0 0 1px rgba(177, 188, 206, 0.28) !important;
}

html.dark-auto:not([data-msb-appearance]) .feed-left-nav-item:hover .feed-left-nav-ic,
html.dark-auto:not([data-msb-appearance]) .feed-left-nav-item:hover .feed-left-nav-label,
html.dark-auto:not([data-msb-appearance]) .feed-left-nav-item:focus .feed-left-nav-ic,
html.dark-auto:not([data-msb-appearance]) .feed-left-nav-item:focus .feed-left-nav-label,
html.dark-auto:not([data-msb-appearance]) .feed-left-nav-item:hover .feed-left-nav-ic svg,
html.dark-auto:not([data-msb-appearance]) .feed-right-nav-item:hover .feed-right-nav-ic,
html.dark-auto:not([data-msb-appearance]) .feed-right-nav-item:hover .feed-right-nav-label,
html.dark-auto:not([data-msb-appearance]) .feed-right-nav-item:hover .feed-right-nav-ic svg,
html.dark-auto:not([data-msb-appearance]) .tt-menu-body .feed-left-nav-item:hover .feed-left-nav-ic,
html.dark-auto:not([data-msb-appearance]) .tt-menu-body .feed-left-nav-item:hover .feed-left-nav-label,
html.dark-auto:not([data-msb-appearance]) .tt-menu-body .feed-left-nav-item:hover .feed-left-nav-ic svg,
html[data-theme="dark"]:not([data-msb-appearance]) .feed-left-nav-item:hover .feed-left-nav-ic,
html[data-theme="dark"]:not([data-msb-appearance]) .feed-left-nav-item:hover .feed-left-nav-label,
html[data-theme="dark"]:not([data-msb-appearance]) .feed-left-nav-item:hover .feed-left-nav-ic svg,
html[data-theme="dark"]:not([data-msb-appearance]) .feed-right-nav-item:hover .feed-right-nav-ic,
html[data-theme="dark"]:not([data-msb-appearance]) .feed-right-nav-item:hover .feed-right-nav-label,
html[data-theme="dark"]:not([data-msb-appearance]) .feed-right-nav-item:hover .feed-right-nav-ic svg {
  color: #e8edf5 !important;
  stroke: currentColor !important;
}

html.dark-auto:not([data-msb-appearance]) .feed-left-nav-item.is-active,
html.dark-auto:not([data-msb-appearance]) .feed-right-nav-item.is-active,
html.dark-auto:not([data-msb-appearance]) .tt-menu-body .feed-left-nav-item.is-active,
html[data-theme="dark"]:not([data-msb-appearance]) .feed-left-nav-item.is-active,
html[data-theme="dark"]:not([data-msb-appearance]) .feed-right-nav-item.is-active,
html[data-theme="dark"]:not([data-msb-appearance]) .tt-menu-body .feed-left-nav-item.is-active {
  background-color: var(--msb-palette-nav-active-bg) !important;
  color: var(--msb-palette-nav-active-text) !important;
}

html.dark-auto:not([data-msb-appearance]) .feed-left-nav-item.is-active .feed-left-nav-ic,
html.dark-auto:not([data-msb-appearance]) .feed-left-nav-item.is-active .feed-left-nav-label,
html.dark-auto:not([data-msb-appearance]) .feed-left-nav-item.is-active .feed-left-nav-ic svg,
html.dark-auto:not([data-msb-appearance]) .feed-right-nav-item.is-active .feed-right-nav-ic,
html.dark-auto:not([data-msb-appearance]) .feed-right-nav-item.is-active .feed-right-nav-label,
html.dark-auto:not([data-msb-appearance]) .feed-right-nav-item.is-active .feed-right-nav-ic svg,
html.dark-auto:not([data-msb-appearance]) .tt-menu-body .feed-left-nav-item.is-active .feed-left-nav-ic,
html.dark-auto:not([data-msb-appearance]) .tt-menu-body .feed-left-nav-item.is-active .feed-left-nav-label,
html[data-theme="dark"]:not([data-msb-appearance]) .feed-left-nav-item.is-active .feed-left-nav-ic,
html[data-theme="dark"]:not([data-msb-appearance]) .feed-left-nav-item.is-active .feed-left-nav-label,
html[data-theme="dark"]:not([data-msb-appearance]) .feed-left-nav-item.is-active .feed-left-nav-ic svg {
  color: #ffffff !important;
  stroke: currentColor !important;
}

html.dark-auto:not([data-msb-appearance]) #ttNavLeftbar .nav-link:hover,
html.dark-auto:not([data-msb-appearance]) #ttNavLeftbar .nav-link.active,
html.dark-auto:not([data-msb-appearance]) body #ttNavLeftbar .nav-link:hover,
html.dark-auto:not([data-msb-appearance]) body #ttNavLeftbar .nav-link.active,
html[data-theme="dark"]:not([data-msb-appearance]) #ttNavLeftbar .nav-link:hover,
html[data-theme="dark"]:not([data-msb-appearance]) body #ttNavLeftbar .nav-link:hover {
  background-color: #2f3a4a !important;
  color: #e8edf5 !important;
}

html.dark-auto:not([data-msb-appearance]) .feed-ig-rail .feed-ig-btn:hover,
html.dark-auto:not([data-msb-appearance]) .feed-ig-rail .feed-ig-btn:focus,
html.dark-auto:not([data-msb-appearance]) .feed-ig-rail .feed-ig-btn.active,
html.dark-auto:not([data-msb-appearance]) .feed-ig-rail .feed-ig-link:hover,
html.dark-auto:not([data-msb-appearance]) .feed-ig-rail .feed-ig-link:focus,
html.dark-auto:not([data-msb-appearance]) .feed-ig-rail .feed-ig-link.active,
html.dark-auto:not([data-msb-appearance]) .ig-link:hover,
html.dark-auto:not([data-msb-appearance]) .ig-link:focus,
html.dark-auto:not([data-msb-appearance]) .ig-link.active,
html[data-theme="dark"]:not([data-msb-appearance]) .feed-ig-rail .feed-ig-btn:hover,
html[data-theme="dark"]:not([data-msb-appearance]) .feed-ig-rail .feed-ig-link:hover,
html[data-theme="dark"]:not([data-msb-appearance]) .ig-link:hover {
  background-color: #2f3a4a !important;
  color: #e8edf5 !important;
}

html.dark-auto:not([data-msb-appearance]) .feed-ig-rail .feed-ig-btn:hover .icon,
html.dark-auto:not([data-msb-appearance]) .feed-ig-rail .feed-ig-link:hover .icon,
html.dark-auto:not([data-msb-appearance]) .ig-link:hover .icon,
html[data-theme="dark"]:not([data-msb-appearance]) .feed-ig-rail .feed-ig-btn:hover .icon,
html[data-theme="dark"]:not([data-msb-appearance]) .feed-ig-rail .feed-ig-link:hover .icon {
  color: #e8edf5 !important;
}

html.dark-auto:not([data-msb-appearance]) a,
html.dark-auto:not([data-msb-appearance]) label,
html.dark-auto:not([data-msb-appearance]) .icon,
html.dark-auto:not([data-msb-appearance]) i,
html.dark-auto:not([data-msb-appearance]) [class*="ion-"],
html.dark-auto:not([data-msb-appearance]) .fa,
html.dark-auto:not([data-msb-appearance]) svg,
html.dark-auto:not([data-msb-appearance]) .text-muted,
html.dark-auto:not([data-msb-appearance]) small,
html.dark-auto:not([data-msb-appearance]) .small,
html.dark-auto:not([data-msb-appearance]) h1,
html.dark-auto:not([data-msb-appearance]) h2,
html.dark-auto:not([data-msb-appearance]) h3,
html.dark-auto:not([data-msb-appearance]) h4,
html.dark-auto:not([data-msb-appearance]) h5,
html.dark-auto:not([data-msb-appearance]) h6,
html.dark-auto:not([data-msb-appearance]) p,
html.dark-auto:not([data-msb-appearance]) li,
html.dark-auto:not([data-msb-appearance]) td,
html.dark-auto:not([data-msb-appearance]) th,
html.dark-auto:not([data-msb-appearance]) input,
html.dark-auto:not([data-msb-appearance]) textarea,
html.dark-auto:not([data-msb-appearance]) select,
html.dark-auto:not([data-msb-appearance]) .form-control,
html.dark-auto:not([data-msb-appearance]) .feed-title,
html.dark-auto:not([data-msb-appearance]) .feed-desc,
html.dark-auto:not([data-msb-appearance]) .feed-date,
html.dark-auto:not([data-msb-appearance]) .feed-meta,
html.dark-auto:not([data-msb-appearance]) .mini-muted,
html.dark-auto:not([data-msb-appearance]) .feed-ig-link,
html.dark-auto:not([data-msb-appearance]) .ig-link,
html.dark-auto:not([data-msb-appearance]) .feed-ig-logo-label,
html.dark-auto:not([data-msb-appearance]) .nav-link,
html.dark-auto:not([data-msb-appearance]) .sh-sidebar-label,
body.dark-auto:not([data-msb-appearance]) .nav-link,
body.dark-auto.org-app:not([data-msb-appearance]) .nav-link,
body.dark-auto.org-app:not([data-msb-appearance]) .feed-card,
body.dark-auto.org-app:not([data-msb-appearance]) .feed-tabs a:not(.active),
body.dark-auto.org-app:not([data-msb-appearance]) .posts-tabs a:not(.active),
body.dark-auto.org-app:not([data-msb-appearance]) .publisher-hub-title,
body.dark-auto.org-app:not([data-msb-appearance]) .publisher-stat,
body.dark-auto.org-app:not([data-msb-appearance]) .link,
body.dark-auto.org-app:not([data-msb-appearance]) .read-more-btn {
  color: #b1bcce !important;
}

html.dark-auto:not([data-msb-appearance]) .btn-outline-primary,
html.dark-auto:not([data-msb-appearance]) .btn-outline-secondary,
html.dark-auto:not([data-msb-appearance]) .btn-outline-success,
html.dark-auto:not([data-msb-appearance]) .btn-close-x,
body.dark-auto.org-app:not([data-msb-appearance]) .btn,
body.dark-auto.org-app:not([data-msb-appearance]) a.btn,
body.dark-auto.org-app:not([data-msb-appearance]) button.btn,
body.dark-auto.org-app:not([data-msb-appearance]) .btn-outline-secondary,
body.dark-auto.org-app:not([data-msb-appearance]) .btn-outline-primary,
body.dark-auto.org-app:not([data-msb-appearance]) .feed-actions .btn-outline-success,
body.dark-auto.org-app:not([data-msb-appearance]) .sidebar-refresh-btn,
body.dark-auto.org-app:not([data-msb-appearance]) .pin-btn,
body.dark-auto.org-app:not([data-msb-appearance]) .btn-close-x {
  background-color: #252f3d !important;
  color: #e8edf5 !important;
  border-color: rgba(177, 188, 206, 0.48) !important;
}

html.dark-auto:not([data-msb-appearance]) body.org-app .posts-tabs a.active,
html.dark-auto:not([data-msb-appearance]) body.org-app .feed-tabs a.active,
body.dark-auto.org-app:not([data-msb-appearance]) .posts-tabs a.active,
body.dark-auto.org-app:not([data-msb-appearance]) .feed-tabs a.active {
  background-color: #2563eb !important;
  border-color: #2563eb !important;
  color: #ffffff !important;
}

html.dark-auto:not([data-msb-appearance]) body.org-app .posts-tabs a:not(.active),
html.dark-auto:not([data-msb-appearance]) body.org-app .feed-tabs a:not(.active),
body.dark-auto.org-app:not([data-msb-appearance]) .posts-tabs a:not(.active),
body.dark-auto.org-app:not([data-msb-appearance]) .feed-tabs a:not(.active) {
  background-color: #252f3d !important;
  border-color: rgba(177, 188, 206, 0.48) !important;
  color: #e8edf5 !important;
}

html.dark-auto:not([data-msb-appearance]) body.org-app .btn-primary,
html.dark-auto:not([data-msb-appearance]) body.org-app a.btn-primary,
html.dark-auto:not([data-msb-appearance]) body.org-app .btn-success,
body.dark-auto.org-app:not([data-msb-appearance]) .btn-primary,
body.dark-auto.org-app:not([data-msb-appearance]) a.btn-primary {
  background-color: var(--msb-palette-btn-bg, var(--org-accent, #2563eb)) !important;
  border-color: var(--msb-palette-btn-bg, var(--org-accent-strong, #1d4ed8)) !important;
  color: var(--msb-palette-btn-text, #ffffff) !important;
}

/* All buttons — Dark auto built-in theme contrast */
html.dark-auto:not([data-msb-appearance]) button,
html.dark-auto:not([data-msb-appearance]) .btn,
html.dark-auto:not([data-msb-appearance]) .ig-btn,
html.dark-auto:not([data-msb-appearance]) .feed-ig-btn,
html.dark-auto:not([data-msb-appearance]) .action-btn,
html.dark-auto:not([data-msb-appearance]) .topicon-btn,
html.dark-auto:not([data-msb-appearance]) .yt-icon-btn,
html.dark-auto:not([data-msb-appearance]) .search-btn,
html.dark-auto:not([data-msb-appearance]) .iconbtn,
html.dark-auto:not([data-msb-appearance]) .messages-shell-action-btn,
html.dark-auto:not([data-msb-appearance]) body.profile-page .gear-upload-btn,
html[data-theme="dark"]:not([data-msb-appearance]) button,
html[data-theme="dark"]:not([data-msb-appearance]) .btn,
html[data-theme="dark"]:not([data-msb-appearance]) .ig-btn,
html[data-theme="dark"]:not([data-msb-appearance]) .feed-ig-btn {
  /* background-color: var(--msb-palette-surface-2, var(--msb-palette-hover-bg, #252f3d)) !important; */
  background-image: none !important;
  border-color: var(--msb-palette-border-strong, rgba(177, 188, 206, 0.48)) !important;
  color: var(--msb-palette-text, #e8edf5) !important;
}

html.dark-auto:not([data-msb-appearance]) .btn-primary,
html.dark-auto:not([data-msb-appearance]) button.btn-primary,
html.dark-auto:not([data-msb-appearance]) a.btn-primary,
html.dark-auto:not([data-msb-appearance]) .btn-success,
html.dark-auto:not([data-msb-appearance]) button.btn-success,
html.dark-auto:not([data-msb-appearance]) a.btn-success,
html.dark-auto:not([data-msb-appearance]) .ch-btn-primary,
html.dark-auto:not([data-msb-appearance]) button.ch-btn-primary,
html.dark-auto:not([data-msb-appearance]) a.ch-btn-primary,
html.dark-auto:not([data-msb-appearance]) body.profile-page .gear-detail-open-btn,
html.dark-auto:not([data-msb-appearance]) body.profile-page .about-edit-btn,
html.dark-auto:not([data-msb-appearance]) body.profile-page .profile-shop-buy-btn,
html[data-theme="dark"]:not([data-msb-appearance]) .btn-primary,
html[data-theme="dark"]:not([data-msb-appearance]) button.btn-primary,
html[data-theme="dark"]:not([data-msb-appearance]) a.btn-primary,
html[data-theme="dark"]:not([data-msb-appearance]) .ch-btn-primary {
  background-color: var(--msb-palette-btn-bg, #2563eb) !important;
  border-color: var(--msb-palette-btn-bg, #2563eb) !important;
  color: var(--msb-palette-btn-text, #ffffff) !important;
}

html.dark-auto:not([data-msb-appearance]) .btn-primary:hover,
html.dark-auto:not([data-msb-appearance]) button.btn-primary:hover,
html.dark-auto:not([data-msb-appearance]) a.btn-primary:hover,
html.dark-auto:not([data-msb-appearance]) .ch-btn-primary:hover,
html.dark-auto:not([data-msb-appearance]) body.profile-page .gear-detail-open-btn:hover,
html.dark-auto:not([data-msb-appearance]) body.profile-page .gear-upload-btn:hover,
html[data-theme="dark"]:not([data-msb-appearance]) .btn-primary:hover,
html[data-theme="dark"]:not([data-msb-appearance]) a.btn-primary:hover {
  background-color: var(--msb-palette-btn-hover-bg, #1d4ed8) !important;
  border-color: var(--msb-palette-btn-hover-bg, #1d4ed8) !important;
  color: var(--msb-palette-btn-text, #ffffff) !important;
}

html.dark-auto:not([data-msb-appearance]) .btn:hover,
html.dark-auto:not([data-msb-appearance]) button:hover,
html.dark-auto:not([data-msb-appearance]) .ig-btn:hover,
html.dark-auto:not([data-msb-appearance]) .feed-ig-btn:hover,
html.dark-auto:not([data-msb-appearance]) body.profile-page .gear-nav-item:hover,
html[data-theme="dark"]:not([data-msb-appearance]) .btn:hover,
html[data-theme="dark"]:not([data-msb-appearance]) button:hover {
  /* background-color: var(--msb-palette-hover-bg, #2f3a4a) !important; */
  color: var(--msb-palette-text-on-hover, #e8edf5) !important;
}

html.dark-auto:not([data-msb-appearance]) .btn-primary i,
html.dark-auto:not([data-msb-appearance]) .btn-primary .icon,
html.dark-auto:not([data-msb-appearance]) button.btn-primary i,
html.dark-auto:not([data-msb-appearance]) a.btn-primary i,
html.dark-auto:not([data-msb-appearance]) .ch-btn-primary i,
html.dark-auto:not([data-msb-appearance]) body.profile-page .gear-detail-open-btn i,
html[data-theme="dark"]:not([data-msb-appearance]) .btn-primary i,
html[data-theme="dark"]:not([data-msb-appearance]) a.btn-primary i {
  color: var(--msb-palette-btn-text, #ffffff) !important;
}

html:not(.dark-auto):not([data-msb-appearance]) .btn-primary,
html:not(.dark-auto):not([data-msb-appearance]) button.btn-primary,
html:not(.dark-auto):not([data-msb-appearance]) a.btn-primary,
html:not(.dark-auto):not([data-msb-appearance]) .btn-success,
html:not(.dark-auto):not([data-msb-appearance]) .ch-btn-primary,
html:not(.dark-auto):not([data-msb-appearance]) body.profile-page .gear-detail-open-btn,
html:not(.dark-auto):not([data-msb-appearance]) body.profile-page .gear-upload-btn {
  background-color: var(--msb-palette-btn-bg, #2563eb) !important;
  border-color: var(--msb-palette-btn-bg, #2563eb) !important;
  color: var(--msb-palette-btn-text, #ffffff) !important;
}

html:not(.dark-auto):not([data-msb-appearance]) .btn:not(.btn-primary):not(.btn-success),
html:not(.dark-auto):not([data-msb-appearance]) button.btn:not(.btn-primary),
html:not(.dark-auto):not([data-msb-appearance]) .ig-btn {
  background-color: var(--msb-palette-surface-2, var(--msb-palette-bg, #f5f7fb)) !important;
  border-color: var(--msb-palette-border-strong, rgba(15,23,42,.14)) !important;
  color: var(--msb-palette-text, #0f172a) !important;
}

html:not(.dark-auto):not([data-msb-appearance]) body.profile-page .gear-nav-item,
html:not(.dark-auto):not([data-msb-appearance]) body.profile-page .gear-nav-section-toggle,
html:not(.dark-auto):not([data-msb-appearance]) body.profile-page .gear-archive-shortcut {
  background-color: transparent !important;
  border: 0 !important;
  border-color: transparent !important;
  box-shadow: none !important;
  color: var(--msb-palette-text, #0f172a) !important;
}

/* All spans — Dark auto built-in theme contrast */
html.dark-auto:not([data-msb-appearance]) body.profile-page .gear-chip,
html.dark-auto:not([data-msb-appearance]) span.gear-chip,
html[data-theme="dark"]:not([data-msb-appearance]) body.profile-page .gear-chip,
html[data-theme="dark"]:not([data-msb-appearance]) span.gear-chip {
  background-color: var(--msb-palette-action-soft, var(--msb-palette-nav-active-bg, rgba(37,99,235,.18))) !important;
  background-image: none !important;
  border-color: var(--msb-palette-border-strong, rgba(177, 188, 206, 0.48)) !important;
  color: var(--msb-palette-nav-active-text, var(--msb-palette-action, #93c5fd)) !important;
}

html.dark-auto:not([data-msb-appearance]) body.profile-page .gear-tag,
html.dark-auto:not([data-msb-appearance]) span.gear-tag,
html.dark-auto:not([data-msb-appearance]) span.badge,
html.dark-auto:not([data-msb-appearance]) .badge,
html.dark-auto:not([data-msb-appearance]) .badge-light,
html.dark-auto:not([data-msb-appearance]) span.feed-badge,
html.dark-auto:not([data-msb-appearance]) .feed-badge,
html.dark-auto:not([data-msb-appearance]) span.stat-pill,
html.dark-auto:not([data-msb-appearance]) .stat-pill,
html.dark-auto:not([data-msb-appearance]) span.commerce-pill,
html.dark-auto:not([data-msb-appearance]) .commerce-pill,
html.dark-auto:not([data-msb-appearance]) span.commerce-order-badge,
html.dark-auto:not([data-msb-appearance]) .commerce-order-badge,
html.dark-auto:not([data-msb-appearance]) span.commerce-brand-card-badge,
html.dark-auto:not([data-msb-appearance]) .commerce-brand-card-badge,
html.dark-auto:not([data-msb-appearance]) span.pv-pill,
html.dark-auto:not([data-msb-appearance]) .pv-pill,
html.dark-auto:not([data-msb-appearance]) span.pv-likepill,
html.dark-auto:not([data-msb-appearance]) .pv-likepill,
html.dark-auto:not([data-msb-appearance]) span.sidebar-pill,
html.dark-auto:not([data-msb-appearance]) .sidebar-pill,
html.dark-auto:not([data-msb-appearance]) span.msg-pill,
html.dark-auto:not([data-msb-appearance]) .msg-pill,
html.dark-auto:not([data-msb-appearance]) span.msg-reaction-pill,
html.dark-auto:not([data-msb-appearance]) .msg-reaction-pill,
html.dark-auto:not([data-msb-appearance]) span.live-modal-badge,
html.dark-auto:not([data-msb-appearance]) .live-modal-badge,
html.dark-auto:not([data-msb-appearance]) span.sidebar-chip,
html.dark-auto:not([data-msb-appearance]) .sidebar-chip,
html.dark-auto:not([data-msb-appearance]) span.ig-profile-love-count,
html.dark-auto:not([data-msb-appearance]) .ig-profile-love-count,
html[data-theme="dark"]:not([data-msb-appearance]) body.profile-page .gear-tag,
html[data-theme="dark"]:not([data-msb-appearance]) span.gear-tag,
html[data-theme="dark"]:not([data-msb-appearance]) span.stat-pill,
html[data-theme="dark"]:not([data-msb-appearance]) .stat-pill,
html[data-theme="dark"]:not([data-msb-appearance]) span.commerce-pill,
html[data-theme="dark"]:not([data-msb-appearance]) .commerce-pill {
  background-color: var(--msb-palette-surface-2, var(--msb-palette-hover-bg, #252f3d)) !important;
  background-image: none !important;
  border-color: var(--msb-palette-border-strong, rgba(177, 188, 206, 0.48)) !important;
  color: var(--msb-palette-text, #e8edf5) !important;
}

html.dark-auto:not([data-msb-appearance]) .stat-pill .num,
html.dark-auto:not([data-msb-appearance]) .pv-likepill span,
html[data-theme="dark"]:not([data-msb-appearance]) .stat-pill .num,
html[data-theme="dark"]:not([data-msb-appearance]) .pv-likepill span {
  color: var(--msb-palette-text, #e8edf5) !important;
  background-color: transparent !important;
}

html.dark-auto:not([data-msb-appearance]) .stat-pill .lbl,
html.dark-auto:not([data-msb-appearance]) .stat-pill .sub,
html[data-theme="dark"]:not([data-msb-appearance]) .stat-pill .lbl,
html[data-theme="dark"]:not([data-msb-appearance]) .stat-pill .sub {
  color: var(--msb-palette-text-muted, #cbd5e1) !important;
  background-color: transparent !important;
}

html.dark-auto:not([data-msb-appearance]) .stat-pill .icon,
html.dark-auto:not([data-msb-appearance]) .stat-pill i,
html.dark-auto:not([data-msb-appearance]) .commerce-pill i,
html.dark-auto:not([data-msb-appearance]) .pv-likepill i,
html.dark-auto:not([data-msb-appearance]) .feed-badge i,
html.dark-auto:not([data-msb-appearance]) .badge i,
html.dark-auto:not([data-msb-appearance]) span.sidebar-chip i,
html[data-theme="dark"]:not([data-msb-appearance]) .stat-pill i,
html[data-theme="dark"]:not([data-msb-appearance]) .commerce-pill i {
  color: var(--msb-palette-icon, var(--msb-palette-text, #e8edf5)) !important;
}

html.dark-auto:not([data-msb-appearance]) .stat-pill .icon,
html[data-theme="dark"]:not([data-msb-appearance]) .stat-pill .icon {
  background-color: var(--msb-palette-hover-bg, #111827) !important;
}

html.dark-auto:not([data-msb-appearance]) body.profile-page .gear-nav-section-label,
html.dark-auto:not([data-msb-appearance]) body.profile-page .gear-nav-item-meta,
html.dark-auto:not([data-msb-appearance]) body.profile-page .gear-upload-hint,
html.dark-auto:not([data-msb-appearance]) body.profile-page .gear-detail-control-label,
html.dark-auto:not([data-msb-appearance]) body.profile-page .gear-nav-section-chevron,
html.dark-auto:not([data-msb-appearance]) body.profile-page .gear-save-state,
html.dark-auto:not([data-msb-appearance]) .nav-link > span,
html.dark-auto:not([data-msb-appearance]) .sh-icon-link > span,
html.dark-auto:not([data-msb-appearance]) body.org-app .sidebar-meta > span,
html.dark-auto:not([data-msb-appearance]) .mf-num,
html.dark-auto:not([data-msb-appearance]) .pv-n,
html.dark-auto:not([data-msb-appearance]) .pv-views,
html.dark-auto:not([data-msb-appearance]) .ig-story-name,
html.dark-auto:not([data-msb-appearance]) span.muted,
html[data-theme="dark"]:not([data-msb-appearance]) body.profile-page .gear-nav-section-label,
html[data-theme="dark"]:not([data-msb-appearance]) body.profile-page .gear-nav-item-meta,
html[data-theme="dark"]:not([data-msb-appearance]) .nav-link > span,
html[data-theme="dark"]:not([data-msb-appearance]) span.muted {
  background-color: transparent !important;
  color: var(--msb-palette-text, #e8edf5) !important;
}

html.dark-auto:not([data-msb-appearance]) body.profile-page .gear-nav-item-meta,
html.dark-auto:not([data-msb-appearance]) body.profile-page .gear-upload-hint,
html.dark-auto:not([data-msb-appearance]) body.profile-page .gear-nav-section-chevron,
html.dark-auto:not([data-msb-appearance]) body.profile-page .gear-save-state:not(.is-saving):not(.is-saved):not(.is-error),
html.dark-auto:not([data-msb-appearance]) span.muted,
html[data-theme="dark"]:not([data-msb-appearance]) body.profile-page .gear-nav-item-meta,
html[data-theme="dark"]:not([data-msb-appearance]) span.muted {
  color: var(--msb-palette-text-muted, #b1bcce) !important;
}

html:not(.dark-auto):not([data-msb-appearance]) body.profile-page .gear-chip,
html:not(.dark-auto):not([data-msb-appearance]) span.gear-chip {
  background-color: var(--msb-palette-action-soft, #eef2ff) !important;
  border-color: var(--msb-palette-border-strong, rgba(15,23,42,.14)) !important;
  color: var(--msb-palette-nav-active-text, var(--msb-palette-action, #4338ca)) !important;
}

html:not(.dark-auto):not([data-msb-appearance]) body.profile-page .gear-tag,
html:not(.dark-auto):not([data-msb-appearance]) span.gear-tag,
html:not(.dark-auto):not([data-msb-appearance]) span.stat-pill,
html:not(.dark-auto):not([data-msb-appearance]) .stat-pill,
html:not(.dark-auto):not([data-msb-appearance]) span.commerce-pill,
html:not(.dark-auto):not([data-msb-appearance]) .commerce-pill,
html:not(.dark-auto):not([data-msb-appearance]) span.badge,
html:not(.dark-auto):not([data-msb-appearance]) .badge {
  background-color: var(--msb-palette-surface-2, var(--msb-palette-hover-bg, #f3f4f6)) !important;
  border-color: var(--msb-palette-border-strong, rgba(15,23,42,.14)) !important;
  color: var(--msb-palette-text, #0f172a) !important;
}

/* Profile header labels, stats, and tabs — theme contrast */
html.dark-auto:not([data-msb-appearance]) body.profile-page .ig-username,
html.dark-auto:not([data-msb-appearance]) body.profile-page .ig-stat,
html.dark-auto:not([data-msb-appearance]) body.profile-page b.ig-stat,
html.dark-auto:not([data-msb-appearance]) body.profile-page .ig-bio,
html[data-theme="dark"]:not([data-msb-appearance]) body.profile-page .ig-username,
html[data-theme="dark"]:not([data-msb-appearance]) body.profile-page .ig-stat,
html[data-theme="dark"]:not([data-msb-appearance]) body.profile-page b.ig-stat,
html[data-theme="dark"]:not([data-msb-appearance]) body.profile-page .ig-bio {
  background-color: transparent !important;
  background-image: none !important;
  color: var(--msb-palette-text, #e8edf5) !important;
}

html.dark-auto:not([data-msb-appearance]) body.profile-page .ig-tab:not(.active),
html[data-theme="dark"]:not([data-msb-appearance]) body.profile-page .ig-tab:not(.active) {
  background-color: transparent !important;
  color: var(--msb-palette-text-muted, #b1bcce) !important;
}

html.dark-auto:not([data-msb-appearance]) body.profile-page .ig-tab.active,
html[data-theme="dark"]:not([data-msb-appearance]) body.profile-page .ig-tab.active {
  background-color: var(--msb-palette-nav-active-bg, var(--msb-palette-surface-2, #252f3d)) !important;
  color: var(--msb-palette-nav-active-text, var(--msb-palette-text, #e8edf5)) !important;
  border-top-color: var(--msb-palette-nav-active-text, var(--msb-palette-text, #e8edf5)) !important;
}

html.dark-auto:not([data-msb-appearance]) body.profile-page .ig-tab.active i,
html[data-theme="dark"]:not([data-msb-appearance]) body.profile-page .ig-tab.active i {
  color: inherit !important;
}

html[data-msb-appearance] #ttLeftbarOverlays .tt-profile-wrap,
html[data-msb-appearance] #ttLeftbarOverlays .tt-profile-head,
html[data-msb-appearance] #ttLeftbarOverlays .tt-profile-body,
html[data-msb-appearance] .msb-profile-door-host .tt-profile-wrap,
html[data-msb-appearance] .msb-profile-door-host .tt-profile-head,
html[data-msb-appearance] .msb-profile-door-host .tt-profile-body {
  background-color: var(--msb-palette-bg) !important;
  background-image: none !important;
  color: var(--msb-palette-text, #0a0a0a) !important;
}

/* Profile door — dark auto built-in theme contrast */
html.dark-auto:not([data-msb-appearance]) #ttLeftbarOverlays .tt-profile-wrap,
html.dark-auto:not([data-msb-appearance]) #ttLeftbarOverlays .tt-profile-head,
html.dark-auto:not([data-msb-appearance]) #ttLeftbarOverlays .tt-profile-body,
html.dark-auto:not([data-msb-appearance]) .msb-profile-door-host .tt-profile-wrap,
html.dark-auto:not([data-msb-appearance]) .msb-profile-door-host .tt-profile-head,
html.dark-auto:not([data-msb-appearance]) .msb-profile-door-host .tt-profile-body,
html[data-theme="dark"]:not([data-msb-appearance]) #ttLeftbarOverlays .tt-profile-wrap,
html[data-theme="dark"]:not([data-msb-appearance]) #ttLeftbarOverlays .tt-profile-head,
html[data-theme="dark"]:not([data-msb-appearance]) #ttLeftbarOverlays .tt-profile-body,
html[data-theme="dark"]:not([data-msb-appearance]) .msb-profile-door-host .tt-profile-wrap,
html[data-theme="dark"]:not([data-msb-appearance]) .msb-profile-door-host .tt-profile-head,
html[data-theme="dark"]:not([data-msb-appearance]) .msb-profile-door-host .tt-profile-body {
  background-color: var(--msb-palette-bg, #171d24) !important;
  background-image: none !important;
  color: var(--msb-palette-text, #e8edf5) !important;
  border-color: var(--msb-palette-border, rgba(255,255,255,.12)) !important;
}

html.dark-auto:not([data-msb-appearance]) #ttLeftbarOverlays .tt-profile-head .title,
html.dark-auto:not([data-msb-appearance]) .msb-profile-door-host .tt-profile-head .title,
html[data-theme="dark"]:not([data-msb-appearance]) #ttLeftbarOverlays .tt-profile-head .title,
html[data-theme="dark"]:not([data-msb-appearance]) .msb-profile-door-host .tt-profile-head .title,
html[data-msb-appearance] #ttLeftbarOverlays .tt-profile-head .title,
html[data-msb-appearance] .msb-profile-door-host .tt-profile-head .title,
html.dark-auto #ttLeftbarOverlays .tt-menu-head .title,
html.dark-auto #ttLeftbarOverlays .tt-comments-head .title,
html[data-theme="dark"] #ttLeftbarOverlays .tt-menu-head .title,
html[data-theme="dark"] #ttLeftbarOverlays .tt-comments-head .title,
html[data-msb-appearance] #ttLeftbarOverlays .tt-menu-head .title,
html[data-msb-appearance] #ttLeftbarOverlays .tt-comments-head .title {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border-color: transparent !important;
  box-shadow: none !important;
}

html.dark-auto:not([data-msb-appearance]) #ttLeftbarOverlays .tt-profile-head .title,
html.dark-auto:not([data-msb-appearance]) #ttLeftbarOverlays .tt-profile-name,
html.dark-auto:not([data-msb-appearance]) #ttLeftbarOverlays .tt-profile-badge,
html.dark-auto:not([data-msb-appearance]) #ttLeftbarOverlays .tt-profile-nav a,
html.dark-auto:not([data-msb-appearance]) .msb-profile-door-host .tt-profile-head .title,
html.dark-auto:not([data-msb-appearance]) .msb-profile-door-host .tt-profile-name,
html.dark-auto:not([data-msb-appearance]) .msb-profile-door-host .tt-profile-badge,
html.dark-auto:not([data-msb-appearance]) .msb-profile-door-host .tt-profile-nav a,
html[data-theme="dark"]:not([data-msb-appearance]) #ttLeftbarOverlays .tt-profile-head .title,
html[data-theme="dark"]:not([data-msb-appearance]) #ttLeftbarOverlays .tt-profile-name,
html[data-theme="dark"]:not([data-msb-appearance]) #ttLeftbarOverlays .tt-profile-nav a {
  color: var(--msb-palette-text, #e8edf5) !important;
}

html.dark-auto:not([data-msb-appearance]) #ttLeftbarOverlays .tt-profile-email,
html.dark-auto:not([data-msb-appearance]) #ttLeftbarOverlays .tt-profile-code,
html.dark-auto:not([data-msb-appearance]) .msb-profile-door-host .tt-profile-email,
html.dark-auto:not([data-msb-appearance]) .msb-profile-door-host .tt-profile-code,
html[data-theme="dark"]:not([data-msb-appearance]) #ttLeftbarOverlays .tt-profile-email,
html[data-theme="dark"]:not([data-msb-appearance]) #ttLeftbarOverlays .tt-profile-code {
  color: var(--msb-palette-text-muted, #b1bcce) !important;
}

html.dark-auto:not([data-msb-appearance]) #ttLeftbarOverlays .tt-profile-nav a .icon,
html.dark-auto:not([data-msb-appearance]) .msb-profile-door-host .tt-profile-nav a .icon,
html[data-theme="dark"]:not([data-msb-appearance]) #ttLeftbarOverlays .tt-profile-nav a .icon {
  color: var(--msb-palette-icon, var(--msb-palette-text, #e8edf5)) !important;
}

html.dark-auto:not([data-msb-appearance]) #ttLeftbarOverlays .tt-profile-wrap .tt-close,
html.dark-auto:not([data-msb-appearance]) .msb-profile-door-host .tt-profile-wrap .tt-close,
html[data-theme="dark"]:not([data-msb-appearance]) #ttLeftbarOverlays .tt-profile-wrap .tt-close {
  background-color: var(--msb-palette-surface-2, var(--msb-palette-hover-bg, #252f3d)) !important;
  color: var(--msb-palette-text, #e8edf5) !important;
  border-color: var(--msb-palette-border-strong, rgba(177, 188, 206, 0.48)) !important;
}

html.dark-auto:not([data-msb-appearance]) #ttLeftbarOverlays .tt-profile-wrap .tt-close i,
html.dark-auto:not([data-msb-appearance]) .msb-profile-door-host .tt-profile-wrap .tt-close i,
html[data-theme="dark"]:not([data-msb-appearance]) #ttLeftbarOverlays .tt-profile-wrap .tt-close i {
  color: inherit !important;
}

html.dark-auto:not([data-msb-appearance]) #ttLeftbarOverlays .tt-profile-nav a:hover,
html.dark-auto:not([data-msb-appearance]) #ttLeftbarOverlays .tt-profile-nav a:focus,
html.dark-auto:not([data-msb-appearance]) .msb-profile-door-host .tt-profile-nav a:hover,
html[data-theme="dark"]:not([data-msb-appearance]) #ttLeftbarOverlays .tt-profile-nav a:hover {
  background-color: var(--msb-palette-hover-bg, #2f3a4a) !important;
  color: var(--msb-palette-text-on-hover, #e8edf5) !important;
}

html.dark-auto:not([data-msb-appearance]) #ttLeftbarOverlays .tt-profile-divider,
html.dark-auto:not([data-msb-appearance]) .msb-profile-door-host .tt-profile-divider,
html[data-theme="dark"]:not([data-msb-appearance]) #ttLeftbarOverlays .tt-profile-divider {
  background-color: var(--msb-palette-border-strong, rgba(177, 188, 206, 0.48)) !important;
}

html.dark-auto:not([data-msb-appearance]) #ttLeftbarOverlays .tt-profile-nav a .icon,
html.dark-auto:not([data-msb-appearance]) .msb-profile-door-host .tt-profile-nav a .icon,
html[data-theme="dark"]:not([data-msb-appearance]) #ttLeftbarOverlays .tt-profile-nav a .icon {
  color: var(--msb-palette-text, #e8edf5) !important;
  opacity: 1 !important;
}

html.dark-auto:not([data-msb-appearance]) #ttLeftbarOverlays .tt-profile-email,
html.dark-auto:not([data-msb-appearance]) #ttLeftbarOverlays .tt-profile-code,
html.dark-auto:not([data-msb-appearance]) .msb-profile-door-host .tt-profile-email,
html.dark-auto:not([data-msb-appearance]) .msb-profile-door-host .tt-profile-code,
html[data-theme="dark"]:not([data-msb-appearance]) #ttLeftbarOverlays .tt-profile-email,
html[data-theme="dark"]:not([data-msb-appearance]) #ttLeftbarOverlays .tt-profile-code {
  color: var(--msb-palette-text-muted, var(--msb-palette-text, #cbd5e1)) !important;
}

html.dark-auto:not([data-msb-appearance]) #ttLeftbarOverlays .tt-menu-body .feed-left-nav-item,
html.dark-auto:not([data-msb-appearance]) #ttLeftbarOverlays .tt-menu-body .feed-left-nav-label,
html.dark-auto:not([data-msb-appearance]) #ttLeftbarOverlays .tt-menu-body .feed-left-nav-ic,
html[data-theme="dark"]:not([data-msb-appearance]) #ttLeftbarOverlays .tt-menu-body .feed-left-nav-label {
  color: var(--msb-palette-text, #e8edf5) !important;
}

html[data-msb-appearance] body.profile-page .ig-username,
html[data-msb-appearance] body.profile-page .ig-stat,
html[data-msb-appearance] body.profile-page b.ig-stat,
html[data-msb-appearance] body.profile-page .ig-bio {
  background-color: transparent !important;
  background-image: none !important;
}

html.dark-auto:not([data-msb-appearance]) body.org-app .sh-sideleft-menu .nav > .nav-item > .nav-link:hover,
html.dark-auto:not([data-msb-appearance]) body.org-app .org-sideleft-scroll .nav > .nav-item > .nav-link:hover,
html.dark-auto:not([data-msb-appearance]) body.org-app .sh-sideleft-menu .nav > .nav-item > .nav-link:hover span,
html.dark-auto:not([data-msb-appearance]) body.org-app .sh-sideleft-menu .nav > .nav-item > .nav-link:hover i,
html.dark-auto:not([data-msb-appearance]) body.org-app .sh-sideleft-menu .nav > .nav-item > .nav-link:hover .icon,
html.dark-auto:not([data-msb-appearance]) body.org-app .sh-sideleft-menu .nav > .nav-item > .nav-link:hover [class*="ion-"],
html.dark-auto:not([data-msb-appearance]) body.org-app .org-sideleft-scroll .nav > .nav-item > .nav-link:hover span,
html.dark-auto:not([data-msb-appearance]) body.org-app .org-sideleft-scroll .nav > .nav-item > .nav-link:hover i,
html.dark-auto:not([data-msb-appearance]) body.org-app .org-sideleft-scroll .nav > .nav-item > .nav-link:hover .icon,
html.dark-auto:not([data-msb-appearance]) body.org-app .org-sideleft-scroll .nav > .nav-item > .nav-link:hover [class*="ion-"],
body.dark-auto.org-app:not([data-msb-appearance]) .sh-sideleft-menu .nav > .nav-item > .nav-link:hover,
body.dark-auto.org-app:not([data-msb-appearance]) .org-sideleft-scroll .nav > .nav-item > .nav-link:hover {
  background-color: #2f3a4a !important;
  color: #e8edf5 !important;
}

html.dark-auto:not([data-msb-appearance]) body.org-app .sh-sideleft-menu .nav > .nav-item > .nav-link.active,
html.dark-auto:not([data-msb-appearance]) body.org-app .org-sideleft-scroll .nav > .nav-item > .nav-link.active,
html.dark-auto:not([data-msb-appearance]) body.org-app .sh-sideleft-menu .nav > .nav-item > .nav-link.active span,
html.dark-auto:not([data-msb-appearance]) body.org-app .sh-sideleft-menu .nav > .nav-item > .nav-link.active i,
html.dark-auto:not([data-msb-appearance]) body.org-app .sh-sideleft-menu .nav > .nav-item > .nav-link.active .icon,
html.dark-auto:not([data-msb-appearance]) body.org-app .sh-sideleft-menu .nav > .nav-item > .nav-link.active [class*="ion-"],
html.dark-auto:not([data-msb-appearance]) body.org-app .org-sideleft-scroll .nav > .nav-item > .nav-link.active span,
html.dark-auto:not([data-msb-appearance]) body.org-app .org-sideleft-scroll .nav > .nav-item > .nav-link.active i,
html.dark-auto:not([data-msb-appearance]) body.org-app .org-sideleft-scroll .nav > .nav-item > .nav-link.active .icon,
html.dark-auto:not([data-msb-appearance]) body.org-app .org-sideleft-scroll .nav > .nav-item > .nav-link.active [class*="ion-"],
body.dark-auto.org-app:not([data-msb-appearance]) .sh-sideleft-menu .nav > .nav-item > .nav-link.active,
body.dark-auto.org-app:not([data-msb-appearance]) .org-sideleft-scroll .nav > .nav-item > .nav-link.active {
  background-color: rgba(96, 165, 250, 0.2) !important;
  color: #ffffff !important;
}

body.dark-auto.org-app:not([data-msb-appearance]) .org-header-chip,
html.dark-auto:not([data-msb-appearance]) body.org-app .org-header-chip {
  background-color: #252f3d !important;
  border-color: rgba(177, 188, 206, 0.32) !important;
}

body.dark-auto.org-app:not([data-msb-appearance]) .org-header-chip:hover,
html.dark-auto:not([data-msb-appearance]) body.org-app .org-header-chip:hover {
  background-color: #2f3a4a !important;
}

body.dark-auto.org-app:not([data-msb-appearance]) .sh-icon-link,
html.dark-auto:not([data-msb-appearance]) body.org-app .sh-icon-link {
  color: #b1bcce !important;
}

body.dark-auto.org-app:not([data-msb-appearance]) .sh-icon-link:hover,
html.dark-auto:not([data-msb-appearance]) body.org-app .sh-icon-link:hover {
  color: #e8edf5 !important;
  background-color: #2f3a4a !important;
}

/* =====================================================
   ORG LIGHT CANVAS — Light/System Gear appearance by day
   White only when Dark auto is not painting night (no .dark-auto).
   At night with Dark auto ON, org follows the same #171d24 canvas.
   ===================================================== */
html[data-msb-org-light]:not(.dark-auto):not([data-msb-appearance]) {
  --bg-main: #ffffff;
  --bg-card: #ffffff;
  --bg-sidebar: #ffffff;
}

html[data-msb-org-light].dark-auto:not([data-msb-appearance]),
html[data-msb-org-light].dark-auto:not([data-msb-appearance]) body.org-app {
  background: #171d24 !important;
  background-color: #171d24 !important;
  color: #e8edf5 !important;
  color-scheme: dark;
  --studio-bg: #171d24;
  --studio-text: #e8edf5;
  --msb-dark-auto-chrome: #111827;
  --bg-main: #171d24;
  --bg-card: #171d24;
  --bg-sidebar: #171d24;
  --text-primary: #e8edf5;
  --text-secondary: #b1bcce;
  --text-muted: #b1bcce;
  --border-color: #334155;
}

html[data-msb-org-light]:not(.dark-auto):not([data-msb-appearance]) body.org-app,
html[data-msb-org-light]:not(.dark-auto):not([data-msb-appearance]) body.org-app .sh-mainpanel,
html[data-msb-org-light]:not(.dark-auto):not([data-msb-appearance]) body.org-app .sh-pagebody,
html[data-msb-org-light]:not(.dark-auto):not([data-msb-appearance]) body.org-app .sh-sideleft-menu,
html[data-msb-org-light]:not(.dark-auto):not([data-msb-appearance]) body.org-app .org-sideleft-scroll,
html[data-msb-org-light]:not(.dark-auto):not([data-msb-appearance]) body.org-app .feed-layout,
html[data-msb-org-light]:not(.dark-auto):not([data-msb-appearance]) body.org-app .feed-main,
html[data-msb-org-light]:not(.dark-auto):not([data-msb-appearance]) body.org-app .feed-sidebar,
html[data-msb-org-light]:not(.dark-auto):not([data-msb-appearance]) body.org-app .feed-card,
html[data-msb-org-light]:not(.dark-auto):not([data-msb-appearance]) body.org-app .rows-scroll,
html[data-msb-org-light]:not(.dark-auto):not([data-msb-appearance]) body.org-app .sidebar-head,
html[data-msb-org-light]:not(.dark-auto):not([data-msb-appearance]) body.org-app .sidebar-list,
html[data-msb-org-light]:not(.dark-auto):not([data-msb-appearance]) body.org-app .dashboard-card,
html[data-msb-org-light]:not(.dark-auto):not([data-msb-appearance]) body.org-app .card,
html[data-msb-org-light]:not(.dark-auto):not([data-msb-appearance]) body.org-app .card-body {
  background: #ffffff !important;
  background-color: #ffffff !important;
  background-image: none !important;
  color: #111827 !important;
}

html[data-msb-org-light].dark-auto:not([data-msb-appearance]) body.org-app,
html[data-msb-org-light].dark-auto:not([data-msb-appearance]) body.org-app .sh-mainpanel,
html[data-msb-org-light].dark-auto:not([data-msb-appearance]) body.org-app .sh-pagebody,
html[data-msb-org-light].dark-auto:not([data-msb-appearance]) body.org-app .sh-sideleft-menu,
html[data-msb-org-light].dark-auto:not([data-msb-appearance]) body.org-app .org-sideleft-scroll,
html[data-msb-org-light].dark-auto:not([data-msb-appearance]) body.org-app .feed-layout,
html[data-msb-org-light].dark-auto:not([data-msb-appearance]) body.org-app .feed-main,
html[data-msb-org-light].dark-auto:not([data-msb-appearance]) body.org-app .feed-sidebar,
html[data-msb-org-light].dark-auto:not([data-msb-appearance]) body.org-app .feed-card,
html[data-msb-org-light].dark-auto:not([data-msb-appearance]) body.org-app .feed-post-detail,
html[data-msb-org-light].dark-auto:not([data-msb-appearance]) body.org-app .feed-compose,
html[data-msb-org-light].dark-auto:not([data-msb-appearance]) body.org-app .comment-item,
html[data-msb-org-light].dark-auto:not([data-msb-appearance]) body.org-app .rows-scroll,
html[data-msb-org-light].dark-auto:not([data-msb-appearance]) body.org-app .sidebar-head,
html[data-msb-org-light].dark-auto:not([data-msb-appearance]) body.org-app .sidebar-list,
html[data-msb-org-light].dark-auto:not([data-msb-appearance]) body.org-app .dashboard-card,
html[data-msb-org-light].dark-auto:not([data-msb-appearance]) body.org-app .card,
html[data-msb-org-light].dark-auto:not([data-msb-appearance]) body.org-app .card-body {
  background: #171d24 !important;
  background-color: #171d24 !important;
  background-image: none !important;
  color: #e8edf5 !important;
}

html[data-msb-org-light].dark-auto:not([data-msb-appearance]) body.org-app .sidebar-search,
html[data-msb-org-light].dark-auto:not([data-msb-appearance]) body.org-app .feed-compose-input,
html[data-msb-org-light].dark-auto:not([data-msb-appearance]) body.org-app .org-pill,
html[data-msb-org-light].dark-auto:not([data-msb-appearance]) body.org-app .sh-headpanel-right .ig-feed-account-badge {
  background: #252f3d !important;
  background-color: #252f3d !important;
  background-image: none !important;
  color: #e8edf5 !important;
  border-color: rgba(177, 188, 206, 0.38) !important;
}

html[data-msb-org-light].dark-auto:not([data-msb-appearance]) body.org-app .compose-card,
html[data-msb-org-light].dark-auto:not([data-msb-appearance]) body.org-app .compose-intro,
html[data-msb-org-light].dark-auto:not([data-msb-appearance]) body.org-app .compose-preview,
html[data-msb-org-light].dark-auto:not([data-msb-appearance]) body.org-app .actions-fixed,
html[data-msb-org-light].dark-auto:not([data-msb-appearance]) body.org-app .card-body-fixed {
  background: #171d24 !important;
  background-color: #171d24 !important;
  background-image: none !important;
  color: #e8edf5 !important;
  border-color: #334155 !important;
}

html[data-msb-org-light].dark-auto:not([data-msb-appearance]) body.org-app .compose-preview {
  background: #1e2733 !important;
  background-color: #1e2733 !important;
}

html[data-msb-org-light].dark-auto:not([data-msb-appearance]) body.org-app .chat-shell,
html[data-msb-org-light].dark-auto:not([data-msb-appearance]) body.org-app .chat-left,
html[data-msb-org-light].dark-auto:not([data-msb-appearance]) body.org-app .chat-right,
html[data-msb-org-light].dark-auto:not([data-msb-appearance]) body.org-app .fixed-card,
html[data-msb-org-light].dark-auto:not([data-msb-appearance]) body.org-app .fixed-head,
html[data-msb-org-light].dark-auto:not([data-msb-appearance]) body.org-app .fixed-body,
html[data-msb-org-light].dark-auto:not([data-msb-appearance]) body.org-app .members-list-wrap,
html[data-msb-org-light].dark-auto:not([data-msb-appearance]) body.org-app .members-search,
html[data-msb-org-light].dark-auto:not([data-msb-appearance]) body.org-app .members-scroll,
html[data-msb-org-light].dark-auto:not([data-msb-appearance]) body.org-app .conv-split,
html[data-msb-org-light].dark-auto:not([data-msb-appearance]) body.org-app .conv-main,
html[data-msb-org-light].dark-auto:not([data-msb-appearance]) body.org-app .conv-topbar,
html[data-msb-org-light].dark-auto:not([data-msb-appearance]) body.org-app .conv-history,
html[data-msb-org-light].dark-auto:not([data-msb-appearance]) body.org-app .history-card,
html[data-msb-org-light].dark-auto:not([data-msb-appearance]) body.org-app .history-head,
html[data-msb-org-light].dark-auto:not([data-msb-appearance]) body.org-app .history-search,
html[data-msb-org-light].dark-auto:not([data-msb-appearance]) body.org-app .history-scroll,
html[data-msb-org-light].dark-auto:not([data-msb-appearance]) body.org-app .msg-scroll,
html[data-msb-org-light].dark-auto:not([data-msb-appearance]) body.org-app .composer-fixed,
html[data-msb-org-light].dark-auto:not([data-msb-appearance]) body.org-app .search-bar,
html[data-msb-org-light].dark-auto:not([data-msb-appearance]) body.org-app .list-group-item {
  background: #171d24 !important;
  background-color: #171d24 !important;
  background-image: none !important;
  color: #e8edf5 !important;
  border-color: #334155 !important;
}

html[data-msb-org-light].dark-auto:not([data-msb-appearance]) body.org-app .members-search input,
html[data-msb-org-light].dark-auto:not([data-msb-appearance]) body.org-app .history-search input,
html[data-msb-org-light].dark-auto:not([data-msb-appearance]) body.org-app .composer-row textarea {
  background: #252f3d !important;
  background-color: #252f3d !important;
  color: #e8edf5 !important;
  border-color: rgba(177, 188, 206, 0.38) !important;
}

html[data-msb-org-light].dark-auto:not([data-msb-appearance]) body.org-app .sidebar-search::placeholder,
html[data-msb-org-light].dark-auto:not([data-msb-appearance]) body.org-app .feed-compose-input::placeholder {
  color: #b1bcce !important;
  opacity: 0.72;
}

/* Keep love reactions pink (same as picker) */
html.dark-auto:not([data-msb-appearance]) .is-love,
html.dark-auto:not([data-msb-appearance]) .is-loved,
html.dark-auto:not([data-msb-appearance]) .mf-act.is-love,
html.dark-auto:not([data-msb-appearance]) .mf-act.is-love i,
html.dark-auto:not([data-msb-appearance]) .ig-profile-love-btn.is-loved,
html.dark-auto:not([data-msb-appearance]) .ig-profile-love-btn.is-loved i {
  color: var(--msb-rx-love, var(--msb-love-color, #ff4d6d)) !important;
}

/* Profile door — final contrast (wins over overlay + dark-auto inheritance) */
html #ttLeftbarOverlays .tt-profile-head .title,
html .msb-profile-door-host .tt-profile-head .title,
html #ttLeftbarOverlays .tt-profile-name,
html .msb-profile-door-host .tt-profile-name,
html #ttLeftbarOverlays .tt-profile-badge,
html .msb-profile-door-host .tt-profile-badge,
html #ttLeftbarOverlays .tt-profile-nav a,
html .msb-profile-door-host .tt-profile-nav a {
  color: var(--msb-palette-text, var(--tt-text, #101828)) !important;
  -webkit-text-fill-color: var(--msb-palette-text, var(--tt-text, #101828)) !important;
  background: transparent !important;
  background-color: transparent !important;
}

html #ttLeftbarOverlays .tt-profile-nav a .icon,
html .msb-profile-door-host .tt-profile-nav a .icon {
  color: var(--msb-palette-text, var(--msb-palette-icon, var(--tt-text, #101828))) !important;
  opacity: 1 !important;
}

html #ttLeftbarOverlays .tt-profile-email,
html #ttLeftbarOverlays .tt-profile-code,
html .msb-profile-door-host .tt-profile-email,
html .msb-profile-door-host .tt-profile-code {
  color: var(--msb-palette-text-muted, var(--msb-palette-text, var(--tt-muted, #475569))) !important;
  opacity: 1 !important;
}

html.dark-auto:not([data-msb-appearance]) #ttLeftbarOverlays .tt-profile-head .title,
html.dark-auto:not([data-msb-appearance]) #ttLeftbarOverlays .tt-profile-name,
html.dark-auto:not([data-msb-appearance]) #ttLeftbarOverlays .tt-profile-badge,
html.dark-auto:not([data-msb-appearance]) #ttLeftbarOverlays .tt-profile-nav a,
html.dark-auto:not([data-msb-appearance]) .msb-profile-door-host .tt-profile-head .title,
html.dark-auto:not([data-msb-appearance]) .msb-profile-door-host .tt-profile-name,
html.dark-auto:not([data-msb-appearance]) .msb-profile-door-host .tt-profile-nav a,
html[data-theme="dark"]:not([data-msb-appearance]) #ttLeftbarOverlays .tt-profile-head .title,
html[data-theme="dark"]:not([data-msb-appearance]) #ttLeftbarOverlays .tt-profile-nav a {
  color: var(--msb-palette-text, var(--tt-text, #e8edf5)) !important;
  -webkit-text-fill-color: var(--msb-palette-text, var(--tt-text, #e8edf5)) !important;
}

html[data-msb-appearance] #ttLeftbarOverlays .tt-profile-head .title,
html[data-msb-appearance] #ttLeftbarOverlays .tt-profile-name,
html[data-msb-appearance] #ttLeftbarOverlays .tt-profile-badge,
html[data-msb-appearance] #ttLeftbarOverlays .tt-profile-nav a,
html[data-msb-appearance] .msb-profile-door-host .tt-profile-head .title,
html[data-msb-appearance] .msb-profile-door-host .tt-profile-name,
html[data-msb-appearance] .msb-profile-door-host .tt-profile-nav a,
html.dark-auto[data-msb-appearance] #ttLeftbarOverlays .tt-profile-head .title,
html.dark-auto[data-msb-appearance] #ttLeftbarOverlays .tt-profile-name,
html.dark-auto[data-msb-appearance] #ttLeftbarOverlays .tt-profile-nav a,
html.dark-auto[data-msb-appearance] .msb-profile-door-host .tt-profile-nav a {
  color: var(--msb-palette-text) !important;
  -webkit-text-fill-color: var(--msb-palette-text) !important;
}

html[data-msb-appearance] #ttLeftbarOverlays .tt-profile-nav a .icon,
html[data-msb-appearance] .msb-profile-door-host .tt-profile-nav a .icon,
html.dark-auto[data-msb-appearance] #ttLeftbarOverlays .tt-profile-nav a .icon {
  color: var(--msb-palette-text) !important;
}

/* Shop left rail + storefront cards — Gear dark / auto / appearance / progress */
html.dark-auto:not([data-msb-appearance]) body.shop-page .feed-left-rail,
html.dark-auto:not([data-msb-appearance]) body.shop-page .feed-left-rail-page-head,
html.dark-auto:not([data-msb-appearance]) body.shop-page .feed-left-nav,
html.dark-auto:not([data-msb-appearance]) body.shop-page .shop-nav-filters,
html.dark-auto:not([data-msb-appearance]) body.shop-page .shop-brand-nav,
html.dark-auto:not([data-msb-appearance]) body.shop-page .shop-nav-utility-links,
html.dark-auto:not([data-msb-appearance]) body.shop-page .shop-side-card,
html.dark-auto:not([data-msb-appearance]) body.shop-page .shop-service-strip,
html.dark-auto:not([data-msb-appearance]) body.shop-page .shop-promo-hero,
html.dark-auto:not([data-msb-appearance]) body.shop-page .shop-promo-slide,
html.dark-auto:not([data-msb-appearance]) body.shop-page .shop-market-card,
html.dark-auto:not([data-msb-appearance]) body.shop-page .shop-category-tile span,
html.dark-auto:not([data-msb-appearance]) body.shop-page .shop-sort-select,
html.dark-auto:not([data-msb-appearance]) body.shop-page .shop-product-page-arrow,
html.dark-auto:not([data-msb-appearance]) body.shop-page .shop-product-per-page select,
html[data-theme="dark"]:not([data-msb-appearance]) body.shop-page .feed-left-rail,
html[data-theme="dark"]:not([data-msb-appearance]) body.shop-page .feed-left-rail-page-head,
html[data-theme="dark"]:not([data-msb-appearance]) body.shop-page .feed-left-nav,
html[data-theme="dark"]:not([data-msb-appearance]) body.shop-page .shop-nav-filters,
html[data-theme="dark"]:not([data-msb-appearance]) body.shop-page .shop-brand-nav,
html[data-theme="dark"]:not([data-msb-appearance]) body.shop-page .shop-nav-utility-links,
html[data-theme="dark"]:not([data-msb-appearance]) body.shop-page .shop-side-card,
html[data-theme="dark"]:not([data-msb-appearance]) body.shop-page .shop-service-strip,
html[data-theme="dark"]:not([data-msb-appearance]) body.shop-page .shop-promo-hero,
html[data-theme="dark"]:not([data-msb-appearance]) body.shop-page .shop-promo-slide,
html[data-theme="dark"]:not([data-msb-appearance]) body.shop-page .shop-market-card,
html[data-theme="dark"]:not([data-msb-appearance]) body.shop-page .shop-category-tile span,
html[data-theme="dark"]:not([data-msb-appearance]) body.shop-page .shop-product-page-arrow,
html[data-theme="dark"]:not([data-msb-appearance]) body.shop-page .shop-product-per-page select,
html[data-msb-appearance] body.shop-page .feed-left-rail,
html[data-msb-appearance] body.shop-page .feed-left-rail-page-head,
html[data-msb-appearance] body.shop-page .feed-left-nav,
html[data-msb-appearance] body.shop-page .shop-nav-filters,
html[data-msb-appearance] body.shop-page .shop-brand-nav,
html[data-msb-appearance] body.shop-page .shop-nav-utility-links,
html[data-msb-appearance] body.shop-page .shop-side-card,
html[data-msb-appearance] body.shop-page .shop-service-strip,
html[data-msb-appearance] body.shop-page .shop-promo-hero,
html[data-msb-appearance] body.shop-page .shop-promo-slide,
html[data-msb-appearance] body.shop-page .shop-market-card,
html[data-msb-appearance] body.shop-page .shop-category-tile span,
html[data-msb-appearance] body.shop-page .shop-sort-select,
html[data-msb-appearance] body.shop-page .shop-product-page-arrow,
html[data-msb-appearance] body.shop-page .shop-product-per-page select,
html.dark-auto[data-msb-appearance] body.shop-page .feed-left-rail,
html.dark-auto[data-msb-appearance] body.shop-page .feed-left-rail-page-head,
html.dark-auto[data-msb-appearance] body.shop-page .feed-left-nav,
html.dark-auto[data-msb-appearance] body.shop-page .shop-nav-filters,
html.dark-auto[data-msb-appearance] body.shop-page .shop-brand-nav,
html.dark-auto[data-msb-appearance] body.shop-page .shop-nav-utility-links,
html.dark-auto[data-msb-appearance] body.shop-page .shop-side-card,
html.dark-auto[data-msb-appearance] body.shop-page .shop-service-strip,
html.dark-auto[data-msb-appearance] body.shop-page .shop-promo-hero,
html.dark-auto[data-msb-appearance] body.shop-page .shop-promo-slide,
html.dark-auto[data-msb-appearance] body.shop-page .shop-market-card,
html.dark-auto[data-msb-appearance] body.shop-page .shop-category-tile span,
html.dark-auto[data-msb-appearance] body.shop-page .shop-product-page-arrow,
html.dark-auto[data-msb-appearance] body.shop-page .shop-product-per-page select {
  background-color: var(--msb-palette-bg, var(--shop-card-bg, var(--shop-surface, #171d24))) !important;
  background-image: none !important;
  color: var(--msb-palette-text, var(--shop-text, #b1bcce)) !important;
  border-color: var(--msb-palette-border, var(--shop-border, rgba(255,255,255,.12))) !important;
}

html.dark-auto:not([data-msb-appearance]) body.shop-page .shop-product-page-num,
html.dark-auto:not([data-msb-appearance]) body.shop-page .shop-product-per-page label,
html[data-theme="dark"]:not([data-msb-appearance]) body.shop-page .shop-product-page-num,
html[data-msb-appearance] body.shop-page .shop-product-page-num,
html[data-msb-appearance] body.shop-page .shop-product-per-page label {
  color: var(--msb-palette-text-muted, var(--shop-text-muted, #b1bcce)) !important;
}
html.dark-auto:not([data-msb-appearance]) body.shop-page .shop-product-page-num.is-active,
html[data-msb-appearance] body.shop-page .shop-product-page-num.is-active {
  color: var(--msb-palette-text, var(--shop-text, #f3f6fb)) !important;
  border-bottom-color: var(--msb-palette-text, var(--shop-text, #f3f6fb)) !important;
}

html.dark-auto:not([data-msb-appearance]) body.shop-page .feed-left-rail-page-title,
html.dark-auto:not([data-msb-appearance]) body.shop-page .shop-nav-filter-toggle,
html.dark-auto:not([data-msb-appearance]) body.shop-page .shop-brand-nav-text strong,
html[data-theme="dark"]:not([data-msb-appearance]) body.shop-page .feed-left-rail-page-title,
html[data-theme="dark"]:not([data-msb-appearance]) body.shop-page .shop-nav-filter-toggle,
html[data-theme="dark"]:not([data-msb-appearance]) body.shop-page .shop-brand-nav-text strong,
html[data-msb-appearance] body.shop-page .feed-left-rail-page-title,
html[data-msb-appearance] body.shop-page .shop-nav-filter-toggle,
html[data-msb-appearance] body.shop-page .shop-brand-nav-text strong {
  color: var(--msb-palette-text, var(--shop-text, #b1bcce)) !important;
}

html.dark-auto:not([data-msb-appearance]) body.shop-page .feed-left-rail-page-sub,
html.dark-auto:not([data-msb-appearance]) body.shop-page .shop-brand-nav-head,
html.dark-auto:not([data-msb-appearance]) body.shop-page .shop-brand-nav-text span,
html.dark-auto:not([data-msb-appearance]) body.shop-page .shop-nav-filter-option,
html[data-theme="dark"]:not([data-msb-appearance]) body.shop-page .feed-left-rail-page-sub,
html[data-theme="dark"]:not([data-msb-appearance]) body.shop-page .shop-brand-nav-head,
html[data-theme="dark"]:not([data-msb-appearance]) body.shop-page .shop-brand-nav-text span,
html[data-msb-appearance] body.shop-page .feed-left-rail-page-sub,
html[data-msb-appearance] body.shop-page .shop-brand-nav-head,
html[data-msb-appearance] body.shop-page .shop-brand-nav-text span,
html[data-msb-appearance] body.shop-page .shop-nav-filter-option {
  color: var(--msb-palette-text-muted, var(--shop-text-muted, #b1bcce)) !important;
}

/* Shop top header — user name strip + search bar */
html.dark-auto:not([data-msb-appearance]) body.shop-page .ig-feed-header,
html[data-theme="dark"]:not([data-msb-appearance]) body.shop-page .ig-feed-header,
html[data-msb-appearance] body.shop-page .ig-feed-header,
html.dark-auto[data-msb-appearance] body.shop-page .ig-feed-header,
html.dark-auto:not([data-msb-appearance]) body.shop-page .sh-pagebody,
html[data-theme="dark"]:not([data-msb-appearance]) body.shop-page .sh-pagebody,
html[data-msb-appearance] body.shop-page .sh-pagebody {
  background-color: var(--msb-palette-bg, var(--shop-surface, #171d24)) !important;
  background-image: none !important;
  color: var(--msb-palette-text, var(--shop-text, #b1bcce)) !important;
}

html.dark-auto:not([data-msb-appearance]) body.shop-page .ig-feed-user-name,
html[data-theme="dark"]:not([data-msb-appearance]) body.shop-page .ig-feed-user-name,
html[data-msb-appearance] body.shop-page .ig-feed-user-name,
html.dark-auto[data-msb-appearance] body.shop-page .ig-feed-user-name {
  background-color: transparent !important;
  color: var(--msb-palette-text, var(--shop-text, #b1bcce)) !important;
  -webkit-text-fill-color: var(--msb-palette-text, var(--shop-text, #b1bcce)) !important;
}

html.dark-auto:not([data-msb-appearance]) body.shop-page .ig-feed-user-name:hover,
html.dark-auto:not([data-msb-appearance]) body.shop-page .ig-feed-user-name:focus,
html[data-theme="dark"]:not([data-msb-appearance]) body.shop-page .ig-feed-user-name:hover,
html[data-msb-appearance] body.shop-page .ig-feed-user-name:hover,
html[data-msb-appearance] body.shop-page .ig-feed-user-name:focus {
  color: var(--msb-palette-link, var(--shop-link, #93c5fd)) !important;
  -webkit-text-fill-color: var(--msb-palette-link, var(--shop-link, #93c5fd)) !important;
}

/* =====================================================
   Appearance color wins over Dark-auto black when Gear color is set
   ===================================================== */
html.dark-auto[data-msb-appearance],
html.dark-auto[data-msb-appearance] body,
html.dark-auto[data-msb-appearance] body.dashboard-page,
html.dark-auto[data-msb-appearance] body.dashboard-modal-page,
html.dark-auto[data-msb-appearance] body.dashboard-page .sh-mainpanel,
html.dark-auto[data-msb-appearance] body.dashboard-page .sh-pagebody,
html.dark-auto[data-msb-appearance] body.dashboard-page .card,
html.dark-auto[data-msb-appearance] body.dashboard-page .card-body,
html.dark-auto[data-msb-appearance] body.dashboard-page .card-header,
html.dark-auto[data-msb-appearance] body.dashboard-page .card-footer,
html.dark-auto[data-msb-appearance] body.dashboard-page .row,
html.dark-auto[data-msb-appearance] body.dashboard-page .row-sm,
html.dark-auto[data-msb-appearance] body.dashboard-page .col-lg-12,
html.dark-auto[data-msb-appearance] body.dashboard-page .alert,
html.dark-auto[data-msb-appearance] body.dashboard-page .alert-info,
html.dark-auto[data-msb-appearance] body.dashboard-page #instructionBox{
  background: var(--msb-palette-bg) !important;
  background-color: var(--msb-palette-bg) !important;
  background-image: none !important;
  color: var(--msb-palette-text) !important;
}

html.dark-auto:not([data-msb-appearance]){
  --hc-story-bg:#171d24;
  --hc-story-gold:#e8c98a;
  --hc-story-text:#b1bcce;
  --hc-story-muted:#8b97a8;
}
html.dark-auto:not([data-msb-appearance]) body.ig-auth,
html.dark-auto:not([data-msb-appearance]) body.ig-auth .auth-page,
html.dark-auto:not([data-msb-appearance]) body.ig-auth .help-center,
html.dark-auto:not([data-msb-appearance]) body.ig-auth .hc-top,
html.dark-auto:not([data-msb-appearance]) body.ig-auth .hc-nav,
html.dark-auto:not([data-msb-appearance]) body.ig-auth .hc-main,
html.dark-auto:not([data-msb-appearance]) body.ig-auth .auth-page-foot,
html.dark-auto:not([data-msb-appearance]) body.ig-auth .hc-about-story,
html.dark-auto:not([data-msb-appearance]) body.ig-auth .auth-card,
html.dark-auto:not([data-msb-appearance]) body.ig-auth .auth-shell,
html.dark-auto:not([data-msb-appearance]) body.ig-auth .auth-left,
html.dark-auto:not([data-msb-appearance]) body.ig-auth .auth-right,
html.dark-auto:not([data-msb-appearance]) body.ig-auth .auth-gear-menu{
  background:#171d24 !important;
  color:#b1bcce !important;
  border:1px solid #2a2f36 !important;
  box-shadow:none !important;
}
html.dark-auto:not([data-msb-appearance]) body.ig-auth .hc-brand,
html.dark-auto:not([data-msb-appearance]) body.ig-auth .hc-menu,
html.dark-auto:not([data-msb-appearance]) body.ig-auth .hc-lang,
html.dark-auto:not([data-msb-appearance]) body.ig-auth .hc-home-cta,
html.dark-auto:not([data-msb-appearance]) body.ig-auth a.hc-home-cta,
html.dark-auto:not([data-msb-appearance]) body.ig-auth .hc-nav-group a,
html.dark-auto:not([data-msb-appearance]) body.ig-auth .hc-nav-group summary,
html.dark-auto:not([data-msb-appearance]) body.ig-auth .hc-nav-topic summary,
html.dark-auto:not([data-msb-appearance]) body.ig-auth .auth-legal-article,
html.dark-auto:not([data-msb-appearance]) body.ig-auth .auth-page-foot a{
  color:#b1bcce !important;
}
html.dark-auto:not([data-msb-appearance]) body.ig-auth .hc-nav-group a.is-active,
html.dark-auto:not([data-msb-appearance]) body.ig-auth .hc-story-progress a.is-active,
html.dark-auto:not([data-msb-appearance]) body.ig-auth .hc-story-kicker,
html.dark-auto:not([data-msb-appearance]) body.ig-auth .hc-about-story .hc-story-more{
  color:#e8c98a !important;
}
html.dark-auto:not([data-msb-appearance]) body.ig-auth .hc-nav-topic a.is-active{
  color:#b1bcce !important;
}
html.dark-auto:not([data-msb-appearance]) body.ig-auth .hc-acc-tool,
html.dark-auto:not([data-msb-appearance]) body.ig-auth .hc-acc-link{
  color:var(--msb-palette-action, #0095f6) !important;
  -webkit-text-fill-color:var(--msb-palette-action, #0095f6) !important;
}
html.dark-auto:not([data-msb-appearance]) body.ig-auth .hc-menu,
html.dark-auto:not([data-msb-appearance]) body.ig-auth .hc-search input,
html.dark-auto:not([data-msb-appearance]) body.ig-auth .auth-help-chat,
html.dark-auto:not([data-msb-appearance]) body.ig-auth .auth-help-input,
html.dark-auto:not([data-msb-appearance]) body.ig-auth textarea.auth-help-input{
  background:#171d24 !important;
  background-color:#171d24 !important;
  color:#b1bcce !important;
  border-color:#2a2f36 !important;
}
html.dark-auto:not([data-msb-appearance]) body.ig-auth .auth-field,
html.dark-auto:not([data-msb-appearance]) body.ig-auth .auth-birthday select{
  background:#171d24 !important;
  border-color:#2a2f36 !important;
}
html.dark-auto:not([data-msb-appearance]) body.ig-auth .auth-field:focus-within{
  background:#171d24 !important;
  border-color:#4b5563 !important;
}
html.dark-auto:not([data-msb-appearance]) body.ig-auth .auth-field input,
html.dark-auto:not([data-msb-appearance]) body.ig-auth .auth-field select,
html.dark-auto:not([data-msb-appearance]) body.ig-auth .auth-field textarea{
  border:0 !important;
  background:transparent !important;
  color:#f3f6fb !important;
}
html.dark-auto:not([data-msb-appearance]) body.ig-auth .auth-switch button,
html.dark-auto:not([data-msb-appearance]) body.ig-auth .auth-create-btn{
  background:#0d61bc !important;
  border-color:#0d61bc !important;
  color:#fff !important;
}

/* Door and live outlines use the active Appearance palette, including custom accents. */
html body .tt-live-door,html body .tt-live-right-door,
html body .tt-live-door-panel,html body .tt-live-right-door-panel,
html body .hub-shell,html body .hub-top,html body .hub-tabs,
html body .hub-stage,html body .hub-live-chat-panel,
html body .hub-public-watch-chat,html body .hub-live-side-stats,
html body .hub-live-compose,html body .hub-live-compose-inputwrap{
  border-color:var(--msb-palette-border-strong,var(--msb-palette-border))!important;
}