Bluesky emoji picker is unthemed

[WalkQuackBack]

Is there an existing issue outlining your problem?

• [x] I am using the latest version of the provided userstyle.
• [x] I have searched the existing issues and they do not solve my problem.

What userstyles are you seeing the problem on?

lbl:bsky

Describe your problem.

The emoji picker in the Create post interface is unthemed.

Attach screenshots.

What browser(s) are you seeing the problem on?

Chrome 139.0.7258.154

Any additional comments?

They seem to be themed using these variables, and uses Emoji Mart.

[data-theme="dark"] {
    --em-rgb-color: var(--rgb-color, 222, 222, 221);
    --em-rgb-accent: var(--rgb-accent, 58, 130, 247);
    --em-rgb-background: var(--rgb-background, 21, 22, 23);
    --em-rgb-input: var(--rgb-input, 0, 0, 0);
    --em-color-border: var(--color-border, rgba(255, 255, 255, .1));
    --em-color-border-over: var(--color-border-over, rgba(255, 255, 255, .2));
}

[RoootTheFox]

this is unfortunately impossible to style, as the emoji picker resides within a shadow DOM, which isn't accessible from a regular CSS context. stylus would need to provide custom statements to make this possible. see https://github.com/openstyles/stylus/issues/739

[WalkQuackBack]

this is unfortunately impossible to style, as the emoji picker resides within a shadow DOM, which isn't accessible from a regular CSS context. stylus would need to provide custom statements to make this possible. see openstyles/stylus#739

AFAICS it references external CSS variables though, so depending on where these are defined a look could be taken at Bluesky upstream to define them outside of the shadow root if they're defined in the shadow root right now.

[RoootTheFox]

sounds like it might be possible after all then (if not, a social-app PR might do the trick); i'll reopen this