/* The shared empty state (static/js/empty-state.js), desktop and phone.
 *
 * The palette is a handful of --es-* tokens picked per theme: light, dark,
 * a page colour (--pc-*, app-colors.js / mobile-page-colors.js) and Glass.
 * A host that sits on its own surface (the TV screen) can set the same
 * tokens on .nst-es from its own sheet.
 *
 * Every rule is doubled on the class and marked important: the phone's
 * blanket sweeps ([data-theme=light] * * * painting leaves black, the global
 * button restyles, [class*=...] sweeps) would win otherwise.
 */

.nst-es {
    --es-ink: #111114;
    --es-dim: rgba(17, 17, 20, 0.58);
    --es-soft: rgba(17, 17, 20, 0.045);
    --es-line: rgba(17, 17, 20, 0.09);
    --es-btn: #111114;
    --es-on-btn: #ffffff;
    --es-glow: rgba(17, 17, 20, 0.07);
    --es-fun-a: #ff6a3d;
    --es-fun-b: #7c5cff;
}
[data-theme="dark"] .nst-es {
    --es-ink: #f5f5f7;
    --es-dim: rgba(245, 245, 247, 0.6);
    --es-soft: rgba(255, 255, 255, 0.06);
    --es-line: rgba(255, 255, 255, 0.12);
    --es-btn: #f5f5f7;
    --es-on-btn: #111114;
    --es-glow: rgba(255, 255, 255, 0.08);
}
[data-page-color] .nst-es {
    --es-ink: var(--pc-ink);
    --es-dim: var(--pc-dim);
    --es-soft: var(--pc-soft);
    --es-line: var(--pc-line);
    --es-btn: var(--pc-btn, var(--pc-ink));
    --es-on-btn: var(--pc-on-btn, var(--pc-page, #ffffff));
    --es-glow: var(--pc-soft);
}
html[data-appearance="glass"] .nst-es {
    --es-ink: #ffffff;
    --es-dim: rgba(255, 255, 255, 0.7);
    --es-soft: rgba(255, 255, 255, 0.1);
    --es-line: rgba(255, 255, 255, 0.2);
    --es-btn: #ffffff;
    --es-on-btn: #111114;
    --es-glow: rgba(255, 255, 255, 0.12);
}

html body .nst-es.nst-es {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 0 !important;
    box-sizing: border-box !important;
    width: 100% !important;
    max-width: 440px !important;
    margin: 0 auto !important;
    padding: 40px 20px 44px !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    text-align: center !important;
    color: var(--es-ink) !important;
    -webkit-text-fill-color: var(--es-ink) !important;
    font-family: inherit !important;
}
html body .nst-es.nst-es * {
    box-sizing: border-box !important;
    font-family: inherit !important;
    color: inherit !important;
    -webkit-text-fill-color: currentColor !important;
    text-shadow: none !important;
}
html body .nst-es.nst-es [hidden] { display: none !important; }

/* The picture: a big soft tile with the line icon in it. */
html body .nst-es.nst-es .nst-es__art {
    position: relative !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 96px !important;
    height: 96px !important;
    margin: 0 0 22px !important;
    border-radius: 30px !important;
    background: var(--es-soft) !important;
    border: 1px solid var(--es-line) !important;
    box-shadow: 0 18px 44px var(--es-glow) !important;
    color: var(--es-ink) !important;
}
html body .nst-es.nst-es .nst-es__halo { display: none !important; }
html body .nst-es.nst-es .nst-es__icon {
    display: block !important;
    width: 44px !important;
    height: 44px !important;
    flex: none !important;
    color: var(--es-ink) !important;
}
html body .nst-es.nst-es svg [fill="none"] { fill: none !important; }
html body .nst-es.nst-es svg [stroke="currentColor"] { stroke: currentColor !important; }

html body .nst-es.nst-es .nst-es__title {
    margin: 0 0 8px !important;
    padding: 0 !important;
    font-size: 22px !important;
    line-height: 1.2 !important;
    font-weight: 700 !important;
    letter-spacing: -0.01em !important;
    text-transform: none !important;
    color: var(--es-ink) !important;
    -webkit-text-fill-color: var(--es-ink) !important;
}
html body .nst-es.nst-es .nst-es__body {
    margin: 0 !important;
    padding: 0 !important;
    max-width: 360px !important;
    font-size: 15px !important;
    line-height: 1.5 !important;
    font-weight: 400 !important;
    color: var(--es-dim) !important;
    -webkit-text-fill-color: var(--es-dim) !important;
}

html body .nst-es.nst-es .nst-es__acts {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    gap: 10px !important;
    margin: 22px 0 0 !important;
}
html body .nst-es.nst-es .nst-es__btn {
    -webkit-appearance: none !important;
    appearance: none !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    width: auto !important;
    min-width: 0 !important;
    height: 44px !important;
    min-height: 44px !important;
    margin: 0 !important;
    padding: 0 22px !important;
    border-radius: 999px !important;
    border: 1px solid var(--es-btn) !important;
    background: var(--es-btn) !important;
    color: var(--es-on-btn) !important;
    -webkit-text-fill-color: var(--es-on-btn) !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    letter-spacing: 0 !important;
    text-transform: none !important;
    line-height: 1 !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    cursor: pointer !important;
    transition: transform 140ms ease, opacity 140ms ease !important;
}
html body .nst-es.nst-es .nst-es__btn:hover { opacity: 0.88 !important; }
html body .nst-es.nst-es .nst-es__btn:active { transform: scale(0.97) !important; }
html body .nst-es.nst-es .nst-es__btn[disabled] { opacity: 0.6 !important; cursor: default !important; }
html body .nst-es.nst-es .nst-es__btn[hidden] { display: none !important; }
html body .nst-es.nst-es .nst-es__btn svg { width: 16px !important; height: 16px !important; flex: none !important; display: block !important; }
html body .nst-es.nst-es .nst-es__btn * { color: inherit !important; -webkit-text-fill-color: currentColor !important; }
/* The phone's global button/text rules can repaint the label black even
   while the shared empty-state primary action keeps its dark fill. Bind the
   label and icon directly to the button's contrast token. */
html body #community-main-area .fp-sec--empty .nst-es.nst-es .nst-es__btn.nst-es__btn--primary,
html body #community-main-area .fp-sec--empty .nst-es.nst-es .nst-es__btn.nst-es__btn--primary :is(span, svg, svg *) {
    color: var(--es-on-btn) !important;
    -webkit-text-fill-color: var(--es-on-btn) !important;
}
html body .nst-es.nst-es .nst-es__btn--notify {
    background: transparent !important;
    border-color: var(--es-line) !important;
    color: var(--es-ink) !important;
    -webkit-text-fill-color: var(--es-ink) !important;
}
html body .nst-es.nst-es .nst-es__btn--notify.is-on { border-color: transparent !important; color: var(--es-dim) !important; -webkit-text-fill-color: var(--es-dim) !important; }
html body .nst-es.nst-es .nst-es__btn--link {
    height: 32px !important;
    min-height: 32px !important;
    padding: 0 10px !important;
    background: transparent !important;
    border-color: transparent !important;
    color: var(--es-dim) !important;
    -webkit-text-fill-color: var(--es-dim) !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    text-decoration: underline !important;
    text-underline-offset: 3px !important;
}

/* Guests: the same shape with some play -- a warm gradient halo that
   breathes behind the picture. */
html body .nst-es.nst-es--guest .nst-es__art {
    border-radius: 999px !important;
    background: var(--es-soft) !important;
    border-color: transparent !important;
    box-shadow: none !important;
}
html body .nst-es.nst-es--guest .nst-es__halo {
    display: block !important;
    position: absolute !important;
    inset: -10px !important;
    border-radius: 999px !important;
    background: conic-gradient(from 200deg, var(--es-fun-a), var(--es-fun-b), var(--es-fun-a)) !important;
    opacity: 0.22 !important;
    filter: blur(10px) !important;
    animation: nst-es-breathe 3.6s ease-in-out infinite !important;
    z-index: -1 !important;
}
html body .nst-es.nst-es--guest .nst-es__art { isolation: isolate !important; }
html body .nst-es.nst-es--guest .nst-es__icon { animation: nst-es-bob 3.6s ease-in-out infinite !important; }
@keyframes nst-es-breathe { 0%, 100% { transform: scale(0.94); opacity: 0.18; } 50% { transform: scale(1.06); opacity: 0.3; } }
@keyframes nst-es-bob { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-3px); } }
@media (prefers-reduced-motion: reduce) {
    html body .nst-es.nst-es .nst-es__halo, html body .nst-es.nst-es .nst-es__icon { animation: none !important; }
}

/* Inside a dashboard card or a narrow rail. */
html body .nst-es.nst-es--compact { padding: 22px 12px 24px !important; }
html body .nst-es.nst-es--compact .nst-es__art { width: 64px !important; height: 64px !important; border-radius: 20px !important; margin-bottom: 14px !important; box-shadow: none !important; }
html body .nst-es.nst-es--compact .nst-es__icon { width: 30px !important; height: 30px !important; }
html body .nst-es.nst-es--compact .nst-es__title { font-size: 17px !important; }
html body .nst-es.nst-es--compact .nst-es__body { font-size: 14px !important; }
html body .nst-es.nst-es--compact .nst-es__acts { margin-top: 16px !important; }

/* EmptyState.mount(): the host box's own lines step aside. */
html body .has-nst-es > :not(.nst-es-host) { display: none !important; }

/* Community Home already has its hero and member controls above the feed. */
html body #community-main-area #community-layers-home .fp-sec--empty {
    margin: 24px 0 0 !important;
    padding: 0 20px 32px !important;
}
html body #community-main-area #community-layers-home .fp-sec--empty .nst-es.nst-es {
    align-items: flex-start !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
    text-align: left !important;
}
html body #community-main-area #community-layers-home .fp-sec--empty .nst-es__art {
    display: none !important;
}
html body #community-main-area #community-layers-home .fp-sec--empty .nst-es__title {
    font-size: 18px !important;
    margin-bottom: 5px !important;
}
html body #community-main-area #community-layers-home .fp-sec--empty .nst-es__body {
    font-size: 14px !important;
    max-width: 320px !important;
}
html body #community-main-area #community-layers-home .fp-sec--empty .nst-es__acts {
    align-items: flex-start !important;
    margin-top: 14px !important;
}
html body #community-main-area #community-layers-home .fp-sec--empty .nst-es__btn--primary,
html body #community-main-area #community-layers-home .fp-sec--empty .nst-es__btn--primary :is(span, svg, svg *) {
    color: var(--es-on-btn) !important;
    -webkit-text-fill-color: var(--es-on-btn) !important;
}
html body .nst-es-host { width: 100% !important; align-self: stretch !important; }

/* Dark surfaces. The button pair is always --es-btn (fill) with --es-on-btn
   (label) and every theme above sets both, so a label can never take the
   fill's colour. A host that is dark whatever the theme (the TV, the stream
   stage, a room) passes surface:'dark' (.nst-es--on-dark) or sets the tokens
   on its own .nst-es; hosts whose own sweeps reach in at id strength get the
   same token rules repeated at that strength below. */
html body .nst-es.nst-es--on-dark,
html body #mtv .nst-es.nst-es {
    --es-ink: #ffffff;
    --es-dim: rgba(255, 255, 255, 0.7);
    --es-soft: rgba(255, 255, 255, 0.08);
    --es-line: rgba(255, 255, 255, 0.2);
    --es-btn: #ffffff;
    --es-on-btn: #111114;
    --es-glow: rgba(0, 0, 0, 0.3);
}
html body #mtv#mtv#mtv .nst-es .nst-es__title { color: var(--es-ink) !important; -webkit-text-fill-color: var(--es-ink) !important; }
html body #mtv#mtv#mtv .nst-es .nst-es__body { color: var(--es-dim) !important; -webkit-text-fill-color: var(--es-dim) !important; }
html body #mtv#mtv#mtv .nst-es .nst-es__btn.nst-es__btn--primary { background: var(--es-btn) !important; border-color: var(--es-btn) !important; }
html body #mtv#mtv#mtv .nst-es .nst-es__btn.nst-es__btn--primary,
html body #mtv#mtv#mtv .nst-es .nst-es__btn.nst-es__btn--primary * { color: var(--es-on-btn) !important; -webkit-text-fill-color: var(--es-on-btn) !important; }
html body #mtv#mtv#mtv .nst-es .nst-es__btn--notify,
html body #mtv#mtv#mtv .nst-es .nst-es__btn--notify * { color: var(--es-ink) !important; -webkit-text-fill-color: var(--es-ink) !important; }
html body #mtv#mtv#mtv .nst-es .nst-es__btn--link,
html body #mtv#mtv#mtv .nst-es .nst-es__btn--link * { background: transparent !important; border-color: transparent !important; color: var(--es-dim) !important; -webkit-text-fill-color: var(--es-dim) !important; }

/* Shared mobile sheets and composers. Explicit roots keep glass out of media,
   maps and embedded payment documents. No layout or visibility is changed. */
