diff --git a/docs/docs/themes/creating.md b/docs/docs/themes/creating.md
index 618d7bead..a73484182 100644
--- a/docs/docs/themes/creating.md
+++ b/docs/docs/themes/creating.md
@@ -31,8 +31,7 @@ If you're customizing the default dark styles, scope your styles to the followin
 
 ```css
 .wa-dark,
-.wa-invert,
-:is(:host-context(.wa-dark)) {
+.wa-invert {
   /* your custom styles here */
 }
 ```
diff --git a/docs/docs/themes/index.njk b/docs/docs/themes/index.njk
index 9c1753e0e..fa89792a5 100644
--- a/docs/docs/themes/index.njk
+++ b/docs/docs/themes/index.njk
@@ -1,6 +1,6 @@
 ---
 title: Themes
-description: Themes are collections of design tokens that thread through every Web Awesome component and pattern. 
+description: Themes are collections of design tokens that thread through every Web Awesome component and pattern.
   Themes play a crucial role in [customizing Web Awesome](/docs/customizing).
 layout: overview
 override:tags: []
@@ -30,7 +30,7 @@ In pre-made themes, we use a light color scheme by default.
 Additionally, styles may be scoped to the `:root` selector to be activated automatically.
 For pre-made themes, *all* custom properties are scoped to `:root`, the theme class, and `wa-light`.
 
-Finally, we scope themes to `:host` and `:host-context()` to ensure the styles are applied to the shadow roots of custom elements.
+Finally, we scope themes to `:host` to ensure the styles are applied to the shadow roots of custom elements.
 
 For example, the default theme is set up like this:
 
@@ -44,8 +44,7 @@ For example, the default theme is set up like this:
 }
 
 .wa-dark,
-.wa-invert,
-:host-context(.wa-dark) {
+.wa-invert {
   /* subset of CSS custom properties for a dark color scheme */
 }
 ```
diff --git a/src/styles/themes/active/color.css b/src/styles/themes/active/color.css
index e6b04d98e..c8e15c4ca 100644
--- a/src/styles/themes/active/color.css
+++ b/src/styles/themes/active/color.css
@@ -80,8 +80,7 @@
 }
 
 .wa-dark,
-.wa-invert,
-:is(:host-context(.wa-dark)) {
+.wa-invert {
   /**
    * Foundational Colors
    */
diff --git a/src/styles/themes/awesome/color.css b/src/styles/themes/awesome/color.css
index f608d931a..94e34e9fb 100644
--- a/src/styles/themes/awesome/color.css
+++ b/src/styles/themes/awesome/color.css
@@ -71,8 +71,7 @@
 }
 
 .wa-dark,
-.wa-invert,
-:is(:host-context(.wa-dark)) {
+.wa-invert {
   color-scheme: dark;
   color: var(--wa-color-text-normal);
 
diff --git a/src/styles/themes/brutalist/color.css b/src/styles/themes/brutalist/color.css
index 98013f2a5..0efe93aa6 100644
--- a/src/styles/themes/brutalist/color.css
+++ b/src/styles/themes/brutalist/color.css
@@ -78,8 +78,7 @@
 }
 
 .wa-dark,
-.wa-invert,
-:is(:host-context(.wa-dark)) {
+.wa-invert {
   color-scheme: dark;
   color: var(--wa-color-text-normal);
 
diff --git a/src/styles/themes/classic/color.css b/src/styles/themes/classic/color.css
index a42a72998..023f73ee5 100644
--- a/src/styles/themes/classic/color.css
+++ b/src/styles/themes/classic/color.css
@@ -68,8 +68,7 @@
 }
 
 .wa-dark,
-.wa-invert,
-:is(:host-context(.wa-dark)) {
+.wa-invert {
   /**
    * Foundational Colors
    */
diff --git a/src/styles/themes/default/color.css b/src/styles/themes/default/color.css
index da6fd8339..ad1593dbb 100644
--- a/src/styles/themes/default/color.css
+++ b/src/styles/themes/default/color.css
@@ -114,10 +114,8 @@
   --wa-color-neutral-on-loud: white;
 }
 
-/** need to wrap :host-context() in an :is() selector for unsupported browsers */
 .wa-dark,
-.wa-invert,
-:is(:host-context(.wa-dark)) {
+.wa-invert {
   color-scheme: dark;
   color: var(--wa-color-text-normal);
 
diff --git a/src/styles/themes/matter/color.css b/src/styles/themes/matter/color.css
index d3e891796..24be3ee3a 100644
--- a/src/styles/themes/matter/color.css
+++ b/src/styles/themes/matter/color.css
@@ -85,8 +85,7 @@
 }
 
 .wa-dark,
-.wa-invert,
-:is(:host-context(.wa-dark)) {
+.wa-invert {
   /**
    * Foundational Colors
    */
diff --git a/src/styles/themes/mellow/color.css b/src/styles/themes/mellow/color.css
index c8d945415..b279c64ff 100644
--- a/src/styles/themes/mellow/color.css
+++ b/src/styles/themes/mellow/color.css
@@ -83,8 +83,7 @@
 }
 
 .wa-dark,
-.wa-invert,
-:is(:host-context(.wa-dark)) {
+.wa-invert {
   /**
    * Foundational Colors
    */
diff --git a/src/styles/themes/playful/color.css b/src/styles/themes/playful/color.css
index 731bab72d..f853cc63a 100644
--- a/src/styles/themes/playful/color.css
+++ b/src/styles/themes/playful/color.css
@@ -75,8 +75,7 @@
 }
 
 .wa-dark,
-.wa-invert,
-:is(:host-context(.wa-dark)) {
+.wa-invert {
   /**
    * Foundational Colors
    */
diff --git a/src/styles/themes/premium/color.css b/src/styles/themes/premium/color.css
index d28d65046..1172226c5 100644
--- a/src/styles/themes/premium/color.css
+++ b/src/styles/themes/premium/color.css
@@ -74,8 +74,7 @@
 }
 
 .wa-dark,
-.wa-invert,
-:is(:host-context(.wa-dark)) {
+.wa-invert {
   /**
    * Foundational Colors
    */
diff --git a/src/styles/themes/tailspin/color.css b/src/styles/themes/tailspin/color.css
index a7a8890de..403052d7e 100644
--- a/src/styles/themes/tailspin/color.css
+++ b/src/styles/themes/tailspin/color.css
@@ -84,8 +84,7 @@
 }
 
 .wa-dark,
-.wa-invert,
-:is(:host-context(.wa-dark)) {
+.wa-invert {
   /**
    * Foundational Colors
    */
diff --git a/src/styles/themes/tailspin/overrides.css b/src/styles/themes/tailspin/overrides.css
index 1730eacac..449777139 100644
--- a/src/styles/themes/tailspin/overrides.css
+++ b/src/styles/themes/tailspin/overrides.css
@@ -1,7 +1,6 @@
 :where(:root),
 :host,
-.wa-theme-tailspin,
-:is(:host-context(.wa-theme-tailspin)) {
+.wa-theme-tailspin {
   h1,
   h2,
   h3,