fix: stop popup being inverted in Wikipedia's experimental dark mode

Fixes #1590.

CHANGELOG.md

@@ -8,6 +8,10 @@ app.
 
 ## [Unreleased]
 
+- Stopped popup being inverted when Wikipedia's experimental dark mode is
+  enabled
+  ([#1590](https://github.com/birchill/10ten-ja-reader/issues/1590)).
+
 ## [1.17.1] - 2024-01-04
 
 - (Chrome, Edge) Fixed support for Google Docs on chromium browsers

src/content/popup/popup.ts

@@ -295,14 +295,23 @@ export function renderPopup(
 }
 
 function getDefaultContainer(): HTMLElement {
-  return getOrCreateEmptyContainer({
+  const defaultContainer = getOrCreateEmptyContainer({
     id: 'tenten-ja-window',
     styles: popupStyles.toString(),
     // Make sure the popup container appears _before_ the puck container so that
     // we can assign them the same z-index and have the puck appear on top.
     before: LookupPuck.id,
     legacyIds: ['rikaichamp-window'],
   });
+
+  // Make sure our popup doesn't get inverted by Wikipedia's (experimental) dark
+  // mode.
+  if (document.location.hostname.endsWith('wikipedia.org')) {
+    defaultContainer.classList.add('mw-no-invert');
+    defaultContainer.style.filter = 'inherit';
+  }
+
+  return defaultContainer;
 }
 
 function resetContainer({