html[data-appearance="glass"], html[data-appearance="glass"] body[data-theme] {
    --background-color: transparent;
    --bg-primary: transparent;
    --bg-secondary: rgba(255,255,255,.10);
    --body-bg: transparent;
    --panel-bg: rgba(255,255,255,.10);
    --surface-color: rgba(255,255,255,.12);
    --surface-background-color: rgba(255,255,255,.12);
    --card-bg: rgba(255,255,255,.12);
    --modal-bg: rgba(28,28,32,.42);
    --input-bg: rgba(255,255,255,.14);
    --input-background-color: rgba(255,255,255,.14);
    --hover-bg: rgba(255,255,255,.20);
    --dark-canvas: transparent;
    --dark-surface: rgba(255,255,255,.12);
    --dark-surface-raised: rgba(255,255,255,.20);
    --text-color: #fff;
    --text-primary: #fff;
    --text-secondary: rgba(255,255,255,.72);
    --border-color: rgba(255,255,255,.24);
}
html[data-appearance="glass"] body :is(#verification-modal#verification-modal#verification-modal#verification-modal#verification-modal#verification-modal,
    #community-settings-modal#community-settings-modal#community-settings-modal#community-settings-modal#community-settings-modal#community-settings-modal,
    #text-bloc-create-modal#text-bloc-create-modal#text-bloc-create-modal#text-bloc-create-modal#text-bloc-create-modal#text-bloc-create-modal,
    #text-bloc-share-modal#text-bloc-share-modal#text-bloc-share-modal#text-bloc-share-modal#text-bloc-share-modal#text-bloc-share-modal,
    #create-modal#create-modal#create-modal#create-modal#create-modal#create-modal,
    #compose-modal#compose-modal#compose-modal#compose-modal#compose-modal#compose-modal,
    #owner-bookings-modal#owner-bookings-modal#owner-bookings-modal#owner-bookings-modal#owner-bookings-modal#owner-bookings-modal,
    #ai-topup-sheet#ai-topup-sheet#ai-topup-sheet#ai-topup-sheet#ai-topup-sheet#ai-topup-sheet,
    #enter-modal#enter-modal#enter-modal#enter-modal#enter-modal#enter-modal,
    #mobile-bytes-modal#mobile-bytes-modal#mobile-bytes-modal#mobile-bytes-modal#mobile-bytes-modal#mobile-bytes-modal,
    #payment-modal#payment-modal#payment-modal#payment-modal#payment-modal#payment-modal,
    #profile-modal#profile-modal#profile-modal#profile-modal#profile-modal#profile-modal,
    #app-modal#app-modal#app-modal#app-modal#app-modal#app-modal,
    #booking-settings-modal#booking-settings-modal#booking-settings-modal#booking-settings-modal#booking-settings-modal#booking-settings-modal,
    #booking-manager-modal#booking-manager-modal#booking-manager-modal#booking-manager-modal#booking-manager-modal#booking-manager-modal,
    #new-custom-modal#new-custom-modal#new-custom-modal#new-custom-modal#new-custom-modal#new-custom-modal,
    #bloc-share-sheet#bloc-share-sheet#bloc-share-sheet#bloc-share-sheet#bloc-share-sheet#bloc-share-sheet,
    #create-bloc-modal#create-bloc-modal#create-bloc-modal#create-bloc-modal#create-bloc-modal#create-bloc-modal,
    #tab-menu-modal#tab-menu-modal#tab-menu-modal#tab-menu-modal#tab-menu-modal#tab-menu-modal,
    #source-modal#source-modal#source-modal#source-modal#source-modal#source-modal,
    #custom-pin-modal#custom-pin-modal#custom-pin-modal#custom-pin-modal#custom-pin-modal#custom-pin-modal,
    #onboarding-modal#onboarding-modal#onboarding-modal#onboarding-modal#onboarding-modal#onboarding-modal,
    #mobileAddBookingModal#mobileAddBookingModal#mobileAddBookingModal#mobileAddBookingModal#mobileAddBookingModal#mobileAddBookingModal,
    #mobile-blocspace-calendar-event-modal#mobile-blocspace-calendar-event-modal#mobile-blocspace-calendar-event-modal#mobile-blocspace-calendar-event-modal#mobile-blocspace-calendar-event-modal#mobile-blocspace-calendar-event-modal,
    #mobile-app-access-sheet#mobile-app-access-sheet#mobile-app-access-sheet#mobile-app-access-sheet#mobile-app-access-sheet#mobile-app-access-sheet,
    #mobile-contact-sheet#mobile-contact-sheet#mobile-contact-sheet#mobile-contact-sheet#mobile-contact-sheet#mobile-contact-sheet,
    #channel-maker#channel-maker#channel-maker#channel-maker#channel-maker#channel-maker,
    #quick-login-modal#quick-login-modal#quick-login-modal#quick-login-modal#quick-login-modal#quick-login-modal,
    #membership-join#membership-join#membership-join#membership-join#membership-join#membership-join) {
    background: var(--gl-sheet) !important;
    color: #fff !important;
    -webkit-text-fill-color: #fff !important;
    color-scheme: dark !important;
    -webkit-backdrop-filter: var(--gl-blur) !important;
    backdrop-filter: var(--gl-blur) !important;
    border-color: var(--gl-rim) !important;
}
html[data-appearance="glass"] body :is(#verification-modal#verification-modal#verification-modal#verification-modal#verification-modal#verification-modal,
    #community-settings-modal#community-settings-modal#community-settings-modal#community-settings-modal#community-settings-modal#community-settings-modal,
    #text-bloc-create-modal#text-bloc-create-modal#text-bloc-create-modal#text-bloc-create-modal#text-bloc-create-modal#text-bloc-create-modal,
    #text-bloc-share-modal#text-bloc-share-modal#text-bloc-share-modal#text-bloc-share-modal#text-bloc-share-modal#text-bloc-share-modal,
    #create-modal#create-modal#create-modal#create-modal#create-modal#create-modal,
    #compose-modal#compose-modal#compose-modal#compose-modal#compose-modal#compose-modal,
    #owner-bookings-modal#owner-bookings-modal#owner-bookings-modal#owner-bookings-modal#owner-bookings-modal#owner-bookings-modal,
    #ai-topup-sheet#ai-topup-sheet#ai-topup-sheet#ai-topup-sheet#ai-topup-sheet#ai-topup-sheet,
    #enter-modal#enter-modal#enter-modal#enter-modal#enter-modal#enter-modal,
    #mobile-bytes-modal#mobile-bytes-modal#mobile-bytes-modal#mobile-bytes-modal#mobile-bytes-modal#mobile-bytes-modal,
    #payment-modal#payment-modal#payment-modal#payment-modal#payment-modal#payment-modal,
    #profile-modal#profile-modal#profile-modal#profile-modal#profile-modal#profile-modal,
    #app-modal#app-modal#app-modal#app-modal#app-modal#app-modal,
    #booking-settings-modal#booking-settings-modal#booking-settings-modal#booking-settings-modal#booking-settings-modal#booking-settings-modal,
    #booking-manager-modal#booking-manager-modal#booking-manager-modal#booking-manager-modal#booking-manager-modal#booking-manager-modal,
    #new-custom-modal#new-custom-modal#new-custom-modal#new-custom-modal#new-custom-modal#new-custom-modal,
    #bloc-share-sheet#bloc-share-sheet#bloc-share-sheet#bloc-share-sheet#bloc-share-sheet#bloc-share-sheet,
    #create-bloc-modal#create-bloc-modal#create-bloc-modal#create-bloc-modal#create-bloc-modal#create-bloc-modal,
    #tab-menu-modal#tab-menu-modal#tab-menu-modal#tab-menu-modal#tab-menu-modal#tab-menu-modal,
    #source-modal#source-modal#source-modal#source-modal#source-modal#source-modal,
    #custom-pin-modal#custom-pin-modal#custom-pin-modal#custom-pin-modal#custom-pin-modal#custom-pin-modal,
    #onboarding-modal#onboarding-modal#onboarding-modal#onboarding-modal#onboarding-modal#onboarding-modal,
    #mobileAddBookingModal#mobileAddBookingModal#mobileAddBookingModal#mobileAddBookingModal#mobileAddBookingModal#mobileAddBookingModal,
    #mobile-blocspace-calendar-event-modal#mobile-blocspace-calendar-event-modal#mobile-blocspace-calendar-event-modal#mobile-blocspace-calendar-event-modal#mobile-blocspace-calendar-event-modal#mobile-blocspace-calendar-event-modal,
    #mobile-app-access-sheet#mobile-app-access-sheet#mobile-app-access-sheet#mobile-app-access-sheet#mobile-app-access-sheet#mobile-app-access-sheet,
    #mobile-contact-sheet#mobile-contact-sheet#mobile-contact-sheet#mobile-contact-sheet#mobile-contact-sheet#mobile-contact-sheet,
    #channel-maker#channel-maker#channel-maker#channel-maker#channel-maker#channel-maker,
    #quick-login-modal#quick-login-modal#quick-login-modal#quick-login-modal#quick-login-modal#quick-login-modal,
    #membership-join#membership-join#membership-join#membership-join#membership-join#membership-join) :where(div, section, article, header, footer, nav, form, fieldset, label, h1, h2, h3, h4, p, span, small, strong, b, a, i) {
    background-color: transparent !important;
    color: #fff !important;
    -webkit-text-fill-color: #fff !important;
    border-color: var(--gl-rim) !important;
}
html[data-appearance="glass"] body :is(#verification-modal#verification-modal#verification-modal#verification-modal#verification-modal#verification-modal,
    #community-settings-modal#community-settings-modal#community-settings-modal#community-settings-modal#community-settings-modal#community-settings-modal,
    #text-bloc-create-modal#text-bloc-create-modal#text-bloc-create-modal#text-bloc-create-modal#text-bloc-create-modal#text-bloc-create-modal,
    #text-bloc-share-modal#text-bloc-share-modal#text-bloc-share-modal#text-bloc-share-modal#text-bloc-share-modal#text-bloc-share-modal,
    #create-modal#create-modal#create-modal#create-modal#create-modal#create-modal,
    #compose-modal#compose-modal#compose-modal#compose-modal#compose-modal#compose-modal,
    #owner-bookings-modal#owner-bookings-modal#owner-bookings-modal#owner-bookings-modal#owner-bookings-modal#owner-bookings-modal,
    #ai-topup-sheet#ai-topup-sheet#ai-topup-sheet#ai-topup-sheet#ai-topup-sheet#ai-topup-sheet,
    #enter-modal#enter-modal#enter-modal#enter-modal#enter-modal#enter-modal,
    #mobile-bytes-modal#mobile-bytes-modal#mobile-bytes-modal#mobile-bytes-modal#mobile-bytes-modal#mobile-bytes-modal,
    #payment-modal#payment-modal#payment-modal#payment-modal#payment-modal#payment-modal,
    #profile-modal#profile-modal#profile-modal#profile-modal#profile-modal#profile-modal,
    #app-modal#app-modal#app-modal#app-modal#app-modal#app-modal,
    #booking-settings-modal#booking-settings-modal#booking-settings-modal#booking-settings-modal#booking-settings-modal#booking-settings-modal,
    #booking-manager-modal#booking-manager-modal#booking-manager-modal#booking-manager-modal#booking-manager-modal#booking-manager-modal,
    #new-custom-modal#new-custom-modal#new-custom-modal#new-custom-modal#new-custom-modal#new-custom-modal,
    #bloc-share-sheet#bloc-share-sheet#bloc-share-sheet#bloc-share-sheet#bloc-share-sheet#bloc-share-sheet,
    #create-bloc-modal#create-bloc-modal#create-bloc-modal#create-bloc-modal#create-bloc-modal#create-bloc-modal,
    #tab-menu-modal#tab-menu-modal#tab-menu-modal#tab-menu-modal#tab-menu-modal#tab-menu-modal,
    #source-modal#source-modal#source-modal#source-modal#source-modal#source-modal,
    #custom-pin-modal#custom-pin-modal#custom-pin-modal#custom-pin-modal#custom-pin-modal#custom-pin-modal,
    #onboarding-modal#onboarding-modal#onboarding-modal#onboarding-modal#onboarding-modal#onboarding-modal,
    #mobileAddBookingModal#mobileAddBookingModal#mobileAddBookingModal#mobileAddBookingModal#mobileAddBookingModal#mobileAddBookingModal,
    #mobile-blocspace-calendar-event-modal#mobile-blocspace-calendar-event-modal#mobile-blocspace-calendar-event-modal#mobile-blocspace-calendar-event-modal#mobile-blocspace-calendar-event-modal#mobile-blocspace-calendar-event-modal,
    #mobile-app-access-sheet#mobile-app-access-sheet#mobile-app-access-sheet#mobile-app-access-sheet#mobile-app-access-sheet#mobile-app-access-sheet,
    #mobile-contact-sheet#mobile-contact-sheet#mobile-contact-sheet#mobile-contact-sheet#mobile-contact-sheet#mobile-contact-sheet,
    #channel-maker#channel-maker#channel-maker#channel-maker#channel-maker#channel-maker,
    #quick-login-modal#quick-login-modal#quick-login-modal#quick-login-modal#quick-login-modal#quick-login-modal,
    #membership-join#membership-join#membership-join#membership-join#membership-join#membership-join) :is(input:not([type="file"]):not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]):not([type="hidden"]), textarea, select),
html[data-appearance="glass"] body :is(#verification-modal#verification-modal#verification-modal#verification-modal#verification-modal#verification-modal,
    #community-settings-modal#community-settings-modal#community-settings-modal#community-settings-modal#community-settings-modal#community-settings-modal,
    #text-bloc-create-modal#text-bloc-create-modal#text-bloc-create-modal#text-bloc-create-modal#text-bloc-create-modal#text-bloc-create-modal,
    #text-bloc-share-modal#text-bloc-share-modal#text-bloc-share-modal#text-bloc-share-modal#text-bloc-share-modal#text-bloc-share-modal,
    #create-modal#create-modal#create-modal#create-modal#create-modal#create-modal,
    #compose-modal#compose-modal#compose-modal#compose-modal#compose-modal#compose-modal,
    #owner-bookings-modal#owner-bookings-modal#owner-bookings-modal#owner-bookings-modal#owner-bookings-modal#owner-bookings-modal,
    #ai-topup-sheet#ai-topup-sheet#ai-topup-sheet#ai-topup-sheet#ai-topup-sheet#ai-topup-sheet,
    #enter-modal#enter-modal#enter-modal#enter-modal#enter-modal#enter-modal,
    #mobile-bytes-modal#mobile-bytes-modal#mobile-bytes-modal#mobile-bytes-modal#mobile-bytes-modal#mobile-bytes-modal,
    #payment-modal#payment-modal#payment-modal#payment-modal#payment-modal#payment-modal,
    #profile-modal#profile-modal#profile-modal#profile-modal#profile-modal#profile-modal,
    #app-modal#app-modal#app-modal#app-modal#app-modal#app-modal,
    #booking-settings-modal#booking-settings-modal#booking-settings-modal#booking-settings-modal#booking-settings-modal#booking-settings-modal,
    #booking-manager-modal#booking-manager-modal#booking-manager-modal#booking-manager-modal#booking-manager-modal#booking-manager-modal,
    #new-custom-modal#new-custom-modal#new-custom-modal#new-custom-modal#new-custom-modal#new-custom-modal,
    #bloc-share-sheet#bloc-share-sheet#bloc-share-sheet#bloc-share-sheet#bloc-share-sheet#bloc-share-sheet,
    #create-bloc-modal#create-bloc-modal#create-bloc-modal#create-bloc-modal#create-bloc-modal#create-bloc-modal,
    #tab-menu-modal#tab-menu-modal#tab-menu-modal#tab-menu-modal#tab-menu-modal#tab-menu-modal,
    #source-modal#source-modal#source-modal#source-modal#source-modal#source-modal,
    #custom-pin-modal#custom-pin-modal#custom-pin-modal#custom-pin-modal#custom-pin-modal#custom-pin-modal,
    #onboarding-modal#onboarding-modal#onboarding-modal#onboarding-modal#onboarding-modal#onboarding-modal,
    #mobileAddBookingModal#mobileAddBookingModal#mobileAddBookingModal#mobileAddBookingModal#mobileAddBookingModal#mobileAddBookingModal,
    #mobile-blocspace-calendar-event-modal#mobile-blocspace-calendar-event-modal#mobile-blocspace-calendar-event-modal#mobile-blocspace-calendar-event-modal#mobile-blocspace-calendar-event-modal#mobile-blocspace-calendar-event-modal,
    #mobile-app-access-sheet#mobile-app-access-sheet#mobile-app-access-sheet#mobile-app-access-sheet#mobile-app-access-sheet#mobile-app-access-sheet,
    #mobile-contact-sheet#mobile-contact-sheet#mobile-contact-sheet#mobile-contact-sheet#mobile-contact-sheet#mobile-contact-sheet,
    #channel-maker#channel-maker#channel-maker#channel-maker#channel-maker#channel-maker,
    #quick-login-modal#quick-login-modal#quick-login-modal#quick-login-modal#quick-login-modal#quick-login-modal,
    #membership-join#membership-join#membership-join#membership-join#membership-join#membership-join) :where(button, [class$="-card"], [class$="-preview"], [class$="-media-label"], [class$="-seg"], [class$="-pill"]) {
    background: var(--gl-bg) !important;
    color: #fff !important;
    -webkit-text-fill-color: #fff !important;
    border-color: var(--gl-rim) !important;
    box-shadow: var(--gl-hi) !important;
}
html[data-appearance="glass"] body :is(#verification-modal#verification-modal#verification-modal#verification-modal#verification-modal#verification-modal,
    #community-settings-modal#community-settings-modal#community-settings-modal#community-settings-modal#community-settings-modal#community-settings-modal,
    #text-bloc-create-modal#text-bloc-create-modal#text-bloc-create-modal#text-bloc-create-modal#text-bloc-create-modal#text-bloc-create-modal,
    #text-bloc-share-modal#text-bloc-share-modal#text-bloc-share-modal#text-bloc-share-modal#text-bloc-share-modal#text-bloc-share-modal,
    #create-modal#create-modal#create-modal#create-modal#create-modal#create-modal,
    #compose-modal#compose-modal#compose-modal#compose-modal#compose-modal#compose-modal,
    #owner-bookings-modal#owner-bookings-modal#owner-bookings-modal#owner-bookings-modal#owner-bookings-modal#owner-bookings-modal,
    #ai-topup-sheet#ai-topup-sheet#ai-topup-sheet#ai-topup-sheet#ai-topup-sheet#ai-topup-sheet,
    #enter-modal#enter-modal#enter-modal#enter-modal#enter-modal#enter-modal,
    #mobile-bytes-modal#mobile-bytes-modal#mobile-bytes-modal#mobile-bytes-modal#mobile-bytes-modal#mobile-bytes-modal,
    #payment-modal#payment-modal#payment-modal#payment-modal#payment-modal#payment-modal,
    #profile-modal#profile-modal#profile-modal#profile-modal#profile-modal#profile-modal,
    #app-modal#app-modal#app-modal#app-modal#app-modal#app-modal,
    #booking-settings-modal#booking-settings-modal#booking-settings-modal#booking-settings-modal#booking-settings-modal#booking-settings-modal,
    #booking-manager-modal#booking-manager-modal#booking-manager-modal#booking-manager-modal#booking-manager-modal#booking-manager-modal,
    #new-custom-modal#new-custom-modal#new-custom-modal#new-custom-modal#new-custom-modal#new-custom-modal,
    #bloc-share-sheet#bloc-share-sheet#bloc-share-sheet#bloc-share-sheet#bloc-share-sheet#bloc-share-sheet,
    #create-bloc-modal#create-bloc-modal#create-bloc-modal#create-bloc-modal#create-bloc-modal#create-bloc-modal,
    #tab-menu-modal#tab-menu-modal#tab-menu-modal#tab-menu-modal#tab-menu-modal#tab-menu-modal,
    #source-modal#source-modal#source-modal#source-modal#source-modal#source-modal,
    #custom-pin-modal#custom-pin-modal#custom-pin-modal#custom-pin-modal#custom-pin-modal#custom-pin-modal,
    #onboarding-modal#onboarding-modal#onboarding-modal#onboarding-modal#onboarding-modal#onboarding-modal,
    #mobileAddBookingModal#mobileAddBookingModal#mobileAddBookingModal#mobileAddBookingModal#mobileAddBookingModal#mobileAddBookingModal,
    #mobile-blocspace-calendar-event-modal#mobile-blocspace-calendar-event-modal#mobile-blocspace-calendar-event-modal#mobile-blocspace-calendar-event-modal#mobile-blocspace-calendar-event-modal#mobile-blocspace-calendar-event-modal,
    #mobile-app-access-sheet#mobile-app-access-sheet#mobile-app-access-sheet#mobile-app-access-sheet#mobile-app-access-sheet#mobile-app-access-sheet,
    #mobile-contact-sheet#mobile-contact-sheet#mobile-contact-sheet#mobile-contact-sheet#mobile-contact-sheet#mobile-contact-sheet,
    #channel-maker#channel-maker#channel-maker#channel-maker#channel-maker#channel-maker,
    #quick-login-modal#quick-login-modal#quick-login-modal#quick-login-modal#quick-login-modal#quick-login-modal,
    #membership-join#membership-join#membership-join#membership-join#membership-join#membership-join) :is(button.is-active, button[aria-pressed="true"], button[aria-selected="true"], [class$="-primary"], button[type="submit"]) {
    background: var(--gl-fill-strong) !important;
    border-color: var(--gl-rim-strong) !important;
}
html[data-appearance="glass"] body :is(#verification-modal#verification-modal#verification-modal#verification-modal#verification-modal#verification-modal,
    #community-settings-modal#community-settings-modal#community-settings-modal#community-settings-modal#community-settings-modal#community-settings-modal,
    #text-bloc-create-modal#text-bloc-create-modal#text-bloc-create-modal#text-bloc-create-modal#text-bloc-create-modal#text-bloc-create-modal,
    #text-bloc-share-modal#text-bloc-share-modal#text-bloc-share-modal#text-bloc-share-modal#text-bloc-share-modal#text-bloc-share-modal,
    #create-modal#create-modal#create-modal#create-modal#create-modal#create-modal,
    #compose-modal#compose-modal#compose-modal#compose-modal#compose-modal#compose-modal,
    #owner-bookings-modal#owner-bookings-modal#owner-bookings-modal#owner-bookings-modal#owner-bookings-modal#owner-bookings-modal,
    #ai-topup-sheet#ai-topup-sheet#ai-topup-sheet#ai-topup-sheet#ai-topup-sheet#ai-topup-sheet,
    #enter-modal#enter-modal#enter-modal#enter-modal#enter-modal#enter-modal,
    #mobile-bytes-modal#mobile-bytes-modal#mobile-bytes-modal#mobile-bytes-modal#mobile-bytes-modal#mobile-bytes-modal,
    #payment-modal#payment-modal#payment-modal#payment-modal#payment-modal#payment-modal,
    #profile-modal#profile-modal#profile-modal#profile-modal#profile-modal#profile-modal,
    #app-modal#app-modal#app-modal#app-modal#app-modal#app-modal,
    #booking-settings-modal#booking-settings-modal#booking-settings-modal#booking-settings-modal#booking-settings-modal#booking-settings-modal,
    #booking-manager-modal#booking-manager-modal#booking-manager-modal#booking-manager-modal#booking-manager-modal#booking-manager-modal,
    #new-custom-modal#new-custom-modal#new-custom-modal#new-custom-modal#new-custom-modal#new-custom-modal,
    #bloc-share-sheet#bloc-share-sheet#bloc-share-sheet#bloc-share-sheet#bloc-share-sheet#bloc-share-sheet,
    #create-bloc-modal#create-bloc-modal#create-bloc-modal#create-bloc-modal#create-bloc-modal#create-bloc-modal,
    #tab-menu-modal#tab-menu-modal#tab-menu-modal#tab-menu-modal#tab-menu-modal#tab-menu-modal,
    #source-modal#source-modal#source-modal#source-modal#source-modal#source-modal,
    #custom-pin-modal#custom-pin-modal#custom-pin-modal#custom-pin-modal#custom-pin-modal#custom-pin-modal,
    #onboarding-modal#onboarding-modal#onboarding-modal#onboarding-modal#onboarding-modal#onboarding-modal,
    #mobileAddBookingModal#mobileAddBookingModal#mobileAddBookingModal#mobileAddBookingModal#mobileAddBookingModal#mobileAddBookingModal,
    #mobile-blocspace-calendar-event-modal#mobile-blocspace-calendar-event-modal#mobile-blocspace-calendar-event-modal#mobile-blocspace-calendar-event-modal#mobile-blocspace-calendar-event-modal#mobile-blocspace-calendar-event-modal,
    #mobile-app-access-sheet#mobile-app-access-sheet#mobile-app-access-sheet#mobile-app-access-sheet#mobile-app-access-sheet#mobile-app-access-sheet,
    #mobile-contact-sheet#mobile-contact-sheet#mobile-contact-sheet#mobile-contact-sheet#mobile-contact-sheet#mobile-contact-sheet,
    #channel-maker#channel-maker#channel-maker#channel-maker#channel-maker#channel-maker,
    #quick-login-modal#quick-login-modal#quick-login-modal#quick-login-modal#quick-login-modal#quick-login-modal,
    #membership-join#membership-join#membership-join#membership-join#membership-join#membership-join) :is(input, textarea)::placeholder {
    color: rgba(255,255,255,.65) !important;
    -webkit-text-fill-color: rgba(255,255,255,.65) !important;
}
html[data-appearance="glass"] body :is(#verification-modal,
    #community-settings-modal,
    #text-bloc-create-modal,
    #text-bloc-share-modal,
    #create-modal,
    #compose-modal,
    #owner-bookings-modal,
    #ai-topup-sheet,
    #enter-modal,
    #mobile-bytes-modal,
    #payment-modal,
    #profile-modal,
    #app-modal,
    #booking-settings-modal,
    #booking-manager-modal,
    #new-custom-modal,
    #bloc-share-sheet,
    #create-bloc-modal,
    #tab-menu-modal,
    #source-modal,
    #custom-pin-modal,
    #onboarding-modal,
    #mobileAddBookingModal,
    #mobile-blocspace-calendar-event-modal,
    #mobile-app-access-sheet,
    #mobile-contact-sheet,
    #channel-maker,
    #quick-login-modal,
    #membership-join) option { background: #1c1c20 !important; color: #fff !important; }
html[data-appearance="glass"] body #create-bloc-modal-backdrop#create-bloc-modal-backdrop,
html[data-appearance="glass"] body #bytes-modal-scroll#bytes-modal-scroll,
html[data-appearance="glass"] body #modal-content-wrapper#modal-content-wrapper {
    background: transparent !important;
}
/* Disabled controls stay visibly unavailable. */
html[data-appearance="glass"] body :is(#verification-modal#verification-modal#verification-modal#verification-modal#verification-modal#verification-modal,
    #community-settings-modal#community-settings-modal#community-settings-modal#community-settings-modal#community-settings-modal#community-settings-modal,
    #text-bloc-create-modal#text-bloc-create-modal#text-bloc-create-modal#text-bloc-create-modal#text-bloc-create-modal#text-bloc-create-modal,
    #text-bloc-share-modal#text-bloc-share-modal#text-bloc-share-modal#text-bloc-share-modal#text-bloc-share-modal#text-bloc-share-modal,
    #create-modal#create-modal#create-modal#create-modal#create-modal#create-modal,
    #compose-modal#compose-modal#compose-modal#compose-modal#compose-modal#compose-modal,
    #owner-bookings-modal#owner-bookings-modal#owner-bookings-modal#owner-bookings-modal#owner-bookings-modal#owner-bookings-modal,
    #ai-topup-sheet#ai-topup-sheet#ai-topup-sheet#ai-topup-sheet#ai-topup-sheet#ai-topup-sheet,
    #enter-modal#enter-modal#enter-modal#enter-modal#enter-modal#enter-modal,
    #mobile-bytes-modal#mobile-bytes-modal#mobile-bytes-modal#mobile-bytes-modal#mobile-bytes-modal#mobile-bytes-modal,
    #payment-modal#payment-modal#payment-modal#payment-modal#payment-modal#payment-modal,
    #profile-modal#profile-modal#profile-modal#profile-modal#profile-modal#profile-modal,
    #app-modal#app-modal#app-modal#app-modal#app-modal#app-modal,
    #booking-settings-modal#booking-settings-modal#booking-settings-modal#booking-settings-modal#booking-settings-modal#booking-settings-modal,
    #booking-manager-modal#booking-manager-modal#booking-manager-modal#booking-manager-modal#booking-manager-modal#booking-manager-modal,
    #new-custom-modal#new-custom-modal#new-custom-modal#new-custom-modal#new-custom-modal#new-custom-modal,
    #bloc-share-sheet#bloc-share-sheet#bloc-share-sheet#bloc-share-sheet#bloc-share-sheet#bloc-share-sheet,
    #create-bloc-modal#create-bloc-modal#create-bloc-modal#create-bloc-modal#create-bloc-modal#create-bloc-modal,
    #tab-menu-modal#tab-menu-modal#tab-menu-modal#tab-menu-modal#tab-menu-modal#tab-menu-modal,
    #source-modal#source-modal#source-modal#source-modal#source-modal#source-modal,
    #custom-pin-modal#custom-pin-modal#custom-pin-modal#custom-pin-modal#custom-pin-modal#custom-pin-modal,
    #onboarding-modal#onboarding-modal#onboarding-modal#onboarding-modal#onboarding-modal#onboarding-modal,
    #mobileAddBookingModal#mobileAddBookingModal#mobileAddBookingModal#mobileAddBookingModal#mobileAddBookingModal#mobileAddBookingModal,
    #mobile-blocspace-calendar-event-modal#mobile-blocspace-calendar-event-modal#mobile-blocspace-calendar-event-modal#mobile-blocspace-calendar-event-modal#mobile-blocspace-calendar-event-modal#mobile-blocspace-calendar-event-modal,
    #mobile-app-access-sheet#mobile-app-access-sheet#mobile-app-access-sheet#mobile-app-access-sheet#mobile-app-access-sheet#mobile-app-access-sheet,
    #mobile-contact-sheet#mobile-contact-sheet#mobile-contact-sheet#mobile-contact-sheet#mobile-contact-sheet#mobile-contact-sheet,
    #channel-maker#channel-maker#channel-maker#channel-maker#channel-maker#channel-maker,
    #quick-login-modal#quick-login-modal#quick-login-modal#quick-login-modal#quick-login-modal#quick-login-modal,
    #membership-join#membership-join#membership-join#membership-join#membership-join#membership-join) :is(button:disabled, input:disabled, select:disabled) { opacity: .48 !important; }
html[data-appearance="glass"] body #rooms-mobile-overlay,
html[data-appearance="glass"] body #rooms-room-transition-cover {
    background: var(--gl-sheet) !important;
    -webkit-backdrop-filter: var(--gl-blur);
    backdrop-filter: var(--gl-blur);
}
html[data-appearance="glass"] body #rooms-mobile-frame { background: transparent !important; }

/* Login locks inline field colors on focus; tokens let appearance switches
   update those fields immediately without changing its light defaults. */
html[data-appearance="glass"] #quick-login-modal {
    --qlm-input-bg: rgba(255,255,255,.14);
    --qlm-input-ink: #fff;
}

