/* Scoped Style */
@supports (--js-element('html', {}, {})) {
  [--self] {
    background: cyan;
  }
}

/* Using an Element Query */
@supports (--js-element('html', {minWidth: 500}, {})) {
  [--self] {
    background: magenta;
  }
}

/* Testing a Property with a Function */
@supports (--js-element('html', {offsetWidth: n => n > 700}, {})) {
  [--self] {
    background: yellow;
  }
}

/* Using a Custom Function */
@supports (
  --js-element(
    'html',
    {customFunc: 900},
    {customFunc: (tag, n) => tag.offsetWidth > n}
  )
) {
  [--self] {
    background: black;
  }
}