* Why all the :is(*, #\#) prefixes? * * These components are embedded in who-knows-what sites with unpredictable CSS. * We need our styles to win against host page selectors like `.content p` or * `article a:hover` without using !important everywhere. * * The :is(*, #\#) trick adds ID-level specificity (0,1,0) without requiring * an actual ID in the DOM. Chaining it (2x or 3x) builds enough specificity * to beat most host selectors. * * The #\# is an escaped # character, creating an invalid-but-harmless ID * selector that never matches, but still contributes specificity via :is(). * * We also need these overrides to only affect the Component UI elements themselves. * Users can provide custom templates to the results and searchbox components, * and these must inherit their styles without having to fight ours. * * It's admittedly a bit of a hack but it does provide best effort styling consistency * for the Component UI out in the wild.