/* New Post has one glass shell. Its native card wrappers own the field
   material; painting their inputs again produces double rims and square
   patches on the plain-text header controls. Repeated IDs match the shared
   legacy sheet overrides above without affecting Light or Dark. */
html[data-appearance="glass"] body #create-modal#create-modal#create-modal#create-modal#create-modal#create-modal {
    background: rgba(14, 14, 18, .16) !important;
}
html[data-appearance="glass"] body #create-modal#create-modal#create-modal#create-modal#create-modal#create-modal :is(.modal-content, #modal-public-content) {
    background: transparent !important;
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
    box-shadow: none !important;
    border: 0 !important;
}
html[data-appearance="glass"] body #create-modal#create-modal#create-modal#create-modal#create-modal#create-modal .cpx--composer {
    padding: 12px 14px 16px !important;
    border: 1px solid rgba(255,255,255,.20) !important;
    border-radius: 28px !important;
    background: linear-gradient(145deg, rgba(255,255,255,.12), rgba(255,255,255,.035)), rgba(28,28,32,.26) !important;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.15) !important;
    -webkit-backdrop-filter: var(--gl-blur) !important;
    backdrop-filter: var(--gl-blur) !important;
    overflow: hidden !important;
}
html[data-appearance="glass"] body #create-modal#create-modal#create-modal#create-modal#create-modal#create-modal :is(.cpx-bar-cancel, .cpx-bar-settings) {
    background: transparent !important;
    border: 0 !important;
    border-radius: 14px !important;
    box-shadow: none !important;
    min-height: 44px !important;
}
html[data-appearance="glass"] body #create-modal#create-modal#create-modal#create-modal#create-modal#create-modal :is(.cpx-bar-cancel, .cpx-bar-settings)::before,
html[data-appearance="glass"] body #create-modal#create-modal#create-modal#create-modal#create-modal#create-modal :is(.cpx-bar-cancel, .cpx-bar-settings)::after {
    content: none !important;
}
html[data-appearance="glass"] body #create-modal#create-modal#create-modal#create-modal#create-modal#create-modal :is(.cpx-posting, .cpx-card, .cpx-settings-card, .cpx-gate-card) {
    background: rgba(255,255,255,.065) !important;
    border: 1px solid rgba(255,255,255,.16) !important;
    border-radius: 20px !important;
    box-shadow: none !important;
}
html[data-appearance="glass"] body #create-modal#create-modal#create-modal#create-modal#create-modal#create-modal :is(.cpx-select, .cpx-textarea, #community-post-media-btn) {
    background-color: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    border-radius: 16px !important;
}
html[data-appearance="glass"] body #create-modal#create-modal#create-modal#create-modal#create-modal#create-modal .cpx-card:focus-within {
    border-color: rgba(255,255,255,.52) !important;
    box-shadow: 0 0 0 2px rgba(255,255,255,.08) !important;
}
html[data-appearance="glass"] body #create-modal#create-modal#create-modal#create-modal#create-modal#create-modal :is(.cpx-bar-cancel, .cpx-bar-settings):focus-visible {
    outline: 2px solid rgba(255,255,255,.65) !important;
    outline-offset: 1px !important;
}
/* The shared glass button fill makes the New Post header controls look like
   square tiles. They are plain controls on the header, with a full tap area. */
html[data-appearance="glass"] body #new-custom-modal#new-custom-modal#new-custom-modal#new-custom-modal#new-custom-modal#new-custom-modal.upload-only:not(.story-mode) :is(#bytes-composer-cancel, #bytes-composer-settings) {
    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
    color: #fff !important;
    -webkit-text-fill-color: #fff !important;
    min-height: 44px !important;
}
html[data-appearance="glass"] body #new-custom-modal#new-custom-modal#new-custom-modal#new-custom-modal#new-custom-modal#new-custom-modal.upload-only:not(.story-mode) :is(#bytes-composer-cancel, #bytes-composer-settings)::before,
html[data-appearance="glass"] body #new-custom-modal#new-custom-modal#new-custom-modal#new-custom-modal#new-custom-modal#new-custom-modal.upload-only:not(.story-mode) :is(#bytes-composer-cancel, #bytes-composer-settings)::after {
    content: none !important;
}
html[data-appearance="glass"] body #new-custom-modal#new-custom-modal#new-custom-modal#new-custom-modal#new-custom-modal#new-custom-modal.upload-only:not(.story-mode) #bytes-composer-settings i {
    color: #fff !important;
    -webkit-text-fill-color: #fff !important;
}
html[data-appearance="glass"] body #new-custom-modal#new-custom-modal#new-custom-modal#new-custom-modal#new-custom-modal#new-custom-modal.upload-only:not(.story-mode) :is(#bytes-composer-cancel, #bytes-composer-settings):focus-visible {
    outline: 2px solid rgba(255,255,255,.7) !important;
    outline-offset: 2px !important;
}

