URLはCSS内でどこに現れるのか?

@counter-style winners-list {
  system: fixed;
  symbols: url(gold-medal.svg) url(silver-medal.svg) url(bronze-medal.svg);
  suffix: " ";
}

@document url("https://www.example.com/") {
  h1 {
    color: green;
  }
}

@font-face {
  font-family: "Open Sans";
  src: url("/fonts/OpenSans-Regular-webfont.woff2") format("woff2"),
       url("/fonts/OpenSans-Regular-webfont.woff") format("woff");
}

@import url("fineprint.css") print;
@import url("bluish.css") speech;
@import "common.css" screen;
@import url('landscape.css') screen and (orientation:landscape);

@namespace url(XML-namespace-URL);
@namespace "XML-namespace-URL";
@namespace prefix url(XML-namespace-URL);
@namespace prefix "XML-namespace-URL";

url(...)の形式を除けば、以下の３点でURLが現れる。

@import "common.css" screen;
@namespace "XML-namespace-URL";
@namespace prefix "XML-namespace-URL";

namespace generally points to other domains, so it's an absolute url.
@namespace "http://www.w3.org/1998/Math/MathML";

[relative path] aaa/bbb/ccc
[absolute path] /aaa/bbb/ccc
[absolute path] #myid
[absolute path] http://
[absolute path] https://
[absolute path] chorme://
[absolute path] data:

https://developer.mozilla.org/en-US/docs/Web/CSS/url()

/* Simple usage */
url(https://example.com/images/myImg.jpg);
url(data:image/png;base64,iRxVB0…);
url(myFont.woff);
url(#IDofSVGpath);

/* associated properties */
background-image: url("https://mdn.mozillademos.org/files/16761/star.gif");
list-style-image: url('../images/bullet.jpg');
content: url("pdficon.jpg");
cursor: url(mycursor.cur);
border-image-source: url(/media/diamonds.png);
src: url('fantasticfont.woff');
offset-path: url(#path);
mask-image: url("masks.svg#mask1");

/* Properties with fallbacks */
cursor: url(pointer.cur), pointer;

/* Associated short-hand properties */
background: url('https://mdn.mozillademos.org/files/16761/star.gif') bottom right repeat-x blue;
border-image: url("/media/diamonds.png") 30 fill / 30px / 30px space;

/* As a parameter in another CSS function */
background-image: cross-fade(20% url(first.png), url(second.png));
mask-image: image(url(mask.png), skyblue, linear-gradient(rgba(0, 0, 0, 1.0), transparent);

/* as part of a non-shorthand multiple value */
content: url(star.svg) url(star.svg) url(star.svg) url(star.svg) url(star.svg);

/* at-rules */
@document url("https://www.example.com/") { ... } 
    This is an experimental API that should not be used in production code.
    

@import url("https://www.example.com/style.css");
@namespace url(http://www.w3.org/1999/xhtml);
Relative URLs, if used, are relative to the URL of the stylesheet (not to the URL of the web page).

The url() function can be included as a value for background, background-image, list-style, list-style-image, content, cursor, border, border-image, border-image-source, mask, mask-image, src as part of a @font-face block, and @counter-style/symbol