/* The shared button surface, also used for demo names and story pills. */
html body[data-page=demos] :is(.avatar-dialog .avatar-chat-identity,.avatar-dialog .avatar-story,.roster-preview):not(#demo-color-a):not(#demo-color-b):not(#demo-color-c){background:rgba(0,0,0,.65)!important;color:#fff!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
html body[data-page=demos] :is(.avatar-dialog .avatar-chat-identity,.avatar-dialog .avatar-story,.roster-preview):not(#demo-color-a):not(#demo-color-b):not(#demo-color-c) *{color:#fff!important}
html body[data-page=demos] .avatar-dialog .avatar-chat-message:not(#demo-color-a):not(#demo-color-b):not(#demo-color-c){background:rgba(0,0,0,.65)!important;color:#fff!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important}

/* Character names retain the collapsed Satoshi face in expanded conversations. */
html body[data-page=demos] .avatar-dialog .avatar-chat-identity-name:not(#demo-font-a):not(#demo-font-b):not(#demo-font-c):not(#demo-font-d),html body[data-page=demos] .avatar-dialog .avatar-chat-identity-name *:not(#demo-font-a):not(#demo-font-b):not(#demo-font-c):not(#demo-font-d){font-family:var(--sans)!important;font-weight:300!important;font-style:normal!important}