html[data-appearance="glass"] body #create-modal#create-modal#create-modal#create-modal#create-modal#create-modal #community-post-media-btn i {
    background: rgba(255,255,255,.08) !important;
    box-shadow: none !important;
}

/* Post detail is a separate surface, with its reply dock outside the modal.
   Keep the media pixels untouched and let the glass canvas show through the
   text/replies instead of repainting each section with the legacy dark fill. */
html[data-appearance="glass"] body #enter-modal#enter-modal#enter-modal#enter-modal#enter-modal#enter-modal.post-detail-page {
    --community-post-detail-surface: transparent !important;
    --detail-text: #fff;
    background: var(--gl-sheet) !important;
    -webkit-backdrop-filter: var(--gl-blur) !important;
    backdrop-filter: var(--gl-blur) !important;
}
html[data-appearance="glass"] body #enter-modal#enter-modal#enter-modal#enter-modal#enter-modal#enter-modal.post-detail-page :is(.enter-content, #post-info, .post-detail-thread-grid, .enter-post-hero, .enter-post-body, .enter-post-copy, .post-detail-engagement, .post-detail-replies-head, .post-detail-inline-replies, .post-detail-inline-reply, .comments-section, #comments-list) {
    background: transparent !important;
    box-shadow: none !important;
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
}
html[data-appearance="glass"] body #enter-modal#enter-modal#enter-modal#enter-modal#enter-modal#enter-modal.post-detail-page :is(.community-feed-action, .enter-close, .post-detail-inline-reply-menu-trigger) {
    background: rgba(255,255,255,.12) !important;
    border: 1px solid rgba(255,255,255,.22) !important;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.10) !important;
    color: #fff !important;
    -webkit-text-fill-color: #fff !important;
}
html[data-appearance="glass"] body #enter-modal#enter-modal#enter-modal#enter-modal#enter-modal#enter-modal.post-detail-page :is(.post-detail-inline-reply-menu-popover, .community-post-menu) {
    background: rgba(28,28,32,.80) !important;
    -webkit-backdrop-filter: var(--gl-blur) !important;
    backdrop-filter: var(--gl-blur) !important;
    border-color: rgba(255,255,255,.22) !important;
}
html[data-appearance="glass"] body #enter-modal#enter-modal#enter-modal#enter-modal#enter-modal#enter-modal.post-detail-page .post-detail-inline-replies::before {
    color: rgba(255,255,255,.64) !important;
    -webkit-text-fill-color: rgba(255,255,255,.64) !important;
}
html[data-appearance="glass"] body.post-detail-open #global-comment-input#global-comment-input#global-comment-input#global-comment-input {
    background: transparent !important;
    box-shadow: none !important;
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
    color: #fff !important;
}
html[data-appearance="glass"] body.post-detail-open #global-comment-input#global-comment-input#global-comment-input#global-comment-input > div {
    background: transparent !important;
    box-shadow: none !important;
}
html[data-appearance="glass"] body.post-detail-open #global-comment-input#global-comment-input#global-comment-input#global-comment-input #comment-input {
    background: rgba(35,35,40,.48) !important;
    border: 1px solid rgba(255,255,255,.25) !important;
    color: #fff !important;
    -webkit-text-fill-color: #fff !important;
    caret-color: #fff !important;
    -webkit-backdrop-filter: var(--gl-blur) !important;
    backdrop-filter: var(--gl-blur) !important;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.10) !important;
}
html[data-appearance="glass"] body.post-detail-open #global-comment-input#global-comment-input#global-comment-input#global-comment-input #comment-input::placeholder {
    color: rgba(255,255,255,.70) !important;
    -webkit-text-fill-color: rgba(255,255,255,.70) !important;
    opacity: 1 !important;
}
html[data-appearance="glass"] body.post-detail-open #global-comment-input#global-comment-input#global-comment-input#global-comment-input button,
html[data-appearance="glass"] body.post-detail-open #global-comment-input#global-comment-input#global-comment-input#global-comment-input button i {
    color: #fff !important;
    -webkit-text-fill-color: #fff !important;
}
html[data-appearance="glass"] body.post-detail-open #global-comment-input#global-comment-input#global-comment-input#global-comment-input button:last-child {
    background: rgba(35,35,40,.48) !important;
    border: 1px solid rgba(255,255,255,.25) !important;
    -webkit-backdrop-filter: var(--gl-blur) !important;
    backdrop-filter: var(--gl-blur) !important;
}
html[data-appearance="glass"] body #enter-modal#enter-modal#enter-modal#enter-modal#enter-modal#enter-modal.post-detail-page .post-detail-inline-reply-menu-trigger {
    border-radius: 50% !important;
}

/* The full-screen post sits above opaque navigation panes. Blurring those
   panes alone produces black; carry the app wallpaper into this surface. */
html[data-appearance="glass"] body #enter-modal#enter-modal#enter-modal#enter-modal#enter-modal#enter-modal.post-detail-page {
    isolation: isolate !important;
}
html[data-appearance="glass"] body #enter-modal#enter-modal#enter-modal#enter-modal#enter-modal#enter-modal.post-detail-page::after {
    content: "" !important;
    position: absolute !important;
    inset: -40px !important;
    z-index: -1 !important;
    pointer-events: none !important;
    background-color: #514553 !important;
    background-image: linear-gradient(rgba(24,24,30,.22), rgba(24,24,30,.22)), var(--gl-wallpaper, linear-gradient(135deg, #4d4359, #806147 55%, #35495b)) !important;
    background-size: cover !important;
    background-position: center 30% !important;
    filter: blur(26px) saturate(140%) brightness(.78) !important;
    transform: scale(1.08) !important;
}

/* Email retains its glass reader; messaging owns its theme-aware surfaces. */
html[data-appearance="glass"] body #mobile-blocspace-email-reader#mobile-blocspace-email-reader#mobile-blocspace-email-reader#mobile-blocspace-email-reader#mobile-blocspace-email-reader#mobile-blocspace-email-reader {
    isolation: isolate !important;
    background: var(--gl-sheet) !important;
    color: #fff !important;
    --messages-input-bg: rgba(255,255,255,.10);
    --messages-input-ink: #fff;
    --messages-input-scheme: dark;
}
html[data-appearance="glass"] body #mobile-blocspace-email-reader#mobile-blocspace-email-reader#mobile-blocspace-email-reader#mobile-blocspace-email-reader#mobile-blocspace-email-reader#mobile-blocspace-email-reader::before {
    content: "" !important;
    position: absolute !important;
    inset: -30px !important;
    z-index: -1 !important;
    pointer-events: none !important;
    background-color: #514553 !important;
    background-image: linear-gradient(rgba(24,24,30,.22), rgba(24,24,30,.22)), var(--gl-wallpaper, linear-gradient(135deg,#4d4359,#806147 55%,#35495b)) !important;
    background-size: cover !important;
    background-position: center 30% !important;
    filter: blur(26px) saturate(140%) brightness(.78) !important;
}
html[data-appearance="glass"] body #mobile-blocspace-email-reader#mobile-blocspace-email-reader#mobile-blocspace-email-reader#mobile-blocspace-email-reader#mobile-blocspace-email-reader#mobile-blocspace-email-reader :where(div,header,section,article,footer,form,label,span,p,strong,small,h1,h2,h3,em,a,i,button,input,textarea) {
    background-color: transparent !important;
    color: #fff !important;
    -webkit-text-fill-color: #fff !important;
    border-color: rgba(255,255,255,.18) !important;
}
html[data-appearance="glass"] body #mobile-blocspace-email-reader#mobile-blocspace-email-reader#mobile-blocspace-email-reader#mobile-blocspace-email-reader#mobile-blocspace-email-reader#mobile-blocspace-email-reader :is(.bsd-deck,.bsd-card,.bsd-search,.bsd-menu,.bsd-compose,.bsd-pill.is-on,.bsd-chip.is-on,.mobile-blocspace-email-thread-card,.mobile-blocspace-email-reply > div) {
    background: rgba(255,255,255,.10) !important;
    border-color: rgba(255,255,255,.20) !important;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.08) !important;
}
html[data-appearance="glass"] body #mobile-blocspace-email-reader#mobile-blocspace-email-reader#mobile-blocspace-email-reader#mobile-blocspace-email-reader#mobile-blocspace-email-reader#mobile-blocspace-email-reader :is(input,textarea)::placeholder {
    color: rgba(255,255,255,.65) !important;
    -webkit-text-fill-color: rgba(255,255,255,.65) !important;
    opacity: 1 !important;
}

/* Stream checkout and its verified receipt share the app's Glass canvas.
   Scope only our form surfaces; payment-provider buttons and pass artwork
   retain their own branding and contrast. */
html[data-appearance="glass"] body #stream-collect-sheet#stream-collect-sheet#stream-collect-sheet {
    background: var(--gl-sheet) !important;
    isolation: isolate !important;
}
html[data-appearance="glass"] body #stream-collect-sheet#stream-collect-sheet#stream-collect-sheet::before {
    content: "" !important;
    position: fixed !important;
    inset: -30px !important;
    z-index: -1 !important;
    pointer-events: none !important;
    background: linear-gradient(rgba(24,24,30,.22),rgba(24,24,30,.22)), var(--gl-wallpaper, linear-gradient(135deg,#4d4359,#806147 55%,#35495b)) !important;
    background-size: cover !important;
    background-position: center 30% !important;
    -webkit-filter: blur(26px) saturate(140%) brightness(.78) !important;
    filter: blur(26px) saturate(140%) brightness(.78) !important;
}
html[data-appearance="glass"] body #stream-collect-sheet#stream-collect-sheet#stream-collect-sheet :is(.sc-body,.sc-footer,.sc-receipt) {
    background: transparent !important;
}
html[data-appearance="glass"] body #stream-collect-sheet#stream-collect-sheet#stream-collect-sheet :is(.sc-field,.sc-totals,.sc-frequency-tabs,.stream-collect-amounts button,.sc-number,.sc-preview-btn,.sc-perks,.checkout-methods__card) {
    background: rgba(255,255,255,.10) !important;
    border-color: rgba(255,255,255,.22) !important;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.10) !important;
}
html[data-appearance="glass"] body #stream-collect-sheet#stream-collect-sheet#stream-collect-sheet :is(h2,h3,p,.sc-receipt .sc-benefits li,.sc-eyebrow,.sc-label,.sc-field,.sc-field input,.sc-totals,.sc-totals span,.sc-totals strong,.sc-perks li,.sc-number,.sc-preview-btn,.stream-collect-amounts button,.sc-frequency-tabs button,.sc-receipt-total,.checkout-methods__card summary,[data-pay],[data-recover]) {
    color: #fff !important;
    -webkit-text-fill-color: #fff !important;
}
html[data-appearance="glass"] body #stream-collect-sheet#stream-collect-sheet#stream-collect-sheet :is(.sc-field input,.sc-field b,.sc-frequency-tabs button) {
    background: transparent !important;
}
html[data-appearance="glass"] body #stream-collect-sheet#stream-collect-sheet#stream-collect-sheet :is(button[data-pay],.sc-frequency-tabs button[aria-pressed="true"],.stream-collect-amounts button[aria-pressed="true"]) {
    background: rgba(255,255,255,.23) !important;
}
html[data-appearance="glass"] body #stream-collect-sheet#stream-collect-sheet#stream-collect-sheet :is(.sc-preview-btn span,.sc-preview-btn i,.sc-field b) {
    color: #fff !important;
    -webkit-text-fill-color: #fff !important;
}
html[data-appearance="glass"] body #stream-collect-sheet#stream-collect-sheet#stream-collect-sheet .sc-receipt-check {
    color: #166534 !important;
    -webkit-text-fill-color: #166534 !important;
}
/* The translucent modal must not reveal its own launch dock underneath it. */
html[data-appearance="glass"] body:has(#stream-collect-sheet[open]) #stream-collect-bar {
    visibility: hidden !important;
    pointer-events: none !important;
}
/* Keep the wallpaper in the dialog's own layer when scrolling long forms. */
html[data-appearance="glass"] body #stream-collect-sheet#stream-collect-sheet#stream-collect-sheet::before { z-index: 0 !important; }
html[data-appearance="glass"] body #stream-collect-sheet#stream-collect-sheet#stream-collect-sheet > :is(.sc-art,.sc-body,.sc-footer) {
    position: relative !important;
    z-index: 1 !important;
}
/* WebKit can omit filter on a fixed dialog pseudo-element; frost the photo
   with a separate backdrop layer as well. Both layers stay below controls. */
html[data-appearance="glass"] body #stream-collect-sheet#stream-collect-sheet#stream-collect-sheet::after {
    content: "" !important;
    position: fixed !important;
    inset: 0 !important;
    z-index: 0 !important;
    pointer-events: none !important;
    background: rgba(24,24,30,.18) !important;
    -webkit-backdrop-filter: blur(26px) saturate(140%) !important;
    backdrop-filter: blur(26px) saturate(140%) !important;
}

/* Stream chat is a separate bottom sheet from the direct-message inbox. */
html[data-appearance="glass"] body #stream-message-panel#stream-message-panel#stream-message-panel#stream-message-panel {
    background: rgba(28,28,32,.40) !important;
    border-color: rgba(255,255,255,.22) !important;
    color: #fff !important;
    -webkit-backdrop-filter: var(--gl-blur) !important;
    backdrop-filter: var(--gl-blur) !important;
    isolation: isolate !important;
}
html[data-appearance="glass"] body #stream-message-panel#stream-message-panel#stream-message-panel#stream-message-panel::before {
    content: "" !important;
    position: absolute !important;
    inset: -30px !important;
    z-index: -1 !important;
    pointer-events: none !important;
    background: linear-gradient(rgba(24,24,30,.28),rgba(24,24,30,.28)), var(--gl-wallpaper,linear-gradient(135deg,#4d4359,#806147 55%,#35495b)) !important;
    background-size: cover !important;
    background-position: center 30% !important;
    -webkit-filter: blur(26px) saturate(140%) brightness(.78) !important;
    filter: blur(26px) saturate(140%) brightness(.78) !important;
}
html[data-appearance="glass"] body #stream-message-panel#stream-message-panel#stream-message-panel#stream-message-panel :is(.stream-message-panel-head,.stream-message-list,.stream-message-compose) {
    background: transparent !important;
    box-shadow: none !important;
    border-color: rgba(255,255,255,.16) !important;
}
html[data-appearance="glass"] body #stream-message-panel#stream-message-panel#stream-message-panel#stream-message-panel :is(h3,p,span,i,.stream-message-empty,.stream-message-text,button,textarea) {
    color: #fff !important;
    -webkit-text-fill-color: #fff !important;
}
html[data-appearance="glass"] body #stream-message-panel#stream-message-panel#stream-message-panel#stream-message-panel :is(.stream-message-bubble,.stream-message-panel-close,.stream-message-delete,.stream-message-moderate,#stream-message-input) {
    background: rgba(255,255,255,.10) !important;
    border: 1px solid rgba(255,255,255,.20) !important;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.08) !important;
}
html[data-appearance="glass"] body #stream-message-panel#stream-message-panel#stream-message-panel#stream-message-panel :is(.stream-message-bubble.is-self,.stream-message-send) {
    background: rgba(255,255,255,.22) !important;
    border-color: rgba(255,255,255,.28) !important;
}
html[data-appearance="glass"] body #stream-message-panel#stream-message-panel#stream-message-panel#stream-message-panel :is(.stream-message-time,.stream-message-sender-ticker,.stream-message-panel-kicker,.stream-message-empty) {
    color: rgba(255,255,255,.72) !important;
    -webkit-text-fill-color: rgba(255,255,255,.72) !important;
}
html[data-appearance="glass"] body #stream-message-panel#stream-message-panel#stream-message-panel#stream-message-panel #stream-message-input::placeholder {
    color: rgba(255,255,255,.65) !important;
    -webkit-text-fill-color: rgba(255,255,255,.65) !important;
    opacity: 1 !important;
}
html[data-appearance="glass"] body #stream-message-panel#stream-message-panel#stream-message-panel#stream-message-panel .stream-message-moderate.is-block {
    color: #ffb0a8 !important;
    -webkit-text-fill-color: #ffb0a8 !important;
}
html[data-appearance="glass"] body #stream-message-panel#stream-message-panel#stream-message-panel#stream-message-panel#stream-message-panel .stream-message-bubble.is-self {
    background: rgba(255,255,255,.22) !important;
}

