Add notes for system-ui (w3c#12831)

Author: NightFurySL2001

css-fonts-4/Overview.bs

@@ -577,11 +577,12 @@ Generic font families</h4>
 	    <dt id="system-ui-def"><dfn>system-ui</dfn>
 	    <dd>
 	        This generic font family lets text render with the default user interface font
-			(which, as with all [[#generic-font-families]] may be a composite font)
+			(which, as with all [[#generic-font-families]], may be a composite font)
 	        on the platform on which the UA is running.
 	        A cross-platform UA should use different fonts on its different supported platforms.
 	        The purpose of ''system-ui'' is to allow web content
 	        to integrate with the look and feel of the native OS.
+            This is useful for hybrid, web or cross-platform applications.
 
 			<wpt>
 				system-ui-ar.html
@@ -594,9 +595,11 @@ Generic font families</h4>
 				system-ui.html
 			</wpt>
 
-			The precise font used will depend on factors such as
-			Unicode coverage
-			and the content language.
+			The precise font(s) used will depend on factors such as 
+            platform support, platform language, locale settings, 
+			user settings, Unicode coverage and the content language.
+            UA may optionally choose to use the text rendering engine provided by the platform when using
+            ''system-ui'' to match the appearance of the default user interface more closely.
 
 	        <div class="example" id="ex-system-ui-opaque">
 	            As with other generic font families,
@@ -614,6 +617,16 @@ Generic font families</h4>
 	            In particular, the above script should yield a result of "system-ui" on every platform.
 	        </div>
 
+            Note: ''system-ui'' is highly dependent on the platform environment as multiple factors may 
+            affect the default user interface font, and may have verying level of text rendering support.
+            This may cause the displayed typeface to be undesirable for some end users 
+            (e.g. Simplified Chinese users might get a monospaced serif font on older version of Windows; 
+            ''lang'' attribute might not affect displayed font in cases like ''lang="uk"'' in Russian locale 
+            or ''lang="ja"'' in Chinese locale). 
+            Some operating system vendors does not offer means to customise ''system-ui'', 
+            unlike UAs that generally allow users to customise the generic ''sans-serif'' or ''serif'' font family.
+            As the name implies, ''system-ui'' is intended for use with UI elements in web application, and not for large paragraphs of text or articles.
+
 	    <dt id="math-def"><dfn>math</dfn>
 	    <dd>
 	        This font family is intended for use with mathematical expressions.