/* 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;
}

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;
}

/* Messages carries its own wallpaper because the full-screen conversation
   sits above the opaque app navigation stack. Never tint attached images. */
html[data-appearance="glass"] body :is(#fullscreen-chat-modal#fullscreen-chat-modal#fullscreen-chat-modal#fullscreen-chat-modal#fullscreen-chat-modal#fullscreen-chat-modal, #mobile-blocspace-email-reader#mobile-blocspace-email-reader#mobile-blocspace-email-reader#mobile-blocspace-email-reader#mobile-blocspace-email-reader#mobile-blocspace-email-reader, #blocspace-section-dms#blocspace-section-dms#blocspace-section-dms#blocspace-section-dms#blocspace-section-dms#blocspace-section-dms) {
    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 :is(#fullscreen-chat-modal, #mobile-blocspace-email-reader, #blocspace-section-dms)::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 :is(#fullscreen-chat-modal#fullscreen-chat-modal#fullscreen-chat-modal#fullscreen-chat-modal#fullscreen-chat-modal#fullscreen-chat-modal, #mobile-blocspace-email-reader#mobile-blocspace-email-reader#mobile-blocspace-email-reader#mobile-blocspace-email-reader#mobile-blocspace-email-reader#mobile-blocspace-email-reader, #blocspace-section-dms#blocspace-section-dms#blocspace-section-dms#blocspace-section-dms#blocspace-section-dms#blocspace-section-dms) :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 #fullscreen-chat-modal#fullscreen-chat-modal#fullscreen-chat-modal#fullscreen-chat-modal#fullscreen-chat-modal#fullscreen-chat-modal :is(.chat-header,.chat-input-area) {
    background: rgba(28,28,32,.24) !important;
    -webkit-backdrop-filter: var(--gl-blur) !important;
    backdrop-filter: var(--gl-blur) !important;
}
html[data-appearance="glass"] body #fullscreen-chat-modal#fullscreen-chat-modal#fullscreen-chat-modal#fullscreen-chat-modal#fullscreen-chat-modal#fullscreen-chat-modal :is(.chat-message-bubble,.chat-input-area > div,.recipient-avatar) {
    background: rgba(255,255,255,.09) !important;
    border: 1px solid rgba(255,255,255,.18) !important;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.08) !important;
}
html[data-appearance="glass"] body #fullscreen-chat-modal#fullscreen-chat-modal#fullscreen-chat-modal#fullscreen-chat-modal#fullscreen-chat-modal#fullscreen-chat-modal :is(.chat-message-bubble.is-sent,.message.sent > .chat-message-bubble,.chat-input-area button) {
    background: rgba(255,255,255,.23) !important;
}
html[data-appearance="glass"] body #fullscreen-chat-modal#fullscreen-chat-modal#fullscreen-chat-modal#fullscreen-chat-modal#fullscreen-chat-modal#fullscreen-chat-modal :is(.recipient-subtitle,.chat-message-meta,.chat-day-separator,.chat-message-delivery) {
    color: rgba(255,255,255,.70) !important;
    -webkit-text-fill-color: rgba(255,255,255,.70) !important;
}
html[data-appearance="glass"] body #fullscreen-chat-modal#fullscreen-chat-modal#fullscreen-chat-modal#fullscreen-chat-modal#fullscreen-chat-modal#fullscreen-chat-modal .message.is-failed .chat-message-delivery {
    color: #ffb0a8 !important;
    -webkit-text-fill-color: #ffb0a8 !important;
}
html[data-appearance="glass"] body :is(#blocspace-section-dms#blocspace-section-dms#blocspace-section-dms#blocspace-section-dms#blocspace-section-dms#blocspace-section-dms, #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 :is(#fullscreen-chat-modal#fullscreen-chat-modal#fullscreen-chat-modal#fullscreen-chat-modal#fullscreen-chat-modal#fullscreen-chat-modal, #blocspace-section-dms#blocspace-section-dms#blocspace-section-dms#blocspace-section-dms#blocspace-section-dms#blocspace-section-dms, #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;
}
html[data-appearance="glass"] body #blocspace-section-dms#blocspace-section-dms#blocspace-section-dms#blocspace-section-dms#blocspace-section-dms#blocspace-section-dms {
    position: relative !important;
    min-height: calc(100dvh - 80px) !important;
    overflow: hidden !important;
}
html[data-appearance="glass"] body #blocspace-section-dms#blocspace-section-dms#blocspace-section-dms#blocspace-section-dms#blocspace-section-dms#blocspace-section-dms :is(.bsd-deck,.bsd-card) {
    border-radius: 22px !important;
    overflow: hidden !important;
    box-shadow: none !important;
}
html[data-appearance="glass"] body #blocspace-section-dms#blocspace-section-dms#blocspace-section-dms#blocspace-section-dms#blocspace-section-dms#blocspace-section-dms :is(.bsd-search,.bsd-pill,.bsd-chip) {
    border-radius: 14px !important;
    box-shadow: none !important;
}
html[data-appearance="glass"] body #blocspace-section-dms#blocspace-section-dms#blocspace-section-dms#blocspace-section-dms#blocspace-section-dms#blocspace-section-dms .bsd-btn {
    background: rgba(255,255,255,.12) !important;
    border-color: rgba(255,255,255,.20) !important;
}
html[data-appearance="glass"] body #blocspace-section-dms#blocspace-section-dms#blocspace-section-dms#blocspace-section-dms#blocspace-section-dms#blocspace-section-dms .bsd-btn.is-danger {
    color: #ffb0a8 !important;
    -webkit-text-fill-color: #ffb0a8 !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;
}