/* Glass appearance for owner analytics, finance, campaigns and streaming.
   Keep chart/status colors, media, QR codes and editable wallet artwork intact. */
html[data-appearance="glass"] body #blocspace-activity-content#blocspace-activity-content .bsa-root {
    --bsa-card: var(--gl-fill); --bsa-line: var(--gl-rim); --bsa-line2: rgba(255,255,255,.16);
    --bsa-ink: #fff; --bsa-ink2: rgba(255,255,255,.88); --bsa-mute: rgba(255,255,255,.74);
    --bsa-mute2: rgba(255,255,255,.68); --bsa-faint: rgba(255,255,255,.55);
    --bsa-track: rgba(255,255,255,.10); --bsa-pill: var(--gl-fill); --bsa-chip: var(--gl-fill);
    --bsa-thumb: var(--gl-fill); --bsa-hero: var(--gl-fill); --bsa-hero-on: var(--gl-fill-strong);
    --bsa-hero-line: var(--gl-rim); --bsa-hero-ink: #fff; --bsa-hero-mute: rgba(255,255,255,.74);
    --bsa-teal-ink: #86efac; --bsa-teal-bg: rgba(52,211,153,.16);
    --bsa-amber-ink: #fcd34d; --bsa-amber-bg: rgba(251,191,36,.16);
    --bsa-red: #fda4af; --bsa-red-bg: rgba(251,113,133,.16); --bsa-shadow: var(--gl-hi);
    background: transparent !important;
}
html[data-appearance="glass"] body #blocspace-activity-content#blocspace-activity-content :is(.bsa-hero,.bsa-card) {
    background: var(--gl-bg) !important; border-color: var(--gl-rim) !important; box-shadow: var(--gl-shadow) !important;
}
html[data-appearance="glass"] body #blocspace-activity-content#blocspace-activity-content .bsa-hero {
    -webkit-backdrop-filter: var(--gl-blur); backdrop-filter: var(--gl-blur);
}
html[data-appearance="glass"] body #blocspace-wallet-finance#blocspace-wallet-finance {
    --text-primary: #fff; --text-secondary: rgba(255,255,255,.74); background: transparent !important;
}
html[data-appearance="glass"] body #blocspace-wallet-finance#blocspace-wallet-finance :is(.mobile-blocspace-wallet-hero,.mobile-blocspace-wallet-section,.mobile-blocspace-wallet-empty) {
    background: var(--gl-bg) !important; border: 1px solid var(--gl-rim) !important;
    border-radius: 20px; padding: 16px; box-shadow: var(--gl-hi) !important;
}
html[data-appearance="glass"] body #blocspace-wallet-finance#blocspace-wallet-finance .mobile-blocspace-wallet-hero {
    -webkit-backdrop-filter: var(--gl-blur); backdrop-filter: var(--gl-blur);
}
html[data-appearance="glass"] body #blocspace-wallet-finance#blocspace-wallet-finance :is(button,.mobile-blocspace-wallet-sub-summary) {
    background: var(--gl-fill) !important; border-color: var(--gl-rim) !important; color: #fff !important; -webkit-text-fill-color: #fff !important;
}
html[data-appearance="glass"] body #blocspace-wallet-finance#blocspace-wallet-finance .mobile-blocspace-wallet-segment button.is-active {
    background: var(--gl-fill-strong) !important; box-shadow: var(--gl-hi) !important;
}
/* Campaign's composer has its own hard-coded light palette. */
html[data-appearance="glass"] body :is(.mcamp.mcamp.mcamp,#mobile-campaign-overlay#mobile-campaign-overlay) {
    --mc-ink: #fff; --mc-body: rgba(255,255,255,.88); --mc-mute: rgba(255,255,255,.74);
    --mc-faint: rgba(255,255,255,.55); --mc-paper: transparent; --mc-wash: var(--gl-fill); --mc-line: var(--gl-rim);
    background: transparent !important;
}
html[data-appearance="glass"] body #mobile-campaign-overlay#mobile-campaign-overlay {
    background: var(--gl-sheet) !important; -webkit-backdrop-filter: var(--gl-blur) !important; backdrop-filter: var(--gl-blur) !important;
}
html[data-appearance="glass"] body :is(.mcamp.mcamp.mcamp,#mobile-campaign-overlay#mobile-campaign-overlay) :is(.mcamp-overlay__body,.mcamp-overlay__bar,.mcamp__wizhead) {
    background: transparent !important;
}
html[data-appearance="glass"] body :is(.mcamp.mcamp.mcamp,#mobile-campaign-overlay#mobile-campaign-overlay) :is(.mcamp__card,.mcamp__boxed,.mcamp__row,.mcamp__disc,.mcamp__cal,.mcamp__search,.mcamp__drop,.mcamp__sponsor,.mcamp__paste,.mcamp__addbtn,.mcamp__btn,.mcamp__pill,.mcamp__choice,.mcamp__grid2:has(.mcamp__choice),input,textarea,select) {
    background: var(--gl-fill) !important; border-color: var(--gl-rim) !important; box-shadow: var(--gl-hi) !important;
}
html[data-appearance="glass"] body :is(.mcamp.mcamp.mcamp,#mobile-campaign-overlay#mobile-campaign-overlay) :is(h1,h2,h3,p,label,input,textarea,select,button,.mcamp__title,.mcamp__label,.mcamp__row-title,.mcamp__row-meta,.mcamp__field,.mcamp__btn,.mcamp__choice) {
    color: #fff !important; -webkit-text-fill-color: #fff !important;
}
html[data-appearance="glass"] body :is(.mcamp.mcamp.mcamp,#mobile-campaign-overlay#mobile-campaign-overlay) :is(.mcamp__btn--next,.mcamp__btn--solid,.mcamp__choice.is-on,.mcamp__check.is-on,.mcamp__day.is-on,.mcamp__day.is-sel) {
    background: var(--gl-fill-strong) !important; color: #fff !important; -webkit-text-fill-color: #fff !important;
}
html[data-appearance="glass"] body #mobile-campaign-overlay#mobile-campaign-overlay :is(.mcamp__banner,.mcamp__error) {
    background: rgba(251,113,133,.16) !important; color: #fda4af !important; -webkit-text-fill-color: #fda4af !important;
}
/* Streaming dashboard, replay library, add composer and wallet detail sheets. */
html[data-appearance="glass"] body :is(#mobile-stream-control-sheet#mobile-stream-control-sheet#mobile-stream-control-sheet,#mobile-stream-replay-library#mobile-stream-replay-library,#mobileStreamModal#mobileStreamModal#mobileStreamModal,dialog.sd-wallet-preview.sd-wallet-preview.sd-wallet-preview:not(.sd-details-mode),dialog.sd-field-sheet.sd-field-sheet) {
    background: var(--gl-sheet) !important; color: #fff !important; -webkit-text-fill-color: #fff !important;
    color-scheme: dark !important; -webkit-backdrop-filter: var(--gl-blur) !important; backdrop-filter: var(--gl-blur) !important;
}
html[data-appearance="glass"] body #mobile-stream-control-sheet#mobile-stream-control-sheet#mobile-stream-control-sheet :is(.mobile-stream-control-panel,.mobile-stream-control-head,.mobile-stream-control-body,.mobile-stream-dashboard-metrics,.mobile-stream-dashboard-metrics article,.mobile-stream-dashboard-permission-option,.mobile-stream-activity-row) {
    background: transparent !important; border-color: var(--gl-rim) !important;
}
html[data-appearance="glass"] body #mobile-stream-control-sheet#mobile-stream-control-sheet#mobile-stream-control-sheet :is(.mobile-stream-status-card,.mobile-stream-dashboard-stream-row,.mobile-stream-dashboard-permission-options,.mobile-stream-dashboard-access-code,.mobile-stream-activity-list,.mobile-stream-control-inline,.mobile-stream-control-close,.sd-schedule-form,.sd-price-control,.sd-wallet-mini,[data-minimum-form],[data-card-status],[aria-label="Trading card pricing"],.msd-replay-stats > div,input,select,.msd-library-back,.msd-replay-menu button) {
    background: var(--gl-bg) !important; border-color: var(--gl-rim) !important; box-shadow: var(--gl-hi) !important;
}
html[data-appearance="glass"] body #mobile-stream-control-sheet#mobile-stream-control-sheet#mobile-stream-control-sheet :is(h3,strong,small,span,label,input,select,button,p,i,.mobile-stream-control-kicker,.mobile-stream-activity-value,.sd-price-help) {
    color: #fff !important; -webkit-text-fill-color: #fff !important;
}
html[data-appearance="glass"] body #mobile-stream-control-sheet#mobile-stream-control-sheet#mobile-stream-control-sheet :is([data-card-mode][aria-pressed="true"],button[type="submit"],.sd-price-control button) {
    background: var(--gl-fill-strong) !important; color: #fff !important; -webkit-text-fill-color: #fff !important;
}
html[data-appearance="glass"] body #mobileStreamModal#mobileStreamModal#mobileStreamModal :is(.stc-posting,.stc-card,.stc-segment,.stc-pass-row,.stc-pass-link,.stc-pass-actions button,.stc-submit,.stc-preview-stage,.mobile-stream-add-card,.mobile-stream-add-status.is-starting) {
    background: var(--gl-bg) !important; border-color: var(--gl-rim) !important; box-shadow: var(--gl-hi) !important;
}
html[data-appearance="glass"] body #mobileStreamModal#mobileStreamModal#mobileStreamModal :is(h1,h2,h3,p,label,input,textarea,select,button,span,.stc-label,.stc-hint,.stc-posting-name,.stc-posting-meta,.stc-pass-link) {
    color: #fff !important; -webkit-text-fill-color: #fff !important;
}
html[data-appearance="glass"] body #mobileStreamModal#mobileStreamModal#mobileStreamModal :is(input,textarea,select) { background: transparent !important; }
html[data-appearance="glass"] body #mobileStreamModal#mobileStreamModal#mobileStreamModal :is(.stc-segment button.is-active,.stc-submit.is-ready,.stc-pass-actions button.is-primary) { background: var(--gl-fill-strong) !important; }
html[data-appearance="glass"] body :is(dialog.sd-wallet-preview.sd-wallet-preview.sd-wallet-preview:not(.sd-details-mode),dialog.sd-field-sheet.sd-field-sheet) :is(.sd-detail-group,.sd-wallet-details > div:not(.sd-detail-hero),.sd-wallet-editor,input,header:not(.sd-wallet-face header),button:not(.sd-swatches button)) {
    background: var(--gl-bg) !important; border-color: var(--gl-rim) !important; color: #fff !important; -webkit-text-fill-color: #fff !important;
}
html[data-appearance="glass"] body dialog.sd-wallet-preview.sd-wallet-preview.sd-wallet-preview:not(.sd-details-mode) :is(.sd-wallet-details,.sd-wallet-details *,.sd-detail-toolbar,.sd-detail-toolbar *,header > span):not(.sd-wallet-face):not(.sd-wallet-face *) {
    color: #fff !important; -webkit-text-fill-color: #fff !important; border-color: var(--gl-rim) !important;
}
html[data-appearance="glass"] body :is(#mobileStreamModal#mobileStreamModal#mobileStreamModal,#mobile-campaign-overlay#mobile-campaign-overlay,#mobile-stream-control-sheet#mobile-stream-control-sheet#mobile-stream-control-sheet) :is(input,textarea)::placeholder {
    color: rgba(255,255,255,.6) !important; -webkit-text-fill-color: rgba(255,255,255,.6) !important;
}
html[data-appearance="glass"] body :is(#mobileStreamModal,#mobile-campaign-overlay,#mobile-stream-control-sheet) option { background: #1c1c20 !important; color: #fff !important; }
/* Current Blocspace renderers share BSD and ODX tokens with detail views. */
html[data-appearance="glass"] body :is(#blocspace-modal-content,#blocspace-calendar-sheet) .bsd-root.bsd-root {
    --bsd-card: var(--gl-fill); --bsd-card2: rgba(255,255,255,.08);
    --bsd-line: var(--gl-rim); --bsd-line2: rgba(255,255,255,.16);
    --bsd-ink: #fff; --bsd-ink2: rgba(255,255,255,.88); --bsd-mute: rgba(255,255,255,.74);
    --bsd-mute2: rgba(255,255,255,.68); --bsd-faint: rgba(255,255,255,.55);
    --bsd-track: rgba(255,255,255,.10); --bsd-pill: var(--gl-fill); --bsd-chip: var(--gl-fill);
    --bsd-chip2: var(--gl-fill-strong); --bsd-thumb: var(--gl-fill); --bsd-hero: var(--gl-fill);
    --bsd-hero-on: var(--gl-fill-strong); --bsd-hero-line: var(--gl-rim); --bsd-hero-edge: var(--gl-rim);
    --bsd-hero-ink: #fff; --bsd-hero-mute: rgba(255,255,255,.74); --bsd-hero-soft: rgba(255,255,255,.8);
    --bsd-teal-ink: #86efac; --bsd-teal-bg: rgba(52,211,153,.16); --bsd-amber-ink: #fcd34d;
    --bsd-amber-bg: rgba(251,191,36,.16); --bsd-red: #fda4af; --bsd-red-bg: rgba(251,113,133,.16);
    --bsd-red-line: rgba(251,113,133,.32); --bsd-shadow: var(--gl-hi); --bsd-lift: var(--gl-shadow);
}
html[data-appearance="glass"] body :is(#blocspace-modal-content,#blocspace-calendar-sheet) .bsd-root.bsd-root :is(.bsd-hero,.bsd-card,.bsd-subcard) {
    background: var(--gl-bg) !important; border-color: var(--gl-rim) !important; box-shadow: var(--gl-hi) !important;
}
html[data-appearance="glass"] body :is(#bs-odx,#bsw-odx,#bsm-odx,#bsp-odx):is(#bs-odx,#bsw-odx,#bsm-odx,#bsp-odx):is(#bs-odx,#bsw-odx,#bsm-odx,#bsp-odx).odx {
    --odx-bg: transparent; --odx-card: var(--gl-fill); --odx-ink: #fff;
    --odx-mute: rgba(255,255,255,.74); --odx-faint: rgba(255,255,255,.55);
    --odx-line: rgba(255,255,255,.22); --odx-line2: var(--gl-rim);
    --odx-good: #86efac; --odx-bad: #fda4af; --odx-warn: #fcd34d;
    background: transparent !important;
}
html[data-appearance="glass"] body :is(#bs-odx,#bsw-odx,#bsm-odx,#bsp-odx):is(#bs-odx,#bsw-odx,#bsm-odx,#bsp-odx):is(#bs-odx,#bsw-odx,#bsm-odx,#bsp-odx).odx :is(.odx-card,.odx-tile,.odx-search,.odx-seg,.odx-chip,.odx-btn) {
    background: var(--gl-fill) !important; border-color: var(--gl-rim) !important; box-shadow: var(--gl-hi) !important;
}
html[data-appearance="glass"] body :is(#bs-odx,#bsw-odx,#bsm-odx,#bsp-odx):is(#bs-odx,#bsw-odx,#bsm-odx,#bsp-odx):is(#bs-odx,#bsw-odx,#bsm-odx,#bsp-odx).odx :is(.odx-seg button[aria-pressed="true"],.odx-btn.is-solid,.odx-chip.is-on,.odx-chip[aria-pressed="true"]) {
    background: var(--gl-fill-strong) !important; color: #fff !important; -webkit-text-fill-color: #fff !important;
}
html[data-appearance="glass"] body :is(#bs-odx,#bsw-odx,#bsm-odx,#bsp-odx):is(#bs-odx,#bsw-odx,#bsm-odx,#bsp-odx):is(#bs-odx,#bsw-odx,#bsm-odx,#bsp-odx).odx .odx-chip[aria-pressed="true"] span { color: #fff !important; -webkit-text-fill-color: #fff !important; }
/* Campaign list and its dock are separate from the wizard's mc-* tokens. */
html[data-appearance="glass"] body #mobile-campaign-overlay#mobile-campaign-overlay :is(.mcamp,.mch,.mcamp-overlay__body) {
    background: transparent !important; color: #fff !important; -webkit-text-fill-color: #fff !important;
}
html[data-appearance="glass"] body #mobile-campaign-overlay#mobile-campaign-overlay :is(.mch-foot,.mch-pill,.mch-cta,.mch-mark,.mch-chip--draft,.mch-chip--ended,.mch-bar,.mch-track) {
    background: var(--gl-bg) !important; border-color: var(--gl-rim) !important; box-shadow: var(--gl-hi) !important;
}
html[data-appearance="glass"] body #mobile-campaign-overlay#mobile-campaign-overlay :is(.mch-foot) {
    -webkit-backdrop-filter: var(--gl-blur); backdrop-filter: var(--gl-blur);
}
html[data-appearance="glass"] body #mobile-campaign-overlay#mobile-campaign-overlay :is(.mch-pill.is-on,.mch-cta,.mch-chip--live) { background: var(--gl-fill-strong) !important; }
html[data-appearance="glass"] body #mobile-campaign-overlay#mobile-campaign-overlay :is(.mch-name,.mch-value,.mch-figure,.mch-row-title,.mch-pill,.mch-mark,.mch-chip--draft,.mch-chip--ended,.mch-cta) { color: #fff !important; -webkit-text-fill-color: #fff !important; }
html[data-appearance="glass"] body #mobile-campaign-overlay#mobile-campaign-overlay :is(.mch-label,.mch-sub,.mch-muted,.mch-row-meta,.mch-empty,.mch-hint) { color: rgba(255,255,255,.74) !important; -webkit-text-fill-color: rgba(255,255,255,.74) !important; }
html[data-appearance="glass"] body #mobile-campaign-overlay#mobile-campaign-overlay :is(.mch-stats,.mch-stat,.mch-row) { border-color: var(--gl-rim) !important; }
html[data-appearance="glass"] body #mobile-campaign-overlay#mobile-campaign-overlay :is(.mcamp__wiztitle,.mcamp__display,.mcamp__stat-value,.mcamp__datebtn) { color: #fff !important; -webkit-text-fill-color: #fff !important; }
html[data-appearance="glass"] body #mobile-campaign-overlay#mobile-campaign-overlay :is(.mcamp__note,.mcamp__mono-sm,.mcamp__section-title,.mcamp__stat-label) { color: rgba(255,255,255,.74) !important; -webkit-text-fill-color: rgba(255,255,255,.74) !important; }
html[data-appearance="glass"] body #mobile-campaign-overlay#mobile-campaign-overlay .mcamp__datebtn { background: var(--gl-fill) !important; box-shadow: var(--gl-hi) !important; }
html[data-appearance="glass"] body #mobileStreamModal#mobileStreamModal#mobileStreamModal :is(strong,small) { color: #fff !important; -webkit-text-fill-color: #fff !important; }
/* These structural mats otherwise hide the backdrop behind translucent cards. */
html[data-appearance="glass"] body #stream-main-area#stream-main-area > .stream-container,
html[data-appearance="glass"] body #blocspace-modal-content#blocspace-modal-content > div:first-child {
    background: transparent !important; background-color: transparent !important;
}
html[data-appearance="glass"] body #blocspace-modal#blocspace-modal {
    background: var(--gl-sheet) !important; -webkit-backdrop-filter: var(--gl-blur); backdrop-filter: var(--gl-blur);
}
/* ODX adds :has(#bs-odx) to both ancestor shells in dark mode. */
html[data-appearance="glass"] body #blocspace-modal#blocspace-modal#blocspace-modal { background: var(--gl-sheet) !important; }
html[data-appearance="glass"] body #blocspace-modal-content#blocspace-modal-content#blocspace-modal-content { background: transparent !important; }
html[data-appearance="glass"] body #mobile-stream-control-sheet#mobile-stream-control-sheet#mobile-stream-control-sheet .sd-schedule-form input {
    background: var(--gl-fill) !important; color: #fff !important; -webkit-text-fill-color: #fff !important; border-color: var(--gl-rim) !important;
}
/* Phone Stream Dashboard (#mobile-stream-owner-sheet): icon buttons -- refresh,
   close, remove detail -- are translucent glass with white icons in every state. */
