[mediaqueries] Add an example of error-recovery with unmatched parens.

Author: tabatkins

mediaqueries/Overview.bs

@@ -734,6 +734,20 @@ Error Handling</h3>
 
 		Both of the above <a>media query lists</a> are turned into ''not all, speech'' during parsing,
 		which has the same truth value as just ''speech''.
+
+		Note that error-recovery only happens at the top-level of a <a>media query</a>;
+		anything inside of an invalid parenthesized block
+		will just get turned into ''not all'' as a group.
+		For example:
+
+		<pre>
+			@media (example, speech { /* rules for speech devices */ }
+		</pre>
+
+		Because the parenthesized block is unclosed,
+		it will contain the entire rest of the stylesheet from that point
+		(unless it happens to encounter an unmatched ")" character somewhere in the stylesheet),
+		and turn the entire thing into a ''not all'' <a>media query</a>.
 	</div>
 
 	An unknown <<media-type>> must be treated as not matching.

mediaqueries/Overview.html

@@ -1223,6 +1223,19 @@ <h3 class="heading settled heading" data-level=3.1 id=error-handling><span class
 
 <p>Both of the above <a data-link-type=dfn href=#media-query-list title="media query lists">media query lists</a> are turned into <span class=css data-link-type=maybe title="not all, speech">not all, speech</span> during parsing,
 		which has the same truth value as just <a class=css data-link-type=maybe href=#valuedef-speech title=speech>speech</a>.</p>
+
+<p>Note that error-recovery only happens at the top-level of a <a data-link-type=dfn href=#media-query title="media query">media query</a>;
+		anything inside of an invalid parenthesized block
+		will just get turned into <span class=css data-link-type=maybe title="not all">not all</span> as a group.
+		For example:</p>
+
+		<pre>@media (example, speech { /* rules for speech devices */ }
+</pre>
+
+<p>Because the parenthesized block is unclosed,
+		it will contain the entire rest of the stylesheet from that point
+		(unless it happens to encounter an unmatched ")" character somewhere in the stylesheet),
+		and turn the entire thing into a <span class=css data-link-type=maybe title="not all">not all</span> <a data-link-type=dfn href=#media-query title="media query">media query</a>.</p>
 	</div>
 
 <p>An unknown <a class="production css-code" data-link-type=type href=#typedef-media-type title="<media-type>">&lt;media-type&gt;</a> must be treated as not matching.</p>