[css-position-4] Add better 'in the top layer' and 'rendered in the top layer' definitions.

Author: tabatkins

css-position-4/Overview.bs

@@ -44,6 +44,16 @@ Introduction {#intro}
 This is an early delta spec over [[css-position-3]].
 
 
+<!--
+ ██████  ████████    ███     ██████  ██    ██
+██    ██    ██      ██ ██   ██    ██ ██   ██
+██          ██     ██   ██  ██       ██  ██
+ ██████     ██    ██     ██ ██       █████
+      ██    ██    █████████ ██       ██  ██
+██    ██    ██    ██     ██ ██    ██ ██   ██
+ ██████     ██    ██     ██  ██████  ██    ██
+-->
+
 Painting Order and Stacking Contexts {#painting-order}
 ====================================
 
@@ -324,6 +334,16 @@ It is recommended that UAs use [=out-of-band outlines=],
 as making outlines easily visible
 is an important accessibility feature.
 
+<!--
+████████  ███████  ████████
+   ██    ██     ██ ██     ██
+   ██    ██     ██ ██     ██
+   ██    ██     ██ ████████
+   ██    ██     ██ ██
+   ██    ██     ██ ██
+   ██     ███████  ██
+-->
+
 Top Layer {#top-layer}
 =========
 
@@ -336,10 +356,6 @@ as if they were siblings of the root element.
 [=Document/Top layer=] elements are rendered in the order they appear in the [=Document/top layer=];
 the last element in the [=Document/top layer=] is rendered on top of everything else.
 
-An element is <dfn export>in the top layer</dfn>
-if it's present in its document's [=Document/top layer=],
-and its computed 'overlay' value is ''overlay/auto''.
-
 Note: This special rendering behavior ensures
 that elements in the [=Document/top layer=] cannot be clipped by anything in the document,
 or obscured by anything except elements later in the [=Document/top layer=].
@@ -374,7 +390,7 @@ Instead, specifications should use the following algorithms.
 Top Layer Styling {#top-styling}
 -----------------
 
-Every element [=in the top layer=],
+Every element [=rendered in the top layer=],
 as well as its corresponding ''::backdrop'' pseudo-element,
 are rendered with the following qualities:
 
@@ -408,7 +424,7 @@ are rendered with the following qualities:
 The ''::backdrop'' Pseudo-Element {#backdrop}
 ---------------------------------
 
-Each element [=in the top layer=] has a <dfn selector>::backdrop</dfn> pseudo-element,
+Each element [=rendered in the top layer=] has a <dfn selector>::backdrop</dfn> pseudo-element,
 for which it is the [=originating element=].
 
 When its computed 'content' value is not ''content/none'',
@@ -450,6 +466,44 @@ on how ''::backdrop'' elements are rendered.
 Top Layer Manipulation {#top-manip}
 ----------------------
 
+<div algorithm>
+	An element |el| is <dfn export>in the top layer</dfn>
+	of an optional {{Document}} |doc|
+	if |el| is [=list/contained=] in |doc|'s [=Document/top layer=]
+	but <em>not</em> [=list/contained=] in |doc|'s [=pending top layer removals=].
+
+	If |doc| is not passed,
+	it's [=in the top layer=]
+	if it would be so for <em>any</em> {{Document}}.
+
+	Note: Specs should use this concept,
+	rather than [=rendered in the top layer=],
+	when they are manipulating the top layer itself.
+	Using this concept avoids the behavior being different
+	based on whether there's an 'overlay' transition,
+	or whether two operations happened <em>between</em> rendering updates
+	or <em>across</em> them.
+</div>
+
+<div algorithm>
+	An element |el| is <dfn export lt="render in the top layer">rendered in the top layer</dfn>
+	of an optional {{Document}} |doc|
+	if |el| is [=list/contained=] in |doc|'s [=Document/top layer=].
+
+	If |doc| is not passed,
+	it's [=rendered in the top layer=]
+	if it would be so for <em>any</em> {{Document}}.
+
+	Note: Specs should use this concept,
+	rather than [=in the top layer=],
+	when they are not manipulating the top layer itself,
+	but rather responding to the rendering behavior of being "on top of everything".
+	For example, the presence of a ''::backdrop'' pseudo
+	relies on the element being [=rendered in the top layer=];
+	even if the element is [=pending top layer removals|pending removal=],
+	it has a ''::backdrop'' as long as it's being displayed on top of everything.
+</div>
+
 <div algorithm>
 	To <dfn export lt="add an element to the top layer | add to the top layer">add an element to the top layer</dfn>,
 	given a {{Document}} |doc|