html[data-appearance="glass"] body #mobile-stream-owner-sheet#mobile-stream-owner-sheet :is(.bd-btn--icon,.sd-rm .bd-btn):is(*,:hover,:active,:focus) {
    background: rgba(255,255,255,.14) !important; border-color: rgba(255,255,255,.24) !important;
    color: #fff !important; -webkit-text-fill-color: #fff !important;
}
html[data-appearance="glass"] body #mobile-stream-owner-sheet#mobile-stream-owner-sheet :is(.bd-btn--icon,.sd-rm .bd-btn) i {
    color: #fff !important; -webkit-text-fill-color: #fff !important; opacity: 1 !important;
}

/* Access and Connected Accounts: simple lists instead of nested cards. */
html body #mobile-app-access-sheet[data-ios-hosted] [data-access-scroll] {
  padding-left: 16px !important;
  padding-right: 16px !important;
}
html body #mobile-app-access-sheet[data-ios-hosted] section[data-row] {
  padding: 0 0 18px !important;
  border: 0 !important;
  border-bottom: 1px solid var(--ios-sep, rgba(0,0,0,.12)) !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}
html body #mobile-app-access-sheet[data-ios-hosted] section[data-row] [data-act="membership"] {
  min-height: 64px !important;
  padding: 10px 2px !important;
  border: 0 !important;
  border-bottom: 1px solid var(--ios-sep, rgba(0,0,0,.12)) !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: var(--ios-label, #111) !important;
  -webkit-text-fill-color: var(--ios-label, #111) !important;
}
html body #mobile-app-access-sheet[data-ios-hosted] section[data-row] [data-act="membership"]:last-child {
  border-bottom: 0 !important;
}
html body #mobile-app-access-sheet[data-ios-hosted] [data-act="membership"] > span:first-child {
  width: 28px !important;
  height: 28px !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: var(--ios-label2, #666) !important;
  -webkit-text-fill-color: var(--ios-label2, #666) !important;
}
html body #mobile-app-access-sheet[data-ios-hosted] [data-act="membership"] > span:first-child i {
  color: inherit !important;
  -webkit-text-fill-color: inherit !important;
}
html body #mobile-app-access-sheet[data-ios-hosted] [data-act="membership"] > span:nth-child(2) > span:first-child {
  color: var(--ios-label, #111) !important;
  -webkit-text-fill-color: var(--ios-label, #111) !important;
  font-weight: 650 !important;
}
html body #mobile-app-access-sheet[data-ios-hosted] [data-act="membership"] > span:nth-child(2) > span:last-child {
  color: var(--ios-label2, #666) !important;
  -webkit-text-fill-color: var(--ios-label2, #666) !important;
  white-space: normal !important;
  overflow: visible !important;
}
html body #mobile-app-access-sheet[data-ios-hosted] [data-act="membership"] > span:last-child {
  border-color: var(--ios-label3, #999) !important;
  background: transparent !important;
}
html body #mobile-app-access-sheet[data-ios-hosted] [data-act="membership"][aria-pressed="true"] > span:last-child {
  border: 5px solid var(--ios-label, #111) !important;
  background: var(--ios-bg, #fff) !important;
}

/* Connected Accounts groups use the same page and row rhythm. */
html body #mobile-import-library:not(#nca) [data-mobile-import-library-accounts] {
  --ca-bg: var(--ca-panel);
}
html body #mobile-import-library:not(#nca) [data-mobile-import-library-accounts] .nca-tabs {
  gap: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-bottom: 1px solid var(--ca-line) !important;
  border-radius: 0 !important;
  background: transparent !important;
}
html body #mobile-import-library:not(#nca) [data-mobile-import-library-accounts] .nca-tab,
html body #mobile-import-library:not(#nca) [data-mobile-import-library-accounts] .nca-tab.is-active {
  height: 42px !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}
html body #mobile-import-library:not(#nca) [data-mobile-import-library-accounts] .nca-tab.is-active {
  box-shadow: inset 0 -2px 0 var(--ca-ink) !important;
}
html body #mobile-import-library:not(#nca) [data-mobile-import-library-accounts] .nca-list {
  gap: 24px !important;
}
html body #mobile-import-library:not(#nca) [data-mobile-import-library-accounts] .nca-section {
  gap: 10px !important;
}
html body #mobile-import-library:not(#nca) [data-mobile-import-library-accounts] .nca-body {
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}
html body #mobile-import-library:not(#nca) [data-mobile-import-library-accounts] .nca-section .nca-list {
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  overflow: visible !important;
}
html body #mobile-import-library:not(#nca) [data-mobile-import-library-accounts] .nca-row {
  padding: 14px 2px !important;
  border: 0 !important;
  border-bottom: 1px solid var(--ca-line) !important;
}
html body #mobile-import-library:not(#nca) [data-mobile-import-library-accounts] .nca-row + .nca-row {
  border-top: 0 !important;
}
html body #mobile-import-library:not(#nca) [data-mobile-import-library-accounts] .nca-srcs {
  border: 0 !important;
  border-top: 1px solid var(--ca-line) !important;
  border-radius: 0 !important;
}
html body #mobile-import-library:not(#nca) [data-mobile-import-library-accounts] .nca-src {
  background: transparent !important;
}
html body #mobile-import-library:not(#nca) [data-mobile-import-library-accounts] .nca-body .mobile-import-library__account-row {
  padding: 14px 2px !important;
  border: 0 !important;
  border-bottom: 1px solid var(--ca-line) !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

/* Analytics, Wallet and Members use the same continuous mobile sheet as
   Shop and Booking. Keep this after the glass styles so every theme shares
   the layout while its existing ink and accent variables remain in charge. */
html body :is(#bs-odx, #bsw-odx, #bsm-odx):is(#bs-odx, #bsw-odx, #bsm-odx):is(#bs-odx, #bsw-odx, #bsm-odx):is(#bs-odx, #bsw-odx, #bsm-odx).odx {
  /* The Bloc Space scroller already has a 14px inset. Two more pixels align
     headings to 16px; the negative section margins reach the screen edges. */
  padding: 6px 2px 120px !important;
}

html body :is(#bs-odx, #bsw-odx, #bsm-odx):is(#bs-odx, #bsw-odx, #bsm-odx):is(#bs-odx, #bsw-odx, #bsm-odx):is(#bs-odx, #bsw-odx, #bsm-odx).odx .odx-seg {
  padding: 0 !important;
  margin-bottom: 6px !important;
  border: 0 !important;
  border-bottom: 1px solid var(--odx-line2) !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}
html body :is(#bs-odx, #bsw-odx, #bsm-odx):is(#bs-odx, #bsw-odx, #bsm-odx):is(#bs-odx, #bsw-odx, #bsm-odx):is(#bs-odx, #bsw-odx, #bsm-odx).odx .odx-seg button,
html body :is(#bs-odx, #bsw-odx, #bsm-odx):is(#bs-odx, #bsw-odx, #bsm-odx):is(#bs-odx, #bsw-odx, #bsm-odx):is(#bs-odx, #bsw-odx, #bsm-odx).odx .odx-seg button[aria-pressed="true"] {
  height: 42px !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: var(--odx-mute) !important;
  -webkit-text-fill-color: var(--odx-mute) !important;
  box-shadow: none !important;
}
html body :is(#bs-odx, #bsw-odx, #bsm-odx):is(#bs-odx, #bsw-odx, #bsm-odx):is(#bs-odx, #bsw-odx, #bsm-odx):is(#bs-odx, #bsw-odx, #bsm-odx).odx .odx-seg button[aria-pressed="true"] {
  box-shadow: inset 0 -2px 0 var(--odx-ink) !important;
  color: var(--odx-ink) !important;
  -webkit-text-fill-color: var(--odx-ink) !important;
}

html body :is(#bs-odx, #bsw-odx, #bsm-odx):is(#bs-odx, #bsw-odx, #bsm-odx):is(#bs-odx, #bsw-odx, #bsm-odx):is(#bs-odx, #bsw-odx, #bsm-odx).odx .odx-kpis {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 0 !important;
  margin: 0 -16px !important;
  border-bottom: 1px solid var(--odx-line) !important;
}
html body :is(#bs-odx, #bsw-odx, #bsm-odx):is(#bs-odx, #bsw-odx, #bsm-odx):is(#bs-odx, #bsw-odx, #bsm-odx):is(#bs-odx, #bsw-odx, #bsm-odx).odx .odx-tile {
  min-height: 112px !important;
  padding: 16px !important;
  border: 0 !important;
  border-top: 1px solid var(--odx-line) !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}
html body :is(#bs-odx, #bsw-odx, #bsm-odx):is(#bs-odx, #bsw-odx, #bsm-odx):is(#bs-odx, #bsw-odx, #bsm-odx):is(#bs-odx, #bsw-odx, #bsm-odx).odx .odx-tile:nth-child(odd) {
  border-right: 1px solid var(--odx-line) !important;
}
html body :is(#bs-odx, #bsw-odx, #bsm-odx):is(#bs-odx, #bsw-odx, #bsm-odx):is(#bs-odx, #bsw-odx, #bsm-odx):is(#bs-odx, #bsw-odx, #bsm-odx).odx .odx-tile__sub {
  white-space: normal !important;
  overflow: visible !important;
}

html body :is(#bs-odx, #bsw-odx, #bsm-odx):is(#bs-odx, #bsw-odx, #bsm-odx):is(#bs-odx, #bsw-odx, #bsm-odx):is(#bs-odx, #bsw-odx, #bsm-odx).odx .odx-card {
  margin: 0 -16px !important;
  padding: 20px 16px !important;
  border: 0 !important;
  border-bottom: 1px solid var(--odx-line) !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}
html body :is(#bs-odx, #bsw-odx, #bsm-odx):is(#bs-odx, #bsw-odx, #bsm-odx):is(#bs-odx, #bsw-odx, #bsm-odx):is(#bs-odx, #bsw-odx, #bsm-odx).odx .odx-card.is-flush {
  padding: 18px 0 0 !important;
  overflow: visible !important;
}
html body :is(#bs-odx, #bsw-odx, #bsm-odx):is(#bs-odx, #bsw-odx, #bsm-odx):is(#bs-odx, #bsw-odx, #bsm-odx):is(#bs-odx, #bsw-odx, #bsm-odx).odx .odx-card.is-flush > .odx-card__head {
  padding: 0 16px !important;
}
html body :is(#bs-odx, #bsw-odx, #bsm-odx):is(#bs-odx, #bsw-odx, #bsm-odx):is(#bs-odx, #bsw-odx, #bsm-odx):is(#bs-odx, #bsw-odx, #bsm-odx).odx .odx-card.is-flush :is(.odx-person, .odx-row__main) {
  padding-left: 16px !important;
  padding-right: 16px !important;
}
html body :is(#bs-odx, #bsw-odx, #bsm-odx):is(#bs-odx, #bsw-odx, #bsm-odx):is(#bs-odx, #bsw-odx, #bsm-odx):is(#bs-odx, #bsw-odx, #bsm-odx).odx .odx-card.is-flush :is(.odx-person, .odx-row):first-child {
  border-top: 0 !important;
}
html body #bs-odx#bs-odx#bs-odx#bs-odx.odx .odx-minis > div {
  padding: 8px 12px 8px 0 !important;
  border: 0 !important;
  border-right: 1px solid var(--odx-line) !important;
  border-radius: 0 !important;
}
html body #bs-odx#bs-odx#bs-odx#bs-odx.odx .odx-minis > div:last-child { border-right: 0 !important; }

