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);
}