div {
  transform: rotate(9deg) translate(0px, 71px) scale(1.5);
  box-shadow: 2px 2px 2px 1px rgba(0, 0, 0, 0.2);
  filter: drop-shadow(0.25rem 0 0.75rem #ef9035);
  animation: 2s infinite alternate steps(10);
  background-image: image-set("image.png" 1x, "image-2x.png" 2x, "image-print.png" 600dpi);
  padding: env(safe-area-inset-top, 20px) env(safe-area-inset-right, 20px) env(safe-area-inset-bottom, 20px) env(safe-area-inset-left, 20px);
}
li::after {
  content: "[" counter(listCounter) "] == [" counter(listCounter, upper-roman) "]";
}
li::before {
  content: counters(listCounter, ".") " == " counters(listCounter, ".", lower-roman);
}
div {
  grid-template-columns: fit-content(8ch) fit-content(8ch) 1fr;
}
@font-face {
  font-family: examplefont;
  src: local(Example Font), url('examplefont.woff') format("woff"), url('examplefont.otf') format("opentype");
}
.three {
  background-color: var(--my-var, var(--my-background, pink));
}
img, 
input[type="image"], 
video, 
embed, 
iframe, 
marquee, 
object, 
table {
  aspect-ratio: attr(width) / attr(height);
}
div {
  prop: func(foo), func(foo);
}