html body #bsw-odx#bsw-odx#bsw-odx#bsw-odx.odx .odx-getpaid {
  margin: 12px -16px 0 !important;
  padding: 20px 16px !important;
  border: 0 !important;
  border-bottom: 1px solid var(--odx-line) !important;
  border-radius: 0 !important;
  background: transparent !important;
}
html body #bsw-odx#bsw-odx#bsw-odx#bsw-odx.odx .odx-getpaid__row {
  min-height: 64px !important;
}
html body #bsw-odx#bsw-odx#bsw-odx#bsw-odx.odx .odx-subhead {
  padding-top: 4px !important;
}

html body :is(#bsw-odx, #bsm-odx):is(#bsw-odx, #bsm-odx):is(#bsw-odx, #bsm-odx):is(#bsw-odx, #bsm-odx).odx .odx-chips {
  gap: 20px !important;
  margin: 0 -16px 4px !important;
  padding: 0 16px !important;
  border-bottom: 1px solid var(--odx-line2) !important;
}
html body :is(#bsw-odx, #bsm-odx):is(#bsw-odx, #bsm-odx):is(#bsw-odx, #bsm-odx):is(#bsw-odx, #bsm-odx).odx .odx-chip,
html body :is(#bsw-odx, #bsm-odx):is(#bsw-odx, #bsm-odx):is(#bsw-odx, #bsm-odx):is(#bsw-odx, #bsm-odx).odx .odx-chip[aria-pressed="true"] {
  height: 42px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: var(--odx-mute) !important;
  -webkit-text-fill-color: var(--odx-mute) !important;
  box-shadow: none !important;
}
html body :is(#bsw-odx, #bsm-odx):is(#bsw-odx, #bsm-odx):is(#bsw-odx, #bsm-odx):is(#bsw-odx, #bsm-odx).odx .odx-chip[aria-pressed="true"] {
  box-shadow: inset 0 -2px 0 var(--odx-ink) !important;
  color: var(--odx-ink) !important;
  -webkit-text-fill-color: var(--odx-ink) !important;
}
html body :is(#bsw-odx, #bsm-odx):is(#bsw-odx, #bsm-odx):is(#bsw-odx, #bsm-odx):is(#bsw-odx, #bsm-odx).odx .odx-chip[aria-pressed="true"] span {
  color: var(--odx-mute) !important;
  -webkit-text-fill-color: var(--odx-mute) !important;
}
html body :is(#bsw-odx, #bsm-odx):is(#bsw-odx, #bsm-odx):is(#bsw-odx, #bsm-odx):is(#bsw-odx, #bsm-odx).odx .odx-search {
  height: 48px !important;
  margin: 0 0 4px !important;
  padding: 0 !important;
  border: 0 !important;
  border-bottom: 1px solid var(--odx-line2) !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}
html body #bsm-odx#bsm-odx#bsm-odx#bsm-odx.odx #odx-member-sort {
  margin: 8px 0 !important;
  padding: 0 !important;
  border: 0 !important;
  color: var(--odx-mute) !important;
  -webkit-text-fill-color: var(--odx-mute) !important;
}

/* Mobile shop Glass appearance. Keep media and semantic status colors intact.
 * Theme tokens cover dynamic owner/guest screens; blur only full-screen sheets,
 * sticky bars and popovers, never every product or order in a long list. */

html[data-appearance="glass"] body #moments-scroll-container.mobile-shop-storefront,
html[data-appearance="glass"] body #shop-main-area,
html[data-appearance="glass"] body #main-external-shop,
html[data-appearance="glass"] body .mobile-shop-detail-modal,
html[data-appearance="glass"] body .mobile-shop-product-form,
html[data-appearance="glass"] body #addItemModal,
html[data-appearance="glass"] body #shop-empty,
html[data-appearance="glass"] body #shop-item-action-sheet,
html[data-appearance="glass"] body #mobile-shop-owner-products-modal,
html[data-appearance="glass"] body #mobile-shop-reviews-modal,
html[data-appearance="glass"] body #mobile-shop-review-form-modal,
html[data-appearance="glass"] body #mobile-shop-question-modal,
html[data-appearance="glass"] body #mobile-shop-guest-products-modal,
html[data-appearance="glass"] body .mobile-shop-dashboard-modal,
html[data-appearance="glass"] body .mobile-shop-owner-orders-modal,
html[data-appearance="glass"] body .mobile-shop-order-detail-sheet {
    --mobile-shop-bg: transparent;
    --mobile-shop-text: #fff;
    --mobile-shop-muted: rgba(255,255,255,.76);
    --mobile-shop-subtle: rgba(255,255,255,.62);
    --mobile-shop-border: var(--gl-rim);
    --mobile-shop-surface: var(--gl-fill);
    --mobile-shop-soft: rgba(255,255,255,.10);
    --mobile-shop-card-bg: var(--gl-fill);
    --mobile-shop-card-soft: rgba(255,255,255,.10);
    --mobile-shop-button-bg: var(--gl-fill);
    --mobile-shop-button-disabled: rgba(255,255,255,.08);
    --shop-dashboard-bg: transparent;
    --shop-dashboard-surface: var(--gl-fill);
    --shop-dashboard-surface-soft: rgba(255,255,255,.10);
    --shop-dashboard-border: var(--gl-rim);
    --shop-dashboard-text: #fff;
    --shop-dashboard-muted: rgba(255,255,255,.76);
    --shop-dashboard-subtle: rgba(255,255,255,.62);
    --shop-manager-button-text: #111;
}


html[data-appearance="glass"] body .mobile-shop-detail-modal,
html[data-appearance="glass"] body .mobile-shop-product-form,
html[data-appearance="glass"] body #addItemModal#addItemModal,
html[data-appearance="glass"] body #shop-empty#shop-empty,
html[data-appearance="glass"] body #shop-item-action-sheet#shop-item-action-sheet,
html[data-appearance="glass"] body #mobile-shop-owner-products-modal#mobile-shop-owner-products-modal,
html[data-appearance="glass"] body #mobile-shop-reviews-modal#mobile-shop-reviews-modal,
html[data-appearance="glass"] body #mobile-shop-review-form-modal#mobile-shop-review-form-modal,
html[data-appearance="glass"] body #mobile-shop-question-modal#mobile-shop-question-modal,
html[data-appearance="glass"] body #mobile-shop-guest-products-modal#mobile-shop-guest-products-modal,
html[data-appearance="glass"] body .mobile-shop-dashboard-modal,
html[data-appearance="glass"] body .mobile-shop-owner-orders-modal,
html[data-appearance="glass"] body .mobile-shop-order-detail-sheet,
html[data-appearance="glass"] body #shopping-cart-modal#shopping-cart-modal,
html[data-appearance="glass"] body #shop-checkout#shop-checkout,
html[data-appearance="glass"] body #shop-order-confirmed#shop-order-confirmed,
html[data-appearance="glass"] body #shop-reviews#shop-reviews,
html[data-appearance="glass"] body #shop-review-write#shop-review-write,
html[data-appearance="glass"] body #shop-review-pick#shop-review-pick,
html[data-appearance="glass"] body #shop-ticket-tiers#shop-ticket-tiers,
html[data-appearance="glass"] body #shop-digital-item#shop-digital-item {
    background: var(--gl-sheet) !important;
    color: #fff !important;
    -webkit-backdrop-filter: var(--gl-blur) !important;
    backdrop-filter: var(--gl-blur) !important;
}

/* Order lists and receipts use a separate light palette. Give their controls
   an explicit glass palette so generic button styles cannot leave white pills
   with white labels over the photo. */
html[data-appearance="glass"] body .mobile-shop-orders-v2,
html[data-appearance="glass"] body #mobile-shop-order-detail-sheet.mobile-shop-receipt-v2 {
    --ord-bg: transparent;
    --ord-ink: #fff;
    --ord-muted: rgba(255,255,255,.8);
    --ord-faint: rgba(255,255,255,.62);
    --ord-line: rgba(255,255,255,.3);
    --ord-soft: rgba(255,255,255,.14);
}
html[data-appearance="glass"] body #mobile-shop-order-detail-sheet.mobile-shop-receipt-v2 {
    background: var(--gl-sheet) !important;
}
html[data-appearance="glass"] body #mobile-shop-order-detail-sheet.mobile-shop-receipt-v2 :is(.mobile-shop-receipt-back, .mobile-shop-receipt-pass-link, .mobile-shop-receipt-action),
html[data-appearance="glass"] body .mobile-shop-orders-v2 :is(.mobile-shop-order-btn, .mobile-shop-orders-chip, .mobile-shop-order-card) {
    background: var(--gl-fill) !important;
    border-color: var(--gl-rim) !important;
    color: #fff !important;
    -webkit-text-fill-color: #fff !important;
    box-shadow: var(--gl-hi) !important;
}
html[data-appearance="glass"] body #mobile-shop-order-detail-sheet.mobile-shop-receipt-v2 :is(.mobile-shop-receipt-back, .mobile-shop-receipt-pass-link, .mobile-shop-receipt-action) *,
html[data-appearance="glass"] body .mobile-shop-orders-v2 :is(.mobile-shop-order-btn, .mobile-shop-orders-chip) * {
    color: inherit !important;
    -webkit-text-fill-color: currentColor !important;
}
html[data-appearance="glass"] body #mobile-shop-order-detail-sheet.mobile-shop-receipt-v2 .mobile-shop-receipt-action {
    color: #ffb7bd !important;
    -webkit-text-fill-color: #ffb7bd !important;
    border-color: rgba(255,183,189,.55) !important;
}
html[data-appearance="glass"] body .mobile-shop-orders-v2 .mobile-shop-orders-chip.is-active {
    background: rgba(255,255,255,.26) !important;
    border-color: var(--gl-rim-strong) !important;
}
html[data-appearance="glass"] body .mobile-shop-dashboard-home {
    --shop-dashboard-bg: transparent;
    --shop-dashboard-surface: var(--gl-fill);
    --shop-dashboard-surface-soft: rgba(255,255,255,.12);
    --shop-dashboard-border: var(--gl-rim);
    --shop-dashboard-text: #fff;
    --shop-dashboard-muted: rgba(255,255,255,.78);
    --shop-dashboard-subtle: rgba(255,255,255,.62);
}
html[data-appearance="glass"] body .mobile-shop-dashboard-home :is(.mobile-shop-dashboard-header, .mobile-shop-dashboard-today-metrics span, .mobile-shop-dashboard-day-tile.has-activity, .mobile-shop-dashboard-month-tile.has-activity) {
    background: var(--gl-fill) !important;
    border-color: var(--gl-rim) !important;
    box-shadow: var(--gl-hi) !important;
}
html[data-appearance="glass"] body .mobile-shop-dashboard-home :is(.mobile-shop-dashboard-today-copy strong, .mobile-shop-dashboard-today-metrics b, .mobile-shop-dashboard-day-tile, .mobile-shop-dashboard-day-top span, .mobile-shop-dashboard-day-bottom em, .mobile-shop-dashboard-month-tile, .mobile-shop-dashboard-month-top span) {
    color: #fff !important;
    -webkit-text-fill-color: #fff !important;
}


html[data-appearance="glass"] body #main-external-shop#main-external-shop,
html[data-appearance="glass"] body #moments-scroll-container.mobile-shop-storefront {
    background: transparent !important;
}


html[data-appearance="glass"] body #shopping-cart-modal#shopping-cart-modal {
    --cart-paper: #15151a;
    --cart-ink: #fff;
    --cart-body: rgba(255,255,255,.82);
    --cart-mute: rgba(255,255,255,.68);
    --cart-label: rgba(255,255,255,.68);
    --cart-hair: rgba(255,255,255,.20);
    --cart-rule: var(--gl-rim);
}


html[data-appearance="glass"] body #shopping-cart-modal#shopping-cart-modal .cart-bar,
html[data-appearance="glass"] body #shopping-cart-modal#shopping-cart-modal .cart-dock {
    background: var(--gl-sheet) !important;
    -webkit-backdrop-filter: var(--gl-blur) !important;
    backdrop-filter: var(--gl-blur) !important;
}


html[data-appearance="glass"] body #shop-checkout#shop-checkout {
    --co-paper: #15151a;
    --co-ink: #fff;
    --co-body: rgba(255,255,255,.82);
    --co-mute: rgba(255,255,255,.68);
    --co-label: rgba(255,255,255,.68);
    --co-hair: rgba(255,255,255,.20);
    --co-rule: var(--gl-rim);
}


html[data-appearance="glass"] body #shop-checkout#shop-checkout .co-bar,
html[data-appearance="glass"] body #shop-checkout#shop-checkout .co-dock {
    background: var(--gl-sheet) !important;
    -webkit-backdrop-filter: var(--gl-blur) !important;
    backdrop-filter: var(--gl-blur) !important;
}


html[data-appearance="glass"] body #shop-order-confirmed#shop-order-confirmed {
    --oc-paper: #15151a;
    --oc-ink: #fff;
    --oc-body: rgba(255,255,255,.82);
    --oc-mute: rgba(255,255,255,.68);
    --oc-label: rgba(255,255,255,.68);
    --oc-hair: rgba(255,255,255,.20);
    --oc-rule: var(--gl-rim);
}


html[data-appearance="glass"] body #shop-order-confirmed#shop-order-confirmed .oc-bar,
html[data-appearance="glass"] body #shop-order-confirmed#shop-order-confirmed .oc-dock {
    background: var(--gl-sheet) !important;
    -webkit-backdrop-filter: var(--gl-blur) !important;
    backdrop-filter: var(--gl-blur) !important;
}


html[data-appearance="glass"] body #shop-reviews#shop-reviews {
    --rv-paper: #15151a;
    --rv-ink: #fff;
    --rv-body: rgba(255,255,255,.82);
    --rv-mute: rgba(255,255,255,.68);
    --rv-label: rgba(255,255,255,.68);
    --rv-hair: rgba(255,255,255,.20);
    --rv-rule: var(--gl-rim);
}


html[data-appearance="glass"] body #shop-reviews#shop-reviews .rv-bar,
html[data-appearance="glass"] body #shop-reviews#shop-reviews .rv-dock {
    background: var(--gl-sheet) !important;
    -webkit-backdrop-filter: var(--gl-blur) !important;
    backdrop-filter: var(--gl-blur) !important;
}


html[data-appearance="glass"] body #shop-review-write#shop-review-write {
    --rw-paper: #15151a;
    --rw-ink: #fff;
    --rw-body: rgba(255,255,255,.82);
    --rw-mute: rgba(255,255,255,.68);
    --rw-label: rgba(255,255,255,.68);
    --rw-hair: rgba(255,255,255,.20);
    --rw-rule: var(--gl-rim);
}


html[data-appearance="glass"] body #shop-review-write#shop-review-write .rw-bar,
html[data-appearance="glass"] body #shop-review-write#shop-review-write .rw-dock {
    background: var(--gl-sheet) !important;
    -webkit-backdrop-filter: var(--gl-blur) !important;
    backdrop-filter: var(--gl-blur) !important;
}


html[data-appearance="glass"] body #shop-review-pick#shop-review-pick {
    --rw-paper: #15151a;
    --rw-ink: #fff;
    --rw-body: rgba(255,255,255,.82);
    --rw-mute: rgba(255,255,255,.68);
    --rw-label: rgba(255,255,255,.68);
    --rw-hair: rgba(255,255,255,.20);
    --rw-rule: var(--gl-rim);
}


html[data-appearance="glass"] body #shop-review-pick#shop-review-pick .rw-bar,
html[data-appearance="glass"] body #shop-review-pick#shop-review-pick .rw-dock {
    background: var(--gl-sheet) !important;
    -webkit-backdrop-filter: var(--gl-blur) !important;
    backdrop-filter: var(--gl-blur) !important;
}


html[data-appearance="glass"] body #shop-ticket-tiers#shop-ticket-tiers {
    --tier-paper: #15151a;
    --tier-ink: #fff;
    --tier-body: rgba(255,255,255,.82);
    --tier-mute: rgba(255,255,255,.68);
    --tier-label: rgba(255,255,255,.68);
    --tier-hair: rgba(255,255,255,.20);
    --tier-rule: var(--gl-rim);
}


