body.is-style-dark,
:where(.editor-styles-wrapper).is-style-dark {
  .plover-hide-on-dark {
    display: none;
  }
}

body.is-style-light,
:where(.editor-styles-wrapper).is-style-light {
  .plover-hide-on-light {
    display: none;
  }
}

.default-mode-light:not(.is-style-dark):not(.is-style-system),
:where(.editor-styles-wrapper).default-mode-light:not(.is-style-dark):not(.is-style-system) {
  .plover-hide-on-light {
    display: none;
  }
}

.default-mode-dark:not(.is-style-light):not(.is-style-system),
:where(.editor-styles-wrapper).default-mode-dark:not(.is-style-light):not(.is-style-system) {
  .plover-hide-on-dark {
    display: none;
  }
}

@media (prefers-color-scheme: light) {
  body.is-style-system,
  body.default-mode-system:not(.is-style-light):not(.is-style-dark),
  :where(.editor-styles-wrapper).is-style-system,
  :where(.editor-styles-wrapper).default-mode-system:not(.is-style-light):not(.is-style-dark) {
    .plover-hide-on-light {
      display: none;
    }
  }
}

@media (prefers-color-scheme: dark) {
  body.is-style-system,
  body.default-mode-system:not(.is-style-light):not(.is-style-dark),
  :where(.editor-styles-wrapper).is-style-system,
  :where(.editor-styles-wrapper).default-mode-system:not(.is-style-light):not(.is-style-dark) {
    .plover-hide-on-dark {
      display: none;
    }
  }
}