html[data-appearance="glass"] body #shop-ticket-tiers#shop-ticket-tiers .tier-bar,
html[data-appearance="glass"] body #shop-ticket-tiers#shop-ticket-tiers .tier-dock {
    background: var(--gl-sheet) !important;
    -webkit-backdrop-filter: var(--gl-blur) !important;
    backdrop-filter: var(--gl-blur) !important;
}


html[data-appearance="glass"] body #shop-digital-item#shop-digital-item {
    --dg-paper: #15151a;
    --dg-ink: #fff;
    --dg-body: rgba(255,255,255,.82);
    --dg-mute: rgba(255,255,255,.68);
    --dg-label: rgba(255,255,255,.68);
    --dg-hair: rgba(255,255,255,.20);
    --dg-rule: var(--gl-rim);
}


html[data-appearance="glass"] body #shop-digital-item#shop-digital-item .dg-bar,
html[data-appearance="glass"] body #shop-digital-item#shop-digital-item .dg-dock {
    background: var(--gl-sheet) !important;
    -webkit-backdrop-filter: var(--gl-blur) !important;
    backdrop-filter: var(--gl-blur) !important;
}


html[data-appearance="glass"] body #mobile-shop-owner-orders-modal#mobile-shop-owner-orders-modal,
html[data-appearance="glass"] body #mobile-shop-order-detail-modal#mobile-shop-order-detail-modal,
html[data-appearance="glass"] body .mobile-shop-order-detail-sheet.mobile-shop-order-detail-sheet {
    --ord-bg: transparent;
    --ord-ink: #fff;
    --ord-muted: rgba(255,255,255,.76);
    --ord-faint: rgba(255,255,255,.62);
    --ord-line: var(--gl-rim);
    --ord-soft: var(--gl-fill);
}


html[data-appearance="glass"] body #shop-odx#shop-odx#shop-odx.odx {
    --odx-bg: #15151a;
    --odx-card: var(--gl-fill);
    --odx-ink: #fff;
    --odx-mute: rgba(255,255,255,.76);
    --odx-faint: rgba(255,255,255,.62);
    --odx-line: rgba(255,255,255,.22);
    --odx-line2: var(--gl-rim);
    background: transparent !important;
}


html[data-appearance="glass"] body #shop-odx#shop-odx#shop-odx.odx :is(.odx-card, .odx-stat, .odx-search, .odx-input, .odx-textarea) {
    background: var(--gl-fill) !important;
    border-color: var(--gl-rim) !important;
    box-shadow: var(--gl-hi) !important;
}
html[data-appearance="glass"] body #shop-odx#shop-odx#shop-odx.odx :is(.odx-tile, .odx-btn, .odx-chip, .odx-seg) {
    background: var(--gl-fill) !important;
    border-color: var(--gl-rim) !important;
    color: #fff !important;
    -webkit-text-fill-color: #fff !important;
}
html[data-appearance="glass"] body #shop-odx#shop-odx#shop-odx.odx :is(.odx-btn.is-solid, .odx-seg button[aria-pressed="true"], .odx-chip[aria-pressed="true"]) {
    background: var(--gl-fill-strong) !important;
    border-color: var(--gl-rim-strong) !important;
    color: #fff !important;
    -webkit-text-fill-color: #fff !important;
    box-shadow: var(--gl-hi) !important;
}
html[data-appearance="glass"] body #shop-odx#shop-odx#shop-odx.odx :is(.odx-btn.is-solid, .odx-seg button[aria-pressed="true"], .odx-chip[aria-pressed="true"]) * {
    color: #fff !important;
    -webkit-text-fill-color: #fff !important;
}
html[data-appearance="glass"] body #shop-odx#shop-odx#shop-odx.odx .odx-btn.is-danger {
    color: #ffb7bd !important;
    -webkit-text-fill-color: #ffb7bd !important;
    border-color: rgba(255,183,189,.55) !important;
}


html[data-appearance="glass"] body #shopping-cart-modal#shopping-cart-modal :is(.cart-qty,.cart-stepper),
html[data-appearance="glass"] body #shop-checkout#shop-checkout .co-suggest,
html[data-appearance="glass"] body #shop-order-confirmed#shop-order-confirmed :is(.oc-pass,.oc-card) {
    background: var(--gl-bg) !important;
    border-color: var(--gl-rim) !important;
}


html[data-appearance="glass"] body #shop-checkout#shop-checkout .co-suggest button {
    background: transparent !important;
}


html[data-appearance="glass"] body #shop-order-confirmed#shop-order-confirmed {
    --oc-card: var(--gl-fill);
    --oc-card-mute: rgba(255,255,255,.76);
    --oc-card-dim: rgba(255,255,255,.62);
    --oc-card-hair: var(--gl-rim);
}


html[data-appearance="glass"] body #mobile-shop-question-modal#mobile-shop-question-modal {
    --sak-paper: transparent;
    --sak-ink: #fff;
    --ask-paper: transparent;
    --ask-ink: #fff;
}


html[data-appearance="glass"] body #addItemModal#addItemModal#addItemModal :is(.sac-posting,.sac-card,.sac-segmented,.sac-file,.sac-file-icon,.mobile-shop-ticket-tier input,.mobile-shop-ticket-venue-suggestions,.mobile-shop-ticket-venue-suggestion) {
    background: var(--gl-fill) !important;
    border-color: var(--gl-rim) !important;
    box-shadow: var(--gl-hi) !important;
}


html[data-appearance="glass"] body #addItemModal#addItemModal#addItemModal :is(h2,h3,p,label,input,textarea,select,.sac-posting-name,.sac-posting-label,.sac-label,.sac-file-title,.sac-file-meta,.sac-row--button,.sac-type-btn) {
    color: #fff !important;
    -webkit-text-fill-color: #fff !important;
    border-color: var(--gl-rim) !important;
}


html[data-appearance="glass"] body #addItemModal#addItemModal#addItemModal :is(input,textarea,select) {
    background-color: rgba(255,255,255,.08) !important;
}


html[data-appearance="glass"] body #addItemModal#addItemModal#addItemModal :is(input,textarea)::placeholder {
    color: rgba(255,255,255,.65) !important;
    -webkit-text-fill-color: rgba(255,255,255,.65) !important;
}


html[data-appearance="glass"] body .mobile-shop-dashboard-license-input {
    background: var(--gl-fill) !important;
    border-color: var(--gl-rim) !important;
    color: #fff !important;
    -webkit-text-fill-color: #fff !important;
}

/* Composer text is explicitly dark in its base sheet, independent of theme. */
html[data-appearance="glass"] body #addItemModal#addItemModal#addItemModal :is(.sac-bar-title, .sac-bar-cancel, .sac-eyebrow, .sac-hint, .sac-note, .sac-file-copy, .sac-file-copy *, .sac-more-summary, .sac-more-meta, .sac-row-prefix, .sac-row-tag, .sac-segment button) {
    color: #fff !important;
    -webkit-text-fill-color: #fff !important;
}
html[data-appearance="glass"] body #addItemModal#addItemModal#addItemModal .sac-segment {
    background: rgba(255,255,255,.10) !important;
}
html[data-appearance="glass"] body #addItemModal#addItemModal#addItemModal .sac-segment button:is(.active, [aria-pressed="true"]) {
    background: var(--gl-fill-strong) !important;
}
html[data-appearance="glass"] body #mobile-shop-question-modal#mobile-shop-question-modal.is-sak {
    --sak-card-bg: var(--gl-fill);
    --sak-line: var(--gl-rim);
    --sak-text-dim: rgba(255,255,255,.76);
    --sak-text-mute: rgba(255,255,255,.62);
}
html[data-appearance="glass"] body #mobile-shop-question-modal#mobile-shop-question-modal.is-sak :is(input,textarea),
html[data-appearance="glass"] body #shopping-cart-modal#shopping-cart-modal .cart-stepper button {
    background: rgba(255,255,255,.08) !important;
    color: #fff !important;
    -webkit-text-fill-color: #fff !important;
}
/* Shared owner-dashboard CSS adds an opaque :has(#shop-odx) wrapper. */
html[data-appearance="glass"] body :is(#shop-orders-modal, #mobile-shop-owner-orders-modal):is(#shop-orders-modal, #mobile-shop-owner-orders-modal):has(#shop-odx) {
    background: var(--gl-sheet) !important;
    -webkit-backdrop-filter: var(--gl-blur) !important;
    backdrop-filter: var(--gl-blur) !important;
}
html[data-appearance="glass"] body :is(#shop-orders-modal, #mobile-shop-owner-orders-modal):is(#shop-orders-modal, #mobile-shop-owner-orders-modal):has(#shop-odx) :is(.mobile-shop-dashboard-scroll, .mobile-shop-orders-topbar, #shop-orders-list-modal, #mobile-shop-dashboard-order-rows) {
    background: transparent !important;
}
/* Product manager has intentionally white cards even in its dark stylesheet. */
html[data-appearance="glass"] body #mobile-shop-owner-products-modal#mobile-shop-owner-products-modal {
    --shop-manager-bg: transparent;
    --shop-manager-text: #fff;
    --shop-manager-muted: rgba(255,255,255,.76);
    --shop-manager-border: var(--gl-rim);
    --shop-manager-surface: var(--gl-fill);
    --shop-manager-soft: var(--gl-fill);
}
html[data-appearance="glass"] body #mobile-shop-owner-products-modal#mobile-shop-owner-products-modal :is(.mobile-shop-owner-products-embed-btn, .mobile-shop-owner-products-search-wrap, .mobile-shop-owner-product-filter, .mobile-shop-owner-products-primary-btn, .mobile-shop-owner-product-row, .mobile-shop-owner-product-action) {
    background: var(--gl-fill) !important;
    border-color: var(--gl-rim) !important;
    box-shadow: var(--gl-hi) !important;
}
html[data-appearance="glass"] body #mobile-shop-owner-products-modal#mobile-shop-owner-products-modal :is(.mobile-shop-owner-product-filter, .mobile-shop-owner-product-filter *, .mobile-shop-owner-product-action:not(.is-delete), .mobile-shop-owner-products-primary-btn) {
    color: #fff !important;
    -webkit-text-fill-color: #fff !important;
}
html[data-appearance="glass"] body #mobile-shop-owner-products-modal#mobile-shop-owner-products-modal .mobile-shop-owner-product-filter.is-active {
    background: var(--gl-fill-strong) !important;
}
html[data-appearance="glass"] body #mobile-shop-owner-products-modal#mobile-shop-owner-products-modal .mobile-shop-owner-product-filter.is-active * {
    background: transparent !important;
}
html[data-appearance="glass"] body #mobile-add-product-modal#mobile-add-product-modal :is(.mobile-shop-product-form-media, .mobile-shop-product-form-close, .mobile-shop-product-form-save, .mobile-shop-product-form-upload) {
    background: var(--gl-fill) !important;
    border-color: var(--gl-rim) !important;
    color: #fff !important;
    -webkit-text-fill-color: #fff !important;
}
html[data-appearance="glass"] body #mobile-add-product-modal#mobile-add-product-modal :is(.mobile-shop-product-form-upload *, .mobile-shop-product-form-close *, .mobile-shop-product-form-save *) {
    color: #fff !important;
    -webkit-text-fill-color: #fff !important;
}
html[data-appearance="glass"] body #mobile-shop-owner-products-modal#mobile-shop-owner-products-modal :is(.mobile-shop-owner-product-name, .mobile-shop-owner-product-price, .mobile-shop-owner-product-meta span, .mobile-shop-variant-chips span, .mobile-shop-variant-chips strong, .mobile-shop-owner-products-search-wrap input, .mobile-shop-owner-products-search-wrap i, .mobile-shop-owner-products-embed-btn i, .mobile-shop-owner-product-action:not(.is-delete) i) {
    color: #fff !important;
    -webkit-text-fill-color: #fff !important;
}
html[data-appearance="glass"] body #mobile-shop-owner-products-modal#mobile-shop-owner-products-modal input::placeholder {
    color: rgba(255,255,255,.72) !important;
    -webkit-text-fill-color: rgba(255,255,255,.72) !important;
}
html[data-appearance="glass"] body #shop-orders-modal#shop-orders-modal,
html[data-appearance="glass"] body #mobile-shop-order-detail-sheet#mobile-shop-order-detail-sheet,
html[data-appearance="glass"] body #mobile-shop-dashboard-activity-modal#mobile-shop-dashboard-activity-modal {
    background: var(--gl-sheet) !important;
    color: #fff !important;
    -webkit-backdrop-filter: var(--gl-blur) !important;
    backdrop-filter: var(--gl-blur) !important;
}
html[data-appearance="glass"] body #mobile-shop-owner-products-modal#mobile-shop-owner-products-modal #mobile-shop-owner-products-search {
    color: #fff !important;
    -webkit-text-fill-color: #fff !important;
}
html[data-appearance="glass"] body #mobile-shop-owner-products-modal#mobile-shop-owner-products-modal #mobile-shop-owner-products-search:empty::before {
    color: rgba(255,255,255,.72) !important;
    -webkit-text-fill-color: rgba(255,255,255,.72) !important;
}

/* The Digital add-item composer has its own four-ID field rules and inline
 * input colors. Keep the sheet frosted and its controls clear while typing. */
html[data-appearance="glass"] body #addItemModal#addItemModal {
    --sac-field-ink: #fff;
    --sac-field-scheme: dark;
    --sac-selected-bg: var(--gl-fill-strong);
    --sac-muted-ink: rgba(255,255,255,.76);
}
html[data-appearance="glass"] body #addItemModal#addItemModal#addItemModal#addItemModal#addItemModal :is(input:not([type="file"]):not([type="checkbox"]):not([type="color"]), textarea, select) {
    color: #fff !important;
    -webkit-text-fill-color: #fff !important;
    background: transparent !important;
    caret-color: #fff !important;
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
    color-scheme: dark !important;
}
html[data-appearance="glass"] body #addItemModal#addItemModal#addItemModal :is(.sac-bar-title strong, .sac-posting-name, .sac-file-icon i, .sac-more-summary span, .sac-row--button span) {
    color: #fff !important;
    -webkit-text-fill-color: #fff !important;
}
html[data-appearance="glass"] body #addItemModal#addItemModal#addItemModal :is(.sac-bar-title small, .sac-eyebrow span, .sac-posting-label, .sac-row > span, .sac-file-copy small, .sac-note) {
    color: rgba(255,255,255,.76) !important;
    -webkit-text-fill-color: rgba(255,255,255,.76) !important;
}
html[data-appearance="glass"] body #addItemModal#addItemModal#addItemModal :is(.sac-bar, .sac-row, .sac-more, .mobile-shop-ticket-tier) {
    border-color: var(--gl-rim) !important;
}
html[data-appearance="glass"] body #addItemModal#addItemModal#addItemModal :is(.sac-file-action, .sac-posting-avatar) {
    background: var(--gl-fill) !important;
    border: 1px solid var(--gl-rim) !important;
}
html[data-appearance="glass"] body #addItemModal#addItemModal#addItemModal .sac-submit {
    background: rgba(255,255,255,.10) !important;
    color: rgba(255,255,255,.55) !important;
    -webkit-text-fill-color: rgba(255,255,255,.55) !important;
}
html[data-appearance="glass"] body #addItemModal#addItemModal#addItemModal .sac-submit.is-ready {
    background: var(--gl-cta) !important;
    color: var(--gl-cta-ink) !important;
    -webkit-text-fill-color: var(--gl-cta-ink) !important;
}

html[data-appearance="glass"] body #addItemModal#addItemModal#addItemModal :is(.mobile-shop-add-item-shell, .mobile-shop-add-item-scroll, #addItemForm) {
    background: transparent !important;
}

/* Keep the owner dashboard's full-width layout in Glass mode. */
html[data-appearance="glass"] body #shop-odx#shop-odx#shop-odx#shop-odx.odx.is-shop-dashboard :is(.odx-card, .odx-tile, .odx-seg) {
    background: transparent !important;
    box-shadow: none !important;
}
html[data-appearance="glass"] body #shop-odx#shop-odx#shop-odx#shop-odx.odx.is-shop-dashboard .odx-card {
    border-color: var(--odx-line) !important;
}